@pie-element/ebsr 10.5.8-next.3 → 10.5.8-next.7

package/module/element.js

@@ -12309,7 +12309,7 @@ const StyledCheckbox = styles$b.withStyles(inputStyles)(props => {
   });
 });
 const StyledRadio = styles$b.withStyles(inputStyles)(props => {
-  const {correctness, classes, checked, onChange, disabled, value, id} = props;
+  const {correctness, classes, checked, onChange, disabled, value, id, tagName} = props;
   const key = k => correctness ? `${correctness}-${k}` : k;
   const resolved = {
     root: classes[key('root')],
@@ -12329,6 +12329,7 @@ const StyledRadio = styles$b.withStyles(inputStyles)(props => {
     disableRipple: true,
     ...miniProps,
     className: CLASS_NAME,
+    name: tagName,
     classes: {
       root: resolved.root,
       checked: resolved.checked,
@@ -12382,7 +12383,7 @@ class ChoiceInput extends React$4.Component {
     return 'choice-' + (Math.random() * 10000).toFixed();
   }
   render() {
-    const {choiceMode, disabled, displayKey, feedback, label, correctness, classes, className, rationale, hideTick, isEvaluateMode, choicesLayout, value, checked, isSelectionButtonBelow} = this.props;
+    const {choiceMode, disabled, displayKey, feedback, label, correctness, classes, className, rationale, hideTick, isEvaluateMode, choicesLayout, value, checked, tagName, isSelectionButtonBelow} = this.props;
     const Tag = choiceMode === 'checkbox' ? StyledCheckbox : StyledRadio;
     const classSuffix = choiceMode === 'checkbox' ? 'checkbox' : 'radio-button';
     const holderClassNames = classNames$2(classes.checkboxHolder, {
@@ -12395,7 +12396,7 @@ class ChoiceInput extends React$4.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 253
+        lineNumber: 255
       }
     }, displayKey, ".", '\u00A0', React$4.createElement(PreviewPrompt$1, {
       className: "label",
@@ -12404,7 +12405,7 @@ class ChoiceInput extends React$4.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 255
+        lineNumber: 257
       }
     })) : React$4.createElement(PreviewPrompt$1, {
       className: "label",
@@ -12413,7 +12414,7 @@ class ChoiceInput extends React$4.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 258
+        lineNumber: 260
       }
     }));
     const screenReaderLabel = React$4.createElement('span', {
@@ -12422,13 +12423,14 @@ class ChoiceInput extends React$4.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 264
+        lineNumber: 266
       }
     }, choiceMode === 'checkbox' ? 'Checkbox to select the answer below' : 'Radio button to select the answer below');
     const tagProps = {
       disabled,
       checked,
       correctness,
+      tagName,
       value,
       id: this.choiceId,
       onChange: this.onToggleChoice,
@@ -12440,7 +12442,7 @@ class ChoiceInput extends React$4.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 290
+        lineNumber: 293
       }
     }, hasMathOrImage && screenReaderLabel, React$4.createElement(Tag, {
       ...tagProps,
@@ -12450,14 +12452,14 @@ class ChoiceInput extends React$4.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 292
+        lineNumber: 295
       }
     }), displayKey ? `${displayKey}.` : '') : React$4.createElement(React$4.Fragment, null, hasMathOrImage && screenReaderLabel, React$4.createElement(Tag, {
       ...tagProps,
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 298
+        lineNumber: 301
       }
     }));
     return React$4.createElement('div', {
@@ -12465,28 +12467,28 @@ class ChoiceInput extends React$4.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 303
+        lineNumber: 306
       }
     }, React$4.createElement('div', {
       className: classes.row,
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 304
+        lineNumber: 307
       }
     }, !hideTick && isEvaluateMode && React$4.createElement(FeedbackTick$1, {
       correctness: correctness,
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 305
+        lineNumber: 308
       }
     }), React$4.createElement('div', {
       className: classNames$2(holderClassNames, 'checkbox-holder'),
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 306
+        lineNumber: 309
       }
     }, React$4.createElement(StyledFormControlLabel, {
       label: choicelabel,
@@ -12497,7 +12499,7 @@ class ChoiceInput extends React$4.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 307
+        lineNumber: 310
       }
     }))), rationale && React$4.createElement(PreviewPrompt$1, {
       className: "rationale",
@@ -12506,7 +12508,7 @@ class ChoiceInput extends React$4.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 316
+        lineNumber: 319
       }
     }), React$4.createElement(Feedback, {
       feedback: feedback,
@@ -12514,7 +12516,7 @@ class ChoiceInput extends React$4.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 317
+        lineNumber: 320
       }
     }));
   }
