npm - @pie-element/multiple-choice - Versions diffs - 9.19.3 → 9.19.4 - Mend

@pie-element/multiple-choice 9.19.3 → 9.19.4

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.

Files changed (9) hide show

package/CHANGELOG.md +11 -0
package/lib/multiple-choice.js +6 -1
package/lib/multiple-choice.js.map +1 -1
package/module/element.js +17 -15
package/module/index.html +1 -1
package/module/manifest.json +1 -1
package/module/print.html +1 -1
package/module/print.js +17 -15
package/package.json +2 -2

package/CHANGELOG.md CHANGED Viewed

@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+## [9.19.4](https://github.com/pie-framework/pie-elements/compare/@pie-element/multiple-choice@9.19.3...@pie-element/multiple-choice@9.19.4) (2025-09-18)
+### Bug Fixes
+* **multiple-choice:** handle evaluate and print modes correctly PD-5200 ([6f6397e](https://github.com/pie-framework/pie-elements/commit/6f6397ee2de584da70c789c8e1ec1529ec609727))
 ## [9.19.3](https://github.com/pie-framework/pie-elements/compare/@pie-element/multiple-choice@9.19.2...@pie-element/multiple-choice@9.19.3) (2025-09-11)

package/lib/multiple-choice.js CHANGED Viewed

@@ -251,7 +251,12 @@ var MultipleChoice = /*#__PURE__*/function (_React$Component) {
   }, {
     key: "getChecked",
     value: function getChecked(choice) {
-      if (this.state.showCorrect) {
+      // to determine if we are in evaluate mode or print mode
+      // since both modes have showCorrect but it interferes with "browse mode" in IBX if the print props are set
+      var isEvaluateMode = this.state.showCorrect && this.props.mode === 'evaluate';
+      var isPrintMode = this.props.alwaysShowCorrect && (!this.props.session || !this.props.session.value || this.props.session.value.length === 0);
+      if (isEvaluateMode || isPrintMode) {
         return choice.correct || false;
       }

package/lib/multiple-choice.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/multiple-choice.jsx"],"names":["translator","Translator","styles","theme","main","color","text","backgroundColor","background","position","border","partLabel","display","fontSize","margin","fontWeight","paddingBottom","spacing","unit","teacherInstructions","marginBottom","horizontalLayout","flexDirection","flexWrap","gridLayout","fieldset","padding","minWidth","outline","srOnly","left","top","width","height","overflow","errorText","typography","palette","error","paddingTop","MultipleChoice","props","event","target","value","checked","maxSelections","onChoiceChanged","session","length","setState","maxSelectionsErrorState","selected","selector","mode","showCorrect","state","onShowCorrectToggle","choice","isCorrect","correct","isChecked","isSelected","undefined","e","currentTarget","activeEl","document","activeElement","contains","relatedTarget","compareDocumentPosition","Node","DOCUMENT_POSITION_PRECEDING","firstInputRef","current","focus","alwaysShowCorrect","onToggle","bind","React","createRef","sessionValue","indexOf","nextProps","correctResponse","index","keyMode","String","fromCharCode","toUpperCase","choiceMode","classes","disabled","className","choices","gridColumns","prompt","responseCorrect","animationsDisabled","language","isSelectionButtonBelow","minSelections","autoplayAudioEnabled","customAudioButton","isEvaluateMode","showCorrectAnswerToggle","columnsStyle","gridTemplateColumns","selections","teacherInstructionsDiv","getMultipleChoiceMinSelectionErrorMessage","t","lng","renderHeading","hidden","visible","handleGroupFocus","choicesLayout","map","selectedAnswerBackgroundColor","handleChange","hideTick","getChecked","getCorrectness","indexToSymbol","Component","PropTypes","string","oneOf","array","object","bool","func","isRequired","number","playImage","pauseImage","defaultProps"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { CorrectAnswerToggle } from '@pie-lib/pie-toolbox/correct-answer-toggle';\nimport classNames from 'classnames';\nimport { withStyles } from '@material-ui/core/styles';\nimport { color, Collapsible, PreviewPrompt } from '@pie-lib/pie-toolbox/render-ui';\nimport Translator from '@pie-lib/pie-toolbox/translator';\n\nimport StyledChoice from './choice';\n\n// MultipleChoice\n\nconst { translator } = Translator;\n\nconst styles = (theme) => ({\n main: {\n color: color.text(),\n backgroundColor: color.background(),\n '& ': {\n '-webkit-font-smoothing': 'antialiased',\n },\n position: 'relative',\n // remove border from legend tags inside main to override the OT default styles\n '& legend': {\n border: 'none !important',\n },\n },\n partLabel: {\n display: 'block',\n fontSize: 'inherit',\n margin: '0',\n fontWeight: 'normal',\n paddingBottom: theme.spacing.unit 2,\n },\n teacherInstructions: {\n marginBottom: theme.spacing.unit * 2,\n },\n horizontalLayout: {\n display: 'flex',\n flexDirection: 'row',\n flexWrap: 'wrap',\n },\n gridLayout: {\n display: 'grid',\n },\n fieldset: {\n border: '0px',\n padding: '0.01em 0 0 0',\n margin: '0px',\n minWidth: '0px',\n '&:focus': {\n outline: 'none',\n },\n },\n srOnly: {\n position: 'absolute',\n left: '-10000px',\n top: 'auto',\n width: '1px',\n height: '1px',\n overflow: 'hidden',\n },\n errorText: {\n fontSize: theme.typography.fontSize - 2,\n color: theme.palette.error.main,\n paddingTop: theme.spacing.unit,\n },\n});\n\nexport class MultipleChoice extends React.Component {\n static propTypes = {\n className: PropTypes.string,\n mode: PropTypes.oneOf(['gather', 'view', 'evaluate']),\n choiceMode: PropTypes.oneOf(['radio', 'checkbox']),\n keyMode: PropTypes.oneOf(['numbers', 'letters', 'none']),\n choices: PropTypes.array,\n partLabel: PropTypes.string,\n prompt: PropTypes.string,\n teacherInstructions: PropTypes.string,\n session: PropTypes.object,\n disabled: PropTypes.bool,\n onChoiceChanged: PropTypes.func,\n responseCorrect: PropTypes.bool,\n classes: PropTypes.object.isRequired,\n correctResponse: PropTypes.array,\n choicesLayout: PropTypes.oneOf(['vertical', 'grid', 'horizontal']),\n gridColumns: PropTypes.string,\n alwaysShowCorrect: PropTypes.bool,\n animationsDisabled: PropTypes.bool,\n language: PropTypes.string,\n selectedAnswerBackgroundColor: PropTypes.string,\n onShowCorrectToggle: PropTypes.func,\n isSelectionButtonBelow: PropTypes.bool,\n minSelections: PropTypes.number,\n maxSelections: PropTypes.number,\n autoplayAudioEnabled: PropTypes.bool,\n customAudioButton: {\n playImage: PropTypes.string,\n pauseImage: PropTypes.string,\n },\n };\n\n constructor(props) {\n super(props);\n\n this.state = {\n showCorrect: this.props.alwaysShowCorrect \|\| false,\n maxSelectionsErrorState: false,\n };\n\n this.onToggle = this.onToggle.bind(this);\n this.firstInputRef = React.createRef();\n }\n\n isSelected(value) {\n const sessionValue = this.props.session && this.props.session.value;\n\n return sessionValue && sessionValue.indexOf && sessionValue.indexOf(value) >= 0;\n }\n\n // handleChange was added for accessibility. Please see comments and videos from PD-2441.\n handleChange = (event) => {\n const { value, checked } = event.target;\n const { maxSelections, onChoiceChanged, session } = this.props;\n\n if (session.value && session.value.length >= maxSelections) {\n // show/hide max selections error when user select/deselect an answer\n this.setState({ maxSelectionsErrorState: checked });\n\n if (checked) {\n // prevent selecting more answers\n return;\n }\n }\n\n onChoiceChanged({ value, selected: checked, selector: 'Mouse' });\n };\n\n onToggle = () => {\n if (this.props.mode === 'evaluate') {\n this.setState({ showCorrect: !this.state.showCorrect }, () => {\n if (this.props.onShowCorrectToggle) {\n this.props.onShowCorrectToggle();\n }\n });\n }\n };\n\n UNSAFE_componentWillReceiveProps(nextProps) {\n if (!nextProps.correctResponse && this.state.showCorrect !== false) {\n this.setState({ showCorrect: false }, () => {\n if (this.props.onShowCorrectToggle) {\n this.props.onShowCorrectToggle();\n }\n });\n }\n\n if (nextProps.alwaysShowCorrect && this.state.showCorrect !== true) {\n this.setState({ showCorrect: true }, () => {\n if (this.props.onShowCorrectToggle) {\n this.props.onShowCorrectToggle();\n }\n });\n }\n }\n\n indexToSymbol(index) {\n if (this.props.keyMode === 'numbers') {\n return `${index + 1}`;\n }\n\n if (this.props.keyMode === 'letters') {\n return String.fromCharCode(97 + index).toUpperCase();\n }\n\n return '';\n }\n\n getCorrectness = (choice = {}) => {\n const isCorrect = choice.correct;\n const isChecked = this.isSelected(choice.value);\n\n if (this.state.showCorrect) {\n return isCorrect ? 'correct' : undefined;\n }\n\n if (isCorrect) {\n if (isChecked) {\n // A correct answer is selected: marked with a green checkmark\n return 'correct';\n } else {\n // A correct answer is NOT selected: marked with an orange X\n return 'incorrect';\n }\n } else {\n if (isChecked) {\n // An incorrect answer is selected: marked with an orange X\n return 'incorrect';\n } else {\n // An incorrect answer is NOT selected: not marked\n return undefined;\n }\n }\n };\n\n getChecked(choice) {\n if (this.state.showCorrect) {\n return choice.correct \|\| false;\n }\n\n return this.isSelected(choice.value);\n }\n\n // renderHeading function was added for accessibility.\n renderHeading() {\n const { mode, choiceMode, classes } = this.props;\n\n if (mode !== 'gather') {\n return null;\n }\n\n return choiceMode === 'radio' ? (\n <h3 className={classes.srOnly}>Multiple Choice Question</h3>\n ) : (\n <h3 className={classes.srOnly}>Multiple Select Question</h3>\n );\n }\n\n handleGroupFocus = (e) => {\n const fieldset = e.currentTarget;\n const activeEl = document.activeElement;\n\n if (fieldset.contains(activeEl) && activeEl !== fieldset) {\n return;\n }\n\n // Only focus the first input if user is tabbing forward\n if (!e.relatedTarget \|\| fieldset.compareDocumentPosition(e.relatedTarget) & Node.DOCUMENT_POSITION_PRECEDING) {\n if (this.firstInputRef?.current) {\n this.firstInputRef.current.focus();\n }\n }\n };\n\n render() {\n const {\n mode,\n disabled,\n className,\n choices = [],\n choiceMode,\n gridColumns,\n partLabel,\n prompt,\n responseCorrect,\n teacherInstructions,\n classes,\n alwaysShowCorrect,\n animationsDisabled,\n language,\n isSelectionButtonBelow,\n minSelections,\n maxSelections,\n autoplayAudioEnabled,\n session,\n customAudioButton,\n } = this.props;\n const { showCorrect, maxSelectionsErrorState } = this.state;\n const isEvaluateMode = mode === 'evaluate';\n const showCorrectAnswerToggle = isEvaluateMode && !responseCorrect;\n const columnsStyle = gridColumns > 1 ? { gridTemplateColumns: `repeat(${gridColumns}, 1fr)` } : undefined;\n const selections = (session.value && session.value.length) \|\| 0;\n\n const teacherInstructionsDiv = (\n <PreviewPrompt\n tagName=\"div\"\n className=\"prompt\"\n defaultClassName=\"teacher-instructions\"\n prompt={teacherInstructions}\n />\n );\n\n const getMultipleChoiceMinSelectionErrorMessage = () => {\n if (minSelections && maxSelections) {\n return minSelections === maxSelections\n ? translator.t('translation:multipleChoice:minmaxSelections_equal', { lng: language, minSelections })\n : translator.t('translation:multipleChoice:minmaxSelections_range', {\n lng: language,\n minSelections,\n maxSelections,\n });\n }\n\n if (minSelections) {\n return translator.t('translation:multipleChoice:minSelections', { lng: language, minSelections });\n }\n\n return '';\n };\n\n return (\n <div id={'main-container'} className={classNames(classes.main, className, 'multiple-choice')}>\n {partLabel && <h2 className={classes.partLabel}>{partLabel}</h2>}\n\n {this.renderHeading()}\n\n {teacherInstructions && (\n <div className={classes.teacherInstructions}>\n {!animationsDisabled ? (\n <Collapsible\n labels={{\n hidden: 'Show Teacher Instructions',\n visible: 'Hide Teacher Instructions',\n }}\n >\n {teacherInstructionsDiv}\n </Collapsible>\n ) : (\n teacherInstructionsDiv\n )}\n </div>\n )}\n\n <fieldset\n tabIndex={0}\n className={classes.fieldset}\n onFocus={this.handleGroupFocus}\n role={choiceMode === 'radio' ? 'radiogroup' : 'group'}\n >\n <PreviewPrompt\n className=\"prompt\"\n defaultClassName=\"prompt\"\n prompt={prompt}\n tagName={'legend'}\n autoplayAudioEnabled={autoplayAudioEnabled}\n customAudioButton={customAudioButton}\n />\n\n {!alwaysShowCorrect && (\n <CorrectAnswerToggle\n show={showCorrectAnswerToggle}\n toggled={showCorrect}\n onToggle={this.onToggle.bind(this)}\n language={language}\n />\n )}\n\n <div\n className={classNames({\n [classes.gridLayout]: this.props.choicesLayout === 'grid',\n [classes.horizontalLayout]: this.props.choicesLayout === 'horizontal',\n })}\n style={columnsStyle}\n >\n {choices.map((choice, index) => (\n <StyledChoice\n autoFocusRef={index === 0 ? this.firstInputRef : null}\n choicesLayout={this.props.choicesLayout}\n selectedAnswerBackgroundColor={this.props.selectedAnswerBackgroundColor}\n gridColumns={gridColumns}\n key={`choice-${index}`}\n choice={choice}\n index={index}\n choicesLength={choices.length}\n showCorrect={showCorrect}\n isEvaluateMode={isEvaluateMode}\n choiceMode={choiceMode}\n disabled={disabled}\n tagName={partLabel ? `group-${partLabel}` : 'group'}\n onChoiceChanged={this.handleChange}\n hideTick={choice.hideTick}\n checked={this.getChecked(choice)}\n correctness={isEvaluateMode ? this.getCorrectness(choice) : undefined}\n displayKey={this.indexToSymbol(index)}\n isSelectionButtonBelow={isSelectionButtonBelow}\n />\n ))}\n </div>\n </fieldset>\n\n {choiceMode === 'checkbox' && selections < minSelections && (\n <div className={classes.errorText}>{getMultipleChoiceMinSelectionErrorMessage()}</div>\n )}\n {choiceMode === 'checkbox' && maxSelectionsErrorState && (\n <div className={classes.errorText}>\n {translator.t(`translation:multipleChoice:maxSelections_${maxSelections === 1 ? 'one' : 'other'}`, {\n lng: language,\n maxSelections,\n })}\n </div>\n )}\n </div>\n );\n }\n}\n\nMultipleChoice.defaultProps = {\n session: {\n value: [],\n },\n};\n\nexport default withStyles(styles)(MultipleChoice);\n"],"file":"multiple-choice.js"}
1	+ {"version":3,"sources":["../src/multiple-choice.jsx"],"names":["translator","Translator","styles","theme","main","color","text","backgroundColor","background","position","border","partLabel","display","fontSize","margin","fontWeight","paddingBottom","spacing","unit","teacherInstructions","marginBottom","horizontalLayout","flexDirection","flexWrap","gridLayout","fieldset","padding","minWidth","outline","srOnly","left","top","width","height","overflow","errorText","typography","palette","error","paddingTop","MultipleChoice","props","event","target","value","checked","maxSelections","onChoiceChanged","session","length","setState","maxSelectionsErrorState","selected","selector","mode","showCorrect","state","onShowCorrectToggle","choice","isCorrect","correct","isChecked","isSelected","undefined","e","currentTarget","activeEl","document","activeElement","contains","relatedTarget","compareDocumentPosition","Node","DOCUMENT_POSITION_PRECEDING","firstInputRef","current","focus","alwaysShowCorrect","onToggle","bind","React","createRef","sessionValue","indexOf","nextProps","correctResponse","index","keyMode","String","fromCharCode","toUpperCase","isEvaluateMode","isPrintMode","choiceMode","classes","disabled","className","choices","gridColumns","prompt","responseCorrect","animationsDisabled","language","isSelectionButtonBelow","minSelections","autoplayAudioEnabled","customAudioButton","showCorrectAnswerToggle","columnsStyle","gridTemplateColumns","selections","teacherInstructionsDiv","getMultipleChoiceMinSelectionErrorMessage","t","lng","renderHeading","hidden","visible","handleGroupFocus","choicesLayout","map","selectedAnswerBackgroundColor","handleChange","hideTick","getChecked","getCorrectness","indexToSymbol","Component","PropTypes","string","oneOf","array","object","bool","func","isRequired","number","playImage","pauseImage","defaultProps"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { CorrectAnswerToggle } from '@pie-lib/pie-toolbox/correct-answer-toggle';\nimport classNames from 'classnames';\nimport { withStyles } from '@material-ui/core/styles';\nimport { color, Collapsible, PreviewPrompt } from '@pie-lib/pie-toolbox/render-ui';\nimport Translator from '@pie-lib/pie-toolbox/translator';\n\nimport StyledChoice from './choice';\n\n// MultipleChoice\n\nconst { translator } = Translator;\n\nconst styles = (theme) => ({\n main: {\n color: color.text(),\n backgroundColor: color.background(),\n '& ': {\n '-webkit-font-smoothing': 'antialiased',\n },\n position: 'relative',\n // remove border from legend tags inside main to override the OT default styles\n '& legend': {\n border: 'none !important',\n },\n },\n partLabel: {\n display: 'block',\n fontSize: 'inherit',\n margin: '0',\n fontWeight: 'normal',\n paddingBottom: theme.spacing.unit 2,\n },\n teacherInstructions: {\n marginBottom: theme.spacing.unit * 2,\n },\n horizontalLayout: {\n display: 'flex',\n flexDirection: 'row',\n flexWrap: 'wrap',\n },\n gridLayout: {\n display: 'grid',\n },\n fieldset: {\n border: '0px',\n padding: '0.01em 0 0 0',\n margin: '0px',\n minWidth: '0px',\n '&:focus': {\n outline: 'none',\n },\n },\n srOnly: {\n position: 'absolute',\n left: '-10000px',\n top: 'auto',\n width: '1px',\n height: '1px',\n overflow: 'hidden',\n },\n errorText: {\n fontSize: theme.typography.fontSize - 2,\n color: theme.palette.error.main,\n paddingTop: theme.spacing.unit,\n },\n});\n\nexport class MultipleChoice extends React.Component {\n static propTypes = {\n className: PropTypes.string,\n mode: PropTypes.oneOf(['gather', 'view', 'evaluate']),\n choiceMode: PropTypes.oneOf(['radio', 'checkbox']),\n keyMode: PropTypes.oneOf(['numbers', 'letters', 'none']),\n choices: PropTypes.array,\n partLabel: PropTypes.string,\n prompt: PropTypes.string,\n teacherInstructions: PropTypes.string,\n session: PropTypes.object,\n disabled: PropTypes.bool,\n onChoiceChanged: PropTypes.func,\n responseCorrect: PropTypes.bool,\n classes: PropTypes.object.isRequired,\n correctResponse: PropTypes.array,\n choicesLayout: PropTypes.oneOf(['vertical', 'grid', 'horizontal']),\n gridColumns: PropTypes.string,\n alwaysShowCorrect: PropTypes.bool,\n animationsDisabled: PropTypes.bool,\n language: PropTypes.string,\n selectedAnswerBackgroundColor: PropTypes.string,\n onShowCorrectToggle: PropTypes.func,\n isSelectionButtonBelow: PropTypes.bool,\n minSelections: PropTypes.number,\n maxSelections: PropTypes.number,\n autoplayAudioEnabled: PropTypes.bool,\n customAudioButton: {\n playImage: PropTypes.string,\n pauseImage: PropTypes.string,\n },\n };\n\n constructor(props) {\n super(props);\n\n this.state = {\n showCorrect: this.props.alwaysShowCorrect \|\| false,\n maxSelectionsErrorState: false,\n };\n\n this.onToggle = this.onToggle.bind(this);\n this.firstInputRef = React.createRef();\n }\n\n isSelected(value) {\n const sessionValue = this.props.session && this.props.session.value;\n\n return sessionValue && sessionValue.indexOf && sessionValue.indexOf(value) >= 0;\n }\n\n // handleChange was added for accessibility. Please see comments and videos from PD-2441.\n handleChange = (event) => {\n const { value, checked } = event.target;\n const { maxSelections, onChoiceChanged, session } = this.props;\n\n if (session.value && session.value.length >= maxSelections) {\n // show/hide max selections error when user select/deselect an answer\n this.setState({ maxSelectionsErrorState: checked });\n\n if (checked) {\n // prevent selecting more answers\n return;\n }\n }\n\n onChoiceChanged({ value, selected: checked, selector: 'Mouse' });\n };\n\n onToggle = () => {\n if (this.props.mode === 'evaluate') {\n this.setState({ showCorrect: !this.state.showCorrect }, () => {\n if (this.props.onShowCorrectToggle) {\n this.props.onShowCorrectToggle();\n }\n });\n }\n };\n\n UNSAFE_componentWillReceiveProps(nextProps) {\n if (!nextProps.correctResponse && this.state.showCorrect !== false) {\n this.setState({ showCorrect: false }, () => {\n if (this.props.onShowCorrectToggle) {\n this.props.onShowCorrectToggle();\n }\n });\n }\n\n if (nextProps.alwaysShowCorrect && this.state.showCorrect !== true) {\n this.setState({ showCorrect: true }, () => {\n if (this.props.onShowCorrectToggle) {\n this.props.onShowCorrectToggle();\n }\n });\n }\n }\n\n indexToSymbol(index) {\n if (this.props.keyMode === 'numbers') {\n return `${index + 1}`;\n }\n\n if (this.props.keyMode === 'letters') {\n return String.fromCharCode(97 + index).toUpperCase();\n }\n\n return '';\n }\n\n getCorrectness = (choice = {}) => {\n const isCorrect = choice.correct;\n const isChecked = this.isSelected(choice.value);\n\n if (this.state.showCorrect) {\n return isCorrect ? 'correct' : undefined;\n }\n\n if (isCorrect) {\n if (isChecked) {\n // A correct answer is selected: marked with a green checkmark\n return 'correct';\n } else {\n // A correct answer is NOT selected: marked with an orange X\n return 'incorrect';\n }\n } else {\n if (isChecked) {\n // An incorrect answer is selected: marked with an orange X\n return 'incorrect';\n } else {\n // An incorrect answer is NOT selected: not marked\n return undefined;\n }\n }\n };\n\n getChecked(choice) {\n // to determine if we are in evaluate mode or print mode\n // since both modes have showCorrect but it interferes with \"browse mode\" in IBX if the print props are set\n const isEvaluateMode = this.state.showCorrect && this.props.mode === 'evaluate';\n const isPrintMode = this.props.alwaysShowCorrect && (!this.props.session \|\| !this.props.session.value \|\| this.props.session.value.length === 0);\n\n if (isEvaluateMode \|\| isPrintMode) {\n return choice.correct \|\| false;\n }\n\n return this.isSelected(choice.value);\n }\n\n // renderHeading function was added for accessibility.\n renderHeading() {\n const { mode, choiceMode, classes } = this.props;\n\n if (mode !== 'gather') {\n return null;\n }\n\n return choiceMode === 'radio' ? (\n <h3 className={classes.srOnly}>Multiple Choice Question</h3>\n ) : (\n <h3 className={classes.srOnly}>Multiple Select Question</h3>\n );\n }\n\n handleGroupFocus = (e) => {\n const fieldset = e.currentTarget;\n const activeEl = document.activeElement;\n\n if (fieldset.contains(activeEl) && activeEl !== fieldset) {\n return;\n }\n\n // Only focus the first input if user is tabbing forward\n if (!e.relatedTarget \|\| fieldset.compareDocumentPosition(e.relatedTarget) & Node.DOCUMENT_POSITION_PRECEDING) {\n if (this.firstInputRef?.current) {\n this.firstInputRef.current.focus();\n }\n }\n };\n\n render() {\n const {\n mode,\n disabled,\n className,\n choices = [],\n choiceMode,\n gridColumns,\n partLabel,\n prompt,\n responseCorrect,\n teacherInstructions,\n classes,\n alwaysShowCorrect,\n animationsDisabled,\n language,\n isSelectionButtonBelow,\n minSelections,\n maxSelections,\n autoplayAudioEnabled,\n session,\n customAudioButton,\n } = this.props;\n const { showCorrect, maxSelectionsErrorState } = this.state;\n const isEvaluateMode = mode === 'evaluate';\n const showCorrectAnswerToggle = isEvaluateMode && !responseCorrect;\n const columnsStyle = gridColumns > 1 ? { gridTemplateColumns: `repeat(${gridColumns}, 1fr)` } : undefined;\n const selections = (session.value && session.value.length) \|\| 0;\n\n const teacherInstructionsDiv = (\n <PreviewPrompt\n tagName=\"div\"\n className=\"prompt\"\n defaultClassName=\"teacher-instructions\"\n prompt={teacherInstructions}\n />\n );\n\n const getMultipleChoiceMinSelectionErrorMessage = () => {\n if (minSelections && maxSelections) {\n return minSelections === maxSelections\n ? translator.t('translation:multipleChoice:minmaxSelections_equal', { lng: language, minSelections })\n : translator.t('translation:multipleChoice:minmaxSelections_range', {\n lng: language,\n minSelections,\n maxSelections,\n });\n }\n\n if (minSelections) {\n return translator.t('translation:multipleChoice:minSelections', { lng: language, minSelections });\n }\n\n return '';\n };\n\n return (\n <div id={'main-container'} className={classNames(classes.main, className, 'multiple-choice')}>\n {partLabel && <h2 className={classes.partLabel}>{partLabel}</h2>}\n\n {this.renderHeading()}\n\n {teacherInstructions && (\n <div className={classes.teacherInstructions}>\n {!animationsDisabled ? (\n <Collapsible\n labels={{\n hidden: 'Show Teacher Instructions',\n visible: 'Hide Teacher Instructions',\n }}\n >\n {teacherInstructionsDiv}\n </Collapsible>\n ) : (\n teacherInstructionsDiv\n )}\n </div>\n )}\n\n <fieldset\n tabIndex={0}\n className={classes.fieldset}\n onFocus={this.handleGroupFocus}\n role={choiceMode === 'radio' ? 'radiogroup' : 'group'}\n >\n <PreviewPrompt\n className=\"prompt\"\n defaultClassName=\"prompt\"\n prompt={prompt}\n tagName={'legend'}\n autoplayAudioEnabled={autoplayAudioEnabled}\n customAudioButton={customAudioButton}\n />\n\n {!alwaysShowCorrect && (\n <CorrectAnswerToggle\n show={showCorrectAnswerToggle}\n toggled={showCorrect}\n onToggle={this.onToggle.bind(this)}\n language={language}\n />\n )}\n\n <div\n className={classNames({\n [classes.gridLayout]: this.props.choicesLayout === 'grid',\n [classes.horizontalLayout]: this.props.choicesLayout === 'horizontal',\n })}\n style={columnsStyle}\n >\n {choices.map((choice, index) => (\n <StyledChoice\n autoFocusRef={index === 0 ? this.firstInputRef : null}\n choicesLayout={this.props.choicesLayout}\n selectedAnswerBackgroundColor={this.props.selectedAnswerBackgroundColor}\n gridColumns={gridColumns}\n key={`choice-${index}`}\n choice={choice}\n index={index}\n choicesLength={choices.length}\n showCorrect={showCorrect}\n isEvaluateMode={isEvaluateMode}\n choiceMode={choiceMode}\n disabled={disabled}\n tagName={partLabel ? `group-${partLabel}` : 'group'}\n onChoiceChanged={this.handleChange}\n hideTick={choice.hideTick}\n checked={this.getChecked(choice)}\n correctness={isEvaluateMode ? this.getCorrectness(choice) : undefined}\n displayKey={this.indexToSymbol(index)}\n isSelectionButtonBelow={isSelectionButtonBelow}\n />\n ))}\n </div>\n </fieldset>\n\n {choiceMode === 'checkbox' && selections < minSelections && (\n <div className={classes.errorText}>{getMultipleChoiceMinSelectionErrorMessage()}</div>\n )}\n {choiceMode === 'checkbox' && maxSelectionsErrorState && (\n <div className={classes.errorText}>\n {translator.t(`translation:multipleChoice:maxSelections_${maxSelections === 1 ? 'one' : 'other'}`, {\n lng: language,\n maxSelections,\n })}\n </div>\n )}\n </div>\n );\n }\n}\n\nMultipleChoice.defaultProps = {\n session: {\n value: [],\n },\n};\n\nexport default withStyles(styles)(MultipleChoice);\n"],"file":"multiple-choice.js"}

package/module/element.js CHANGED Viewed

@@ -12859,7 +12859,9 @@ class MultipleChoice$1 extends React$2.Component {
     };
   }
   getChecked(choice) {
-    if (this.state.showCorrect) {
+    const isEvaluateMode = this.state.showCorrect && this.props.mode === 'evaluate';
+    const isPrintMode = this.props.alwaysShowCorrect && (!this.props.session || !this.props.session.value || this.props.session.value.length === 0);
+    if (isEvaluateMode || isPrintMode) {
       return choice.correct || false;
     }
     return this.isSelected(choice.value);
@@ -12874,14 +12876,14 @@ class MultipleChoice$1 extends React$2.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 223
+        lineNumber: 228
       }
     }, "Multiple Choice Question") : React$2.createElement('h3', {
       className: classes.srOnly,
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 225
+        lineNumber: 230
       }
     }, "Multiple Select Question");
   }
@@ -12916,7 +12918,7 @@ class MultipleChoice$1 extends React$2.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 275
+        lineNumber: 280
       }
     });
     const getMultipleChoiceMinSelectionErrorMessage = () => {
@@ -12944,21 +12946,21 @@ class MultipleChoice$1 extends React$2.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 302
+        lineNumber: 307
       }
     }, partLabel && React$2.createElement('h2', {
       className: classes.partLabel,
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 303
+        lineNumber: 308
       }
     }, partLabel), this.renderHeading(), teacherInstructions && React$2.createElement('div', {
       className: classes.teacherInstructions,
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 308
+        lineNumber: 313
       }
     }, !animationsDisabled ? React$2.createElement(Collapsible, {
       labels: {
@@ -12968,7 +12970,7 @@ class MultipleChoice$1 extends React$2.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 310
+        lineNumber: 315
       }
     }, teacherInstructionsDiv) : teacherInstructionsDiv), React$2.createElement('fieldset', {
       tabIndex: 0,
@@ -12978,7 +12980,7 @@ class MultipleChoice$1 extends React$2.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 324
+        lineNumber: 329
       }
     }, React$2.createElement(PreviewPrompt, {
       className: "prompt",
@@ -12990,7 +12992,7 @@ class MultipleChoice$1 extends React$2.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 330
+        lineNumber: 335
       }
     }), !alwaysShowCorrect && React$2.createElement(CorrectAnswerToggle, {
       show: showCorrectAnswerToggle,
@@ -13000,7 +13002,7 @@ class MultipleChoice$1 extends React$2.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 340
+        lineNumber: 345
       }
     }), React$2.createElement('div', {
       className: classNames({
@@ -13011,7 +13013,7 @@ class MultipleChoice$1 extends React$2.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 348
+        lineNumber: 353
       }
     }, choices.map((choice, index) => React$2.createElement(StyledChoice, {
       autoFocusRef: index === 0 ? this.firstInputRef : null,
@@ -13036,21 +13038,21 @@ class MultipleChoice$1 extends React$2.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 356
+        lineNumber: 361
       }
     })))), choiceMode === 'checkbox' && selections < minSelections && React$2.createElement('div', {
       className: classes.errorText,
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 382
+        lineNumber: 387
       }
     }, getMultipleChoiceMinSelectionErrorMessage()), choiceMode === 'checkbox' && maxSelectionsErrorState && React$2.createElement('div', {
       className: classes.errorText,
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 385
+        lineNumber: 390
       }
     }, translator.t(`translation:multipleChoice:maxSelections_${maxSelections === 1 ? 'one' : 'other'}`, {
       lng: language,

package/module/index.html CHANGED Viewed

@@ -2,7 +2,7 @@
   <!doctype html>
   <html>
     <head>
-      <title>@pie-element/multiple-choice@9.19.2</title>
+      <title>@pie-element/multiple-choice@9.19.3</title>
       <script
         type="module"
         src="https://cdn.jsdelivr.net/npm/@pslb/demo-el@^1.0.0/dist/demo-el/demo-el.esm.js"></script>

package/module/manifest.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@pie-element/multiple-choice",
-  "version": "9.19.2",
+  "version": "9.19.3",
   "modules": [
     {
       "name": "@pie-lib/pie-toolbox-math-rendering-module",

package/module/print.html CHANGED Viewed

@@ -2,7 +2,7 @@
   <!doctype html>
   <html>
     <head>
-      <title>@pie-element/multiple-choice@9.19.2</title>
+      <title>@pie-element/multiple-choice@9.19.3</title>
       <link
         href="https://fonts.googleapis.com/css?family=Roboto&display=swap"
         rel="stylesheet"

package/module/print.js CHANGED Viewed

@@ -12859,7 +12859,9 @@ class MultipleChoice extends React$2.Component {
     };
   }
   getChecked(choice) {
-    if (this.state.showCorrect) {
+    const isEvaluateMode = this.state.showCorrect && this.props.mode === 'evaluate';
+    const isPrintMode = this.props.alwaysShowCorrect && (!this.props.session || !this.props.session.value || this.props.session.value.length === 0);
+    if (isEvaluateMode || isPrintMode) {
       return choice.correct || false;
     }
     return this.isSelected(choice.value);
@@ -12874,14 +12876,14 @@ class MultipleChoice extends React$2.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 223
+        lineNumber: 228
       }
     }, "Multiple Choice Question") : React$2.createElement('h3', {
       className: classes.srOnly,
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 225
+        lineNumber: 230
       }
     }, "Multiple Select Question");
   }
