@coorpacademy/components 11.8.1-alpha.25 → 11.9.0
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/select/index.js +1 -1
- package/es/atom/select/index.js.map +1 -1
- package/es/molecule/answer/index.d.ts.map +1 -1
- package/es/molecule/answer/index.js +2 -2
- package/es/molecule/answer/index.js.map +1 -1
- package/es/molecule/questions/drop-down/index.d.ts.map +1 -1
- package/es/molecule/questions/drop-down/index.js +2 -2
- package/es/molecule/questions/drop-down/index.js.map +1 -1
- package/es/molecule/questions/qcm/index.d.ts.map +1 -1
- package/es/molecule/questions/qcm/index.js +2 -2
- package/es/molecule/questions/qcm/index.js.map +1 -1
- package/es/molecule/questions/qcm-drag/index.d.ts.map +1 -1
- package/es/molecule/questions/qcm-drag/index.js +2 -2
- package/es/molecule/questions/qcm-drag/index.js.map +1 -1
- package/es/molecule/questions/qcm-graphic/index.d.ts.map +1 -1
- package/es/molecule/questions/qcm-graphic/index.js +2 -2
- package/es/molecule/questions/qcm-graphic/index.js.map +1 -1
- package/es/molecule/questions/question-range/index.d.ts.map +1 -1
- package/es/molecule/questions/question-range/index.js +2 -2
- package/es/molecule/questions/question-range/index.js.map +1 -1
- package/es/molecule/questions/template/index.d.ts.map +1 -1
- package/es/molecule/questions/template/index.js +2 -2
- package/es/molecule/questions/template/index.js.map +1 -1
- package/es/organism/mooc-header/index.d.ts +0 -6
- package/es/organism/mooc-header/index.d.ts.map +1 -1
- package/es/organism/mooc-header/index.js +8 -68
- package/es/organism/mooc-header/index.js.map +1 -1
- package/es/organism/mooc-header/style.css +0 -46
- package/es/template/teams-dashboard/index.d.ts +0 -2
- package/lib/atom/select/index.js +1 -1
- package/lib/atom/select/index.js.map +1 -1
- package/lib/molecule/answer/index.d.ts.map +1 -1
- package/lib/molecule/answer/index.js +2 -2
- package/lib/molecule/answer/index.js.map +1 -1
- package/lib/molecule/questions/drop-down/index.d.ts.map +1 -1
- package/lib/molecule/questions/drop-down/index.js +2 -2
- package/lib/molecule/questions/drop-down/index.js.map +1 -1
- package/lib/molecule/questions/qcm/index.d.ts.map +1 -1
- package/lib/molecule/questions/qcm/index.js +2 -2
- package/lib/molecule/questions/qcm/index.js.map +1 -1
- package/lib/molecule/questions/qcm-drag/index.d.ts.map +1 -1
- package/lib/molecule/questions/qcm-drag/index.js +2 -2
- package/lib/molecule/questions/qcm-drag/index.js.map +1 -1
- package/lib/molecule/questions/qcm-graphic/index.d.ts.map +1 -1
- package/lib/molecule/questions/qcm-graphic/index.js +2 -2
- package/lib/molecule/questions/qcm-graphic/index.js.map +1 -1
- package/lib/molecule/questions/question-range/index.d.ts.map +1 -1
- package/lib/molecule/questions/question-range/index.js +2 -2
- package/lib/molecule/questions/question-range/index.js.map +1 -1
- package/lib/molecule/questions/template/index.d.ts.map +1 -1
- package/lib/molecule/questions/template/index.js +2 -2
- package/lib/molecule/questions/template/index.js.map +1 -1
- package/lib/organism/mooc-header/index.d.ts +0 -6
- package/lib/organism/mooc-header/index.d.ts.map +1 -1
- package/lib/organism/mooc-header/index.js +7 -67
- package/lib/organism/mooc-header/index.js.map +1 -1
- package/lib/organism/mooc-header/style.css +0 -46
- package/lib/template/teams-dashboard/index.d.ts +0 -2
- package/package.json +3 -3
|
@@ -73,12 +73,12 @@ const QCM = (props, legacyContext) => {
|
|
|
73
73
|
}
|
|
74
74
|
}));
|
|
75
75
|
}), [answers, longestAnswer, primarySkinColor]);
|
|
76
|
-
return /*#__PURE__*/_react.default.createElement("
|
|
76
|
+
return /*#__PURE__*/_react.default.createElement("div", {
|
|
77
77
|
"data-name": "qcm",
|
|
78
78
|
className: _style.default.wrapper,
|
|
79
79
|
role: "group",
|
|
80
80
|
"aria-label": groupAriaLabel
|
|
81
|
-
}, answersViews)
|
|
81
|
+
}, answersViews);
|
|
82
82
|
};
|
|
83
83
|
|
|
84
84
|
QCM.contextTypes = {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["QCM","props","legacyContext","answers","groupAriaLabel","longestAnswer","maxBy","title","length","skin","GetSkinFromContext","primarySkinColor","getOr","answersViews","useMemo","map","answer","key","onClick","selected","ariaLabel","longAnswerClass","style","selectedAnswerClass","selectedAnswer","unselectedAnswer","classnames","innerHTML","boxShadow","getShadowBoxColorFromPrimary","backgroundColor","background","answerText","__html","wrapper","contextTypes","Provider","childContextTypes","propTypes","PropTypes","arrayOf","shape","string","bool","func"],"sources":["../../../../src/molecule/questions/qcm/index.js"],"sourcesContent":["import React, {useMemo} from 'react';\nimport classnames from 'classnames';\nimport PropTypes from 'prop-types';\nimport getOr from 'lodash/fp/getOr';\nimport maxBy from 'lodash/fp/maxBy';\nimport Provider, {GetSkinFromContext} from '../../../atom/provider';\nimport {getShadowBoxColorFromPrimary} from '../../../util/get-shadow-box-color-from-primary';\nimport style from './style.css';\n\nconst QCM = (props, legacyContext) => {\n const {answers, groupAriaLabel} = props;\n const longestAnswer = maxBy(({title}) => title.length, answers);\n const skin = GetSkinFromContext(legacyContext);\n const primarySkinColor = getOr('#00B0FF', 'common.primary', skin);\n\n const answersViews = useMemo(\n () =>\n answers.map((answer, key) => {\n const {onClick, title, selected, 'aria-label': ariaLabel} = answer;\n const longAnswerClass = longestAnswer.title === title ? style.longestAnswer : style.answer;\n const selectedAnswerClass = selected ? style.selectedAnswer : style.unselectedAnswer;\n\n return (\n <div\n data-name=\"answer\"\n aria-label={ariaLabel || title}\n className={classnames(longAnswerClass, style.innerHTML, selectedAnswerClass)}\n onClick={onClick}\n style={{\n ...(selected && {\n boxShadow: `0 4px 16px ${getShadowBoxColorFromPrimary(primarySkinColor)}`\n })\n }}\n data-selected={selected}\n key={key}\n >\n <div\n data-name=\"answer-background\"\n style={{backgroundColor: selected ? primarySkinColor : '#F4F4F5' /* cm_grey_75 */}}\n className={style.background}\n />\n <span\n data-name=\"answer-label\"\n className={style.answerText}\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{__html: title}}\n />\n </div>\n );\n }),\n [answers, longestAnswer, primarySkinColor]\n );\n\n return (\n <
|
|
1
|
+
{"version":3,"file":"index.js","names":["QCM","props","legacyContext","answers","groupAriaLabel","longestAnswer","maxBy","title","length","skin","GetSkinFromContext","primarySkinColor","getOr","answersViews","useMemo","map","answer","key","onClick","selected","ariaLabel","longAnswerClass","style","selectedAnswerClass","selectedAnswer","unselectedAnswer","classnames","innerHTML","boxShadow","getShadowBoxColorFromPrimary","backgroundColor","background","answerText","__html","wrapper","contextTypes","Provider","childContextTypes","propTypes","PropTypes","arrayOf","shape","string","bool","func"],"sources":["../../../../src/molecule/questions/qcm/index.js"],"sourcesContent":["import React, {useMemo} from 'react';\nimport classnames from 'classnames';\nimport PropTypes from 'prop-types';\nimport getOr from 'lodash/fp/getOr';\nimport maxBy from 'lodash/fp/maxBy';\nimport Provider, {GetSkinFromContext} from '../../../atom/provider';\nimport {getShadowBoxColorFromPrimary} from '../../../util/get-shadow-box-color-from-primary';\nimport style from './style.css';\n\nconst QCM = (props, legacyContext) => {\n const {answers, groupAriaLabel} = props;\n const longestAnswer = maxBy(({title}) => title.length, answers);\n const skin = GetSkinFromContext(legacyContext);\n const primarySkinColor = getOr('#00B0FF', 'common.primary', skin);\n\n const answersViews = useMemo(\n () =>\n answers.map((answer, key) => {\n const {onClick, title, selected, 'aria-label': ariaLabel} = answer;\n const longAnswerClass = longestAnswer.title === title ? style.longestAnswer : style.answer;\n const selectedAnswerClass = selected ? style.selectedAnswer : style.unselectedAnswer;\n\n return (\n <div\n data-name=\"answer\"\n aria-label={ariaLabel || title}\n className={classnames(longAnswerClass, style.innerHTML, selectedAnswerClass)}\n onClick={onClick}\n style={{\n ...(selected && {\n boxShadow: `0 4px 16px ${getShadowBoxColorFromPrimary(primarySkinColor)}`\n })\n }}\n data-selected={selected}\n key={key}\n >\n <div\n data-name=\"answer-background\"\n style={{backgroundColor: selected ? primarySkinColor : '#F4F4F5' /* cm_grey_75 */}}\n className={style.background}\n />\n <span\n data-name=\"answer-label\"\n className={style.answerText}\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{__html: title}}\n />\n </div>\n );\n }),\n [answers, longestAnswer, primarySkinColor]\n );\n\n return (\n <div data-name=\"qcm\" className={style.wrapper} role=\"group\" aria-label={groupAriaLabel}>\n {answersViews}\n </div>\n );\n};\n\nQCM.contextTypes = {\n skin: Provider.childContextTypes.skin\n};\n\nQCM.propTypes = {\n answers: PropTypes.arrayOf(\n PropTypes.shape({\n title: PropTypes.string,\n selected: PropTypes.bool,\n onClick: PropTypes.func,\n 'aria-label': PropTypes.string\n })\n ),\n groupAriaLabel: PropTypes.string\n};\n\nexport default QCM;\n"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;AAEA,MAAMA,GAAG,GAAG,CAACC,KAAD,EAAQC,aAAR,KAA0B;EACpC,MAAM;IAACC,OAAD;IAAUC;EAAV,IAA4BH,KAAlC;EACA,MAAMI,aAAa,GAAG,IAAAC,cAAA,EAAM,CAAC;IAACC;EAAD,CAAD,KAAaA,KAAK,CAACC,MAAzB,EAAiCL,OAAjC,CAAtB;EACA,MAAMM,IAAI,GAAG,IAAAC,4BAAA,EAAmBR,aAAnB,CAAb;EACA,MAAMS,gBAAgB,GAAG,IAAAC,cAAA,EAAM,SAAN,EAAiB,gBAAjB,EAAmCH,IAAnC,CAAzB;EAEA,MAAMI,YAAY,GAAG,IAAAC,cAAA,EACnB,MACEX,OAAO,CAACY,GAAR,CAAY,CAACC,MAAD,EAASC,GAAT,KAAiB;IAC3B,MAAM;MAACC,OAAD;MAAUX,KAAV;MAAiBY,QAAjB;MAA2B,cAAcC;IAAzC,IAAsDJ,MAA5D;IACA,MAAMK,eAAe,GAAGhB,aAAa,CAACE,KAAd,KAAwBA,KAAxB,GAAgCe,cAAA,CAAMjB,aAAtC,GAAsDiB,cAAA,CAAMN,MAApF;IACA,MAAMO,mBAAmB,GAAGJ,QAAQ,GAAGG,cAAA,CAAME,cAAT,GAA0BF,cAAA,CAAMG,gBAApE;IAEA,oBACE;MACE,aAAU,QADZ;MAEE,cAAYL,SAAS,IAAIb,KAF3B;MAGE,SAAS,EAAE,IAAAmB,mBAAA,EAAWL,eAAX,EAA4BC,cAAA,CAAMK,SAAlC,EAA6CJ,mBAA7C,CAHb;MAIE,OAAO,EAAEL,OAJX;MAKE,KAAK,eACCC,QAAQ,IAAI;QACdS,SAAS,EAAG,cAAa,IAAAC,0DAAA,EAA6BlB,gBAA7B,CAA+C;MAD1D,CADb,CALP;MAUE,iBAAeQ,QAVjB;MAWE,GAAG,EAAEF;IAXP,gBAaE;MACE,aAAU,mBADZ;MAEE,KAAK,EAAE;QAACa,eAAe,EAAEX,QAAQ,GAAGR,gBAAH,GAAsB;QAAU;;MAA1D,CAFT;MAGE,SAAS,EAAEW,cAAA,CAAMS;IAHnB,EAbF,eAkBE;MACE,aAAU,cADZ;MAEE,SAAS,EAAET,cAAA,CAAMU,UAFnB,CAGE;MAHF;MAIE,uBAAuB,EAAE;QAACC,MAAM,EAAE1B;MAAT;IAJ3B,EAlBF,CADF;EA2BD,CAhCD,CAFiB,EAmCnB,CAACJ,OAAD,EAAUE,aAAV,EAAyBM,gBAAzB,CAnCmB,CAArB;EAsCA,oBACE;IAAK,aAAU,KAAf;IAAqB,SAAS,EAAEW,cAAA,CAAMY,OAAtC;IAA+C,IAAI,EAAC,OAApD;IAA4D,cAAY9B;EAAxE,GACGS,YADH,CADF;AAKD,CAjDD;;AAmDAb,GAAG,CAACmC,YAAJ,GAAmB;EACjB1B,IAAI,EAAE2B,iBAAA,CAASC,iBAAT,CAA2B5B;AADhB,CAAnB;AAIAT,GAAG,CAACsC,SAAJ,2CAAgB;EACdnC,OAAO,EAAEoC,kBAAA,CAAUC,OAAV,CACPD,kBAAA,CAAUE,KAAV,CAAgB;IACdlC,KAAK,EAAEgC,kBAAA,CAAUG,MADH;IAEdvB,QAAQ,EAAEoB,kBAAA,CAAUI,IAFN;IAGdzB,OAAO,EAAEqB,kBAAA,CAAUK,IAHL;IAId,cAAcL,kBAAA,CAAUG;EAJV,CAAhB,CADO,CADK;EASdtC,cAAc,EAAEmC,kBAAA,CAAUG;AATZ,CAAhB;eAYe1C,G"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/molecule/questions/qcm-drag/index.js"],"names":[],"mappings":";AAkGA;;;;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/molecule/questions/qcm-drag/index.js"],"names":[],"mappings":";AAkGA;;;;oCAYC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAtGD;;;;;;0BAQE;AA8BF;;;;gBA4CC;;;;;;;;;;;AAxED;;gBAA6E"}
|
|
@@ -141,7 +141,7 @@ const QcmDrag = ({
|
|
|
141
141
|
}, legacyContext) => {
|
|
142
142
|
const skin = (0, _provider.GetSkinFromContext)(legacyContext);
|
|
143
143
|
const primarySkinColor = (0, _getOr2.default)('#00B0FF', 'common.primary', skin);
|
|
144
|
-
return /*#__PURE__*/_react.default.createElement("
|
|
144
|
+
return /*#__PURE__*/_react.default.createElement("div", {
|
|
145
145
|
className: _style.default.wrapper,
|
|
146
146
|
role: "group",
|
|
147
147
|
"aria-label": groupAriaLabel
|
|
@@ -154,7 +154,7 @@ const QcmDrag = ({
|
|
|
154
154
|
className: _style.default.answers
|
|
155
155
|
}, /*#__PURE__*/_react.default.createElement(Choices, {
|
|
156
156
|
answers: answers
|
|
157
|
-
})))
|
|
157
|
+
})));
|
|
158
158
|
};
|
|
159
159
|
|
|
160
160
|
QcmDrag.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["AnswersPropTypes","PropTypes","arrayOf","shape","onClick","func","order","number","selected","bool","title","string","help","EmptyView","style","emptySpan","propTypes","Choices","answers","answersViews","map","answer","key","classnames","invisibleAnswer","unselected","innerHTML","__html","choices","SelectedAnswerSections","backgroundColor","selectedAnswers","selectedAnswersViews","boxShadow","getShadowBoxColorFromPrimary","background","content","selectedAnswerText","length","emptyAnswers","QcmDrag","groupAriaLabel","legacyContext","skin","GetSkinFromContext","primarySkinColor","wrapper","contextTypes","Provider","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 <
|
|
1
|
+
{"version":3,"file":"index.js","names":["AnswersPropTypes","PropTypes","arrayOf","shape","onClick","func","order","number","selected","bool","title","string","help","EmptyView","style","emptySpan","propTypes","Choices","answers","answersViews","map","answer","key","classnames","invisibleAnswer","unselected","innerHTML","__html","choices","SelectedAnswerSections","backgroundColor","selectedAnswers","selectedAnswersViews","boxShadow","getShadowBoxColorFromPrimary","background","content","selectedAnswerText","length","emptyAnswers","QcmDrag","groupAriaLabel","legacyContext","skin","GetSkinFromContext","primarySkinColor","wrapper","contextTypes","Provider","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"}
|
|
@@ -77,12 +77,12 @@ const QCMImage = (props, legacyContext) => {
|
|
|
77
77
|
}
|
|
78
78
|
}))));
|
|
79
79
|
});
|
|
80
|
-
return /*#__PURE__*/_react.default.createElement("
|
|
80
|
+
return /*#__PURE__*/_react.default.createElement("div", {
|
|
81
81
|
"data-name": "qcm-graphic-wrapper",
|
|
82
82
|
className: _style.default.wrapper,
|
|
83
83
|
role: "group",
|
|
84
84
|
"aria-label": groupAriaLabel
|
|
85
|
-
}, answersViews)
|
|
85
|
+
}, answersViews);
|
|
86
86
|
};
|
|
87
87
|
|
|
88
88
|
QCMImage.contextTypes = {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["QCMImage","props","legacyContext","answers","groupAriaLabel","skin","GetSkinFromContext","primarySkinColor","answersViews","map","answer","key","onClick","title","selected","image","ariaLabel","boxShadow","getShadowBoxColorFromPrimary","style","backgroundColor","background","content","imageWrapper","backgroundImage","titleWrapper","classnames","innerHTML","__html","wrapper","contextTypes","Provider","childContextTypes","propTypes","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 <
|
|
1
|
+
{"version":3,"file":"index.js","names":["QCMImage","props","legacyContext","answers","groupAriaLabel","skin","GetSkinFromContext","primarySkinColor","answersViews","map","answer","key","onClick","title","selected","image","ariaLabel","boxShadow","getShadowBoxColorFromPrimary","style","backgroundColor","background","content","imageWrapper","backgroundImage","titleWrapper","classnames","innerHTML","__html","wrapper","contextTypes","Provider","childContextTypes","propTypes","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;;AACA;;AAEA;;AACA;;AACA;;AACA;;;;;;;;;;AAEA,MAAMA,QAAQ,GAAG,CAACC,KAAD,EAAQC,aAAR,KAA0B;EACzC,MAAM;IAACC,OAAD;IAAUC;EAAV,IAA4BH,KAAlC;EACA,MAAMI,IAAI,GAAG,IAAAC,4BAAA,EAAmBJ,aAAnB,CAAb;EACA,MAAMK,gBAAgB,GAAG,qBAAM,SAAN,EAAiB,gBAAjB,EAAmCF,IAAnC,CAAzB;EAEA,MAAMG,YAAY,GAAGL,OAAO,CAACM,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,cAAa,IAAAC,0DAAA,EAA6BX,gBAA7B,CAA+C;MAD1D,CADb,CAJP;MASE,SAAS,EAAEO,QAAQ,GAAGK,cAAA,CAAML,QAAT,GAAoBK,cAAA,CAAMT,MAT/C;MAUE,GAAG,EAAEC;IAVP,gBAYE;MACE,aAAU,kBADZ;MAEE,KAAK,EAAE;QACLS,eAAe,EAAEN,QAAQ,GAAGP,gBAAH,GAAsB;MAD1C,CAFT;MAKE,SAAS,EAAEY,cAAA,CAAME;IALnB,EAZF,eAmBE;MAAK,aAAU,eAAf;MAA+B,SAAS,EAAEF,cAAA,CAAMG;IAAhD,gBACE;MACE,SAAS,EAAEH,cAAA,CAAMI,YADnB;MAEE,aAAU,aAFZ;MAGE,cAAYP,SAAS,IAAIH,KAH3B;MAIE,KAAK,EAAE;QACLW,eAAe,EAAG,OAAMT,KAAM;MADzB;IAJT,EADF,eASE;MAAK,aAAU,YAAf;MAA4B,SAAS,EAAEI,cAAA,CAAMM;IAA7C,gBACE;MACE,KAAK,EAAEZ,KADT;MAEE,SAAS,EAAE,IAAAa,mBAAA,EAAWP,cAAA,CAAMN,KAAjB,EAAwBM,cAAA,CAAMQ,SAA9B,CAFb,CAGE;MAHF;MAIE,uBAAuB,EAAE;QAACC,MAAM,EAAEf;MAAT;IAJ3B,EADF,CATF,CAnBF,CADF;EAwCD,CA3CoB,CAArB;EA6CA,oBACE;IACE,aAAU,qBADZ;IAEE,SAAS,EAAEM,cAAA,CAAMU,OAFnB;IAGE,IAAI,EAAC,OAHP;IAIE,cAAYzB;EAJd,GAMGI,YANH,CADF;AAUD,CA5DD;;AA8DAR,QAAQ,CAAC8B,YAAT,GAAwB;EACtBzB,IAAI,EAAE0B,iBAAA,CAASC,iBAAT,CAA2B3B;AADX,CAAxB;AAIAL,QAAQ,CAACiC,SAAT,2CAAqB;EACnB9B,OAAO,EAAE+B,kBAAA,CAAUC,OAAV,CACPD,kBAAA,CAAUE,KAAV,CAAgB;IACdvB,KAAK,EAAEqB,kBAAA,CAAUG,MADH;IAEdvB,QAAQ,EAAEoB,kBAAA,CAAUI,IAFN;IAGd1B,OAAO,EAAEsB,kBAAA,CAAUK,IAHL;IAIdxB,KAAK,EAAEmB,kBAAA,CAAUG,MAJH;IAKdrB,SAAS,EAAEkB,kBAAA,CAAUG;EALP,CAAhB,CADO,CADU;EAUnBjC,cAAc,EAAE8B,kBAAA,CAAUG;AAVP,CAArB;eAaerC,Q"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/molecule/questions/question-range/index.js"],"names":[],"mappings":";AAQA,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/molecule/questions/question-range/index.js"],"names":[],"mappings":";AAQA,4EAiCC"}
|
|
@@ -43,7 +43,7 @@ const QuestionRange = (props, legacyContext) => {
|
|
|
43
43
|
const titleStyle = {
|
|
44
44
|
color: defaultColor
|
|
45
45
|
};
|
|
46
|
-
return /*#__PURE__*/_react.default.createElement("
|
|
46
|
+
return /*#__PURE__*/_react.default.createElement("div", {
|
|
47
47
|
className: _style.default.wrapper,
|
|
48
48
|
role: "group",
|
|
49
49
|
"aria-label": groupAriaLabel
|
|
@@ -68,7 +68,7 @@ const QuestionRange = (props, legacyContext) => {
|
|
|
68
68
|
dangerouslySetInnerHTML: {
|
|
69
69
|
__html: maxLabel
|
|
70
70
|
}
|
|
71
|
-
})))
|
|
71
|
+
})));
|
|
72
72
|
};
|
|
73
73
|
|
|
74
74
|
QuestionRange.contextTypes = {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["QuestionRange","props","legacyContext","title","minLabel","maxLabel","groupAriaLabel","rangeProps","skin","GetSkinFromContext","defaultColor","titleStyle","color","style","wrapper","classnames","innerHTML","__html","labelWrapper","label","contextTypes","Provider","childContextTypes","propTypes","Range","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 <
|
|
1
|
+
{"version":3,"file":"index.js","names":["QuestionRange","props","legacyContext","title","minLabel","maxLabel","groupAriaLabel","rangeProps","skin","GetSkinFromContext","defaultColor","titleStyle","color","style","wrapper","classnames","innerHTML","__html","labelWrapper","label","contextTypes","Provider","childContextTypes","propTypes","Range","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;;AAEA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;;;;;AAEA,MAAMA,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,GAAG,IAAAC,4BAAA,EAAmBP,aAAnB,CAAb;EACA,MAAMQ,YAAY,GAAG,qBAAM,SAAN,EAAiB,gBAAjB,EAAmCF,IAAnC,CAArB;EAEA,MAAMG,UAAU,GAAG;IACjBC,KAAK,EAAEF;EADU,CAAnB;EAIA,oBACE;IAAK,SAAS,EAAEG,cAAA,CAAMC,OAAtB;IAA+B,IAAI,EAAC,OAApC;IAA4C,cAAYR;EAAxD,gBACE;IACE,KAAK,EAAEK,UADT;IAEE,SAAS,EAAE,IAAAI,mBAAA,EAAWF,cAAA,CAAMV,KAAjB,EAAwBU,cAAA,CAAMG,SAA9B,CAFb,CAGE;IAHF;IAIE,uBAAuB,EAAE;MAACC,MAAM,EAAEd;IAAT;EAJ3B,EADF,eAOE,6BAAC,cAAD,EAAWI,UAAX,CAPF,eAQE;IAAK,SAAS,EAAEM,cAAA,CAAMK;EAAtB,gBACE;IACE,SAAS,EAAE,IAAAH,mBAAA,EAAWF,cAAA,CAAMM,KAAjB,EAAwBN,cAAA,CAAMG,SAA9B,CADb,CAEE;IAFF;IAGE,uBAAuB,EAAE;MAACC,MAAM,EAAEb;IAAT;EAH3B,EADF,eAME;IACE,SAAS,EAAE,IAAAW,mBAAA,EAAWF,cAAA,CAAMM,KAAjB,EAAwBN,cAAA,CAAMG,SAA9B,CADb,CAEE;IAFF;IAGE,uBAAuB,EAAE;MAACC,MAAM,EAAEZ;IAAT;EAH3B,EANF,CARF,CADF;AAuBD,CAjCD;;AAmCAL,aAAa,CAACoB,YAAd,GAA6B;EAC3BZ,IAAI,EAAEa,iBAAA,CAASC,iBAAT,CAA2Bd;AADN,CAA7B;AAIAR,aAAa,CAACuB,SAAd,wDACKC,cAAA,CAAMD,SADX;EAEEpB,KAAK,EAAEsB,kBAAA,CAAUC,MAFnB;EAGEtB,QAAQ,EAAEqB,kBAAA,CAAUC,MAHtB;EAIErB,QAAQ,EAAEoB,kBAAA,CAAUC,MAJtB;EAKEpB,cAAc,EAAEmB,kBAAA,CAAUC;AAL5B;eAQe1B,a"}
|
|
@@ -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"}
|
|
@@ -73,12 +73,12 @@ const Template = ({
|
|
|
73
73
|
}
|
|
74
74
|
}, totalTemplate);
|
|
75
75
|
|
|
76
|
-
return /*#__PURE__*/_react.default.createElement("
|
|
76
|
+
return /*#__PURE__*/_react.default.createElement("div", {
|
|
77
77
|
"data-name": "template-wrapper",
|
|
78
78
|
className: _style.default.wrapper,
|
|
79
79
|
role: "group",
|
|
80
80
|
"aria-label": groupAriaLabel
|
|
81
|
-
}, templateCompose)
|
|
81
|
+
}, templateCompose);
|
|
82
82
|
};
|
|
83
83
|
|
|
84
84
|
const TextPropTypes = process.env.NODE_ENV !== "production" ? _extends({}, _dropDown.default.propTypes, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["Template","template","answers","groupAriaLabel","totalTemplate","parseTemplateString","templateCompose","convert","cap","part","key","type","style","textPart","__html","value","field","name","fieldType","fieldProps","fieldView","text","answerType","wrapper","TextPropTypes","DropDown","propTypes","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 <
|
|
1
|
+
{"version":3,"file":"index.js","names":["Template","template","answers","groupAriaLabel","totalTemplate","parseTemplateString","templateCompose","convert","cap","part","key","type","style","textPart","__html","value","field","name","fieldType","fieldProps","fieldView","text","answerType","wrapper","TextPropTypes","DropDown","propTypes","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;;AACA;;AAEA;;AACA;;AACA;;AACA;;;;;;;;;;AAEA,MAAMA,QAAQ,GAAG,CAAC;EAACC,QAAD;EAAWC,OAAX;EAAoBC;AAApB,CAAD,KAAyC;EACxD,MAAMC,aAAa,GAAG,IAAAC,4BAAA,EAAoBJ,QAApB,CAAtB;;EACA,MAAMK,eAAe,GAAG,cAAIC,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,EAAEE,cAAA,CAAMC,QAFnB,CAGE;QAHF;QAIE,uBAAuB,EAAE;UAACC,MAAM,EAAEL,IAAI,CAACM;QAAd;MAJ3B,EADF;IAQD;;IACD,IAAIJ,IAAI,KAAK,aAAb,EAA4B;MAC1B,MAAMK,KAAK,GAAG,oBAAK;QAACC,IAAI,EAAER,IAAI,CAACM;MAAZ,CAAL,EAAyBb,OAAzB,CAAd;MACA,IAAI,CAACc,KAAL,EAAY,OAAO,IAAP;;MACZ,MAAM;QAACL,IAAI,EAAEO;MAAP,IAAmCF,KAAzC;MAAA,MAA2BG,UAA3B,iCAAyCH,KAAzC;;MACA,MAAMI,SAAS,GACbF,SAAS,KAAK,MAAd,gBACE,6BAAC,iBAAD,eAAcC,UAAd;QAA0B,SAAS,EAAEP,cAAA,CAAMS;MAA3C,GADF,gBAGE,6BAAC,iBAAD,eAAcF,UAAd;QAA0B,KAAK,EAAC;MAAhC,GAJJ;MAOA,oBACE;QAAK,SAAS,EAAEP,cAAA,CAAMU,UAAtB;QAAkC,GAAG,EAAEb,IAAI,CAACM;MAA5C,GACGK,SADH,CADF;IAKD;EACF,CA7BuB,EA6BrBhB,aA7BqB,CAAxB;;EA+BA,oBACE;IACE,aAAU,kBADZ;IAEE,SAAS,EAAEQ,cAAA,CAAMW,OAFnB;IAGE,IAAI,EAAC,OAHP;IAIE,cAAYpB;EAJd,GAMGG,eANH,CADF;AAUD,CA3CD;;AA6CA,MAAMkB,aAAN,wDACKC,iBAAA,CAASC,SADd;EAEEf,IAAI,EAAEgB,kBAAA,CAAUC;AAFlB;AAKA5B,QAAQ,CAAC0B,SAAT,2CAAqB;EACnBzB,QAAQ,EAAE0B,kBAAA,CAAUC,MADD;EAEnB1B,OAAO,EAAEyB,kBAAA,CAAUE,OAAV,CACPF,kBAAA,CAAUG,SAAV,CAAoB,CAACH,kBAAA,CAAUI,KAAV,CAAgBN,iBAAA,CAASC,SAAzB,CAAD,EAAsCC,kBAAA,CAAUI,KAAV,CAAgBP,aAAhB,CAAtC,CAApB,CADO,CAFU;EAKnBrB,cAAc,EAAEwB,kBAAA,CAAUC;AALP,CAArB;eAQe5B,Q"}
|
|
@@ -7,8 +7,6 @@ declare class MoocHeader extends React.Component<any, any, any> {
|
|
|
7
7
|
href: PropTypes.Requireable<string>;
|
|
8
8
|
'aria-label': PropTypes.Requireable<string>;
|
|
9
9
|
'button-aria-label': PropTypes.Requireable<string>;
|
|
10
|
-
toolTipText: PropTypes.Requireable<string>;
|
|
11
|
-
closeToolTipInformationTextAriaLabel: PropTypes.Requireable<string>;
|
|
12
10
|
}>>;
|
|
13
11
|
search: PropTypes.Requireable<PropTypes.InferProps<{
|
|
14
12
|
value: PropTypes.Requireable<string>;
|
|
@@ -138,7 +136,6 @@ declare class MoocHeader extends React.Component<any, any, any> {
|
|
|
138
136
|
isSettingsOpen: boolean;
|
|
139
137
|
isMenuOpen: boolean;
|
|
140
138
|
isFocus: boolean;
|
|
141
|
-
isToolTipOpen: boolean;
|
|
142
139
|
};
|
|
143
140
|
handleSettingsToggle(): void;
|
|
144
141
|
handleMenuToggle(): void;
|
|
@@ -151,9 +148,6 @@ declare class MoocHeader extends React.Component<any, any, any> {
|
|
|
151
148
|
handleOnBlur(): void;
|
|
152
149
|
handleOnMenuOpen(): void;
|
|
153
150
|
handleOnMenuClose(): void;
|
|
154
|
-
handleOnMouseOver(): void;
|
|
155
|
-
handleOnMouseLeave(): void;
|
|
156
|
-
handleKeyPress(event: any): void;
|
|
157
151
|
componentDidUpdate(prevProps: any, prevState: any, prevContext: any): void;
|
|
158
152
|
menuSettings: any;
|
|
159
153
|
render(): JSX.Element | null;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organism/mooc-header/index.js"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organism/mooc-header/index.js"],"names":[],"mappings":";AAwBA;IACE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MA2FE;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,6BAmYC;CACF"}
|
|
@@ -45,8 +45,7 @@ class MoocHeader extends _react.default.Component {
|
|
|
45
45
|
this.state = {
|
|
46
46
|
isSettingsOpen: false,
|
|
47
47
|
isMenuOpen: false,
|
|
48
|
-
isFocus: false
|
|
49
|
-
isToolTipOpen: false
|
|
48
|
+
isFocus: false
|
|
50
49
|
};
|
|
51
50
|
this.handleSettingsToggle = this.handleSettingsToggle.bind(this);
|
|
52
51
|
this.handleMenuToggle = this.handleMenuToggle.bind(this);
|
|
@@ -59,9 +58,6 @@ class MoocHeader extends _react.default.Component {
|
|
|
59
58
|
this.handleOnBlur = this.handleOnBlur.bind(this);
|
|
60
59
|
this.handleOnMenuOpen = this.handleOnMenuOpen.bind(this);
|
|
61
60
|
this.handleOnMenuClose = this.handleOnMenuClose.bind(this);
|
|
62
|
-
this.handleOnMouseOver = this.handleOnMouseOver.bind(this);
|
|
63
|
-
this.handleOnMouseLeave = this.handleOnMouseLeave.bind(this);
|
|
64
|
-
this.handleKeyPress = this.handleKeyPress.bind(this);
|
|
65
61
|
}
|
|
66
62
|
|
|
67
63
|
componentDidUpdate(prevProps, prevState, prevContext) {
|
|
@@ -176,30 +172,6 @@ class MoocHeader extends _react.default.Component {
|
|
|
176
172
|
}));
|
|
177
173
|
}
|
|
178
174
|
|
|
179
|
-
handleOnMouseOver() {
|
|
180
|
-
this.setState(() => ({
|
|
181
|
-
isToolTipOpen: true
|
|
182
|
-
}));
|
|
183
|
-
}
|
|
184
|
-
|
|
185
|
-
handleOnMouseLeave() {
|
|
186
|
-
this.setState(() => ({
|
|
187
|
-
isToolTipOpen: false
|
|
188
|
-
}));
|
|
189
|
-
}
|
|
190
|
-
|
|
191
|
-
handleKeyPress(event) {
|
|
192
|
-
if (event.key === 'Enter') {
|
|
193
|
-
this.setState(() => ({
|
|
194
|
-
isToolTipOpen: true
|
|
195
|
-
}));
|
|
196
|
-
} else if (event.key === 'Tab' || event.key === 'Escape') {
|
|
197
|
-
this.setState(() => ({
|
|
198
|
-
isToolTipOpen: false
|
|
199
|
-
}));
|
|
200
|
-
}
|
|
201
|
-
}
|
|
202
|
-
|
|
203
175
|
render() {
|
|
204
176
|
if ((0, _isEmpty2.default)(this.props)) return null;
|
|
205
177
|
const {
|
|
@@ -217,8 +189,7 @@ class MoocHeader extends _react.default.Component {
|
|
|
217
189
|
const {
|
|
218
190
|
isFocus,
|
|
219
191
|
isSettingsOpen,
|
|
220
|
-
isMenuOpen
|
|
221
|
-
isToolTipOpen
|
|
192
|
+
isMenuOpen
|
|
222
193
|
} = this.state;
|
|
223
194
|
const {
|
|
224
195
|
translate,
|
|
@@ -227,9 +198,7 @@ class MoocHeader extends _react.default.Component {
|
|
|
227
198
|
const {
|
|
228
199
|
'aria-label': logoAriaLabel,
|
|
229
200
|
closeMenuAriaLabel,
|
|
230
|
-
openMenuAriaLabel
|
|
231
|
-
toolTipText,
|
|
232
|
-
closeToolTipInformationTextAriaLabel
|
|
201
|
+
openMenuAriaLabel
|
|
233
202
|
} = logo;
|
|
234
203
|
const logoUrl = (0, _get2.default)('src', logo) || (0, _get2.default)('images.logo', skin);
|
|
235
204
|
const logoMobileUrl = (0, _get2.default)('srcMobile', logo) || (0, _getOr2.default)(logoUrl, 'images.logo-mobile', skin);
|
|
@@ -533,10 +502,7 @@ class MoocHeader extends _react.default.Component {
|
|
|
533
502
|
"data-open": isMenuOpen,
|
|
534
503
|
className: isMenuOpen ? _style.default.open : _style.default.header
|
|
535
504
|
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
536
|
-
className: _style.default.logoWrapper
|
|
537
|
-
"aria-label": toolTipText,
|
|
538
|
-
onMouseOver: this.handleOnMouseOver,
|
|
539
|
-
onMouseLeave: this.handleOnMouseLeave
|
|
505
|
+
className: _style.default.logoWrapper
|
|
540
506
|
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
541
507
|
className: _style.default.navMobile,
|
|
542
508
|
"data-name": "nav-mobile"
|
|
@@ -562,35 +528,11 @@ class MoocHeader extends _react.default.Component {
|
|
|
562
528
|
}))), /*#__PURE__*/_react.default.createElement(_link.default, {
|
|
563
529
|
className: _style.default.logo,
|
|
564
530
|
"data-name": "logo",
|
|
565
|
-
href: logo.href
|
|
566
|
-
onKeyDown: this.handleKeyPress,
|
|
567
|
-
tabIndex: 0
|
|
531
|
+
href: logo.href
|
|
568
532
|
}, /*#__PURE__*/_react.default.createElement(_picture.default, {
|
|
569
533
|
src: logoUrl,
|
|
570
534
|
alt: logoAriaLabel
|
|
571
|
-
}),
|
|
572
|
-
"aria-label": toolTipText,
|
|
573
|
-
tabIndex: 0
|
|
574
|
-
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
575
|
-
"aria-label": `${toolTipText} ${closeToolTipInformationTextAriaLabel}`,
|
|
576
|
-
role: "tooltip",
|
|
577
|
-
className: _style.default.tooltipIconContainer,
|
|
578
|
-
tabIndex: 0
|
|
579
|
-
}, /*#__PURE__*/_react.default.createElement(_novaIcons.NovaSolidPlacesPlacesHome2, {
|
|
580
|
-
className: _style.default.homeIcon,
|
|
581
|
-
style: {
|
|
582
|
-
color: primaryColor
|
|
583
|
-
}
|
|
584
|
-
}), /*#__PURE__*/_react.default.createElement("p", {
|
|
585
|
-
className: _style.default.toolTipText // eslint-disable-next-line react/no-danger
|
|
586
|
-
,
|
|
587
|
-
dangerouslySetInnerHTML: {
|
|
588
|
-
__html: toolTipText
|
|
589
|
-
},
|
|
590
|
-
style: {
|
|
591
|
-
color: primaryColor
|
|
592
|
-
}
|
|
593
|
-
}))) : null)), searchFormView, /*#__PURE__*/_react.default.createElement("div", {
|
|
535
|
+
}))), searchFormView, /*#__PURE__*/_react.default.createElement("div", {
|
|
594
536
|
className: isMenuOpen ? _style.default.menuWrapper : _style.default.hiddenMenuWrapper,
|
|
595
537
|
"data-name": "menu-wrapper"
|
|
596
538
|
}, pagesView, userView || linksView, settingsView)));
|
|
@@ -608,9 +550,7 @@ MoocHeader.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
|
608
550
|
srcMobile: _propTypes.default.string,
|
|
609
551
|
href: _propTypes.default.string,
|
|
610
552
|
'aria-label': _propTypes.default.string,
|
|
611
|
-
'button-aria-label': _propTypes.default.string
|
|
612
|
-
toolTipText: _propTypes.default.string,
|
|
613
|
-
closeToolTipInformationTextAriaLabel: _propTypes.default.string
|
|
553
|
+
'button-aria-label': _propTypes.default.string
|
|
614
554
|
}),
|
|
615
555
|
search: _propTypes.default.shape(_inputSearch.default.propTypes),
|
|
616
556
|
'search-reset-aria-label': _propTypes.default.string,
|