npm - @pie-element/multiple-choice - Versions diffs - 9.16.5-next.3 → 9.16.5-next.6 - Mend

@pie-element/multiple-choice 9.16.5-next.3 → 9.16.5-next.6

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 (5) hide show

package/lib/choice-input.js CHANGED Viewed

@@ -219,7 +219,8 @@ var StyledRadio = (0, _styles.withStyles)(inputStyles)(function (props) {
       disabled = props.disabled,
       value = props.value,
       id = props.id,
-      tagName = props.tagName;
+      tagName = props.tagName,
+      inputRef = props.inputRef;
   var key = function key(k) {
     return correctness ? "".concat(correctness, "-").concat(k) : k;
@@ -238,6 +239,7 @@ var StyledRadio = (0, _styles.withStyles)(inputStyles)(function (props) {
   };
   return /*#__PURE__*/_react["default"].createElement(_Radio["default"], (0, _extends2["default"])({
     id: id,
+    inputRef: inputRef,
     "aria-checked": checked,
     focusVisibleClassName: checked ? classes.focusVisibleChecked : classes.focusVisibleUnchecked,
     disableRipple: true

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

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/choice-input.jsx"],"names":["CLASS_NAME","styleSheet","theme","row","display","alignItems","backgroundColor","color","background","checkboxHolder","flex","text","fontSize","horizontalLayout","padding","spacing","unit","margin","belowLayout","belowLayoutCenter","justifyContent","belowSelectionComponent","marginLeft","srOnly","position","left","top","width","height","overflow","formStyleSheet","label","letterSpacing","disabled","cursor","StyledFormControlLabel","name","props","classes","colorStyle","varName","fallback","inputStyles","correct","incorrect","root","primaryLight","checked","primary","opacity","pointerEvents","focusVisibleUnchecked","outline","focusUncheckedBorder","focusUnchecked","focusVisibleChecked","focusCheckedBorder","focusChecked","StyledCheckbox","correctness","onChange","value","id","onKeyDown","inputRef","key","k","resolved","miniProps","StyledRadio","tagName","ChoiceInput","event","choiceMode","isArrowDown","isArrowUp","preventDefault","currentEl","document","getElementById","choiceId","fieldset","closest","groupCheckboxes","Array","from","querySelectorAll","currentIndex","findIndex","el","nextIndex","nextEl","focus","onToggleChoice","bind","generateChoiceId","descId","Math","random","toFixed","displayKey","feedback","className","rationale","hideTick","isEvaluateMode","choicesLayout","isSelectionButtonBelow","Tag","classSuffix","holderClassNames","choicelabel","screenReaderLabel","tagProps","handleKeyDown","hasMathOrImage","includes","control","autoFocusRef","undefined","React","Component","PropTypes","oneOf","string","bool","isRequired","func","object"],"mappings":"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","sourcesContent":["import FormControlLabel from '@material-ui/core/FormControlLabel';\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport Checkbox from '@material-ui/core/Checkbox';\nimport { Feedback, color, PreviewPrompt } from '@pie-lib/pie-toolbox/render-ui';\nimport Radio from '@material-ui/core/Radio';\nimport classNames from 'classnames';\n\nimport FeedbackTick from './feedback-tick';\n\nconst CLASS_NAME = 'multiple-choice-component';\n\nconst styleSheet = (theme) => ({\n row: {\n display: 'flex',\n alignItems: 'center',\n backgroundColor: color.background(),\n },\n checkboxHolder: {\n display: 'flex',\n alignItems: 'center',\n backgroundColor: color.background(),\n flex: 1,\n '& label': {\n color: color.text(),\n '& > span': {\n fontSize: 'inherit',\n },\n },\n },\n horizontalLayout: {\n [`& .${CLASS_NAME}`]: {\n // visually reduce right padding, but maintain accessibility padding for checkbox indicators to be circles\n // add margin to the top, left and bottom of the checkbox to keep the same spacing as before\n padding: theme.spacing.unit,\n margin: `${theme.spacing.unit / 2}px 0 ${theme.spacing.unit / 2}px ${theme.spacing.unit / 2}px`,\n },\n },\n belowLayout: {\n '& > label': {\n alignItems: 'flex-start',\n },\n },\n belowLayoutCenter: {\n justifyContent: 'center',\n '& > label': {\n alignItems: 'center',\n },\n },\n belowSelectionComponent: {\n display: 'flex',\n alignItems: 'center',\n '& > span': {\n // visually reduce right padding, but maintain accessibility padding for checkbox indicators to be circles\n marginLeft: `-${theme.spacing.unit}px`,\n },\n },\n srOnly: {\n position: 'absolute',\n left: '-10000px',\n top: 'auto',\n width: '1px',\n height: '1px',\n overflow: 'hidden',\n },\n});\n\nconst formStyleSheet = {\n label: {\n color: `${color.text()} !important`, //'var(--choice-input-color, black)'\n backgroundColor: color.background(),\n letterSpacing: 'normal',\n },\n disabled: {\n // apply to all children\n '& ': {\n cursor: 'not-allowed !important',\n },\n },\n};\n\nexport const StyledFormControlLabel = withStyles(formStyleSheet, {\n name: 'FormControlLabel',\n})((props) => (\n <FormControlLabel {...props} classes={{ label: props.classes.label, disabled: props.classes.disabled }} />\n));\n\nconst colorStyle = (varName, fallback) => ({\n [`&.${CLASS_NAME}`]: {\n color: `var(--choice-input-${varName}, ${fallback}) !important`,\n },\n});\n\nconst inputStyles = {\n 'correct-root': colorStyle('correct-color', color.text()),\n 'correct-checked': colorStyle('correct-selected-color', color.correct()), //green[500]),\n 'correct-disabled': colorStyle('correct-disabled-color', color.disabled()), //'grey'),\n 'incorrect-root': colorStyle('incorrect-color', color.incorrect()),\n 'incorrect-checked': colorStyle('incorrect-checked', color.incorrect()), //orange[500]),\n 'incorrect-disabled': colorStyle('incorrect-disabled-color', color.disabled()),\n root: {\n ...colorStyle('color', color.text()),\n '&:hover': { color: `${color.primaryLight()} !important` },\n },\n checked: colorStyle('selected-color', color.primary()),\n disabled: {\n ...colorStyle('disabled-color', color.text()),\n opacity: 0.6,\n cursor: 'not-allowed !important',\n pointerEvents: 'initial !important',\n },\n focusVisibleUnchecked: {\n outline: `2px solid ${color.focusUncheckedBorder()}`,\n backgroundColor: color.focusUnchecked(),\n },\n focusVisibleChecked: {\n outline: `2px solid ${color.focusCheckedBorder()}`,\n backgroundColor: color.focusChecked(),\n },\n};\n\nexport const StyledCheckbox = withStyles(inputStyles)((props) => {\n const { correctness, classes, checked, onChange, disabled, value, id, onKeyDown, inputRef } = props;\n const key = (k) => (correctness ? `${correctness}-${k}` : k);\n\n const resolved = {\n root: classes[key('root')],\n checked: classes[key('checked')],\n disabled: classes[key('disabled')],\n };\n\n const miniProps = { checked, onChange, disabled, value };\n\n return (\n <Checkbox\n id={id}\n inputRef={inputRef}\n aria-checked={checked}\n onKeyDown={onKeyDown}\n focusVisibleClassName={checked ? classes.focusVisibleChecked : classes.focusVisibleUnchecked}\n disableRipple\n {...miniProps}\n className={CLASS_NAME}\n classes={{\n root: resolved.root,\n checked: resolved.checked,\n disabled: `${correctness ? '' : resolved.disabled}`,\n }}\n />\n );\n});\n\nexport const StyledRadio = withStyles(inputStyles)((props) => {\n const { correctness, classes, checked, onChange, disabled, value, id, tagName } = props;\n const key = (k) => (correctness ? `${correctness}-${k}` : k);\n\n const resolved = {\n root: classes[key('root')],\n checked: classes[key('checked')],\n disabled: classes[key('disabled')],\n };\n\n const miniProps = { checked, onChange, disabled, value };\n\n return (\n <Radio\n id={id}\n aria-checked={checked}\n focusVisibleClassName={checked ? classes.focusVisibleChecked : classes.focusVisibleUnchecked}\n disableRipple\n {...miniProps}\n className={CLASS_NAME}\n name={tagName}\n classes={{\n root: resolved.root,\n checked: resolved.checked,\n disabled: `${correctness ? '' : resolved.disabled}`,\n }}\n />\n );\n});\n\nexport class ChoiceInput extends React.Component {\n static propTypes = {\n choiceMode: PropTypes.oneOf(['radio', 'checkbox']),\n displayKey: PropTypes.string,\n checked: PropTypes.bool.isRequired,\n correctness: PropTypes.string,\n disabled: PropTypes.bool.isRequired,\n feedback: PropTypes.string,\n label: PropTypes.string.isRequired,\n rationale: PropTypes.string,\n onChange: PropTypes.func.isRequired,\n value: PropTypes.string.isRequired,\n classes: PropTypes.object,\n className: PropTypes.string,\n tagName: PropTypes.string,\n hideTick: PropTypes.bool,\n isEvaluateMode: PropTypes.bool,\n choicesLayout: PropTypes.oneOf(['vertical', 'grid', 'horizontal']),\n isSelectionButtonBelow: PropTypes.bool,\n };\n\n static defaultProps = {\n rationale: null,\n checked: false,\n isEvaluateMode: false,\n };\n\n constructor(props) {\n super(props);\n this.onToggleChoice = this.onToggleChoice.bind(this);\n this.choiceId = this.generateChoiceId();\n this.descId = `${this.choiceId}-desc`;\n }\n\n onToggleChoice(event) {\n this.props.onChange(event);\n }\n\n generateChoiceId() {\n return 'choice-' + (Math.random() 10000).toFixed();\n }\n\n handleKeyDown = (event) => {\n const { choiceMode } = this.props;\n\n if (choiceMode !== 'checkbox') return;\n\n const isArrowDown = event.key === 'ArrowDown';\n const isArrowUp = event.key === 'ArrowUp';\n\n if (!isArrowDown && !isArrowUp) return;\n\n event.preventDefault();\n\n const currentEl = document.getElementById(this.choiceId);\n if (!currentEl) return;\n\n const fieldset = currentEl.closest('fieldset');\n if (!fieldset) return;\n\n const groupCheckboxes = Array.from(fieldset.querySelectorAll('input[type=\"checkbox\"]'));\n\n const currentIndex = groupCheckboxes.findIndex((el) => el === currentEl);\n if (currentIndex === -1) return;\n\n const nextIndex = isArrowDown ? currentIndex + 1 : currentIndex - 1;\n const nextEl = groupCheckboxes[nextIndex];\n\n if (nextEl) {\n nextEl.focus();\n }\n };\n\n render() {\n const {\n choiceMode,\n disabled,\n displayKey,\n feedback,\n label,\n correctness,\n classes,\n className,\n rationale,\n hideTick,\n isEvaluateMode,\n choicesLayout,\n value,\n checked,\n tagName,\n isSelectionButtonBelow,\n } = this.props;\n\n const Tag = choiceMode === 'checkbox' ? StyledCheckbox : StyledRadio;\n const classSuffix = choiceMode === 'checkbox' ? 'checkbox' : 'radio-button';\n\n const holderClassNames = classNames(classes.checkboxHolder, {\n [classes.horizontalLayout]: choicesLayout === 'horizontal',\n [classes.belowLayout]: isSelectionButtonBelow && choicesLayout !== 'grid',\n [classes.belowLayoutCenter]: isSelectionButtonBelow && choicesLayout === 'grid',\n });\n\n const choicelabel = (\n <>\n {displayKey && !isSelectionButtonBelow ? (\n <span className={classes.row}>\n {displayKey}.{'\\u00A0'}\n <PreviewPrompt className=\"label\" prompt={label} tagName=\"span\" />\n </span>\n ) : (\n <PreviewPrompt className=\"label\" prompt={label} tagName=\"span\" />\n )}\n </>\n );\n\n const screenReaderLabel = (\n <span id={this.descId} className={classes.srOnly}>\n {choiceMode === 'checkbox' ? 'Checkbox to select the answer below' : 'Radio button to select the answer below'}\n </span>\n );\n\n const tagProps = {\n disabled,\n checked,\n correctness,\n tagName,\n value,\n id: this.choiceId,\n onChange: this.onToggleChoice,\n onKeyDown: this.handleKeyDown,\n 'aria-describedby': this.descId,\n };\n\n const hasMathOrImage =\n typeof label === 'string' &&\n (label.includes('<math') \|\|\n label.includes('\\\\(') \|\|\n label.includes('\\\\[') \|\|\n label.includes('<img') \|\|\n label.includes('data-latex') \|\|\n label.includes('data-raw') \|\|\n label.includes('<mjx-container'));\n\n const control = isSelectionButtonBelow ? (\n <span className={classes.belowSelectionComponent}>\n {hasMathOrImage && screenReaderLabel}\n <Tag {...tagProps} style={{ padding: 0 }} />\n {displayKey ? `${displayKey}.` : ''}\n </span>\n ) : (\n <>\n {hasMathOrImage && screenReaderLabel}\n <Tag {...tagProps} inputRef={this.props.autoFocusRef} />\n </>\n );\n\n return (\n <div className={classNames(className, 'corespring-' + classSuffix, 'choice-input')}>\n <div className={classes.row}>\n {!hideTick && isEvaluateMode && <FeedbackTick correctness={correctness} />}\n <div className={classNames(holderClassNames, 'checkbox-holder')}>\n <StyledFormControlLabel\n label={choicelabel}\n value={value}\n htmlFor={this.choiceId}\n labelPlacement={isSelectionButtonBelow ? 'top' : undefined}\n control={control}\n />\n </div>\n </div>\n {rationale && <PreviewPrompt className=\"rationale\" defaultClassName=\"rationale\" prompt={rationale} />}\n <Feedback feedback={feedback} correctness={correctness} />\n </div>\n );\n }\n}\n\nexport default withStyles(styleSheet)(ChoiceInput);\n"],"file":"choice-input.js"}
1	+ {"version":3,"sources":["../src/choice-input.jsx"],"names":["CLASS_NAME","styleSheet","theme","row","display","alignItems","backgroundColor","color","background","checkboxHolder","flex","text","fontSize","horizontalLayout","padding","spacing","unit","margin","belowLayout","belowLayoutCenter","justifyContent","belowSelectionComponent","marginLeft","srOnly","position","left","top","width","height","overflow","formStyleSheet","label","letterSpacing","disabled","cursor","StyledFormControlLabel","name","props","classes","colorStyle","varName","fallback","inputStyles","correct","incorrect","root","primaryLight","checked","primary","opacity","pointerEvents","focusVisibleUnchecked","outline","focusUncheckedBorder","focusUnchecked","focusVisibleChecked","focusCheckedBorder","focusChecked","StyledCheckbox","correctness","onChange","value","id","onKeyDown","inputRef","key","k","resolved","miniProps","StyledRadio","tagName","ChoiceInput","event","choiceMode","isArrowDown","isArrowUp","preventDefault","currentEl","document","getElementById","choiceId","fieldset","closest","groupCheckboxes","Array","from","querySelectorAll","currentIndex","findIndex","el","nextIndex","nextEl","focus","onToggleChoice","bind","generateChoiceId","descId","Math","random","toFixed","displayKey","feedback","className","rationale","hideTick","isEvaluateMode","choicesLayout","isSelectionButtonBelow","Tag","classSuffix","holderClassNames","choicelabel","screenReaderLabel","tagProps","handleKeyDown","hasMathOrImage","includes","control","autoFocusRef","undefined","React","Component","PropTypes","oneOf","string","bool","isRequired","func","object"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAEA;;;;;;;;;;AAEA,IAAMA,UAAU,GAAG,2BAAnB;;AAEA,IAAMC,UAAU,GAAG,SAAbA,UAAa,CAACC,KAAD;AAAA,SAAY;AAC7BC,IAAAA,GAAG,EAAE;AACHC,MAAAA,OAAO,EAAE,MADN;AAEHC,MAAAA,UAAU,EAAE,QAFT;AAGHC,MAAAA,eAAe,EAAEC,gBAAMC,UAAN;AAHd,KADwB;AAM7BC,IAAAA,cAAc,EAAE;AACdL,MAAAA,OAAO,EAAE,MADK;AAEdC,MAAAA,UAAU,EAAE,QAFE;AAGdC,MAAAA,eAAe,EAAEC,gBAAMC,UAAN,EAHH;AAIdE,MAAAA,IAAI,EAAE,CAJQ;AAKd,iBAAW;AACTH,QAAAA,KAAK,EAAEA,gBAAMI,IAAN,EADE;AAET,oBAAY;AACVC,UAAAA,QAAQ,EAAE;AADA;AAFH;AALG,KANa;AAkB7BC,IAAAA,gBAAgB,oDACPb,UADO,GACQ;AACpB;AACA;AACAc,MAAAA,OAAO,EAAEZ,KAAK,CAACa,OAAN,CAAcC,IAHH;AAIpBC,MAAAA,MAAM,YAAKf,KAAK,CAACa,OAAN,CAAcC,IAAd,GAAqB,CAA1B,kBAAmCd,KAAK,CAACa,OAAN,CAAcC,IAAd,GAAqB,CAAxD,gBAA+Dd,KAAK,CAACa,OAAN,CAAcC,IAAd,GAAqB,CAApF;AAJc,KADR,CAlBa;AA0B7BE,IAAAA,WAAW,EAAE;AACX,mBAAa;AACXb,QAAAA,UAAU,EAAE;AADD;AADF,KA1BgB;AA+B7Bc,IAAAA,iBAAiB,EAAE;AACjBC,MAAAA,cAAc,EAAE,QADC;AAEjB,mBAAa;AACXf,QAAAA,UAAU,EAAE;AADD;AAFI,KA/BU;AAqC7BgB,IAAAA,uBAAuB,EAAE;AACvBjB,MAAAA,OAAO,EAAE,MADc;AAEvBC,MAAAA,UAAU,EAAE,QAFW;AAGvB,kBAAY;AACV;AACAiB,QAAAA,UAAU,aAAMpB,KAAK,CAACa,OAAN,CAAcC,IAApB;AAFA;AAHW,KArCI;AA6C7BO,IAAAA,MAAM,EAAE;AACNC,MAAAA,QAAQ,EAAE,UADJ;AAENC,MAAAA,IAAI,EAAE,UAFA;AAGNC,MAAAA,GAAG,EAAE,MAHC;AAINC,MAAAA,KAAK,EAAE,KAJD;AAKNC,MAAAA,MAAM,EAAE,KALF;AAMNC,MAAAA,QAAQ,EAAE;AANJ;AA7CqB,GAAZ;AAAA,CAAnB;;AAuDA,IAAMC,cAAc,GAAG;AACrBC,EAAAA,KAAK,EAAE;AACLxB,IAAAA,KAAK,YAAKA,gBAAMI,IAAN,EAAL,gBADA;AACgC;AACrCL,IAAAA,eAAe,EAAEC,gBAAMC,UAAN,EAFZ;AAGLwB,IAAAA,aAAa,EAAE;AAHV,GADc;AAMrBC,EAAAA,QAAQ,EAAE;AACR;AACA,WAAO;AACLC,MAAAA,MAAM,EAAE;AADH;AAFC;AANW,CAAvB;AAcO,IAAMC,sBAAsB,GAAG,wBAAWL,cAAX,EAA2B;AAC/DM,EAAAA,IAAI,EAAE;AADyD,CAA3B,EAEnC,UAACC,KAAD;AAAA,sBACD,gCAAC,4BAAD,gCAAsBA,KAAtB;AAA6B,IAAA,OAAO,EAAE;AAAEN,MAAAA,KAAK,EAAEM,KAAK,CAACC,OAAN,CAAcP,KAAvB;AAA8BE,MAAAA,QAAQ,EAAEI,KAAK,CAACC,OAAN,CAAcL;AAAtD;AAAtC,KADC;AAAA,CAFmC,CAA/B;;;AAMP,IAAMM,UAAU,GAAG,SAAbA,UAAa,CAACC,OAAD,EAAUC,QAAV;AAAA,0DACXzC,UADW,GACI;AACnBO,IAAAA,KAAK,+BAAwBiC,OAAxB,eAAoCC,QAApC;AADc,GADJ;AAAA,CAAnB;;AAMA,IAAMC,WAAW,GAAG;AAClB,kBAAgBH,UAAU,CAAC,eAAD,EAAkBhC,gBAAMI,IAAN,EAAlB,CADR;AAElB,qBAAmB4B,UAAU,CAAC,wBAAD,EAA2BhC,gBAAMoC,OAAN,EAA3B,CAFX;AAEwD;AAC1E,sBAAoBJ,UAAU,CAAC,wBAAD,EAA2BhC,gBAAM0B,QAAN,EAA3B,CAHZ;AAG0D;AAC5E,oBAAkBM,UAAU,CAAC,iBAAD,EAAoBhC,gBAAMqC,SAAN,EAApB,CAJV;AAKlB,uBAAqBL,UAAU,CAAC,mBAAD,EAAsBhC,gBAAMqC,SAAN,EAAtB,CALb;AAKuD;AACzE,wBAAsBL,UAAU,CAAC,0BAAD,EAA6BhC,gBAAM0B,QAAN,EAA7B,CANd;AAOlBY,EAAAA,IAAI,kCACCN,UAAU,CAAC,OAAD,EAAUhC,gBAAMI,IAAN,EAAV,CADX;AAEF,eAAW;AAAEJ,MAAAA,KAAK,YAAKA,gBAAMuC,YAAN,EAAL;AAAP;AAFT,IAPc;AAWlBC,EAAAA,OAAO,EAAER,UAAU,CAAC,gBAAD,EAAmBhC,gBAAMyC,OAAN,EAAnB,CAXD;AAYlBf,EAAAA,QAAQ,kCACHM,UAAU,CAAC,gBAAD,EAAmBhC,gBAAMI,IAAN,EAAnB,CADP;AAENsC,IAAAA,OAAO,EAAE,GAFH;AAGNf,IAAAA,MAAM,EAAE,wBAHF;AAINgB,IAAAA,aAAa,EAAE;AAJT,IAZU;AAkBlBC,EAAAA,qBAAqB,EAAE;AACrBC,IAAAA,OAAO,sBAAe7C,gBAAM8C,oBAAN,EAAf,CADc;AAErB/C,IAAAA,eAAe,EAAEC,gBAAM+C,cAAN;AAFI,GAlBL;AAsBlBC,EAAAA,mBAAmB,EAAE;AACnBH,IAAAA,OAAO,sBAAe7C,gBAAMiD,kBAAN,EAAf,CADY;AAEnBlD,IAAAA,eAAe,EAAEC,gBAAMkD,YAAN;AAFE;AAtBH,CAApB;AA4BO,IAAMC,cAAc,GAAG,wBAAWhB,WAAX,EAAwB,UAACL,KAAD,EAAW;AAC/D,MAAQsB,WAAR,GAA8FtB,KAA9F,CAAQsB,WAAR;AAAA,MAAqBrB,OAArB,GAA8FD,KAA9F,CAAqBC,OAArB;AAAA,MAA8BS,OAA9B,GAA8FV,KAA9F,CAA8BU,OAA9B;AAAA,MAAuCa,QAAvC,GAA8FvB,KAA9F,CAAuCuB,QAAvC;AAAA,MAAiD3B,QAAjD,GAA8FI,KAA9F,CAAiDJ,QAAjD;AAAA,MAA2D4B,KAA3D,GAA8FxB,KAA9F,CAA2DwB,KAA3D;AAAA,MAAkEC,EAAlE,GAA8FzB,KAA9F,CAAkEyB,EAAlE;AAAA,MAAsEC,SAAtE,GAA8F1B,KAA9F,CAAsE0B,SAAtE;AAAA,MAAiFC,QAAjF,GAA8F3B,KAA9F,CAAiF2B,QAAjF;;AACA,MAAMC,GAAG,GAAG,SAANA,GAAM,CAACC,CAAD;AAAA,WAAQP,WAAW,aAAMA,WAAN,cAAqBO,CAArB,IAA2BA,CAA9C;AAAA,GAAZ;;AAEA,MAAMC,QAAQ,GAAG;AACftB,IAAAA,IAAI,EAAEP,OAAO,CAAC2B,GAAG,CAAC,MAAD,CAAJ,CADE;AAEflB,IAAAA,OAAO,EAAET,OAAO,CAAC2B,GAAG,CAAC,SAAD,CAAJ,CAFD;AAGfhC,IAAAA,QAAQ,EAAEK,OAAO,CAAC2B,GAAG,CAAC,UAAD,CAAJ;AAHF,GAAjB;AAMA,MAAMG,SAAS,GAAG;AAAErB,IAAAA,OAAO,EAAPA,OAAF;AAAWa,IAAAA,QAAQ,EAARA,QAAX;AAAqB3B,IAAAA,QAAQ,EAARA,QAArB;AAA+B4B,IAAAA,KAAK,EAALA;AAA/B,GAAlB;AAEA,sBACE,gCAAC,oBAAD;AACE,IAAA,EAAE,EAAEC,EADN;AAEE,IAAA,QAAQ,EAAEE,QAFZ;AAGE,oBAAcjB,OAHhB;AAIE,IAAA,SAAS,EAAEgB,SAJb;AAKE,IAAA,qBAAqB,EAAEhB,OAAO,GAAGT,OAAO,CAACiB,mBAAX,GAAiCjB,OAAO,CAACa,qBALzE;AAME,IAAA,aAAa;AANf,KAOMiB,SAPN;AAQE,IAAA,SAAS,EAAEpE,UARb;AASE,IAAA,OAAO,EAAE;AACP6C,MAAAA,IAAI,EAAEsB,QAAQ,CAACtB,IADR;AAEPE,MAAAA,OAAO,EAAEoB,QAAQ,CAACpB,OAFX;AAGPd,MAAAA,QAAQ,YAAK0B,WAAW,GAAG,EAAH,GAAQQ,QAAQ,CAAClC,QAAjC;AAHD;AATX,KADF;AAiBD,CA7B6B,CAAvB;;AA+BA,IAAMoC,WAAW,GAAG,wBAAW3B,WAAX,EAAwB,UAACL,KAAD,EAAW;AAC5D,MAAQsB,WAAR,GAA4FtB,KAA5F,CAAQsB,WAAR;AAAA,MAAqBrB,OAArB,GAA4FD,KAA5F,CAAqBC,OAArB;AAAA,MAA8BS,OAA9B,GAA4FV,KAA5F,CAA8BU,OAA9B;AAAA,MAAuCa,QAAvC,GAA4FvB,KAA5F,CAAuCuB,QAAvC;AAAA,MAAiD3B,QAAjD,GAA4FI,KAA5F,CAAiDJ,QAAjD;AAAA,MAA2D4B,KAA3D,GAA4FxB,KAA5F,CAA2DwB,KAA3D;AAAA,MAAkEC,EAAlE,GAA4FzB,KAA5F,CAAkEyB,EAAlE;AAAA,MAAsEQ,OAAtE,GAA4FjC,KAA5F,CAAsEiC,OAAtE;AAAA,MAA+EN,QAA/E,GAA4F3B,KAA5F,CAA+E2B,QAA/E;;AACA,MAAMC,GAAG,GAAG,SAANA,GAAM,CAACC,CAAD;AAAA,WAAQP,WAAW,aAAMA,WAAN,cAAqBO,CAArB,IAA2BA,CAA9C;AAAA,GAAZ;;AAEA,MAAMC,QAAQ,GAAG;AACftB,IAAAA,IAAI,EAAEP,OAAO,CAAC2B,GAAG,CAAC,MAAD,CAAJ,CADE;AAEflB,IAAAA,OAAO,EAAET,OAAO,CAAC2B,GAAG,CAAC,SAAD,CAAJ,CAFD;AAGfhC,IAAAA,QAAQ,EAAEK,OAAO,CAAC2B,GAAG,CAAC,UAAD,CAAJ;AAHF,GAAjB;AAMA,MAAMG,SAAS,GAAG;AAAErB,IAAAA,OAAO,EAAPA,OAAF;AAAWa,IAAAA,QAAQ,EAARA,QAAX;AAAqB3B,IAAAA,QAAQ,EAARA,QAArB;AAA+B4B,IAAAA,KAAK,EAALA;AAA/B,GAAlB;AAEA,sBACE,gCAAC,iBAAD;AACE,IAAA,EAAE,EAAEC,EADN;AAEE,IAAA,QAAQ,EAAEE,QAFZ;AAGE,oBAAcjB,OAHhB;AAIE,IAAA,qBAAqB,EAAEA,OAAO,GAAGT,OAAO,CAACiB,mBAAX,GAAiCjB,OAAO,CAACa,qBAJzE;AAKE,IAAA,aAAa;AALf,KAMMiB,SANN;AAOE,IAAA,SAAS,EAAEpE,UAPb;AAQE,IAAA,IAAI,EAAEsE,OARR;AASE,IAAA,OAAO,EAAE;AACPzB,MAAAA,IAAI,EAAEsB,QAAQ,CAACtB,IADR;AAEPE,MAAAA,OAAO,EAAEoB,QAAQ,CAACpB,OAFX;AAGPd,MAAAA,QAAQ,YAAK0B,WAAW,GAAG,EAAH,GAAQQ,QAAQ,CAAClC,QAAjC;AAHD;AATX,KADF;AAiBD,CA7B0B,CAApB;;;IA+BMsC,W;;;;;AA2BX,uBAAYlC,KAAZ,EAAmB;AAAA;;AAAA;AACjB,8BAAMA,KAAN;AADiB,sGAeH,UAACmC,KAAD,EAAW;AACzB,UAAQC,UAAR,GAAuB,MAAKpC,KAA5B,CAAQoC,UAAR;AAEA,UAAIA,UAAU,KAAK,UAAnB,EAA+B;AAE/B,UAAMC,WAAW,GAAGF,KAAK,CAACP,GAAN,KAAc,WAAlC;AACA,UAAMU,SAAS,GAAGH,KAAK,CAACP,GAAN,KAAc,SAAhC;AAEA,UAAI,CAACS,WAAD,IAAgB,CAACC,SAArB,EAAgC;AAEhCH,MAAAA,KAAK,CAACI,cAAN;AAEA,UAAMC,SAAS,GAAGC,QAAQ,CAACC,cAAT,CAAwB,MAAKC,QAA7B,CAAlB;AACA,UAAI,CAACH,SAAL,EAAgB;AAEhB,UAAMI,QAAQ,GAAGJ,SAAS,CAACK,OAAV,CAAkB,UAAlB,CAAjB;AACA,UAAI,CAACD,QAAL,EAAe;AAEf,UAAME,eAAe,GAAGC,KAAK,CAACC,IAAN,CAAWJ,QAAQ,CAACK,gBAAT,CAA0B,wBAA1B,CAAX,CAAxB;AAEA,UAAMC,YAAY,GAAGJ,eAAe,CAACK,SAAhB,CAA0B,UAACC,EAAD;AAAA,eAAQA,EAAE,KAAKZ,SAAf;AAAA,OAA1B,CAArB;AACA,UAAIU,YAAY,KAAK,CAAC,CAAtB,EAAyB;AAEzB,UAAMG,SAAS,GAAGhB,WAAW,GAAGa,YAAY,GAAG,CAAlB,GAAsBA,YAAY,GAAG,CAAlE;AACA,UAAMI,MAAM,GAAGR,eAAe,CAACO,SAAD,CAA9B;;AAEA,UAAIC,MAAJ,EAAY;AACVA,QAAAA,MAAM,CAACC,KAAP;AACD;AACF,KA5CkB;AAEjB,UAAKC,cAAL,GAAsB,MAAKA,cAAL,CAAoBC,IAApB,gDAAtB;AACA,UAAKd,QAAL,GAAgB,MAAKe,gBAAL,EAAhB;AACA,UAAKC,MAAL,aAAiB,MAAKhB,QAAtB;AAJiB;AAKlB;;;;WAED,wBAAeR,KAAf,EAAsB;AACpB,WAAKnC,KAAL,CAAWuB,QAAX,CAAoBY,KAApB;AACD;;;WAED,4BAAmB;AACjB,aAAO,YAAY,CAACyB,IAAI,CAACC,MAAL,KAAgB,KAAjB,EAAwBC,OAAxB,EAAnB;AACD;;;WAiCD,kBAAS;AAAA;;AACP,wBAiBI,KAAK9D,KAjBT;AAAA,UACEoC,UADF,eACEA,UADF;AAAA,UAEExC,QAFF,eAEEA,QAFF;AAAA,UAGEmE,UAHF,eAGEA,UAHF;AAAA,UAIEC,QAJF,eAIEA,QAJF;AAAA,UAKEtE,KALF,eAKEA,KALF;AAAA,UAME4B,WANF,eAMEA,WANF;AAAA,UAOErB,OAPF,eAOEA,OAPF;AAAA,UAQEgE,SARF,eAQEA,SARF;AAAA,UASEC,SATF,eASEA,SATF;AAAA,UAUEC,QAVF,eAUEA,QAVF;AAAA,UAWEC,cAXF,eAWEA,cAXF;AAAA,UAYEC,aAZF,eAYEA,aAZF;AAAA,UAaE7C,KAbF,eAaEA,KAbF;AAAA,UAcEd,OAdF,eAcEA,OAdF;AAAA,UAeEuB,OAfF,eAeEA,OAfF;AAAA,UAgBEqC,sBAhBF,eAgBEA,sBAhBF;AAmBA,UAAMC,GAAG,GAAGnC,UAAU,KAAK,UAAf,GAA4Bf,cAA5B,GAA6CW,WAAzD;AACA,UAAMwC,WAAW,GAAGpC,UAAU,KAAK,UAAf,GAA4B,UAA5B,GAAyC,cAA7D;AAEA,UAAMqC,gBAAgB,GAAG,4BAAWxE,OAAO,CAAC7B,cAAnB,mEACtB6B,OAAO,CAACzB,gBADc,EACK6F,aAAa,KAAK,YADvB,iDAEtBpE,OAAO,CAACpB,WAFc,EAEAyF,sBAAsB,IAAID,aAAa,KAAK,MAF5C,iDAGtBpE,OAAO,CAACnB,iBAHc,EAGMwF,sBAAsB,IAAID,aAAa,KAAK,MAHlD,gBAAzB;;AAMA,UAAMK,WAAW,gBACf,kEACGX,UAAU,IAAI,CAACO,sBAAf,gBACC;AAAM,QAAA,SAAS,EAAErE,OAAO,CAACnC;AAAzB,SACGiG,UADH,OACgB,MADhB,eAEE,gCAAC,uBAAD;AAAe,QAAA,SAAS,EAAC,OAAzB;AAAiC,QAAA,MAAM,EAAErE,KAAzC;AAAgD,QAAA,OAAO,EAAC;AAAxD,QAFF,CADD,gBAMC,gCAAC,uBAAD;AAAe,QAAA,SAAS,EAAC,OAAzB;AAAiC,QAAA,MAAM,EAAEA,KAAzC;AAAgD,QAAA,OAAO,EAAC;AAAxD,QAPJ,CADF;;AAaA,UAAMiF,iBAAiB,gBACrB;AAAM,QAAA,EAAE,EAAE,KAAKhB,MAAf;AAAuB,QAAA,SAAS,EAAE1D,OAAO,CAACf;AAA1C,SACGkD,UAAU,KAAK,UAAf,GAA4B,qCAA5B,GAAoE,yCADvE,CADF;;AAMA,UAAMwC,QAAQ,GAAG;AACfhF,QAAAA,QAAQ,EAARA,QADe;AAEfc,QAAAA,OAAO,EAAPA,OAFe;AAGfY,QAAAA,WAAW,EAAXA,WAHe;AAIfW,QAAAA,OAAO,EAAPA,OAJe;AAKfT,QAAAA,KAAK,EAALA,KALe;AAMfC,QAAAA,EAAE,EAAE,KAAKkB,QANM;AAOfpB,QAAAA,QAAQ,EAAE,KAAKiC,cAPA;AAQf9B,QAAAA,SAAS,EAAE,KAAKmD,aARD;AASf,4BAAoB,KAAKlB;AATV,OAAjB;AAYA,UAAMmB,cAAc,GAClB,OAAOpF,KAAP,KAAiB,QAAjB,KACCA,KAAK,CAACqF,QAAN,CAAe,OAAf,KACCrF,KAAK,CAACqF,QAAN,CAAe,KAAf,CADD,IAECrF,KAAK,CAACqF,QAAN,CAAe,KAAf,CAFD,IAGCrF,KAAK,CAACqF,QAAN,CAAe,MAAf,CAHD,IAICrF,KAAK,CAACqF,QAAN,CAAe,YAAf,CAJD,IAKCrF,KAAK,CAACqF,QAAN,CAAe,UAAf,CALD,IAMCrF,KAAK,CAACqF,QAAN,CAAe,gBAAf,CAPF,CADF;AAUA,UAAMC,OAAO,GAAGV,sBAAsB,gBACpC;AAAM,QAAA,SAAS,EAAErE,OAAO,CAACjB;AAAzB,SACG8F,cAAc,IAAIH,iBADrB,eAEE,gCAAC,GAAD,gCAASC,QAAT;AAAmB,QAAA,KAAK,EAAE;AAAEnG,UAAAA,OAAO,EAAE;AAAX;AAA1B,SAFF,EAGGsF,UAAU,aAAMA,UAAN,SAAsB,EAHnC,CADoC,gBAOpC,kEACGe,cAAc,IAAIH,iBADrB,eAEE,gCAAC,GAAD,gCAASC,QAAT;AAAmB,QAAA,QAAQ,EAAE,KAAK5E,KAAL,CAAWiF;AAAxC,SAFF,CAPF;AAaA,0BACE;AAAK,QAAA,SAAS,EAAE,4BAAWhB,SAAX,EAAsB,gBAAgBO,WAAtC,EAAmD,cAAnD;AAAhB,sBACE;AAAK,QAAA,SAAS,EAAEvE,OAAO,CAACnC;AAAxB,SACG,CAACqG,QAAD,IAAaC,cAAb,iBAA+B,gCAAC,wBAAD;AAAc,QAAA,WAAW,EAAE9C;AAA3B,QADlC,eAEE;AAAK,QAAA,SAAS,EAAE,4BAAWmD,gBAAX,EAA6B,iBAA7B;AAAhB,sBACE,gCAAC,sBAAD;AACE,QAAA,KAAK,EAAEC,WADT;AAEE,QAAA,KAAK,EAAElD,KAFT;AAGE,QAAA,OAAO,EAAE,KAAKmB,QAHhB;AAIE,QAAA,cAAc,EAAE2B,sBAAsB,GAAG,KAAH,GAAWY,SAJnD;AAKE,QAAA,OAAO,EAAEF;AALX,QADF,CAFF,CADF,EAaGd,SAAS,iBAAI,gCAAC,uBAAD;AAAe,QAAA,SAAS,EAAC,WAAzB;AAAqC,QAAA,gBAAgB,EAAC,WAAtD;AAAkE,QAAA,MAAM,EAAEA;AAA1E,QAbhB,eAcE,gCAAC,kBAAD;AAAU,QAAA,QAAQ,EAAEF,QAApB;AAA8B,QAAA,WAAW,EAAE1C;AAA3C,QAdF,CADF;AAkBD;;;EA9K8B6D,kBAAMC,S;;;iCAA1BlD,W,eACQ;AACjBE,EAAAA,UAAU,EAAEiD,sBAAUC,KAAV,CAAgB,CAAC,OAAD,EAAU,UAAV,CAAhB,CADK;AAEjBvB,EAAAA,UAAU,EAAEsB,sBAAUE,MAFL;AAGjB7E,EAAAA,OAAO,EAAE2E,sBAAUG,IAAV,CAAeC,UAHP;AAIjBnE,EAAAA,WAAW,EAAE+D,sBAAUE,MAJN;AAKjB3F,EAAAA,QAAQ,EAAEyF,sBAAUG,IAAV,CAAeC,UALR;AAMjBzB,EAAAA,QAAQ,EAAEqB,sBAAUE,MANH;AAOjB7F,EAAAA,KAAK,EAAE2F,sBAAUE,MAAV,CAAiBE,UAPP;AAQjBvB,EAAAA,SAAS,EAAEmB,sBAAUE,MARJ;AASjBhE,EAAAA,QAAQ,EAAE8D,sBAAUK,IAAV,CAAeD,UATR;AAUjBjE,EAAAA,KAAK,EAAE6D,sBAAUE,MAAV,CAAiBE,UAVP;AAWjBxF,EAAAA,OAAO,EAAEoF,sBAAUM,MAXF;AAYjB1B,EAAAA,SAAS,EAAEoB,sBAAUE,MAZJ;AAajBtD,EAAAA,OAAO,EAAEoD,sBAAUE,MAbF;AAcjBpB,EAAAA,QAAQ,EAAEkB,sBAAUG,IAdH;AAejBpB,EAAAA,cAAc,EAAEiB,sBAAUG,IAfT;AAgBjBnB,EAAAA,aAAa,EAAEgB,sBAAUC,KAAV,CAAgB,CAAC,UAAD,EAAa,MAAb,EAAqB,YAArB,CAAhB,CAhBE;AAiBjBhB,EAAAA,sBAAsB,EAAEe,sBAAUG;AAjBjB,C;iCADRtD,W,kBAqBW;AACpBgC,EAAAA,SAAS,EAAE,IADS;AAEpBxD,EAAAA,OAAO,EAAE,KAFW;AAGpB0D,EAAAA,cAAc,EAAE;AAHI,C;;eA4JT,wBAAWxG,UAAX,EAAuBsE,WAAvB,C","sourcesContent":["import FormControlLabel from '@material-ui/core/FormControlLabel';\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport Checkbox from '@material-ui/core/Checkbox';\nimport { Feedback, color, PreviewPrompt } from '@pie-lib/pie-toolbox/render-ui';\nimport Radio from '@material-ui/core/Radio';\nimport classNames from 'classnames';\n\nimport FeedbackTick from './feedback-tick';\n\nconst CLASS_NAME = 'multiple-choice-component';\n\nconst styleSheet = (theme) => ({\n row: {\n display: 'flex',\n alignItems: 'center',\n backgroundColor: color.background(),\n },\n checkboxHolder: {\n display: 'flex',\n alignItems: 'center',\n backgroundColor: color.background(),\n flex: 1,\n '& label': {\n color: color.text(),\n '& > span': {\n fontSize: 'inherit',\n },\n },\n },\n horizontalLayout: {\n [`& .${CLASS_NAME}`]: {\n // visually reduce right padding, but maintain accessibility padding for checkbox indicators to be circles\n // add margin to the top, left and bottom of the checkbox to keep the same spacing as before\n padding: theme.spacing.unit,\n margin: `${theme.spacing.unit / 2}px 0 ${theme.spacing.unit / 2}px ${theme.spacing.unit / 2}px`,\n },\n },\n belowLayout: {\n '& > label': {\n alignItems: 'flex-start',\n },\n },\n belowLayoutCenter: {\n justifyContent: 'center',\n '& > label': {\n alignItems: 'center',\n },\n },\n belowSelectionComponent: {\n display: 'flex',\n alignItems: 'center',\n '& > span': {\n // visually reduce right padding, but maintain accessibility padding for checkbox indicators to be circles\n marginLeft: `-${theme.spacing.unit}px`,\n },\n },\n srOnly: {\n position: 'absolute',\n left: '-10000px',\n top: 'auto',\n width: '1px',\n height: '1px',\n overflow: 'hidden',\n },\n});\n\nconst formStyleSheet = {\n label: {\n color: `${color.text()} !important`, //'var(--choice-input-color, black)'\n backgroundColor: color.background(),\n letterSpacing: 'normal',\n },\n disabled: {\n // apply to all children\n '& ': {\n cursor: 'not-allowed !important',\n },\n },\n};\n\nexport const StyledFormControlLabel = withStyles(formStyleSheet, {\n name: 'FormControlLabel',\n})((props) => (\n <FormControlLabel {...props} classes={{ label: props.classes.label, disabled: props.classes.disabled }} />\n));\n\nconst colorStyle = (varName, fallback) => ({\n [`&.${CLASS_NAME}`]: {\n color: `var(--choice-input-${varName}, ${fallback}) !important`,\n },\n});\n\nconst inputStyles = {\n 'correct-root': colorStyle('correct-color', color.text()),\n 'correct-checked': colorStyle('correct-selected-color', color.correct()), //green[500]),\n 'correct-disabled': colorStyle('correct-disabled-color', color.disabled()), //'grey'),\n 'incorrect-root': colorStyle('incorrect-color', color.incorrect()),\n 'incorrect-checked': colorStyle('incorrect-checked', color.incorrect()), //orange[500]),\n 'incorrect-disabled': colorStyle('incorrect-disabled-color', color.disabled()),\n root: {\n ...colorStyle('color', color.text()),\n '&:hover': { color: `${color.primaryLight()} !important` },\n },\n checked: colorStyle('selected-color', color.primary()),\n disabled: {\n ...colorStyle('disabled-color', color.text()),\n opacity: 0.6,\n cursor: 'not-allowed !important',\n pointerEvents: 'initial !important',\n },\n focusVisibleUnchecked: {\n outline: `2px solid ${color.focusUncheckedBorder()}`,\n backgroundColor: color.focusUnchecked(),\n },\n focusVisibleChecked: {\n outline: `2px solid ${color.focusCheckedBorder()}`,\n backgroundColor: color.focusChecked(),\n },\n};\n\nexport const StyledCheckbox = withStyles(inputStyles)((props) => {\n const { correctness, classes, checked, onChange, disabled, value, id, onKeyDown, inputRef } = props;\n const key = (k) => (correctness ? `${correctness}-${k}` : k);\n\n const resolved = {\n root: classes[key('root')],\n checked: classes[key('checked')],\n disabled: classes[key('disabled')],\n };\n\n const miniProps = { checked, onChange, disabled, value };\n\n return (\n <Checkbox\n id={id}\n inputRef={inputRef}\n aria-checked={checked}\n onKeyDown={onKeyDown}\n focusVisibleClassName={checked ? classes.focusVisibleChecked : classes.focusVisibleUnchecked}\n disableRipple\n {...miniProps}\n className={CLASS_NAME}\n classes={{\n root: resolved.root,\n checked: resolved.checked,\n disabled: `${correctness ? '' : resolved.disabled}`,\n }}\n />\n );\n});\n\nexport const StyledRadio = withStyles(inputStyles)((props) => {\n const { correctness, classes, checked, onChange, disabled, value, id, tagName, inputRef } = props;\n const key = (k) => (correctness ? `${correctness}-${k}` : k);\n\n const resolved = {\n root: classes[key('root')],\n checked: classes[key('checked')],\n disabled: classes[key('disabled')],\n };\n\n const miniProps = { checked, onChange, disabled, value };\n\n return (\n <Radio\n id={id}\n inputRef={inputRef}\n aria-checked={checked}\n focusVisibleClassName={checked ? classes.focusVisibleChecked : classes.focusVisibleUnchecked}\n disableRipple\n {...miniProps}\n className={CLASS_NAME}\n name={tagName}\n classes={{\n root: resolved.root,\n checked: resolved.checked,\n disabled: `${correctness ? '' : resolved.disabled}`,\n }}\n />\n );\n});\n\nexport class ChoiceInput extends React.Component {\n static propTypes = {\n choiceMode: PropTypes.oneOf(['radio', 'checkbox']),\n displayKey: PropTypes.string,\n checked: PropTypes.bool.isRequired,\n correctness: PropTypes.string,\n disabled: PropTypes.bool.isRequired,\n feedback: PropTypes.string,\n label: PropTypes.string.isRequired,\n rationale: PropTypes.string,\n onChange: PropTypes.func.isRequired,\n value: PropTypes.string.isRequired,\n classes: PropTypes.object,\n className: PropTypes.string,\n tagName: PropTypes.string,\n hideTick: PropTypes.bool,\n isEvaluateMode: PropTypes.bool,\n choicesLayout: PropTypes.oneOf(['vertical', 'grid', 'horizontal']),\n isSelectionButtonBelow: PropTypes.bool,\n };\n\n static defaultProps = {\n rationale: null,\n checked: false,\n isEvaluateMode: false,\n };\n\n constructor(props) {\n super(props);\n this.onToggleChoice = this.onToggleChoice.bind(this);\n this.choiceId = this.generateChoiceId();\n this.descId = `${this.choiceId}-desc`;\n }\n\n onToggleChoice(event) {\n this.props.onChange(event);\n }\n\n generateChoiceId() {\n return 'choice-' + (Math.random() 10000).toFixed();\n }\n\n handleKeyDown = (event) => {\n const { choiceMode } = this.props;\n\n if (choiceMode !== 'checkbox') return;\n\n const isArrowDown = event.key === 'ArrowDown';\n const isArrowUp = event.key === 'ArrowUp';\n\n if (!isArrowDown && !isArrowUp) return;\n\n event.preventDefault();\n\n const currentEl = document.getElementById(this.choiceId);\n if (!currentEl) return;\n\n const fieldset = currentEl.closest('fieldset');\n if (!fieldset) return;\n\n const groupCheckboxes = Array.from(fieldset.querySelectorAll('input[type=\"checkbox\"]'));\n\n const currentIndex = groupCheckboxes.findIndex((el) => el === currentEl);\n if (currentIndex === -1) return;\n\n const nextIndex = isArrowDown ? currentIndex + 1 : currentIndex - 1;\n const nextEl = groupCheckboxes[nextIndex];\n\n if (nextEl) {\n nextEl.focus();\n }\n };\n\n render() {\n const {\n choiceMode,\n disabled,\n displayKey,\n feedback,\n label,\n correctness,\n classes,\n className,\n rationale,\n hideTick,\n isEvaluateMode,\n choicesLayout,\n value,\n checked,\n tagName,\n isSelectionButtonBelow,\n } = this.props;\n\n const Tag = choiceMode === 'checkbox' ? StyledCheckbox : StyledRadio;\n const classSuffix = choiceMode === 'checkbox' ? 'checkbox' : 'radio-button';\n\n const holderClassNames = classNames(classes.checkboxHolder, {\n [classes.horizontalLayout]: choicesLayout === 'horizontal',\n [classes.belowLayout]: isSelectionButtonBelow && choicesLayout !== 'grid',\n [classes.belowLayoutCenter]: isSelectionButtonBelow && choicesLayout === 'grid',\n });\n\n const choicelabel = (\n <>\n {displayKey && !isSelectionButtonBelow ? (\n <span className={classes.row}>\n {displayKey}.{'\\u00A0'}\n <PreviewPrompt className=\"label\" prompt={label} tagName=\"span\" />\n </span>\n ) : (\n <PreviewPrompt className=\"label\" prompt={label} tagName=\"span\" />\n )}\n </>\n );\n\n const screenReaderLabel = (\n <span id={this.descId} className={classes.srOnly}>\n {choiceMode === 'checkbox' ? 'Checkbox to select the answer below' : 'Radio button to select the answer below'}\n </span>\n );\n\n const tagProps = {\n disabled,\n checked,\n correctness,\n tagName,\n value,\n id: this.choiceId,\n onChange: this.onToggleChoice,\n onKeyDown: this.handleKeyDown,\n 'aria-describedby': this.descId,\n };\n\n const hasMathOrImage =\n typeof label === 'string' &&\n (label.includes('<math') \|\|\n label.includes('\\\\(') \|\|\n label.includes('\\\\[') \|\|\n label.includes('<img') \|\|\n label.includes('data-latex') \|\|\n label.includes('data-raw') \|\|\n label.includes('<mjx-container'));\n\n const control = isSelectionButtonBelow ? (\n <span className={classes.belowSelectionComponent}>\n {hasMathOrImage && screenReaderLabel}\n <Tag {...tagProps} style={{ padding: 0 }} />\n {displayKey ? `${displayKey}.` : ''}\n </span>\n ) : (\n <>\n {hasMathOrImage && screenReaderLabel}\n <Tag {...tagProps} inputRef={this.props.autoFocusRef} />\n </>\n );\n\n return (\n <div className={classNames(className, 'corespring-' + classSuffix, 'choice-input')}>\n <div className={classes.row}>\n {!hideTick && isEvaluateMode && <FeedbackTick correctness={correctness} />}\n <div className={classNames(holderClassNames, 'checkbox-holder')}>\n <StyledFormControlLabel\n label={choicelabel}\n value={value}\n htmlFor={this.choiceId}\n labelPlacement={isSelectionButtonBelow ? 'top' : undefined}\n control={control}\n />\n </div>\n </div>\n {rationale && <PreviewPrompt className=\"rationale\" defaultClassName=\"rationale\" prompt={rationale} />}\n <Feedback feedback={feedback} correctness={correctness} />\n </div>\n );\n }\n}\n\nexport default withStyles(styleSheet)(ChoiceInput);\n"],"file":"choice-input.js"}

package/module/element.js CHANGED Viewed

@@ -12274,7 +12274,7 @@ const StyledCheckbox = styles$b.withStyles(inputStyles)(props => {
   });
 });
 const StyledRadio = styles$b.withStyles(inputStyles)(props => {
-  const {correctness, classes, checked, onChange, disabled, value, id, tagName} = props;
+  const {correctness, classes, checked, onChange, disabled, value, id, tagName, inputRef} = props;
   const key = k => correctness ? `${correctness}-${k}` : k;
   const resolved = {
     root: classes[key('root')],
@@ -12289,6 +12289,7 @@ const StyledRadio = styles$b.withStyles(inputStyles)(props => {
   };
   return React$4.createElement(Radio, {
     id: id,
+    inputRef: inputRef,
     'aria-checked': checked,
     focusVisibleClassName: checked ? classes.focusVisibleChecked : classes.focusVisibleUnchecked,
     disableRipple: true,
@@ -12385,7 +12386,7 @@ class ChoiceInput extends React$4.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 289
+        lineNumber: 290
       }
     }, displayKey, ".", '\u00A0', React$4.createElement(PreviewPrompt$1, {
       className: "label",
@@ -12394,7 +12395,7 @@ class ChoiceInput extends React$4.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 291
+        lineNumber: 292
       }
     })) : React$4.createElement(PreviewPrompt$1, {
       className: "label",
@@ -12403,7 +12404,7 @@ class ChoiceInput extends React$4.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 294
+        lineNumber: 295
       }
     }));
     const screenReaderLabel = React$4.createElement('span', {
@@ -12412,7 +12413,7 @@ class ChoiceInput extends React$4.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 300
+        lineNumber: 301
       }
     }, choiceMode === 'checkbox' ? 'Checkbox to select the answer below' : 'Radio button to select the answer below');
     const tagProps = {
@@ -12432,7 +12433,7 @@ class ChoiceInput extends React$4.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 328
+        lineNumber: 329
       }
     }, hasMathOrImage && screenReaderLabel, React$4.createElement(Tag, {
       ...tagProps,
@@ -12442,7 +12443,7 @@ class ChoiceInput extends React$4.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 330
+        lineNumber: 331
       }
     }), displayKey ? `${displayKey}.` : '') : React$4.createElement(React$4.Fragment, null, hasMathOrImage && screenReaderLabel, React$4.createElement(Tag, {
       ...tagProps,
@@ -12450,7 +12451,7 @@ class ChoiceInput extends React$4.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 336
+        lineNumber: 337
       }
     }));
     return React$4.createElement('div', {
@@ -12458,28 +12459,28 @@ class ChoiceInput extends React$4.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 341
+        lineNumber: 342
       }
     }, React$4.createElement('div', {
       className: classes.row,
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 342
+        lineNumber: 343
       }
     }, !hideTick && isEvaluateMode && React$4.createElement(FeedbackTick$1, {
       correctness: correctness,
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 343
+        lineNumber: 344
       }
     }), React$4.createElement('div', {
       className: classNames$2(holderClassNames, 'checkbox-holder'),
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 344
+        lineNumber: 345
       }
     }, React$4.createElement(StyledFormControlLabel, {
       label: choicelabel,
@@ -12490,7 +12491,7 @@ class ChoiceInput extends React$4.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 345
+        lineNumber: 346
       }
     }))), rationale && React$4.createElement(PreviewPrompt$1, {
       className: "rationale",
@@ -12499,7 +12500,7 @@ class ChoiceInput extends React$4.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 354
+        lineNumber: 355
       }
     }), React$4.createElement(Feedback, {
       feedback: feedback,
@@ -12507,7 +12508,7 @@ class ChoiceInput extends React$4.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 355
+        lineNumber: 356
       }
     }));
   }

package/module/print.js CHANGED Viewed

@@ -12274,7 +12274,7 @@ const StyledCheckbox = styles$b.withStyles(inputStyles)(props => {
   });
 });
 const StyledRadio = styles$b.withStyles(inputStyles)(props => {
-  const {correctness, classes, checked, onChange, disabled, value, id, tagName} = props;
+  const {correctness, classes, checked, onChange, disabled, value, id, tagName, inputRef} = props;
   const key = k => correctness ? `${correctness}-${k}` : k;
   const resolved = {
     root: classes[key('root')],
@@ -12289,6 +12289,7 @@ const StyledRadio = styles$b.withStyles(inputStyles)(props => {
   };
   return React$4.createElement(Radio, {
     id: id,
+    inputRef: inputRef,
     'aria-checked': checked,
     focusVisibleClassName: checked ? classes.focusVisibleChecked : classes.focusVisibleUnchecked,
     disableRipple: true,
@@ -12385,7 +12386,7 @@ class ChoiceInput extends React$4.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 289
+        lineNumber: 290
       }
     }, displayKey, ".", '\u00A0', React$4.createElement(PreviewPrompt$1, {
       className: "label",
@@ -12394,7 +12395,7 @@ class ChoiceInput extends React$4.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 291
+        lineNumber: 292
       }
     })) : React$4.createElement(PreviewPrompt$1, {
       className: "label",
@@ -12403,7 +12404,7 @@ class ChoiceInput extends React$4.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 294
+        lineNumber: 295
       }
     }));
     const screenReaderLabel = React$4.createElement('span', {
@@ -12412,7 +12413,7 @@ class ChoiceInput extends React$4.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 300
+        lineNumber: 301
       }
     }, choiceMode === 'checkbox' ? 'Checkbox to select the answer below' : 'Radio button to select the answer below');
     const tagProps = {
@@ -12432,7 +12433,7 @@ class ChoiceInput extends React$4.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 328
+        lineNumber: 329
       }
     }, hasMathOrImage && screenReaderLabel, React$4.createElement(Tag, {
       ...tagProps,
@@ -12442,7 +12443,7 @@ class ChoiceInput extends React$4.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 330
+        lineNumber: 331
       }
     }), displayKey ? `${displayKey}.` : '') : React$4.createElement(React$4.Fragment, null, hasMathOrImage && screenReaderLabel, React$4.createElement(Tag, {
       ...tagProps,
@@ -12450,7 +12451,7 @@ class ChoiceInput extends React$4.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 336
+        lineNumber: 337
       }
     }));
     return React$4.createElement('div', {
@@ -12458,28 +12459,28 @@ class ChoiceInput extends React$4.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 341
+        lineNumber: 342
       }
     }, React$4.createElement('div', {
       className: classes.row,
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 342
+        lineNumber: 343
       }
     }, !hideTick && isEvaluateMode && React$4.createElement(FeedbackTick$1, {
       correctness: correctness,
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 343
+        lineNumber: 344
       }
     }), React$4.createElement('div', {
       className: classNames$2(holderClassNames, 'checkbox-holder'),
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 344
+        lineNumber: 345
       }
     }, React$4.createElement(StyledFormControlLabel, {
       label: choicelabel,
@@ -12490,7 +12491,7 @@ class ChoiceInput extends React$4.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 345
+        lineNumber: 346
       }
     }))), rationale && React$4.createElement(PreviewPrompt$1, {
       className: "rationale",
@@ -12499,7 +12500,7 @@ class ChoiceInput extends React$4.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 354
+        lineNumber: 355
       }
     }), React$4.createElement(Feedback, {
       feedback: feedback,
@@ -12507,7 +12508,7 @@ class ChoiceInput extends React$4.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 355
+        lineNumber: 356
       }
     }));
   }

package/package.json CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "name": "@pie-element/multiple-choice",
   "repository": "pie-framework/pie-elements",
-  "version": "9.16.5-next.3+fff627751",
+  "version": "9.16.5-next.6+1c7d8ad17",
   "publishConfig": {
     "access": "public"
   },
@@ -19,7 +19,7 @@
     "react-test-renderer": "^16.3.2",
     "react-transition-group": "^2.3.1"
   },
-  "gitHead": "fff62775142fc637ffef1f68660901ade504d597",
+  "gitHead": "1c7d8ad1742e80602e5d0901bfada9984e70588b",
   "scripts": {
     "postpublish": "../../scripts/postpublish"
   },