@coorpacademy/components 11.4.3 → 11.4.5-alpha.36
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/molecule/add-to-my-list/index.js +3 -1
- package/es/molecule/add-to-my-list/index.js.map +1 -1
- package/es/molecule/answer/index.d.ts.map +1 -1
- package/es/molecule/answer/index.js +16 -6
- package/es/molecule/answer/index.js.map +1 -1
- package/es/molecule/card/notification.js +3 -1
- package/es/molecule/card/notification.js.map +1 -1
- package/es/molecule/filters/filters-wrapper.d.ts +1 -0
- package/es/molecule/filters/filters-wrapper.d.ts.map +1 -1
- package/es/molecule/filters/filters-wrapper.js +9 -5
- package/es/molecule/filters/filters-wrapper.js.map +1 -1
- package/es/molecule/filters/index.d.ts +1 -0
- package/es/molecule/filters/index.d.ts.map +1 -1
- package/es/molecule/filters/index.js +6 -3
- package/es/molecule/filters/index.js.map +1 -1
- package/es/molecule/forum/forum-post/index.d.ts.map +1 -1
- package/es/molecule/forum/forum-post/index.js +2 -1
- package/es/molecule/forum/forum-post/index.js.map +1 -1
- package/es/molecule/questions/drop-down/index.d.ts +1 -0
- package/es/molecule/questions/drop-down/index.js +7 -3
- package/es/molecule/questions/drop-down/index.js.map +1 -1
- package/es/molecule/questions/qcm/index.d.ts +1 -0
- package/es/molecule/questions/qcm/index.js +7 -3
- package/es/molecule/questions/qcm/index.js.map +1 -1
- package/es/molecule/questions/qcm-drag/index.d.ts +3 -1
- package/es/molecule/questions/qcm-drag/index.d.ts.map +1 -1
- package/es/molecule/questions/qcm-drag/index.js +7 -3
- package/es/molecule/questions/qcm-drag/index.js.map +1 -1
- package/es/molecule/questions/qcm-graphic/index.d.ts +1 -0
- package/es/molecule/questions/qcm-graphic/index.d.ts.map +1 -1
- package/es/molecule/questions/qcm-graphic/index.js +7 -3
- package/es/molecule/questions/qcm-graphic/index.js.map +1 -1
- package/es/molecule/questions/question-range/index.d.ts +1 -0
- package/es/molecule/questions/question-range/index.js +8 -4
- package/es/molecule/questions/question-range/index.js.map +1 -1
- package/es/molecule/questions/template/index.d.ts +6 -2
- package/es/molecule/questions/template/index.d.ts.map +1 -1
- package/es/molecule/questions/template/index.js +7 -3
- package/es/molecule/questions/template/index.js.map +1 -1
- package/es/molecule/share/index.d.ts.map +1 -1
- package/es/molecule/share/index.js +5 -1
- package/es/molecule/share/index.js.map +1 -1
- package/es/organism/review-slide/index.d.ts.map +1 -1
- package/es/organism/review-slide/index.js +31 -2
- package/es/organism/review-slide/index.js.map +1 -1
- package/es/organism/user-preferences/index.d.ts +1 -0
- package/es/organism/user-preferences/index.js +7 -3
- package/es/organism/user-preferences/index.js.map +1 -1
- package/es/template/common/search-page/index.d.ts +2 -0
- package/es/template/common/search-page/index.d.ts.map +1 -1
- package/es/template/common/search-page/index.js +8 -4
- package/es/template/common/search-page/index.js.map +1 -1
- package/lib/molecule/add-to-my-list/index.js +3 -1
- package/lib/molecule/add-to-my-list/index.js.map +1 -1
- package/lib/molecule/answer/index.d.ts.map +1 -1
- package/lib/molecule/answer/index.js +16 -6
- package/lib/molecule/answer/index.js.map +1 -1
- package/lib/molecule/card/notification.js +3 -1
- package/lib/molecule/card/notification.js.map +1 -1
- package/lib/molecule/filters/filters-wrapper.d.ts +1 -0
- package/lib/molecule/filters/filters-wrapper.d.ts.map +1 -1
- package/lib/molecule/filters/filters-wrapper.js +9 -5
- package/lib/molecule/filters/filters-wrapper.js.map +1 -1
- package/lib/molecule/filters/index.d.ts +1 -0
- package/lib/molecule/filters/index.d.ts.map +1 -1
- package/lib/molecule/filters/index.js +6 -3
- package/lib/molecule/filters/index.js.map +1 -1
- package/lib/molecule/forum/forum-post/index.d.ts.map +1 -1
- package/lib/molecule/forum/forum-post/index.js +2 -1
- package/lib/molecule/forum/forum-post/index.js.map +1 -1
- package/lib/molecule/questions/drop-down/index.d.ts +1 -0
- package/lib/molecule/questions/drop-down/index.js +7 -3
- package/lib/molecule/questions/drop-down/index.js.map +1 -1
- package/lib/molecule/questions/qcm/index.d.ts +1 -0
- package/lib/molecule/questions/qcm/index.js +7 -3
- package/lib/molecule/questions/qcm/index.js.map +1 -1
- package/lib/molecule/questions/qcm-drag/index.d.ts +3 -1
- package/lib/molecule/questions/qcm-drag/index.d.ts.map +1 -1
- package/lib/molecule/questions/qcm-drag/index.js +7 -3
- package/lib/molecule/questions/qcm-drag/index.js.map +1 -1
- package/lib/molecule/questions/qcm-graphic/index.d.ts +1 -0
- package/lib/molecule/questions/qcm-graphic/index.d.ts.map +1 -1
- package/lib/molecule/questions/qcm-graphic/index.js +7 -3
- package/lib/molecule/questions/qcm-graphic/index.js.map +1 -1
- package/lib/molecule/questions/question-range/index.d.ts +1 -0
- package/lib/molecule/questions/question-range/index.js +8 -4
- package/lib/molecule/questions/question-range/index.js.map +1 -1
- package/lib/molecule/questions/template/index.d.ts +6 -2
- package/lib/molecule/questions/template/index.d.ts.map +1 -1
- package/lib/molecule/questions/template/index.js +7 -3
- package/lib/molecule/questions/template/index.js.map +1 -1
- package/lib/molecule/share/index.d.ts.map +1 -1
- package/lib/molecule/share/index.js +5 -1
- package/lib/molecule/share/index.js.map +1 -1
- package/lib/organism/review-slide/index.d.ts.map +1 -1
- package/lib/organism/review-slide/index.js +30 -1
- package/lib/organism/review-slide/index.js.map +1 -1
- package/lib/organism/user-preferences/index.d.ts +1 -0
- package/lib/organism/user-preferences/index.js +7 -3
- package/lib/organism/user-preferences/index.js.map +1 -1
- package/lib/template/common/search-page/index.d.ts +2 -0
- package/lib/template/common/search-page/index.d.ts.map +1 -1
- package/lib/template/common/search-page/index.js +8 -4
- package/lib/template/common/search-page/index.js.map +1 -1
- package/locales/en/global.json +6 -1
- package/locales/fr/global.json +6 -1
- package/locales/ru/global.json +6 -1
- package/package.json +2 -2
- package/locales/.mtslconfig.json +0 -1
|
@@ -116,14 +116,17 @@ SelectedAnswerSections.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
|
116
116
|
|
|
117
117
|
const QcmDrag = ({
|
|
118
118
|
answers,
|
|
119
|
-
help
|
|
119
|
+
help,
|
|
120
|
+
groupAriaLabel
|
|
120
121
|
}, legacyContext) => {
|
|
121
122
|
const skin = GetSkinFromContext(legacyContext);
|
|
122
123
|
|
|
123
124
|
const primarySkinColor = _getOr('#00B0FF', 'common.primary', skin);
|
|
124
125
|
|
|
125
126
|
return /*#__PURE__*/React.createElement("div", {
|
|
126
|
-
className: style.wrapper
|
|
127
|
+
className: style.wrapper,
|
|
128
|
+
role: "group",
|
|
129
|
+
"aria-label": groupAriaLabel
|
|
127
130
|
}, /*#__PURE__*/React.createElement(SelectedAnswerSections, {
|
|
128
131
|
answers: answers,
|
|
129
132
|
help: help,
|
|
@@ -138,7 +141,8 @@ const QcmDrag = ({
|
|
|
138
141
|
|
|
139
142
|
QcmDrag.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
140
143
|
answers: AnswersPropTypes,
|
|
141
|
-
help: SelectedAnswerSections.propTypes.help
|
|
144
|
+
help: SelectedAnswerSections.propTypes.help,
|
|
145
|
+
groupAriaLabel: PropTypes.string
|
|
142
146
|
} : {};
|
|
143
147
|
QcmDrag.contextTypes = {
|
|
144
148
|
skin: Provider.childContextTypes.skin
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["React","PropTypes","classnames","Provider","GetSkinFromContext","getShadowBoxColorFromPrimary","style","AnswersPropTypes","arrayOf","shape","onClick","func","order","number","selected","bool","title","string","help","EmptyView","emptySpan","propTypes","Choices","answers","answersViews","map","answer","key","invisibleAnswer","unselected","innerHTML","__html","choices","SelectedAnswerSections","backgroundColor","selectedAnswers","selectedAnswersViews","boxShadow","background","content","selectedAnswerText","length","emptyAnswers","QcmDrag","legacyContext","skin","primarySkinColor","wrapper","contextTypes","childContextTypes"],"sources":["../../../../src/molecule/questions/qcm-drag/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {pipe, filter, orderBy, getOr} from 'lodash/fp';\nimport classnames from 'classnames';\nimport Provider, {GetSkinFromContext} from '../../../atom/provider';\nimport {getShadowBoxColorFromPrimary} from '../../../util/get-shadow-box-color-from-primary';\nimport style from './style.css';\n\nconst AnswersPropTypes = PropTypes.arrayOf(\n PropTypes.shape({\n onClick: PropTypes.func,\n order: PropTypes.number,\n selected: PropTypes.bool,\n title: PropTypes.string,\n help: PropTypes.string\n })\n);\n\nconst EmptyView = ({help}) => <span className={style.emptySpan}>{help}</span>;\n\nEmptyView.propTypes = {\n help: PropTypes.string\n};\n\nconst Choices = ({answers}) => {\n const answersViews = answers.map((answer, key) => {\n const {onClick, title, selected} = answer;\n return (\n <div\n className={classnames(selected ? style.invisibleAnswer : style.unselected, style.innerHTML)}\n data-name=\"answer\"\n onClick={onClick}\n key={key}\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{__html: title}}\n />\n );\n });\n\n return <div className={style.choices}>{answersViews}</div>;\n};\n\nChoices.propTypes = {\n answers: AnswersPropTypes\n};\n\nconst SelectedAnswerSections = ({answers, help, backgroundColor}) => {\n const selectedAnswers = pipe(filter('selected'), orderBy('order', 'asc'))(answers);\n const selectedAnswersViews = selectedAnswers.map((answer, key) => {\n const {onClick, title} = answer;\n return (\n <div\n data-selected=\"true\"\n onClick={onClick}\n key={key}\n data-name=\"selectedAnswer\"\n className={style.selected}\n style={{\n boxShadow: `0px 4px 16px ${getShadowBoxColorFromPrimary(backgroundColor)}`\n }}\n >\n <div\n data-name=\"answerBackground\"\n style={{\n backgroundColor\n }}\n className={style.background}\n />\n <div className={style.content}>\n <span\n data-name=\"answerContent\"\n className={classnames(style.selectedAnswerText, style.innerHTML)}\n title={title}\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{__html: title}}\n />\n </div>\n </div>\n );\n });\n\n if (selectedAnswersViews.length > 0) {\n return <div className={style.selectedAnswers}>{selectedAnswersViews}</div>;\n } else {\n return (\n <div className={style.emptyAnswers}>\n <EmptyView help={help} />\n </div>\n );\n }\n};\n\nSelectedAnswerSections.propTypes = {\n answers: AnswersPropTypes,\n help: EmptyView.propTypes.help,\n backgroundColor: PropTypes.string\n};\n\nconst QcmDrag = ({answers, help}, legacyContext) => {\n const skin = GetSkinFromContext(legacyContext);\n const primarySkinColor = getOr('#00B0FF', 'common.primary', skin);\n\n return (\n <div className={style.wrapper}>\n <SelectedAnswerSections answers={answers} help={help} backgroundColor={primarySkinColor} />\n <div data-name=\"qcm-drag-answers\" className={style.answers}>\n <Choices answers={answers} />\n </div>\n </div>\n );\n};\n\nQcmDrag.propTypes = {\n answers: AnswersPropTypes,\n help: SelectedAnswerSections.propTypes.help\n};\n\nQcmDrag.contextTypes = {\n skin: Provider.childContextTypes.skin\n};\n\nexport default QcmDrag;\n"],"mappings":"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
|
|
1
|
+
{"version":3,"file":"index.js","names":["React","PropTypes","classnames","Provider","GetSkinFromContext","getShadowBoxColorFromPrimary","style","AnswersPropTypes","arrayOf","shape","onClick","func","order","number","selected","bool","title","string","help","EmptyView","emptySpan","propTypes","Choices","answers","answersViews","map","answer","key","invisibleAnswer","unselected","innerHTML","__html","choices","SelectedAnswerSections","backgroundColor","selectedAnswers","selectedAnswersViews","boxShadow","background","content","selectedAnswerText","length","emptyAnswers","QcmDrag","groupAriaLabel","legacyContext","skin","primarySkinColor","wrapper","contextTypes","childContextTypes"],"sources":["../../../../src/molecule/questions/qcm-drag/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {pipe, filter, orderBy, getOr} from 'lodash/fp';\nimport classnames from 'classnames';\nimport Provider, {GetSkinFromContext} from '../../../atom/provider';\nimport {getShadowBoxColorFromPrimary} from '../../../util/get-shadow-box-color-from-primary';\nimport style from './style.css';\n\nconst AnswersPropTypes = PropTypes.arrayOf(\n PropTypes.shape({\n onClick: PropTypes.func,\n order: PropTypes.number,\n selected: PropTypes.bool,\n title: PropTypes.string,\n help: PropTypes.string\n })\n);\n\nconst EmptyView = ({help}) => <span className={style.emptySpan}>{help}</span>;\n\nEmptyView.propTypes = {\n help: PropTypes.string\n};\n\nconst Choices = ({answers}) => {\n const answersViews = answers.map((answer, key) => {\n const {onClick, title, selected} = answer;\n return (\n <div\n className={classnames(selected ? style.invisibleAnswer : style.unselected, style.innerHTML)}\n data-name=\"answer\"\n onClick={onClick}\n key={key}\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{__html: title}}\n />\n );\n });\n\n return <div className={style.choices}>{answersViews}</div>;\n};\n\nChoices.propTypes = {\n answers: AnswersPropTypes\n};\n\nconst SelectedAnswerSections = ({answers, help, backgroundColor}) => {\n const selectedAnswers = pipe(filter('selected'), orderBy('order', 'asc'))(answers);\n const selectedAnswersViews = selectedAnswers.map((answer, key) => {\n const {onClick, title} = answer;\n return (\n <div\n data-selected=\"true\"\n onClick={onClick}\n key={key}\n data-name=\"selectedAnswer\"\n className={style.selected}\n style={{\n boxShadow: `0px 4px 16px ${getShadowBoxColorFromPrimary(backgroundColor)}`\n }}\n >\n <div\n data-name=\"answerBackground\"\n style={{\n backgroundColor\n }}\n className={style.background}\n />\n <div className={style.content}>\n <span\n data-name=\"answerContent\"\n className={classnames(style.selectedAnswerText, style.innerHTML)}\n title={title}\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{__html: title}}\n />\n </div>\n </div>\n );\n });\n\n if (selectedAnswersViews.length > 0) {\n return <div className={style.selectedAnswers}>{selectedAnswersViews}</div>;\n } else {\n return (\n <div className={style.emptyAnswers}>\n <EmptyView help={help} />\n </div>\n );\n }\n};\n\nSelectedAnswerSections.propTypes = {\n answers: AnswersPropTypes,\n help: EmptyView.propTypes.help,\n backgroundColor: PropTypes.string\n};\n\nconst QcmDrag = ({answers, help, groupAriaLabel}, legacyContext) => {\n const skin = GetSkinFromContext(legacyContext);\n const primarySkinColor = getOr('#00B0FF', 'common.primary', skin);\n\n return (\n <div className={style.wrapper} role=\"group\" aria-label={groupAriaLabel}>\n <SelectedAnswerSections answers={answers} help={help} backgroundColor={primarySkinColor} />\n <div data-name=\"qcm-drag-answers\" className={style.answers}>\n <Choices answers={answers} />\n </div>\n </div>\n );\n};\n\nQcmDrag.propTypes = {\n answers: AnswersPropTypes,\n help: SelectedAnswerSections.propTypes.help,\n groupAriaLabel: PropTypes.string\n};\n\nQcmDrag.contextTypes = {\n skin: Provider.childContextTypes.skin\n};\n\nexport default QcmDrag;\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/molecule/questions/qcm-graphic/index.js"],"names":[],"mappings":";AAQA,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/molecule/questions/qcm-graphic/index.js"],"names":[],"mappings":";AAQA,uEA4DC"}
|
|
@@ -11,7 +11,8 @@ import style from './style.css';
|
|
|
11
11
|
|
|
12
12
|
const QCMImage = (props, legacyContext) => {
|
|
13
13
|
const {
|
|
14
|
-
answers
|
|
14
|
+
answers,
|
|
15
|
+
groupAriaLabel
|
|
15
16
|
} = props;
|
|
16
17
|
const skin = GetSkinFromContext(legacyContext);
|
|
17
18
|
|
|
@@ -64,7 +65,9 @@ const QCMImage = (props, legacyContext) => {
|
|
|
64
65
|
});
|
|
65
66
|
return /*#__PURE__*/React.createElement("div", {
|
|
66
67
|
"data-name": "qcm-graphic-wrapper",
|
|
67
|
-
className: style.wrapper
|
|
68
|
+
className: style.wrapper,
|
|
69
|
+
role: "group",
|
|
70
|
+
"aria-label": groupAriaLabel
|
|
68
71
|
}, answersViews);
|
|
69
72
|
};
|
|
70
73
|
|
|
@@ -78,7 +81,8 @@ QCMImage.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
|
78
81
|
onClick: PropTypes.func,
|
|
79
82
|
image: PropTypes.string,
|
|
80
83
|
ariaLabel: PropTypes.string
|
|
81
|
-
}))
|
|
84
|
+
})),
|
|
85
|
+
groupAriaLabel: PropTypes.string
|
|
82
86
|
} : {};
|
|
83
87
|
export default QCMImage;
|
|
84
88
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["React","PropTypes","classnames","Provider","GetSkinFromContext","getShadowBoxColorFromPrimary","style","QCMImage","props","legacyContext","answers","skin","primarySkinColor","answersViews","map","answer","key","onClick","title","selected","image","ariaLabel","boxShadow","backgroundColor","background","content","imageWrapper","backgroundImage","titleWrapper","innerHTML","__html","wrapper","contextTypes","childContextTypes","propTypes","arrayOf","shape","string","bool","func"],"sources":["../../../../src/molecule/questions/qcm-graphic/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {getOr} from 'lodash/fp';\nimport classnames from 'classnames';\nimport Provider, {GetSkinFromContext} from '../../../atom/provider';\nimport {getShadowBoxColorFromPrimary} from '../../../util/get-shadow-box-color-from-primary';\nimport style from './style.css';\n\nconst QCMImage = (props, legacyContext) => {\n const {answers} = props;\n const skin = GetSkinFromContext(legacyContext);\n const primarySkinColor = getOr('#00B0FF', 'common.primary', skin);\n\n const answersViews = answers.map((answer, key) => {\n const {onClick, title, selected, image, ariaLabel} = answer;\n\n return (\n <div\n onClick={onClick}\n data-selected={selected}\n data-name=\"answerGraphic\"\n style={{\n ...(selected && {\n boxShadow: `0 4px 16px ${getShadowBoxColorFromPrimary(primarySkinColor)}`\n })\n }}\n className={selected ? style.selected : style.answer}\n key={key}\n >\n <div\n data-name=\"answerBackground\"\n style={{\n backgroundColor: selected ? primarySkinColor : '#F4F4F5'\n }}\n className={style.background}\n />\n <div data-name=\"answerContent\" className={style.content}>\n <div\n className={style.imageWrapper}\n data-name=\"answerImage\"\n aria-label={ariaLabel || title}\n style={{\n backgroundImage: `url(${image})`\n }}\n />\n <div data-name=\"answerText\" className={style.titleWrapper}>\n <div\n title={title}\n className={classnames(style.title, style.innerHTML)}\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{__html: title}}\n />\n </div>\n </div>\n </div>\n );\n });\n\n return (\n <div
|
|
1
|
+
{"version":3,"file":"index.js","names":["React","PropTypes","classnames","Provider","GetSkinFromContext","getShadowBoxColorFromPrimary","style","QCMImage","props","legacyContext","answers","groupAriaLabel","skin","primarySkinColor","answersViews","map","answer","key","onClick","title","selected","image","ariaLabel","boxShadow","backgroundColor","background","content","imageWrapper","backgroundImage","titleWrapper","innerHTML","__html","wrapper","contextTypes","childContextTypes","propTypes","arrayOf","shape","string","bool","func"],"sources":["../../../../src/molecule/questions/qcm-graphic/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {getOr} from 'lodash/fp';\nimport classnames from 'classnames';\nimport Provider, {GetSkinFromContext} from '../../../atom/provider';\nimport {getShadowBoxColorFromPrimary} from '../../../util/get-shadow-box-color-from-primary';\nimport style from './style.css';\n\nconst QCMImage = (props, legacyContext) => {\n const {answers, groupAriaLabel} = props;\n const skin = GetSkinFromContext(legacyContext);\n const primarySkinColor = getOr('#00B0FF', 'common.primary', skin);\n\n const answersViews = answers.map((answer, key) => {\n const {onClick, title, selected, image, ariaLabel} = answer;\n\n return (\n <div\n onClick={onClick}\n data-selected={selected}\n data-name=\"answerGraphic\"\n style={{\n ...(selected && {\n boxShadow: `0 4px 16px ${getShadowBoxColorFromPrimary(primarySkinColor)}`\n })\n }}\n className={selected ? style.selected : style.answer}\n key={key}\n >\n <div\n data-name=\"answerBackground\"\n style={{\n backgroundColor: selected ? primarySkinColor : '#F4F4F5'\n }}\n className={style.background}\n />\n <div data-name=\"answerContent\" className={style.content}>\n <div\n className={style.imageWrapper}\n data-name=\"answerImage\"\n aria-label={ariaLabel || title}\n style={{\n backgroundImage: `url(${image})`\n }}\n />\n <div data-name=\"answerText\" className={style.titleWrapper}>\n <div\n title={title}\n className={classnames(style.title, style.innerHTML)}\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{__html: title}}\n />\n </div>\n </div>\n </div>\n );\n });\n\n return (\n <div\n data-name=\"qcm-graphic-wrapper\"\n className={style.wrapper}\n role=\"group\"\n aria-label={groupAriaLabel}\n >\n {answersViews}\n </div>\n );\n};\n\nQCMImage.contextTypes = {\n skin: Provider.childContextTypes.skin\n};\n\nQCMImage.propTypes = {\n answers: PropTypes.arrayOf(\n PropTypes.shape({\n title: PropTypes.string,\n selected: PropTypes.bool,\n onClick: PropTypes.func,\n image: PropTypes.string,\n ariaLabel: PropTypes.string\n })\n ),\n groupAriaLabel: PropTypes.string\n};\n\nexport default QCMImage;\n"],"mappings":";;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AAEA,OAAOC,UAAP,MAAuB,YAAvB;AACA,OAAOC,QAAP,IAAkBC,kBAAlB,QAA2C,wBAA3C;AACA,SAAQC,4BAAR,QAA2C,iDAA3C;AACA,OAAOC,KAAP,MAAkB,aAAlB;;AAEA,MAAMC,QAAQ,GAAG,CAACC,KAAD,EAAQC,aAAR,KAA0B;EACzC,MAAM;IAACC,OAAD;IAAUC;EAAV,IAA4BH,KAAlC;EACA,MAAMI,IAAI,GAAGR,kBAAkB,CAACK,aAAD,CAA/B;;EACA,MAAMI,gBAAgB,GAAG,OAAM,SAAN,EAAiB,gBAAjB,EAAmCD,IAAnC,CAAzB;;EAEA,MAAME,YAAY,GAAGJ,OAAO,CAACK,GAAR,CAAY,CAACC,MAAD,EAASC,GAAT,KAAiB;IAChD,MAAM;MAACC,OAAD;MAAUC,KAAV;MAAiBC,QAAjB;MAA2BC,KAA3B;MAAkCC;IAAlC,IAA+CN,MAArD;IAEA,oBACE;MACE,OAAO,EAAEE,OADX;MAEE,iBAAeE,QAFjB;MAGE,aAAU,eAHZ;MAIE,KAAK,eACCA,QAAQ,IAAI;QACdG,SAAS,EAAG,cAAalB,4BAA4B,CAACQ,gBAAD,CAAmB;MAD1D,CADb,CAJP;MASE,SAAS,EAAEO,QAAQ,GAAGd,KAAK,CAACc,QAAT,GAAoBd,KAAK,CAACU,MAT/C;MAUE,GAAG,EAAEC;IAVP,gBAYE;MACE,aAAU,kBADZ;MAEE,KAAK,EAAE;QACLO,eAAe,EAAEJ,QAAQ,GAAGP,gBAAH,GAAsB;MAD1C,CAFT;MAKE,SAAS,EAAEP,KAAK,CAACmB;IALnB,EAZF,eAmBE;MAAK,aAAU,eAAf;MAA+B,SAAS,EAAEnB,KAAK,CAACoB;IAAhD,gBACE;MACE,SAAS,EAAEpB,KAAK,CAACqB,YADnB;MAEE,aAAU,aAFZ;MAGE,cAAYL,SAAS,IAAIH,KAH3B;MAIE,KAAK,EAAE;QACLS,eAAe,EAAG,OAAMP,KAAM;MADzB;IAJT,EADF,eASE;MAAK,aAAU,YAAf;MAA4B,SAAS,EAAEf,KAAK,CAACuB;IAA7C,gBACE;MACE,KAAK,EAAEV,KADT;MAEE,SAAS,EAAEjB,UAAU,CAACI,KAAK,CAACa,KAAP,EAAcb,KAAK,CAACwB,SAApB,CAFvB,CAGE;MAHF;MAIE,uBAAuB,EAAE;QAACC,MAAM,EAAEZ;MAAT;IAJ3B,EADF,CATF,CAnBF,CADF;EAwCD,CA3CoB,CAArB;EA6CA,oBACE;IACE,aAAU,qBADZ;IAEE,SAAS,EAAEb,KAAK,CAAC0B,OAFnB;IAGE,IAAI,EAAC,OAHP;IAIE,cAAYrB;EAJd,GAMGG,YANH,CADF;AAUD,CA5DD;;AA8DAP,QAAQ,CAAC0B,YAAT,GAAwB;EACtBrB,IAAI,EAAET,QAAQ,CAAC+B,iBAAT,CAA2BtB;AADX,CAAxB;AAIAL,QAAQ,CAAC4B,SAAT,2CAAqB;EACnBzB,OAAO,EAAET,SAAS,CAACmC,OAAV,CACPnC,SAAS,CAACoC,KAAV,CAAgB;IACdlB,KAAK,EAAElB,SAAS,CAACqC,MADH;IAEdlB,QAAQ,EAAEnB,SAAS,CAACsC,IAFN;IAGdrB,OAAO,EAAEjB,SAAS,CAACuC,IAHL;IAIdnB,KAAK,EAAEpB,SAAS,CAACqC,MAJH;IAKdhB,SAAS,EAAErB,SAAS,CAACqC;EALP,CAAhB,CADO,CADU;EAUnB3B,cAAc,EAAEV,SAAS,CAACqC;AAVP,CAArB;AAaA,eAAe/B,QAAf"}
|
|
@@ -28,6 +28,7 @@ declare namespace QuestionRange {
|
|
|
28
28
|
title: PropTypes.Requireable<string>;
|
|
29
29
|
minLabel: PropTypes.Requireable<string>;
|
|
30
30
|
maxLabel: PropTypes.Requireable<string>;
|
|
31
|
+
groupAriaLabel: PropTypes.Requireable<string>;
|
|
31
32
|
onChange: PropTypes.Requireable<(...args: any[]) => any>;
|
|
32
33
|
onChangeEnd: PropTypes.Requireable<(...args: any[]) => any>;
|
|
33
34
|
multi: PropTypes.Requireable<boolean>;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import _getOr from "lodash/fp/getOr";
|
|
2
|
-
const _excluded = ["title", "minLabel", "maxLabel"];
|
|
2
|
+
const _excluded = ["title", "minLabel", "maxLabel", "groupAriaLabel"];
|
|
3
3
|
|
|
4
4
|
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); }
|
|
5
5
|
|
|
@@ -16,7 +16,8 @@ const QuestionRange = (props, legacyContext) => {
|
|
|
16
16
|
const {
|
|
17
17
|
title,
|
|
18
18
|
minLabel,
|
|
19
|
-
maxLabel
|
|
19
|
+
maxLabel,
|
|
20
|
+
groupAriaLabel
|
|
20
21
|
} = props,
|
|
21
22
|
rangeProps = _objectWithoutPropertiesLoose(props, _excluded);
|
|
22
23
|
|
|
@@ -28,7 +29,9 @@ const QuestionRange = (props, legacyContext) => {
|
|
|
28
29
|
color: defaultColor
|
|
29
30
|
};
|
|
30
31
|
return /*#__PURE__*/React.createElement("div", {
|
|
31
|
-
className: style.wrapper
|
|
32
|
+
className: style.wrapper,
|
|
33
|
+
role: "group",
|
|
34
|
+
"aria-label": groupAriaLabel
|
|
32
35
|
}, /*#__PURE__*/React.createElement("span", {
|
|
33
36
|
style: titleStyle,
|
|
34
37
|
className: classnames(style.title, style.innerHTML) // eslint-disable-next-line react/no-danger
|
|
@@ -59,7 +62,8 @@ QuestionRange.contextTypes = {
|
|
|
59
62
|
QuestionRange.propTypes = process.env.NODE_ENV !== "production" ? _extends({}, Range.propTypes, {
|
|
60
63
|
title: PropTypes.string,
|
|
61
64
|
minLabel: PropTypes.string,
|
|
62
|
-
maxLabel: PropTypes.string
|
|
65
|
+
maxLabel: PropTypes.string,
|
|
66
|
+
groupAriaLabel: PropTypes.string
|
|
63
67
|
}) : {};
|
|
64
68
|
export default QuestionRange;
|
|
65
69
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["React","PropTypes","classnames","Provider","GetSkinFromContext","Range","style","QuestionRange","props","legacyContext","title","minLabel","maxLabel","rangeProps","skin","defaultColor","titleStyle","color","wrapper","innerHTML","__html","labelWrapper","label","contextTypes","childContextTypes","propTypes","string"],"sources":["../../../../src/molecule/questions/question-range/index.js"],"sourcesContent":["import React from 'react';\nimport {getOr} from 'lodash/fp';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport Provider, {GetSkinFromContext} from '../../../atom/provider';\nimport Range from '../../../atom/range';\nimport style from './style.css';\n\nconst QuestionRange = (props, legacyContext) => {\n const {title, minLabel, maxLabel, ...rangeProps} = props;\n\n const skin = GetSkinFromContext(legacyContext);\n const defaultColor = getOr('#00B0FF', 'common.primary', skin);\n\n const titleStyle = {\n color: defaultColor\n };\n\n return (\n <div className={style.wrapper}>\n <span\n style={titleStyle}\n className={classnames(style.title, style.innerHTML)}\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{__html: title}}\n />\n <Range {...rangeProps} />\n <div className={style.labelWrapper}>\n <span\n className={classnames(style.label, style.innerHTML)}\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{__html: minLabel}}\n />\n <span\n className={classnames(style.label, style.innerHTML)}\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{__html: maxLabel}}\n />\n </div>\n </div>\n );\n};\n\nQuestionRange.contextTypes = {\n skin: Provider.childContextTypes.skin\n};\n\nQuestionRange.propTypes = {\n ...Range.propTypes,\n title: PropTypes.string,\n minLabel: PropTypes.string,\n maxLabel: PropTypes.string\n};\n\nexport default QuestionRange;\n"],"mappings":";;;;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAEA,OAAOC,SAAP,MAAsB,YAAtB;AACA,OAAOC,UAAP,MAAuB,YAAvB;AACA,OAAOC,QAAP,IAAkBC,kBAAlB,QAA2C,wBAA3C;AACA,OAAOC,KAAP,MAAkB,qBAAlB;AACA,OAAOC,KAAP,MAAkB,aAAlB;;AAEA,MAAMC,aAAa,GAAG,CAACC,KAAD,EAAQC,aAAR,KAA0B;EAC9C,MAAM;IAACC,KAAD;IAAQC,QAAR;IAAkBC;
|
|
1
|
+
{"version":3,"file":"index.js","names":["React","PropTypes","classnames","Provider","GetSkinFromContext","Range","style","QuestionRange","props","legacyContext","title","minLabel","maxLabel","groupAriaLabel","rangeProps","skin","defaultColor","titleStyle","color","wrapper","innerHTML","__html","labelWrapper","label","contextTypes","childContextTypes","propTypes","string"],"sources":["../../../../src/molecule/questions/question-range/index.js"],"sourcesContent":["import React from 'react';\nimport {getOr} from 'lodash/fp';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport Provider, {GetSkinFromContext} from '../../../atom/provider';\nimport Range from '../../../atom/range';\nimport style from './style.css';\n\nconst QuestionRange = (props, legacyContext) => {\n const {title, minLabel, maxLabel, groupAriaLabel, ...rangeProps} = props;\n\n const skin = GetSkinFromContext(legacyContext);\n const defaultColor = getOr('#00B0FF', 'common.primary', skin);\n\n const titleStyle = {\n color: defaultColor\n };\n\n return (\n <div className={style.wrapper} role=\"group\" aria-label={groupAriaLabel}>\n <span\n style={titleStyle}\n className={classnames(style.title, style.innerHTML)}\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{__html: title}}\n />\n <Range {...rangeProps} />\n <div className={style.labelWrapper}>\n <span\n className={classnames(style.label, style.innerHTML)}\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{__html: minLabel}}\n />\n <span\n className={classnames(style.label, style.innerHTML)}\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{__html: maxLabel}}\n />\n </div>\n </div>\n );\n};\n\nQuestionRange.contextTypes = {\n skin: Provider.childContextTypes.skin\n};\n\nQuestionRange.propTypes = {\n ...Range.propTypes,\n title: PropTypes.string,\n minLabel: PropTypes.string,\n maxLabel: PropTypes.string,\n groupAriaLabel: PropTypes.string\n};\n\nexport default QuestionRange;\n"],"mappings":";;;;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAEA,OAAOC,SAAP,MAAsB,YAAtB;AACA,OAAOC,UAAP,MAAuB,YAAvB;AACA,OAAOC,QAAP,IAAkBC,kBAAlB,QAA2C,wBAA3C;AACA,OAAOC,KAAP,MAAkB,qBAAlB;AACA,OAAOC,KAAP,MAAkB,aAAlB;;AAEA,MAAMC,aAAa,GAAG,CAACC,KAAD,EAAQC,aAAR,KAA0B;EAC9C,MAAM;IAACC,KAAD;IAAQC,QAAR;IAAkBC,QAAlB;IAA4BC;EAA5B,IAA6DL,KAAnE;EAAA,MAAqDM,UAArD,iCAAmEN,KAAnE;;EAEA,MAAMO,IAAI,GAAGX,kBAAkB,CAACK,aAAD,CAA/B;;EACA,MAAMO,YAAY,GAAG,OAAM,SAAN,EAAiB,gBAAjB,EAAmCD,IAAnC,CAArB;;EAEA,MAAME,UAAU,GAAG;IACjBC,KAAK,EAAEF;EADU,CAAnB;EAIA,oBACE;IAAK,SAAS,EAAEV,KAAK,CAACa,OAAtB;IAA+B,IAAI,EAAC,OAApC;IAA4C,cAAYN;EAAxD,gBACE;IACE,KAAK,EAAEI,UADT;IAEE,SAAS,EAAEf,UAAU,CAACI,KAAK,CAACI,KAAP,EAAcJ,KAAK,CAACc,SAApB,CAFvB,CAGE;IAHF;IAIE,uBAAuB,EAAE;MAACC,MAAM,EAAEX;IAAT;EAJ3B,EADF,eAOE,oBAAC,KAAD,EAAWI,UAAX,CAPF,eAQE;IAAK,SAAS,EAAER,KAAK,CAACgB;EAAtB,gBACE;IACE,SAAS,EAAEpB,UAAU,CAACI,KAAK,CAACiB,KAAP,EAAcjB,KAAK,CAACc,SAApB,CADvB,CAEE;IAFF;IAGE,uBAAuB,EAAE;MAACC,MAAM,EAAEV;IAAT;EAH3B,EADF,eAME;IACE,SAAS,EAAET,UAAU,CAACI,KAAK,CAACiB,KAAP,EAAcjB,KAAK,CAACc,SAApB,CADvB,CAEE;IAFF;IAGE,uBAAuB,EAAE;MAACC,MAAM,EAAET;IAAT;EAH3B,EANF,CARF,CADF;AAuBD,CAjCD;;AAmCAL,aAAa,CAACiB,YAAd,GAA6B;EAC3BT,IAAI,EAAEZ,QAAQ,CAACsB,iBAAT,CAA2BV;AADN,CAA7B;AAIAR,aAAa,CAACmB,SAAd,wDACKrB,KAAK,CAACqB,SADX;EAEEhB,KAAK,EAAET,SAAS,CAAC0B,MAFnB;EAGEhB,QAAQ,EAAEV,SAAS,CAAC0B,MAHtB;EAIEf,QAAQ,EAAEX,SAAS,CAAC0B,MAJtB;EAKEd,cAAc,EAAEZ,SAAS,CAAC0B;AAL5B;AAQA,eAAepB,aAAf"}
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
export default Template;
|
|
2
|
-
declare function Template({ template, answers }: {
|
|
2
|
+
declare function Template({ template, answers, groupAriaLabel }: {
|
|
3
3
|
template: any;
|
|
4
4
|
answers: any;
|
|
5
|
+
groupAriaLabel: any;
|
|
5
6
|
}): JSX.Element;
|
|
6
7
|
declare namespace Template {
|
|
7
8
|
namespace propTypes {
|
|
@@ -16,6 +17,7 @@ declare namespace Template {
|
|
|
16
17
|
}> | null | undefined)[]>;
|
|
17
18
|
theme: PropTypes.Requireable<string>;
|
|
18
19
|
'aria-label': PropTypes.Requireable<string>;
|
|
20
|
+
groupAriaLabel: PropTypes.Requireable<string>;
|
|
19
21
|
}, never>> & Partial<PropTypes.InferPropsInner<Pick<{
|
|
20
22
|
onChange: PropTypes.Requireable<(...args: any[]) => any>;
|
|
21
23
|
options: PropTypes.Requireable<(PropTypes.InferProps<{
|
|
@@ -26,7 +28,9 @@ declare namespace Template {
|
|
|
26
28
|
}> | null | undefined)[]>;
|
|
27
29
|
theme: PropTypes.Requireable<string>;
|
|
28
30
|
'aria-label': PropTypes.Requireable<string>;
|
|
29
|
-
|
|
31
|
+
groupAriaLabel: PropTypes.Requireable<string>;
|
|
32
|
+
}, "aria-label" | "onChange" | "theme" | "options" | "groupAriaLabel">>>) | null | undefined)[]>;
|
|
33
|
+
const groupAriaLabel: PropTypes.Requireable<string>;
|
|
30
34
|
}
|
|
31
35
|
}
|
|
32
36
|
import PropTypes from "prop-types";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/molecule/questions/template/index.js"],"names":[],"mappings":";AAQA
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/molecule/questions/template/index.js"],"names":[],"mappings":";AAQA;;;;gBA2CC"}
|
|
@@ -15,7 +15,8 @@ import style from './style.css';
|
|
|
15
15
|
|
|
16
16
|
const Template = ({
|
|
17
17
|
template,
|
|
18
|
-
answers
|
|
18
|
+
answers,
|
|
19
|
+
groupAriaLabel
|
|
19
20
|
}) => {
|
|
20
21
|
const totalTemplate = parseTemplateString(template);
|
|
21
22
|
|
|
@@ -61,7 +62,9 @@ const Template = ({
|
|
|
61
62
|
|
|
62
63
|
return /*#__PURE__*/React.createElement("div", {
|
|
63
64
|
"data-name": "template-wrapper",
|
|
64
|
-
className: style.wrapper
|
|
65
|
+
className: style.wrapper,
|
|
66
|
+
role: "group",
|
|
67
|
+
"aria-label": groupAriaLabel
|
|
65
68
|
}, templateCompose);
|
|
66
69
|
};
|
|
67
70
|
|
|
@@ -70,7 +73,8 @@ const TextPropTypes = process.env.NODE_ENV !== "production" ? _extends({}, DropD
|
|
|
70
73
|
}) : {};
|
|
71
74
|
Template.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
72
75
|
template: PropTypes.string,
|
|
73
|
-
answers: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.shape(DropDown.propTypes), PropTypes.shape(TextPropTypes)]))
|
|
76
|
+
answers: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.shape(DropDown.propTypes), PropTypes.shape(TextPropTypes)])),
|
|
77
|
+
groupAriaLabel: PropTypes.string
|
|
74
78
|
} : {};
|
|
75
79
|
export default Template;
|
|
76
80
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["React","PropTypes","parseTemplateString","DropDown","FreeText","style","Template","template","answers","totalTemplate","templateCompose","convert","cap","part","key","type","textPart","__html","value","field","name","fieldType","fieldProps","fieldView","text","answerType","wrapper","TextPropTypes","propTypes","string","arrayOf","oneOfType","shape"],"sources":["../../../../src/molecule/questions/template/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {map, find} from 'lodash/fp';\nimport parseTemplateString from '../../../util/parse-template-string';\nimport DropDown from '../drop-down';\nimport FreeText from '../free-text';\nimport style from './style.css';\n\nconst Template = ({template, answers}) => {\n const totalTemplate = parseTemplateString(template);\n const templateCompose = map.convert({cap: false})((part, key) => {\n const type = part.type;\n if (type === 'string') {\n return (\n <span\n key={key}\n className={style.textPart}\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{__html: part.value}}\n />\n );\n }\n if (type === 'answerField') {\n const field = find({name: part.value}, answers);\n if (!field) return null;\n const {type: fieldType, ...fieldProps} = field;\n const fieldView =\n fieldType === 'text' ? (\n <FreeText {...fieldProps} className={style.text} />\n ) : (\n <DropDown {...fieldProps} theme=\"player\" />\n );\n\n return (\n <div className={style.answerType} key={part.value}>\n {fieldView}\n </div>\n );\n }\n }, totalTemplate);\n\n return (\n <div
|
|
1
|
+
{"version":3,"file":"index.js","names":["React","PropTypes","parseTemplateString","DropDown","FreeText","style","Template","template","answers","groupAriaLabel","totalTemplate","templateCompose","convert","cap","part","key","type","textPart","__html","value","field","name","fieldType","fieldProps","fieldView","text","answerType","wrapper","TextPropTypes","propTypes","string","arrayOf","oneOfType","shape"],"sources":["../../../../src/molecule/questions/template/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {map, find} from 'lodash/fp';\nimport parseTemplateString from '../../../util/parse-template-string';\nimport DropDown from '../drop-down';\nimport FreeText from '../free-text';\nimport style from './style.css';\n\nconst Template = ({template, answers, groupAriaLabel}) => {\n const totalTemplate = parseTemplateString(template);\n const templateCompose = map.convert({cap: false})((part, key) => {\n const type = part.type;\n if (type === 'string') {\n return (\n <span\n key={key}\n className={style.textPart}\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{__html: part.value}}\n />\n );\n }\n if (type === 'answerField') {\n const field = find({name: part.value}, answers);\n if (!field) return null;\n const {type: fieldType, ...fieldProps} = field;\n const fieldView =\n fieldType === 'text' ? (\n <FreeText {...fieldProps} className={style.text} />\n ) : (\n <DropDown {...fieldProps} theme=\"player\" />\n );\n\n return (\n <div className={style.answerType} key={part.value}>\n {fieldView}\n </div>\n );\n }\n }, totalTemplate);\n\n return (\n <div\n data-name=\"template-wrapper\"\n className={style.wrapper}\n role=\"group\"\n aria-label={groupAriaLabel}\n >\n {templateCompose}\n </div>\n );\n};\n\nconst TextPropTypes = {\n ...DropDown.propTypes,\n type: PropTypes.string\n};\n\nTemplate.propTypes = {\n template: PropTypes.string,\n answers: PropTypes.arrayOf(\n PropTypes.oneOfType([PropTypes.shape(DropDown.propTypes), PropTypes.shape(TextPropTypes)])\n ),\n groupAriaLabel: PropTypes.string\n};\n\nexport default Template;\n"],"mappings":";;;;;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AAEA,OAAOC,mBAAP,MAAgC,qCAAhC;AACA,OAAOC,QAAP,MAAqB,cAArB;AACA,OAAOC,QAAP,MAAqB,cAArB;AACA,OAAOC,KAAP,MAAkB,aAAlB;;AAEA,MAAMC,QAAQ,GAAG,CAAC;EAACC,QAAD;EAAWC,OAAX;EAAoBC;AAApB,CAAD,KAAyC;EACxD,MAAMC,aAAa,GAAGR,mBAAmB,CAACK,QAAD,CAAzC;;EACA,MAAMI,eAAe,GAAG,KAAIC,OAAJ,CAAY;IAACC,GAAG,EAAE;EAAN,CAAZ,EAA0B,CAACC,IAAD,EAAOC,GAAP,KAAe;IAC/D,MAAMC,IAAI,GAAGF,IAAI,CAACE,IAAlB;;IACA,IAAIA,IAAI,KAAK,QAAb,EAAuB;MACrB,oBACE;QACE,GAAG,EAAED,GADP;QAEE,SAAS,EAAEV,KAAK,CAACY,QAFnB,CAGE;QAHF;QAIE,uBAAuB,EAAE;UAACC,MAAM,EAAEJ,IAAI,CAACK;QAAd;MAJ3B,EADF;IAQD;;IACD,IAAIH,IAAI,KAAK,aAAb,EAA4B;MAC1B,MAAMI,KAAK,GAAG,MAAK;QAACC,IAAI,EAAEP,IAAI,CAACK;MAAZ,CAAL,EAAyBX,OAAzB,CAAd;;MACA,IAAI,CAACY,KAAL,EAAY,OAAO,IAAP;;MACZ,MAAM;QAACJ,IAAI,EAAEM;MAAP,IAAmCF,KAAzC;MAAA,MAA2BG,UAA3B,iCAAyCH,KAAzC;;MACA,MAAMI,SAAS,GACbF,SAAS,KAAK,MAAd,gBACE,oBAAC,QAAD,eAAcC,UAAd;QAA0B,SAAS,EAAElB,KAAK,CAACoB;MAA3C,GADF,gBAGE,oBAAC,QAAD,eAAcF,UAAd;QAA0B,KAAK,EAAC;MAAhC,GAJJ;MAOA,oBACE;QAAK,SAAS,EAAElB,KAAK,CAACqB,UAAtB;QAAkC,GAAG,EAAEZ,IAAI,CAACK;MAA5C,GACGK,SADH,CADF;IAKD;EACF,CA7BuB,EA6BrBd,aA7BqB,CAAxB;;EA+BA,oBACE;IACE,aAAU,kBADZ;IAEE,SAAS,EAAEL,KAAK,CAACsB,OAFnB;IAGE,IAAI,EAAC,OAHP;IAIE,cAAYlB;EAJd,GAMGE,eANH,CADF;AAUD,CA3CD;;AA6CA,MAAMiB,aAAN,wDACKzB,QAAQ,CAAC0B,SADd;EAEEb,IAAI,EAAEf,SAAS,CAAC6B;AAFlB;AAKAxB,QAAQ,CAACuB,SAAT,2CAAqB;EACnBtB,QAAQ,EAAEN,SAAS,CAAC6B,MADD;EAEnBtB,OAAO,EAAEP,SAAS,CAAC8B,OAAV,CACP9B,SAAS,CAAC+B,SAAV,CAAoB,CAAC/B,SAAS,CAACgC,KAAV,CAAgB9B,QAAQ,CAAC0B,SAAzB,CAAD,EAAsC5B,SAAS,CAACgC,KAAV,CAAgBL,aAAhB,CAAtC,CAApB,CADO,CAFU;EAKnBnB,cAAc,EAAER,SAAS,CAAC6B;AALP,CAArB;AAQA,eAAexB,QAAf"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/share/index.js"],"names":[],"mappings":"AAkDO;;gBAcN;;;;;;AAEM;;;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/share/index.js"],"names":[],"mappings":"AAkDO;;gBAcN;;;;;;AAEM;;;uBAoBN;;;;;;;;;;AAED;;;;gBA8BC"}
|
|
@@ -74,7 +74,11 @@ export const ShareFeedback = ({
|
|
|
74
74
|
className: styles.checkIcon,
|
|
75
75
|
width: 13,
|
|
76
76
|
height: 13
|
|
77
|
-
}), /*#__PURE__*/React.createElement("p",
|
|
77
|
+
}), status === SHARE_STATUS.SUCCESS ? /*#__PURE__*/React.createElement("p", {
|
|
78
|
+
role: "status"
|
|
79
|
+
}, successWording) : /*#__PURE__*/React.createElement("p", {
|
|
80
|
+
role: "alert"
|
|
81
|
+
}, errorWording));
|
|
78
82
|
};
|
|
79
83
|
|
|
80
84
|
const Share = ({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["React","useState","useMemo","useCallback","useContext","useEffect","PropTypes","classnames","NovaCompositionCoorpacademyCheck","CheckIcon","NovaCompositionCoorpacademyShare","ShareIcon","NovaCompositionCoorpacademyAttention","AttentionIcon","Link","styles","SHARE_STATUS","IDLE","ERROR","SUCCESS","copyTextViaExecCommand","text","textarea","document","createElement","style","border","padding","visibility","position","setAttribute","value","body","appendChild","status","select","setSelectionRange","length","execCommand","error","removeChild","StatusContext","createContext","ShareStatusProvider","children","setStatus","timeoutId","DURATION","setTimeout","clearTimeout","ShareFeedback","successWording","errorWording","feedback","errorFeedback","checkIcon","Share","wording","onClick","browserSupportsClipboardWriteText","navigator","clipboard","writeText","copyStatus","container","cta","wrapper","shareIcon","propTypes","node","string"],"sources":["../../../src/molecule/share/index.js"],"sourcesContent":["import React, {useState, useMemo, useCallback, useContext, useEffect} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {\n NovaCompositionCoorpacademyCheck as CheckIcon,\n NovaCompositionCoorpacademyShare as ShareIcon,\n NovaCompositionCoorpacademyAttention as AttentionIcon\n} from '@coorpacademy/nova-icons';\nimport Link from '../../atom/link';\nimport styles from './style.css';\n\nconst SHARE_STATUS = {\n IDLE: 'IDLE',\n ERROR: 'ERROR',\n SUCCESS: 'SUCCESS'\n};\n\nconst copyTextViaExecCommand = text => {\n const textarea = document.createElement('textarea');\n\n textarea.style.border = '0';\n textarea.style.padding = '0';\n textarea.style.visibility = 'hidden';\n textarea.style.position = 'absolute';\n textarea.setAttribute('readonly', '');\n textarea.value = text;\n\n // Element.append is not supported on IE11 :/\n // eslint-disable-next-line unicorn/prefer-node-append\n document.body.appendChild(textarea);\n let status = SHARE_STATUS.IDLE;\n\n try {\n textarea.select();\n textarea.setSelectionRange(0, textarea.value.length);\n document.execCommand('copy');\n status = SHARE_STATUS.SUCCESS;\n } catch (error) {\n status = SHARE_STATUS.ERROR;\n }\n\n // Element.remove is not supported on IE11 :/\n // eslint-disable-next-line unicorn/prefer-node-remove\n document.body.removeChild(textarea);\n\n return status;\n};\n\nconst StatusContext = React.createContext(SHARE_STATUS.IDLE);\n\nexport const ShareStatusProvider = ({children}) => {\n const [status, setStatus] = useState(SHARE_STATUS.IDLE);\n useEffect(() => {\n let timeoutId;\n const DURATION = 3000;\n if (status !== SHARE_STATUS.IDLE) {\n timeoutId = setTimeout(() => setStatus(SHARE_STATUS.IDLE), DURATION);\n }\n return () => clearTimeout(timeoutId);\n }, [status]);\n\n const value = useMemo(() => [status, setStatus], [status]);\n\n return <StatusContext.Provider value={value}>{children}</StatusContext.Provider>;\n};\n\nexport const ShareFeedback = ({successWording, errorWording}) => {\n const [status] = useContext(StatusContext);\n if (status === SHARE_STATUS.IDLE) return null;\n\n return (\n <div\n className={classnames(styles.feedback, status === SHARE_STATUS.ERROR && styles.errorFeedback)}\n >\n {status === SHARE_STATUS.SUCCESS ? (\n <CheckIcon className={styles.checkIcon} width={13} height={13} />\n ) : (\n <AttentionIcon className={styles.checkIcon} width={13} height={13} />\n )}\n
|
|
1
|
+
{"version":3,"file":"index.js","names":["React","useState","useMemo","useCallback","useContext","useEffect","PropTypes","classnames","NovaCompositionCoorpacademyCheck","CheckIcon","NovaCompositionCoorpacademyShare","ShareIcon","NovaCompositionCoorpacademyAttention","AttentionIcon","Link","styles","SHARE_STATUS","IDLE","ERROR","SUCCESS","copyTextViaExecCommand","text","textarea","document","createElement","style","border","padding","visibility","position","setAttribute","value","body","appendChild","status","select","setSelectionRange","length","execCommand","error","removeChild","StatusContext","createContext","ShareStatusProvider","children","setStatus","timeoutId","DURATION","setTimeout","clearTimeout","ShareFeedback","successWording","errorWording","feedback","errorFeedback","checkIcon","Share","wording","onClick","browserSupportsClipboardWriteText","navigator","clipboard","writeText","copyStatus","container","cta","wrapper","shareIcon","propTypes","node","string"],"sources":["../../../src/molecule/share/index.js"],"sourcesContent":["import React, {useState, useMemo, useCallback, useContext, useEffect} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {\n NovaCompositionCoorpacademyCheck as CheckIcon,\n NovaCompositionCoorpacademyShare as ShareIcon,\n NovaCompositionCoorpacademyAttention as AttentionIcon\n} from '@coorpacademy/nova-icons';\nimport Link from '../../atom/link';\nimport styles from './style.css';\n\nconst SHARE_STATUS = {\n IDLE: 'IDLE',\n ERROR: 'ERROR',\n SUCCESS: 'SUCCESS'\n};\n\nconst copyTextViaExecCommand = text => {\n const textarea = document.createElement('textarea');\n\n textarea.style.border = '0';\n textarea.style.padding = '0';\n textarea.style.visibility = 'hidden';\n textarea.style.position = 'absolute';\n textarea.setAttribute('readonly', '');\n textarea.value = text;\n\n // Element.append is not supported on IE11 :/\n // eslint-disable-next-line unicorn/prefer-node-append\n document.body.appendChild(textarea);\n let status = SHARE_STATUS.IDLE;\n\n try {\n textarea.select();\n textarea.setSelectionRange(0, textarea.value.length);\n document.execCommand('copy');\n status = SHARE_STATUS.SUCCESS;\n } catch (error) {\n status = SHARE_STATUS.ERROR;\n }\n\n // Element.remove is not supported on IE11 :/\n // eslint-disable-next-line unicorn/prefer-node-remove\n document.body.removeChild(textarea);\n\n return status;\n};\n\nconst StatusContext = React.createContext(SHARE_STATUS.IDLE);\n\nexport const ShareStatusProvider = ({children}) => {\n const [status, setStatus] = useState(SHARE_STATUS.IDLE);\n useEffect(() => {\n let timeoutId;\n const DURATION = 3000;\n if (status !== SHARE_STATUS.IDLE) {\n timeoutId = setTimeout(() => setStatus(SHARE_STATUS.IDLE), DURATION);\n }\n return () => clearTimeout(timeoutId);\n }, [status]);\n\n const value = useMemo(() => [status, setStatus], [status]);\n\n return <StatusContext.Provider value={value}>{children}</StatusContext.Provider>;\n};\n\nexport const ShareFeedback = ({successWording, errorWording}) => {\n const [status] = useContext(StatusContext);\n if (status === SHARE_STATUS.IDLE) return null;\n\n return (\n <div\n className={classnames(styles.feedback, status === SHARE_STATUS.ERROR && styles.errorFeedback)}\n >\n {status === SHARE_STATUS.SUCCESS ? (\n <CheckIcon className={styles.checkIcon} width={13} height={13} />\n ) : (\n <AttentionIcon className={styles.checkIcon} width={13} height={13} />\n )}\n {status === SHARE_STATUS.SUCCESS ? (\n <p role=\"status\">{successWording}</p>\n ) : (\n <p role=\"alert\">{errorWording}</p>\n )}\n </div>\n );\n};\n\nconst Share = ({style, text, wording}) => {\n const [, setStatus] = useContext(StatusContext);\n const onClick = useCallback(async () => {\n const browserSupportsClipboardWriteText =\n 'clipboard' in navigator && 'writeText' in navigator.clipboard;\n if (browserSupportsClipboardWriteText) {\n try {\n await navigator.clipboard.writeText(text);\n setStatus(SHARE_STATUS.SUCCESS);\n } catch (error) {\n setStatus(SHARE_STATUS.ERROR);\n }\n return;\n } else {\n const copyStatus = copyTextViaExecCommand(text);\n setStatus(copyStatus);\n }\n return;\n }, [setStatus, text]);\n\n return (\n <div className={(styles.container, style)}>\n <Link onClick={onClick} className={styles.cta} data-name={'share-button'}>\n <div className={styles.wrapper}>\n <ShareIcon className={styles.shareIcon} width={18} height={18} />\n <p>{wording}</p>\n </div>\n </Link>\n </div>\n );\n};\n\nShareStatusProvider.propTypes = {\n children: PropTypes.node\n};\n\nShareFeedback.propTypes = {\n successWording: PropTypes.string,\n errorWording: PropTypes.string\n};\n\nShare.propTypes = {\n style: PropTypes.string,\n text: PropTypes.string,\n wording: PropTypes.string\n};\n\nexport default Share;\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organism/review-slide/index.js"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organism/review-slide/index.js"],"names":[],"mappings":";AA6JA,sDA8CC"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
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); }
|
|
2
2
|
|
|
3
|
-
import React, { useMemo } from 'react';
|
|
3
|
+
import React, { useMemo, useEffect } from 'react';
|
|
4
4
|
import PropTypes from 'prop-types';
|
|
5
5
|
import classnames from 'classnames';
|
|
6
6
|
import get from 'lodash/fp/get';
|
|
@@ -38,7 +38,22 @@ const CorrectionPopin = ({
|
|
|
38
38
|
information,
|
|
39
39
|
type: correctionPopinProps.type,
|
|
40
40
|
resultLabel: correctionPopinProps.resultLabel
|
|
41
|
-
};
|
|
41
|
+
}; // there is an error of eslint here because this useEffect will be only there when the correctionPopin will be there
|
|
42
|
+
// but that is on purpose to go to the next slide if you press enter when the correctionPopin is present
|
|
43
|
+
// istanbul ignore next
|
|
44
|
+
// eslint-disable-next-line react-hooks/rules-of-hooks
|
|
45
|
+
|
|
46
|
+
useEffect(() => {
|
|
47
|
+
const keyDownHandler = event => {
|
|
48
|
+
if (event.key === 'Enter' || event.key === ' ') {
|
|
49
|
+
event.preventDefault();
|
|
50
|
+
onClick();
|
|
51
|
+
document.removeEventListener('keydown', keyDownHandler);
|
|
52
|
+
}
|
|
53
|
+
};
|
|
54
|
+
|
|
55
|
+
document.addEventListener('keydown', keyDownHandler);
|
|
56
|
+
}, []);
|
|
42
57
|
return /*#__PURE__*/React.createElement("div", {
|
|
43
58
|
className: classnames(style.correctionPopinWrapper, animateCorrectionPopin ? style.popinAnimation : null)
|
|
44
59
|
}, /*#__PURE__*/React.createElement(ReviewCorrectionPopin, _correctionPopinProps));
|
|
@@ -73,6 +88,20 @@ const ValidateButton = ({
|
|
|
73
88
|
backgroundColor: primarySkinColor
|
|
74
89
|
}
|
|
75
90
|
};
|
|
91
|
+
/* istanbul ignore next */
|
|
92
|
+
|
|
93
|
+
useEffect(() => {
|
|
94
|
+
const keyDownHandler = event => {
|
|
95
|
+
if (event.key === 'Enter' || event.key === ' ') {
|
|
96
|
+
event.preventDefault();
|
|
97
|
+
}
|
|
98
|
+
};
|
|
99
|
+
|
|
100
|
+
if (disabled) document.addEventListener('keydown', keyDownHandler);
|
|
101
|
+
return () => {
|
|
102
|
+
document.removeEventListener('keydown', keyDownHandler);
|
|
103
|
+
};
|
|
104
|
+
}, [disabled]);
|
|
76
105
|
return /*#__PURE__*/React.createElement("div", {
|
|
77
106
|
key: "button-wrapper",
|
|
78
107
|
className: style.validateButtonWrapper
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["React","useMemo","PropTypes","classnames","get","getOr","Answer","ButtonLink","Loader","ReviewCorrectionPopin","GetSkinFromContext","propTypes","style","CorrectionPopin","correctionPopinProps","slideIndex","showCorrectionPopin","animateCorrectionPopin","klf","information","label","message","next","onClick","_correctionPopinProps","type","resultLabel","correctionPopinWrapper","popinAnimation","string","bool","ValidateButton","validateButton","primarySkinColor","disabled","validateButtonProps","className","customStyle","backgroundColor","validateButtonWrapper","QuestionContainer","props","answerUI","questionText","questionOrigin","disableContent","slideContentContainer","disabledSlideContent","question","__html","help","answerContainer","shape","slide","ReviewSlide","skin","loading","loadingAriaLabel","parentContentTitle","disabledContent","loader"],"sources":["../../../src/organism/review-slide/index.js"],"sourcesContent":["import React, {useMemo} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport get from 'lodash/fp/get';\nimport getOr from 'lodash/fp/getOr';\nimport Answer from '../../molecule/answer';\nimport ButtonLink from '../../atom/button-link';\nimport Loader from '../../atom/loader';\nimport ReviewCorrectionPopin from '../../molecule/review-correction-popin';\nimport {GetSkinFromContext} from '../../atom/provider';\nimport propTypes from './prop-types';\nimport style from './style.css';\n\nconst CorrectionPopin = ({\n correctionPopinProps,\n slideIndex,\n showCorrectionPopin,\n animateCorrectionPopin\n}) => {\n if (!showCorrectionPopin) return null;\n\n const klf = getOr({}, 'klf', correctionPopinProps);\n const information = getOr({label: '', message: ''}, 'information', correctionPopinProps);\n const next = get('next', correctionPopinProps);\n const onClick = get(['next', 'onClick'], correctionPopinProps);\n\n const _correctionPopinProps = {\n next: {\n onClick,\n label: next && next.label,\n 'data-name': `next-question-button-${slideIndex}`,\n 'aria-label': next && next['aria-label']\n },\n klf,\n information,\n type: correctionPopinProps.type,\n resultLabel: correctionPopinProps.resultLabel\n };\n\n return (\n <div\n className={classnames(\n style.correctionPopinWrapper,\n animateCorrectionPopin ? style.popinAnimation : null\n )}\n >\n <ReviewCorrectionPopin {..._correctionPopinProps} />\n </div>\n );\n};\n\nCorrectionPopin.propTypes = {\n slideIndex: PropTypes.string,\n showCorrectionPopin: PropTypes.bool,\n animateCorrectionPopin: PropTypes.bool,\n correctionPopinProps: propTypes.correctionPopinProps\n};\n\nconst ValidateButton = ({slideIndex, validateButton, primarySkinColor}) => {\n const {label, onClick, disabled} = validateButton;\n const validateButtonProps = {\n type: 'primary',\n label,\n 'aria-label': label,\n 'data-name': `slide-validate-button-${slideIndex}`,\n onClick,\n disabled,\n className: style.validateButton,\n customStyle: {\n backgroundColor: primarySkinColor\n }\n };\n\n return (\n <div key=\"button-wrapper\" className={style.validateButtonWrapper}>\n <ButtonLink {...validateButtonProps} />\n </div>\n );\n};\n\nValidateButton.propTypes = {\n slideIndex: PropTypes.string,\n validateButton: propTypes.validateButton,\n primarySkinColor: PropTypes.string\n};\n\nconst QuestionContainer = props => {\n const {answerUI, questionText, questionOrigin, disableContent} = props;\n if (!answerUI || !questionText) return null;\n\n return (\n <div\n key=\"content-container\"\n data-testid=\"content-container\"\n className={classnames(\n style.slideContentContainer,\n disableContent ? style.disabledSlideContent : null\n )}\n >\n <div key=\"from-course\" className={style.questionOrigin}>\n {questionOrigin}\n </div>\n <div\n key=\"title\"\n data-testid=\"slide-question\"\n className={style.question}\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{__html: questionText}}\n />\n <div\n key=\"help\"\n className={style.help}\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{__html: get('help', answerUI)}}\n />\n <div key=\"answer-container\" className={style.answerContainer}>\n <Answer {...answerUI} key=\"answer\" />\n </div>\n </div>\n );\n};\n\nQuestionContainer.propTypes = {\n answerUI: PropTypes.shape(propTypes.slide.answerUI),\n questionText: PropTypes.string,\n questionOrigin: PropTypes.string,\n disableContent: PropTypes.bool\n};\n\nconst ReviewSlide = props => {\n const {slide, validateButton, correctionPopinProps, slideIndex = '0'} = props;\n\n const skin = GetSkinFromContext();\n const primarySkinColor = useMemo(() => getOr('#00B0FF', 'common.primary', skin), [skin]);\n const {\n loading,\n loadingAriaLabel,\n parentContentTitle,\n questionText,\n disabledContent,\n answerUI,\n showCorrectionPopin,\n animateCorrectionPopin\n } = slide;\n\n return (\n <div data-testid=\"review-slide\" className={style.slide}>\n {loading ? (\n <Loader className={style.loader} theme=\"default\" aria-label={loadingAriaLabel} />\n ) : (\n <>\n <QuestionContainer\n questionOrigin={parentContentTitle}\n questionText={questionText}\n answerUI={answerUI}\n disableContent={disabledContent}\n key=\"question-container\"\n />\n <ValidateButton\n slideIndex={slideIndex}\n validateButton={validateButton}\n primarySkinColor={primarySkinColor}\n key=\"validate-button\"\n />\n <CorrectionPopin\n correctionPopinProps={correctionPopinProps}\n slideIndex={slideIndex}\n showCorrectionPopin={showCorrectionPopin}\n animateCorrectionPopin={animateCorrectionPopin}\n key=\"correction-popin\"\n />\n </>\n )}\n </div>\n );\n};\n\nReviewSlide.propTypes = propTypes;\n\nexport default ReviewSlide;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","names":["React","useMemo","useEffect","PropTypes","classnames","get","getOr","Answer","ButtonLink","Loader","ReviewCorrectionPopin","GetSkinFromContext","propTypes","style","CorrectionPopin","correctionPopinProps","slideIndex","showCorrectionPopin","animateCorrectionPopin","klf","information","label","message","next","onClick","_correctionPopinProps","type","resultLabel","keyDownHandler","event","key","preventDefault","document","removeEventListener","addEventListener","correctionPopinWrapper","popinAnimation","string","bool","ValidateButton","validateButton","primarySkinColor","disabled","validateButtonProps","className","customStyle","backgroundColor","validateButtonWrapper","QuestionContainer","props","answerUI","questionText","questionOrigin","disableContent","slideContentContainer","disabledSlideContent","question","__html","help","answerContainer","shape","slide","ReviewSlide","skin","loading","loadingAriaLabel","parentContentTitle","disabledContent","loader"],"sources":["../../../src/organism/review-slide/index.js"],"sourcesContent":["import React, {useMemo, useEffect} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport get from 'lodash/fp/get';\nimport getOr from 'lodash/fp/getOr';\nimport Answer from '../../molecule/answer';\nimport ButtonLink from '../../atom/button-link';\nimport Loader from '../../atom/loader';\nimport ReviewCorrectionPopin from '../../molecule/review-correction-popin';\nimport {GetSkinFromContext} from '../../atom/provider';\nimport propTypes from './prop-types';\nimport style from './style.css';\n\nconst CorrectionPopin = ({\n correctionPopinProps,\n slideIndex,\n showCorrectionPopin,\n animateCorrectionPopin\n}) => {\n if (!showCorrectionPopin) return null;\n\n const klf = getOr({}, 'klf', correctionPopinProps);\n const information = getOr({label: '', message: ''}, 'information', correctionPopinProps);\n const next = get('next', correctionPopinProps);\n const onClick = get(['next', 'onClick'], correctionPopinProps);\n\n const _correctionPopinProps = {\n next: {\n onClick,\n label: next && next.label,\n 'data-name': `next-question-button-${slideIndex}`,\n 'aria-label': next && next['aria-label']\n },\n klf,\n information,\n type: correctionPopinProps.type,\n resultLabel: correctionPopinProps.resultLabel\n };\n\n // there is an error of eslint here because this useEffect will be only there when the correctionPopin will be there\n // but that is on purpose to go to the next slide if you press enter when the correctionPopin is present\n // istanbul ignore next\n // eslint-disable-next-line react-hooks/rules-of-hooks\n useEffect(() => {\n const keyDownHandler = event => {\n if (event.key === 'Enter' || event.key === ' ') {\n event.preventDefault();\n onClick();\n document.removeEventListener('keydown', keyDownHandler);\n }\n };\n document.addEventListener('keydown', keyDownHandler);\n }, []);\n\n return (\n <div\n className={classnames(\n style.correctionPopinWrapper,\n animateCorrectionPopin ? style.popinAnimation : null\n )}\n >\n <ReviewCorrectionPopin {..._correctionPopinProps} />\n </div>\n );\n};\n\nCorrectionPopin.propTypes = {\n slideIndex: PropTypes.string,\n showCorrectionPopin: PropTypes.bool,\n animateCorrectionPopin: PropTypes.bool,\n correctionPopinProps: propTypes.correctionPopinProps\n};\n\nconst ValidateButton = ({slideIndex, validateButton, primarySkinColor}) => {\n const {label, onClick, disabled} = validateButton;\n const validateButtonProps = {\n type: 'primary',\n label,\n 'aria-label': label,\n 'data-name': `slide-validate-button-${slideIndex}`,\n onClick,\n disabled,\n className: style.validateButton,\n customStyle: {\n backgroundColor: primarySkinColor\n }\n };\n\n /* istanbul ignore next */\n useEffect(() => {\n const keyDownHandler = event => {\n if (event.key === 'Enter' || event.key === ' ') {\n event.preventDefault();\n }\n };\n if (disabled) document.addEventListener('keydown', keyDownHandler);\n return () => {\n document.removeEventListener('keydown', keyDownHandler);\n };\n }, [disabled]);\n\n return (\n <div key=\"button-wrapper\" className={style.validateButtonWrapper}>\n <ButtonLink {...validateButtonProps} />\n </div>\n );\n};\n\nValidateButton.propTypes = {\n slideIndex: PropTypes.string,\n validateButton: propTypes.validateButton,\n primarySkinColor: PropTypes.string\n};\n\nconst QuestionContainer = props => {\n const {answerUI, questionText, questionOrigin, disableContent} = props;\n if (!answerUI || !questionText) return null;\n\n return (\n <div\n key=\"content-container\"\n data-testid=\"content-container\"\n className={classnames(\n style.slideContentContainer,\n disableContent ? style.disabledSlideContent : null\n )}\n >\n <div key=\"from-course\" className={style.questionOrigin}>\n {questionOrigin}\n </div>\n <div\n key=\"title\"\n data-testid=\"slide-question\"\n className={style.question}\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{__html: questionText}}\n />\n <div\n key=\"help\"\n className={style.help}\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{__html: get('help', answerUI)}}\n />\n <div key=\"answer-container\" className={style.answerContainer}>\n <Answer {...answerUI} key=\"answer\" />\n </div>\n </div>\n );\n};\n\nQuestionContainer.propTypes = {\n answerUI: PropTypes.shape(propTypes.slide.answerUI),\n questionText: PropTypes.string,\n questionOrigin: PropTypes.string,\n disableContent: PropTypes.bool\n};\n\nconst ReviewSlide = props => {\n const {slide, validateButton, correctionPopinProps, slideIndex = '0'} = props;\n\n const skin = GetSkinFromContext();\n const primarySkinColor = useMemo(() => getOr('#00B0FF', 'common.primary', skin), [skin]);\n const {\n loading,\n loadingAriaLabel,\n parentContentTitle,\n questionText,\n disabledContent,\n answerUI,\n showCorrectionPopin,\n animateCorrectionPopin\n } = slide;\n\n return (\n <div data-testid=\"review-slide\" className={style.slide}>\n {loading ? (\n <Loader className={style.loader} theme=\"default\" aria-label={loadingAriaLabel} />\n ) : (\n <>\n <QuestionContainer\n questionOrigin={parentContentTitle}\n questionText={questionText}\n answerUI={answerUI}\n disableContent={disabledContent}\n key=\"question-container\"\n />\n <ValidateButton\n slideIndex={slideIndex}\n validateButton={validateButton}\n primarySkinColor={primarySkinColor}\n key=\"validate-button\"\n />\n <CorrectionPopin\n correctionPopinProps={correctionPopinProps}\n slideIndex={slideIndex}\n showCorrectionPopin={showCorrectionPopin}\n animateCorrectionPopin={animateCorrectionPopin}\n key=\"correction-popin\"\n />\n </>\n )}\n </div>\n );\n};\n\nReviewSlide.propTypes = propTypes;\n\nexport default ReviewSlide;\n"],"mappings":"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"}
|
|
@@ -19,6 +19,7 @@ declare namespace UserPreferences {
|
|
|
19
19
|
requiredSelection: PropTypes.Requireable<boolean>;
|
|
20
20
|
}> | null | undefined)[]>;
|
|
21
21
|
const moreInfoAriaLabel: PropTypes.Requireable<string>;
|
|
22
|
+
const groupAriaLabel: PropTypes.Requireable<string>;
|
|
22
23
|
}
|
|
23
24
|
}
|
|
24
25
|
import PropTypes from "prop-types";
|
|
@@ -46,10 +46,13 @@ Settings.propTypes = process.env.NODE_ENV !== "production" ? _extends({}, InputS
|
|
|
46
46
|
const UserPreferences = props => {
|
|
47
47
|
const {
|
|
48
48
|
preferences = [],
|
|
49
|
-
moreInfoAriaLabel
|
|
49
|
+
moreInfoAriaLabel,
|
|
50
|
+
groupAriaLabel
|
|
50
51
|
} = props;
|
|
51
52
|
return /*#__PURE__*/React.createElement("div", {
|
|
52
|
-
className: style.preferences
|
|
53
|
+
className: style.preferences,
|
|
54
|
+
role: "group",
|
|
55
|
+
"aria-label": groupAriaLabel
|
|
53
56
|
}, _map(settings => /*#__PURE__*/React.createElement(Settings, _extends({}, settings, {
|
|
54
57
|
key: settings.label,
|
|
55
58
|
moreInfoAriaLabel: moreInfoAriaLabel
|
|
@@ -58,7 +61,8 @@ const UserPreferences = props => {
|
|
|
58
61
|
|
|
59
62
|
UserPreferences.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
60
63
|
preferences: PropTypes.arrayOf(PropTypes.shape(Settings.propTypes)),
|
|
61
|
-
moreInfoAriaLabel: PropTypes.string
|
|
64
|
+
moreInfoAriaLabel: PropTypes.string,
|
|
65
|
+
groupAriaLabel: PropTypes.string
|
|
62
66
|
} : {};
|
|
63
67
|
export default UserPreferences;
|
|
64
68
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["React","PropTypes","NovaCompositionCoorpacademyInformationIcon","InfoIcon","InputSwitch","style","Settings","props","label","description","moreInfoAriaLabel","settings","infoIconWrapper","infoIcon","showToolTip","descriptionLabel","propTypes","string","isRequired","UserPreferences","preferences","arrayOf","shape"],"sources":["../../../src/organism/user-preferences/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {map, isEmpty} from 'lodash/fp';\nimport {NovaCompositionCoorpacademyInformationIcon as InfoIcon} from '@coorpacademy/nova-icons';\nimport InputSwitch from '../../atom/input-switch';\nimport style from './style.css';\n\nconst Settings = props => {\n const {label, description, moreInfoAriaLabel, ...settings} = props;\n return (\n <div className={style.settings}>\n <InputSwitch {...settings} />\n <span className={style.label}>{label}</span>\n {isEmpty(description) ? null : (\n <div className={style.infoIconWrapper}>\n <InfoIcon\n height={16}\n width={16}\n className={style.infoIcon}\n aria-label={moreInfoAriaLabel}\n />\n <div className={style.showToolTip}>\n <div className={style.descriptionLabel}>{description}</div>\n </div>\n </div>\n )}\n </div>\n );\n};\n\nSettings.propTypes = {\n ...InputSwitch.propTypes,\n label: PropTypes.string.isRequired,\n description: PropTypes.string\n};\n\nconst UserPreferences = props => {\n const {preferences = [], moreInfoAriaLabel} = props;\n\n return (\n <div className={style.preferences}>\n {map(\n settings => (\n <Settings {...settings} key={settings.label} moreInfoAriaLabel={moreInfoAriaLabel} />\n ),\n preferences\n )}\n </div>\n );\n};\n\nUserPreferences.propTypes = {\n preferences: PropTypes.arrayOf(PropTypes.shape(Settings.propTypes)),\n moreInfoAriaLabel: PropTypes.string\n};\n\nexport default UserPreferences;\n"],"mappings":";;;;;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AAEA,SAAQC,0CAA0C,IAAIC,QAAtD,QAAqE,0BAArE;AACA,OAAOC,WAAP,MAAwB,yBAAxB;AACA,OAAOC,KAAP,MAAkB,aAAlB;;AAEA,MAAMC,QAAQ,GAAGC,KAAK,IAAI;EACxB,MAAM;IAACC,KAAD;IAAQC,WAAR;IAAqBC;EAArB,IAAuDH,KAA7D;EAAA,MAAiDI,QAAjD,iCAA6DJ,KAA7D;;EACA,oBACE;IAAK,SAAS,EAAEF,KAAK,CAACM;EAAtB,gBACE,oBAAC,WAAD,EAAiBA,QAAjB,CADF,eAEE;IAAM,SAAS,EAAEN,KAAK,CAACG;EAAvB,GAA+BA,KAA/B,CAFF,EAGG,SAAQC,WAAR,IAAuB,IAAvB,gBACC;IAAK,SAAS,EAAEJ,KAAK,CAACO;EAAtB,gBACE,oBAAC,QAAD;IACE,MAAM,EAAE,EADV;IAEE,KAAK,EAAE,EAFT;IAGE,SAAS,EAAEP,KAAK,CAACQ,QAHnB;IAIE,cAAYH;EAJd,EADF,eAOE;IAAK,SAAS,EAAEL,KAAK,CAACS;EAAtB,gBACE;IAAK,SAAS,EAAET,KAAK,CAACU;EAAtB,GAAyCN,WAAzC,CADF,CAPF,CAJJ,CADF;AAmBD,CArBD;;AAuBAH,QAAQ,CAACU,SAAT,wDACKZ,WAAW,CAACY,SADjB;EAEER,KAAK,EAAEP,SAAS,CAACgB,MAAV,CAAiBC,UAF1B;EAGET,WAAW,EAAER,SAAS,CAACgB;AAHzB;;AAMA,MAAME,eAAe,GAAGZ,KAAK,IAAI;EAC/B,MAAM;IAACa,WAAW,GAAG,EAAf;IAAmBV;
|
|
1
|
+
{"version":3,"file":"index.js","names":["React","PropTypes","NovaCompositionCoorpacademyInformationIcon","InfoIcon","InputSwitch","style","Settings","props","label","description","moreInfoAriaLabel","settings","infoIconWrapper","infoIcon","showToolTip","descriptionLabel","propTypes","string","isRequired","UserPreferences","preferences","groupAriaLabel","arrayOf","shape"],"sources":["../../../src/organism/user-preferences/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {map, isEmpty} from 'lodash/fp';\nimport {NovaCompositionCoorpacademyInformationIcon as InfoIcon} from '@coorpacademy/nova-icons';\nimport InputSwitch from '../../atom/input-switch';\nimport style from './style.css';\n\nconst Settings = props => {\n const {label, description, moreInfoAriaLabel, ...settings} = props;\n return (\n <div className={style.settings}>\n <InputSwitch {...settings} />\n <span className={style.label}>{label}</span>\n {isEmpty(description) ? null : (\n <div className={style.infoIconWrapper}>\n <InfoIcon\n height={16}\n width={16}\n className={style.infoIcon}\n aria-label={moreInfoAriaLabel}\n />\n <div className={style.showToolTip}>\n <div className={style.descriptionLabel}>{description}</div>\n </div>\n </div>\n )}\n </div>\n );\n};\n\nSettings.propTypes = {\n ...InputSwitch.propTypes,\n label: PropTypes.string.isRequired,\n description: PropTypes.string\n};\n\nconst UserPreferences = props => {\n const {preferences = [], moreInfoAriaLabel, groupAriaLabel} = props;\n\n return (\n <div className={style.preferences} role=\"group\" aria-label={groupAriaLabel}>\n {map(\n settings => (\n <Settings {...settings} key={settings.label} moreInfoAriaLabel={moreInfoAriaLabel} />\n ),\n preferences\n )}\n </div>\n );\n};\n\nUserPreferences.propTypes = {\n preferences: PropTypes.arrayOf(PropTypes.shape(Settings.propTypes)),\n moreInfoAriaLabel: PropTypes.string,\n groupAriaLabel: PropTypes.string\n};\n\nexport default UserPreferences;\n"],"mappings":";;;;;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AAEA,SAAQC,0CAA0C,IAAIC,QAAtD,QAAqE,0BAArE;AACA,OAAOC,WAAP,MAAwB,yBAAxB;AACA,OAAOC,KAAP,MAAkB,aAAlB;;AAEA,MAAMC,QAAQ,GAAGC,KAAK,IAAI;EACxB,MAAM;IAACC,KAAD;IAAQC,WAAR;IAAqBC;EAArB,IAAuDH,KAA7D;EAAA,MAAiDI,QAAjD,iCAA6DJ,KAA7D;;EACA,oBACE;IAAK,SAAS,EAAEF,KAAK,CAACM;EAAtB,gBACE,oBAAC,WAAD,EAAiBA,QAAjB,CADF,eAEE;IAAM,SAAS,EAAEN,KAAK,CAACG;EAAvB,GAA+BA,KAA/B,CAFF,EAGG,SAAQC,WAAR,IAAuB,IAAvB,gBACC;IAAK,SAAS,EAAEJ,KAAK,CAACO;EAAtB,gBACE,oBAAC,QAAD;IACE,MAAM,EAAE,EADV;IAEE,KAAK,EAAE,EAFT;IAGE,SAAS,EAAEP,KAAK,CAACQ,QAHnB;IAIE,cAAYH;EAJd,EADF,eAOE;IAAK,SAAS,EAAEL,KAAK,CAACS;EAAtB,gBACE;IAAK,SAAS,EAAET,KAAK,CAACU;EAAtB,GAAyCN,WAAzC,CADF,CAPF,CAJJ,CADF;AAmBD,CArBD;;AAuBAH,QAAQ,CAACU,SAAT,wDACKZ,WAAW,CAACY,SADjB;EAEER,KAAK,EAAEP,SAAS,CAACgB,MAAV,CAAiBC,UAF1B;EAGET,WAAW,EAAER,SAAS,CAACgB;AAHzB;;AAMA,MAAME,eAAe,GAAGZ,KAAK,IAAI;EAC/B,MAAM;IAACa,WAAW,GAAG,EAAf;IAAmBV,iBAAnB;IAAsCW;EAAtC,IAAwDd,KAA9D;EAEA,oBACE;IAAK,SAAS,EAAEF,KAAK,CAACe,WAAtB;IAAmC,IAAI,EAAC,OAAxC;IAAgD,cAAYC;EAA5D,GACG,KACCV,QAAQ,iBACN,oBAAC,QAAD,eAAcA,QAAd;IAAwB,GAAG,EAAEA,QAAQ,CAACH,KAAtC;IAA6C,iBAAiB,EAAEE;EAAhE,GAFH,EAICU,WAJD,CADH,CADF;AAUD,CAbD;;AAeAD,eAAe,CAACH,SAAhB,2CAA4B;EAC1BI,WAAW,EAAEnB,SAAS,CAACqB,OAAV,CAAkBrB,SAAS,CAACsB,KAAV,CAAgBjB,QAAQ,CAACU,SAAzB,CAAlB,CADa;EAE1BN,iBAAiB,EAAET,SAAS,CAACgB,MAFH;EAG1BI,cAAc,EAAEpB,SAAS,CAACgB;AAHA,CAA5B;AAMA,eAAeE,eAAf"}
|
|
@@ -64,6 +64,7 @@ declare namespace SearchPage {
|
|
|
64
64
|
onToggleSorts: PropTypes.Requireable<(...args: any[]) => any>;
|
|
65
65
|
moreSortAriaLabel: PropTypes.Requireable<string>;
|
|
66
66
|
moreFilterAriaLabel: PropTypes.Requireable<string>;
|
|
67
|
+
filterGroupAriaLabel: PropTypes.Requireable<string>;
|
|
67
68
|
}>>;
|
|
68
69
|
const cards: PropTypes.Requireable<PropTypes.InferProps<{
|
|
69
70
|
list: PropTypes.Requireable<(PropTypes.InferProps<any> | null | undefined)[]>;
|
|
@@ -100,6 +101,7 @@ declare namespace SearchPage {
|
|
|
100
101
|
}>>;
|
|
101
102
|
const moreSortAriaLabel: PropTypes.Requireable<string>;
|
|
102
103
|
const moreFilterAriaLabel: PropTypes.Requireable<string>;
|
|
104
|
+
const filterGroupAriaLabel: PropTypes.Requireable<string>;
|
|
103
105
|
}
|
|
104
106
|
}
|
|
105
107
|
import PropTypes from "prop-types";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/template/common/search-page/index.js"],"names":[],"mappings":";AAUA,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/template/common/search-page/index.js"],"names":[],"mappings":";AAUA,mEAoDC"}
|