@@ -12543,7 +12545,7 @@ class Choice extends React$3.Component {
     };
   }
   render() {
-    const {choice, index, choicesLength, showCorrect, isEvaluateMode, choiceMode, disabled, checked, correctness, displayKey, classes, choicesLayout, gridColumns, isSelectionButtonBelow, selectedAnswerBackgroundColor} = this.props;
+    const {choice, index, choicesLength, showCorrect, isEvaluateMode, choiceMode, disabled, checked, correctness, displayKey, classes, choicesLayout, gridColumns, isSelectionButtonBelow, selectedAnswerBackgroundColor, tagName} = this.props;
     const choiceClass = 'choice' + (index === choicesLength - 1 ? ' last' : '');
     const feedback = !isEvaluateMode || showCorrect ? '' : choice.feedback;
     const choiceProps = {
@@ -12559,7 +12561,8 @@ class Choice extends React$3.Component {
       gridColumns,
       onChange: this.onChange,
       isEvaluateMode,
-      isSelectionButtonBelow
+      isSelectionButtonBelow,
+      tagName
     };
     const names = classNames$1(classes.choice, {
       [classes.noBorder]: index === choicesLength - 1 || choicesLayout !== 'vertical',
@@ -12575,7 +12578,7 @@ class Choice extends React$3.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$2,
-        lineNumber: 65
+        lineNumber: 67
       }
     }, React$3.createElement(ChoiceInput$1, {
       ...choiceProps,
@@ -12583,7 +12586,7 @@ class Choice extends React$3.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$2,
-        lineNumber: 66
+        lineNumber: 68
       }
     }));
   }
