@pie-element/multiple-choice 9.4.1-next.6 → 9.5.0

package/lib/multiple-choice.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/multiple-choice.jsx"],"names":["styles","theme","main","color","text","backgroundColor","background","partLabel","display","fontSize","margin","fontWeight","paddingBottom","spacing","unit","teacherInstructions","marginBottom","horizontalLayout","flexDirection","flexWrap","gridLayout","fieldset","border","padding","minWidth","srOnly","position","left","top","width","height","overflow","MultipleChoice","props","event","target","setState","selectedValue","value","checked","prevState","selectedValues","push","filter","currentValue","mode","showCorrect","state","onShowCorrectToggle","choice","isCorrect","correct","isChecked","isSelected","undefined","alwaysShowCorrect","onToggle","bind","sessionValue","session","indexOf","nextProps","correctResponse","index","keyMode","String","fromCharCode","toUpperCase","choiceMode","includes","classes","disabled","className","choices","gridColumns","prompt","onChoiceChanged","responseCorrect","animationsDisabled","language","isEvaluateMode","showCorrectAnswerToggle","columnsStyle","gridTemplateColumns","teacherInstructionsDiv","renderHeading","hidden","visible","choicesLayout","map","length","handleChange","handleChangeCheckboxes","hideTick","getChecked","getCorrectness","indexToSymbol","React","Component","PropTypes","string","oneOf","array","object","bool","func","isRequired","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 StyledChoice from './choice';\n\n// MultipleChoice\n\nconst styles = (theme) => ({\n    main: {\n        color: color.text(),\n        backgroundColor: color.background(),\n        '& *': {\n            '-webkit-font-smoothing': 'antialiased',\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    },\n    srOnly: {\n        position: 'absolute',\n        left: '-10000px',\n        top: 'auto',\n        width: '1px',\n        height: '1px',\n        overflow: 'hidden',\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        onShowCorrectToggle: PropTypes.func,\n    };\n\n    constructor(props) {\n        super(props);\n\n        this.state = {\n            selectedValue: null,\n            selectedValues: [],\n            showCorrect: this.props.alwaysShowCorrect || false,\n        };\n\n        this.onToggle = this.onToggle.bind(this);\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 and handleChangeCheckboxes functions were added for accessibility. Please see comments and videos from PD-2441. They should only be removed if a better solution is found.\n    handleChange = (event) => {\n        const target = event.target;\n\n        this.setState({selectedValue: target.value});\n    };\n\n    handleChangeCheckboxes = (event) => {\n        const {value, checked} = event.target;\n\n        this.setState((prevState) => {\n            let selectedValues = [...prevState.selectedValues];\n\n            if (checked) {\n                selectedValues.push(value);\n            } else {\n                selectedValues = selectedValues.filter((currentValue) => currentValue !== value);\n            }\n\n            return {selectedValues};\n        });\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        if (this.isSelected(choice.value)) {\n            return true;\n        }\n\n        return this.props.choiceMode === 'radio'\n            ? this.state.selectedValue === choice.value\n            : this.state.selectedValues.includes(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            <h2 className={classes.srOnly}>Multiple Choice Question</h2>\n        ) : (\n            <h2 className={classes.srOnly}>Multiple Select Question</h2>\n        );\n    }\n\n    render() {\n        const {\n            mode,\n            disabled,\n            className,\n            choices = [],\n            choiceMode,\n            gridColumns,\n            partLabel,\n            prompt,\n            onChoiceChanged,\n            responseCorrect,\n            teacherInstructions,\n            classes,\n            alwaysShowCorrect,\n            animationsDisabled,\n            language\n        } = this.props;\n        const {showCorrect} = this.state;\n        const isEvaluateMode = mode === 'evaluate';\n        const showCorrectAnswerToggle = isEvaluateMode && !responseCorrect;\n        const columnsStyle = gridColumns > 1 ? {gridTemplateColumns: `repeat(${gridColumns}, 1fr)`} : undefined;\n\n        const teacherInstructionsDiv = (\n            <PreviewPrompt\n                tagName=\"div\"\n                className=\"prompt\"\n                defaultClassName=\"teacher-instructions\"\n                prompt={teacherInstructions}\n            />\n        );\n\n        return (\n            <div className={classNames(classes.main, className, 'multiple-choice')}>\n                {partLabel && <h3 className={classes.partLabel}>{partLabel}</h3>}\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 className={classes.fieldset}>\n                    <PreviewPrompt className=\"prompt\" defaultClassName=\"prompt\" prompt={prompt} tagName={'legend'}/>\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                                choicesLayout={this.props.choicesLayout}\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                                updateSession={onChoiceChanged}\n                                onChoiceChanged={this.props.choiceMode === 'radio' ? this.handleChange : this.handleChangeCheckboxes}\n                                hideTick={choice.hideTick}\n                                checked={this.getChecked(choice)}\n                                correctness={isEvaluateMode ? this.getCorrectness(choice) : undefined}\n                                displayKey={this.indexToSymbol(index)}\n                            />\n                        ))}\n                    </div>\n                </fieldset>\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"}
+{"version":3,"sources":["../src/multiple-choice.jsx"],"names":["styles","theme","main","color","text","backgroundColor","background","partLabel","display","fontSize","margin","fontWeight","paddingBottom","spacing","unit","teacherInstructions","marginBottom","horizontalLayout","flexDirection","flexWrap","gridLayout","fieldset","border","padding","minWidth","srOnly","position","left","top","width","height","overflow","MultipleChoice","props","event","target","setState","selectedValue","value","checked","prevState","selectedValues","push","filter","currentValue","mode","showCorrect","state","onShowCorrectToggle","choice","isCorrect","correct","isChecked","isSelected","undefined","alwaysShowCorrect","onToggle","bind","sessionValue","session","indexOf","nextProps","correctResponse","index","keyMode","String","fromCharCode","toUpperCase","choiceMode","includes","classes","disabled","className","choices","gridColumns","prompt","onChoiceChanged","responseCorrect","animationsDisabled","language","isSelectionButtonBelow","isEvaluateMode","showCorrectAnswerToggle","columnsStyle","gridTemplateColumns","teacherInstructionsDiv","renderHeading","hidden","visible","choicesLayout","map","length","handleChange","handleChangeCheckboxes","hideTick","getChecked","getCorrectness","indexToSymbol","React","Component","PropTypes","string","oneOf","array","object","bool","func","isRequired","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';\n\nimport StyledChoice from './choice';\n\n// MultipleChoice\n\nconst styles = (theme) => ({\n    main: {\n        color: color.text(),\n        backgroundColor: color.background(),\n        '& *': {\n            '-webkit-font-smoothing': 'antialiased',\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    },\n    srOnly: {\n        position: 'absolute',\n        left: '-10000px',\n        top: 'auto',\n        width: '1px',\n        height: '1px',\n        overflow: 'hidden',\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        onShowCorrectToggle: PropTypes.func,\n        isSelectionButtonBelow: PropTypes.bool,\n    };\n\n    constructor(props) {\n        super(props);\n\n        this.state = {\n            selectedValue: null,\n            selectedValues: [],\n            showCorrect: this.props.alwaysShowCorrect || false,\n        };\n\n        this.onToggle = this.onToggle.bind(this);\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 and handleChangeCheckboxes functions were added for accessibility. Please see comments and videos from PD-2441. They should only be removed if a better solution is found.\n    handleChange = (event) => {\n        const target = event.target;\n\n        this.setState({selectedValue: target.value});\n    };\n\n    handleChangeCheckboxes = (event) => {\n        const {value, checked} = event.target;\n\n        this.setState((prevState) => {\n            let selectedValues = [...prevState.selectedValues];\n\n            if (checked) {\n                selectedValues.push(value);\n            } else {\n                selectedValues = selectedValues.filter((currentValue) => currentValue !== value);\n            }\n\n            return {selectedValues};\n        });\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        if (this.isSelected(choice.value)) {\n            return true;\n        }\n\n        return this.props.choiceMode === 'radio'\n            ? this.state.selectedValue === choice.value\n            : this.state.selectedValues.includes(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            <h2 className={classes.srOnly}>Multiple Choice Question</h2>\n        ) : (\n            <h2 className={classes.srOnly}>Multiple Select Question</h2>\n        );\n    }\n\n    render() {\n        const {\n            mode,\n            disabled,\n            className,\n            choices = [],\n            choiceMode,\n            gridColumns,\n            partLabel,\n            prompt,\n            onChoiceChanged,\n            responseCorrect,\n            teacherInstructions,\n            classes,\n            alwaysShowCorrect,\n            animationsDisabled,\n            language,\n            isSelectionButtonBelow\n        } = this.props;\n        const {showCorrect} = this.state;\n        const isEvaluateMode = mode === 'evaluate';\n        const showCorrectAnswerToggle = isEvaluateMode && !responseCorrect;\n        const columnsStyle = gridColumns > 1 ? {gridTemplateColumns: `repeat(${gridColumns}, 1fr)`} : undefined;\n\n        const teacherInstructionsDiv = (\n            <PreviewPrompt\n                tagName=\"div\"\n                className=\"prompt\"\n                defaultClassName=\"teacher-instructions\"\n                prompt={teacherInstructions}\n            />\n        );\n\n        return (\n            <div className={classNames(classes.main, className, 'multiple-choice')}>\n                {partLabel && <h3 className={classes.partLabel}>{partLabel}</h3>}\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 className={classes.fieldset}>\n                    <PreviewPrompt className=\"prompt\" defaultClassName=\"prompt\" prompt={prompt} tagName={'legend'}/>\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                                choicesLayout={this.props.choicesLayout}\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                                updateSession={onChoiceChanged}\n                                onChoiceChanged={this.props.choiceMode === 'radio' ? this.handleChange : this.handleChangeCheckboxes}\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            </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/controller.js

@@ -20710,6 +20710,7 @@ async function model(question, session, env, updateSession) {
     language: normalizedQuestion.language,
     extraCSSRules: normalizedQuestion.extraCSSRules,
     fontSizeFactor: normalizedQuestion.fontSizeFactor,
+    isSelectionButtonBelow: normalizedQuestion.isSelectionButtonBelow,
   };
 
   const { role, mode } = env || {};