@@ -12916,7 +12918,7 @@ class MultipleChoice extends React$2.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 275
+        lineNumber: 280
       }
     });
     const getMultipleChoiceMinSelectionErrorMessage = () => {
@@ -12944,21 +12946,21 @@ class MultipleChoice extends React$2.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 302
+        lineNumber: 307
       }
     }, partLabel && React$2.createElement('h2', {
       className: classes.partLabel,
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 303
+        lineNumber: 308
       }
     }, partLabel), this.renderHeading(), teacherInstructions && React$2.createElement('div', {
       className: classes.teacherInstructions,
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 308
+        lineNumber: 313
       }
     }, !animationsDisabled ? React$2.createElement(Collapsible, {
       labels: {
@@ -12968,7 +12970,7 @@ class MultipleChoice extends React$2.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 310
+        lineNumber: 315
       }
     }, teacherInstructionsDiv) : teacherInstructionsDiv), React$2.createElement('fieldset', {
       tabIndex: 0,
@@ -12978,7 +12980,7 @@ class MultipleChoice extends React$2.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 324
+        lineNumber: 329
       }
     }, React$2.createElement(PreviewPrompt, {
       className: "prompt",
@@ -12990,7 +12992,7 @@ class MultipleChoice extends React$2.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 330
+        lineNumber: 335
       }
     }), !alwaysShowCorrect && React$2.createElement(CorrectAnswerToggle, {
       show: showCorrectAnswerToggle,
@@ -13000,7 +13002,7 @@ class MultipleChoice extends React$2.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 340
+        lineNumber: 345
       }
     }), React$2.createElement('div', {
       className: classNames({
@@ -13011,7 +13013,7 @@ class MultipleChoice extends React$2.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 348
+        lineNumber: 353
       }
     }, choices.map((choice, index) => React$2.createElement(StyledChoice, {
       autoFocusRef: index === 0 ? this.firstInputRef : null,
@@ -13036,21 +13038,21 @@ class MultipleChoice extends React$2.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 356
+        lineNumber: 361
       }
     })))), choiceMode === 'checkbox' && selections < minSelections && React$2.createElement('div', {
       className: classes.errorText,
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 382
+        lineNumber: 387
       }
     }, getMultipleChoiceMinSelectionErrorMessage()), choiceMode === 'checkbox' && maxSelectionsErrorState && React$2.createElement('div', {
       className: classes.errorText,
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 385
+        lineNumber: 390
       }
     }, translator.t(`translation:multipleChoice:maxSelections_${maxSelections === 1 ? 'one' : 'other'}`, {
       lng: language,

package/package.json CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "name": "@pie-element/multiple-choice",
   "repository": "pie-framework/pie-elements",
-  "version": "9.19.3",
+  "version": "9.19.4",
   "publishConfig": {
     "access": "public"
   },
@@ -19,7 +19,7 @@
     "react-test-renderer": "^16.3.2",
     "react-transition-group": "^2.3.1"
   },
-  "gitHead": "c467a0677fd15eec0c1b522a2525e3910d5a79dd",
+  "gitHead": "2fbd9065ebb09e10f21d43369168aa65124d335a",
   "scripts": {
     "postpublish": "../../scripts/postpublish"
   },