@@ -12605,6 +12608,7 @@ Choice.propTypes = {
   choicesLayout: PropTypes$2.oneOf(['vertical', 'grid', 'horizontal']),
   gridColumns: PropTypes$2.string,
   selectedAnswerBackgroundColor: PropTypes$2.string,
+  tagName: PropTypes$2.string,
   isSelectionButtonBelow: PropTypes$2.bool
 };
 var StyledChoice = styles$b.withStyles(theme => ({
@@ -12965,6 +12969,7 @@ class MultipleChoice$1 extends React$2.Component {
       isEvaluateMode: isEvaluateMode,
       choiceMode: choiceMode,
       disabled: disabled,
+      tagName: partLabel ? `group-${partLabel}` : 'group',
       onChoiceChanged: this.handleChange,
       hideTick: choice.hideTick,
       checked: this.getChecked(choice),
@@ -12981,14 +12986,14 @@ class MultipleChoice$1 extends React$2.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 347
+        lineNumber: 348
       }
     }, getMultipleChoiceMinSelectionErrorMessage()), choiceMode === 'checkbox' && maxSelectionsErrorState && React$2.createElement('div', {
       className: classes.errorText,
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 352
+        lineNumber: 353
       }
     }, translator.t(`translation:multipleChoice:maxSelections_${maxSelections === 1 ? 'one' : 'other'}`, {
       lng: language,

package/module/print.js

@@ -12272,7 +12272,7 @@ const StyledCheckbox = styles$b.withStyles(inputStyles)(props => {
   });
 });
 const StyledRadio = styles$b.withStyles(inputStyles)(props => {
-  const {correctness, classes, checked, onChange, disabled, value, id} = props;
+  const {correctness, classes, checked, onChange, disabled, value, id, tagName} = props;
   const key = k => correctness ? `${correctness}-${k}` : k;
   const resolved = {
     root: classes[key('root')],
@@ -12292,6 +12292,7 @@ const StyledRadio = styles$b.withStyles(inputStyles)(props => {
     disableRipple: true,
     ...miniProps,
     className: CLASS_NAME,
+    name: tagName,
     classes: {
       root: resolved.root,
       checked: resolved.checked,
@@ -12345,7 +12346,7 @@ class ChoiceInput extends React$4.Component {
     return 'choice-' + (Math.random() * 10000).toFixed();
   }
   render() {
-    const {choiceMode, disabled, displayKey, feedback, label, correctness, classes, className, rationale, hideTick, isEvaluateMode, choicesLayout, value, checked, isSelectionButtonBelow} = this.props;
+    const {choiceMode, disabled, displayKey, feedback, label, correctness, classes, className, rationale, hideTick, isEvaluateMode, choicesLayout, value, checked, tagName, isSelectionButtonBelow} = this.props;
     const Tag = choiceMode === 'checkbox' ? StyledCheckbox : StyledRadio;
     const classSuffix = choiceMode === 'checkbox' ? 'checkbox' : 'radio-button';
     const holderClassNames = classNames$2(classes.checkboxHolder, {
@@ -12358,7 +12359,7 @@ class ChoiceInput extends React$4.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 253
+        lineNumber: 255
       }
     }, displayKey, ".", '\u00A0', React$4.createElement(PreviewPrompt$1, {
       className: "label",
@@ -12367,7 +12368,7 @@ class ChoiceInput extends React$4.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 255
+        lineNumber: 257
       }
     })) : React$4.createElement(PreviewPrompt$1, {
       className: "label",
@@ -12376,7 +12377,7 @@ class ChoiceInput extends React$4.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 258
+        lineNumber: 260
       }
     }));
     const screenReaderLabel = React$4.createElement('span', {
@@ -12385,13 +12386,14 @@ class ChoiceInput extends React$4.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 264
+        lineNumber: 266
       }
     }, choiceMode === 'checkbox' ? 'Checkbox to select the answer below' : 'Radio button to select the answer below');
     const tagProps = {
       disabled,
       checked,
       correctness,
+      tagName,
       value,
       id: this.choiceId,
       onChange: this.onToggleChoice,
@@ -12403,7 +12405,7 @@ class ChoiceInput extends React$4.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 290
+        lineNumber: 293
       }
     }, hasMathOrImage && screenReaderLabel, React$4.createElement(Tag, {
       ...tagProps,
@@ -12413,14 +12415,14 @@ class ChoiceInput extends React$4.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 292
+        lineNumber: 295
       }
     }), displayKey ? `${displayKey}.` : '') : React$4.createElement(React$4.Fragment, null, hasMathOrImage && screenReaderLabel, React$4.createElement(Tag, {
       ...tagProps,
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 298
+        lineNumber: 301
       }
     }));
     return React$4.createElement('div', {
@@ -12428,28 +12430,28 @@ class ChoiceInput extends React$4.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 303
+        lineNumber: 306
       }
     }, React$4.createElement('div', {
       className: classes.row,
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 304
+        lineNumber: 307
       }
     }, !hideTick && isEvaluateMode && React$4.createElement(FeedbackTick$1, {
       correctness: correctness,
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 305
+        lineNumber: 308
       }
     }), React$4.createElement('div', {
       className: classNames$2(holderClassNames, 'checkbox-holder'),
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 306
+        lineNumber: 309
       }
     }, React$4.createElement(StyledFormControlLabel, {
       label: choicelabel,
@@ -12460,7 +12462,7 @@ class ChoiceInput extends React$4.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 307
+        lineNumber: 310
       }
     }))), rationale && React$4.createElement(PreviewPrompt$1, {
       className: "rationale",
@@ -12469,7 +12471,7 @@ class ChoiceInput extends React$4.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 316
+        lineNumber: 319
       }
     }), React$4.createElement(Feedback, {
       feedback: feedback,
@@ -12477,7 +12479,7 @@ class ChoiceInput extends React$4.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$3,
-        lineNumber: 317
+        lineNumber: 320
       }
     }));
   }
@@ -12506,7 +12508,7 @@ class Choice extends React$3.Component {
     };
   }
   render() {
-    const {choice, index, choicesLength, showCorrect, isEvaluateMode, choiceMode, disabled, checked, correctness, displayKey, classes, choicesLayout, gridColumns, isSelectionButtonBelow, selectedAnswerBackgroundColor} = this.props;
+    const {choice, index, choicesLength, showCorrect, isEvaluateMode, choiceMode, disabled, checked, correctness, displayKey, classes, choicesLayout, gridColumns, isSelectionButtonBelow, selectedAnswerBackgroundColor, tagName} = this.props;
     const choiceClass = 'choice' + (index === choicesLength - 1 ? ' last' : '');
     const feedback = !isEvaluateMode || showCorrect ? '' : choice.feedback;
     const choiceProps = {
@@ -12522,7 +12524,8 @@ class Choice extends React$3.Component {
       gridColumns,
       onChange: this.onChange,
       isEvaluateMode,
-      isSelectionButtonBelow
+      isSelectionButtonBelow,
+      tagName
     };
     const names = classNames$1(classes.choice, {
       [classes.noBorder]: index === choicesLength - 1 || choicesLayout !== 'vertical',
@@ -12538,7 +12541,7 @@ class Choice extends React$3.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$2,
-        lineNumber: 65
+        lineNumber: 67
       }
     }, React$3.createElement(ChoiceInput$1, {
       ...choiceProps,
@@ -12546,7 +12549,7 @@ class Choice extends React$3.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$2,
-        lineNumber: 66
+        lineNumber: 68
       }
     }));
   }
@@ -12568,6 +12571,7 @@ Choice.propTypes = {
   choicesLayout: PropTypes$2.oneOf(['vertical', 'grid', 'horizontal']),
   gridColumns: PropTypes$2.string,
   selectedAnswerBackgroundColor: PropTypes$2.string,
+  tagName: PropTypes$2.string,
   isSelectionButtonBelow: PropTypes$2.bool
 };
 var StyledChoice = styles$b.withStyles(theme => ({
@@ -12928,6 +12932,7 @@ class MultipleChoice$1 extends React$2.Component {
       isEvaluateMode: isEvaluateMode,
       choiceMode: choiceMode,
       disabled: disabled,
+      tagName: partLabel ? `group-${partLabel}` : 'group',
       onChoiceChanged: this.handleChange,
       hideTick: choice.hideTick,
       checked: this.getChecked(choice),
@@ -12944,14 +12949,14 @@ class MultipleChoice$1 extends React$2.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 347
+        lineNumber: 348
       }
     }, getMultipleChoiceMinSelectionErrorMessage()), choiceMode === 'checkbox' && maxSelectionsErrorState && React$2.createElement('div', {
       className: classes.errorText,
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 352
+        lineNumber: 353
       }
     }, translator$1.t(`translation:multipleChoice:maxSelections_${maxSelections === 1 ? 'one' : 'other'}`, {
       lng: language,

package/package.json

@@ -1,13 +1,13 @@
 {
   "name": "@pie-element/ebsr",
-  "version": "10.5.8-next.3+11b54d1f9",
+  "version": "10.5.8-next.7+ea1831187",
   "description": "",
   "repository": "pie-framework/pie-elements",
   "publishConfig": {
     "access": "public"
   },
   "dependencies": {
-    "@pie-element/multiple-choice": "^9.16.2-next.3+11b54d1f9",
+    "@pie-element/multiple-choice": "^9.16.2-next.7+ea1831187",
     "@pie-framework/pie-player-events": "^0.1.0",
     "@pie-lib/pie-toolbox": "2.17.6",
     "classnames": "^2.2.5",
@@ -16,7 +16,7 @@
   },
   "author": "pie framework developers",
   "license": "ISC",
-  "gitHead": "11b54d1f9605e763bdc809c494c50fcafc3db593",
+  "gitHead": "ea18311870fbffe39749d88765a5118d9ff00b21",
   "scripts": {
     "postpublish": "../../scripts/postpublish"
   },