@pie-element/explicit-constructed-response 6.12.6 → 6.12.8

package/module/element.js

@@ -1,4 +1,4 @@
-import {_dll_react, _dll_prop_types, _dll_debug, _dll_lodash, _dll_react_dom_server, _dll_react_dom, _dll_classnames, _dll_pie_lib__pie_toolbox_math_rendering_accessible} from "../../../@pie-lib/pie-toolbox-math-rendering-module@1.10.4/module/index.js";
+import {_dll_react, _dll_prop_types, _dll_debug, _dll_lodash, _dll_react_dom_server, _dll_react_dom, _dll_classnames, _dll_pie_lib__pie_toolbox_math_rendering_accessible} from "../../../@pie-lib/pie-toolbox-math-rendering-module@1.12.0/module/index.js";
 import {_dll_pie_lib__pie_toolbox_correct_answer_toggle, _dll_pie_lib__pie_toolbox_render_ui} from "../../../@pie-lib/pie-toolbox-module@4.12.0/module/index.js";
 var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
 function getDefaultExportFromCjs(x) {
@@ -19140,7 +19140,8 @@ var withMask = function withMask(type, renderChildren) {
     markup: _propTypes$x["default"].string,
     layout: _propTypes$x["default"].object,
     value: _propTypes$x["default"].object,
-    onChange: _propTypes$x["default"].func
+    onChange: _propTypes$x["default"].func,
+    customMarkMarkupComponent: _propTypes$x["default"].func
   }), _class);
 };
 withMask$1.withMask = withMask;
@@ -84129,7 +84130,7 @@ var esm$3 = Object.freeze({
 });
 var require$$2$k = getAugmentedNamespace(esm$3);
 var placeholder = {};
-const require$$1$n = _dll_react;
+const require$$1$o = _dll_react;
 const require$$3$8 = _dll_classnames;
 const require$$4$e = _dll_prop_types;
 (function (exports) {
@@ -84138,7 +84139,7 @@ const require$$4$e = _dll_prop_types;
     value: true
   });
   exports["default"] = exports.PlaceHolder = void 0;
-  var _react = _interopRequireDefault(require$$1$n);
+  var _react = _interopRequireDefault(require$$1$o);
   var _styles = styles$p;
   var _classnames = _interopRequireDefault(require$$3$8);
   var _propTypes = _interopRequireDefault(require$$4$e);
@@ -86601,7 +86602,7 @@ var correctIcon = {};
 var iconBase = {};
 var iconRoot = {};
 var sized = {};
-const require$$1$m = _dll_react;
+const require$$1$n = _dll_react;
 const require$$2$i = _dll_prop_types;
 (function (exports) {
   var _interopRequireDefault = interopRequireDefault.exports;
@@ -86609,7 +86610,7 @@ const require$$2$i = _dll_prop_types;
     value: true
   });
   exports.normalizeSize = exports["default"] = void 0;
-  var _react = _interopRequireDefault(require$$1$m);
+  var _react = _interopRequireDefault(require$$1$n);
   var _propTypes = _interopRequireDefault(require$$2$i);
   var normalizeSize = function normalizeSize(size) {
     return typeof size === 'string' ? size : typeof size === 'number' ? ("").concat(size, "px") : '30px';
@@ -86636,14 +86637,14 @@ const require$$2$i = _dll_prop_types;
   exports["default"] = _default;
 })(sized);
 getDefaultExportFromCjs(sized);
-const require$$1$l = _dll_react;
+const require$$1$m = _dll_react;
 const require$$2$h = _dll_prop_types;
 var _interopRequireDefault$V = interopRequireDefault.exports;
 Object.defineProperty(iconRoot, "__esModule", {
   value: true
 });
 iconRoot.normalizeSize = iconRoot.getStyles = iconRoot.Tick = iconRoot.SquareFeedbackBox = iconRoot.Square = iconRoot.RoundFeedbackBox = iconRoot.IconRoot = iconRoot.Circle = void 0;
-var _react$H = _interopRequireDefault$V(require$$1$l);
+var _react$H = _interopRequireDefault$V(require$$1$m);
 var _propTypes$w = _interopRequireDefault$V(require$$2$h);
 var _sized = _interopRequireDefault$V(sized);
 var normalizeSize = function normalizeSize(size) {
@@ -87030,7 +87031,7 @@ const require$$3$6 = _dll_react;
 })(correctIcon);
 getDefaultExportFromCjs(correctIcon);
 var correctResponseIcon = {};
-const require$$1$k = _dll_prop_types;
+const require$$1$l = _dll_prop_types;
 const require$$2$f = _dll_react;
 const require$$3$5 = _dll_classnames;
 (function (exports) {
@@ -87039,7 +87040,7 @@ const require$$3$5 = _dll_classnames;
     value: true
   });
   exports["default"] = void 0;
-  var _propTypes = _interopRequireDefault(require$$1$k);
+  var _propTypes = _interopRequireDefault(require$$1$l);
   var _react = _interopRequireDefault(require$$2$f);
   var _classnames = _interopRequireDefault(require$$3$5);
   var _styles = styles$p;
@@ -94749,10 +94750,10 @@ getDefaultExportFromCjs(scheduler_development);
 {
   scheduler.exports = scheduler_development;
 }
-const require$$1$j = _dll_react;
+const require$$1$k = _dll_react;
 (function (module) {
   module.exports = function $$$reconciler($$$hostConfig) {
-    var aa = objectAssign, ba = require$$1$j, n = scheduler.exports;
+    var aa = objectAssign, ba = require$$1$k, n = scheduler.exports;
     function p(b) {
       for (var a = b.message, c = "https://reactjs.org/docs/error-decoder.html?invariant=" + a, d = 1; d < arguments.length; d++) c += "&args[]=" + encodeURIComponent(arguments[d]);
       b.message = "Minified React error #" + a + "; visit " + c + " for the full message or use the non-minified dev environment for full errors and additional helpful warnings. ";
@@ -98396,13 +98397,13 @@ getDefaultExportFromCjs(schedulerTracing_development);
 {
   tracing.exports = schedulerTracing_development;
 }
-const require$$1$i = _dll_react;
+const require$$1$j = _dll_react;
 const {checkPropTypes: require$$2$c} = _dll_prop_types;
 (function (module) {
   {
     module.exports = function $$$reconciler($$$hostConfig) {
       var _assign = objectAssign;
-      var React = require$$1$i;
+      var React = require$$1$j;
       var checkPropTypes = require$$2$c;
       var Scheduler = scheduler.exports;
       var tracing$1 = tracing.exports;
@@ -114255,7 +114256,7 @@ var Modal$1 = {};
 var RootRef$2 = {};
 var RootRef$1 = {};
 var reactHelpers = {};
-const require$$1$h = _dll_react;
+const require$$1$i = _dll_react;
 const require$$2$b = _dll_classnames;
 var _interopRequireDefault$Q = interopRequireDefault.exports;
 Object.defineProperty(reactHelpers, "__esModule", {
@@ -114265,7 +114266,7 @@ reactHelpers.cloneElementWithClassName = cloneElementWithClassName;
 reactHelpers.cloneChildrenWithClassName = cloneChildrenWithClassName;
 reactHelpers.isMuiElement = isMuiElement;
 reactHelpers.setRef = setRef;
-var _react$G = _interopRequireDefault$Q(require$$1$h);
+var _react$G = _interopRequireDefault$Q(require$$1$i);
 var _classnames$k = _interopRequireDefault$Q(require$$2$b);
 function cloneElementWithClassName(child, className) {
   return _react$G.default.cloneElement(child, {
@@ -115106,12 +115107,12 @@ var classNamesShape = _propTypes$t.default.oneOfType([_propTypes$t.default.strin
 })]);
 PropTypes$2.classNamesShape = classNamesShape;
 const require$$0$4 = _dll_prop_types;
-const require$$1$g = _dll_react;
+const require$$1$h = _dll_react;
 const require$$2$9 = _dll_react_dom;
 Transition$1.__esModule = true;
 Transition$1.default = Transition$1.EXITING = Transition$1.ENTERED = Transition$1.ENTERING = Transition$1.EXITED = Transition$1.UNMOUNTED = void 0;
 var PropTypes$1 = _interopRequireWildcard$1(require$$0$4);
-var _react$D = _interopRequireDefault$J(require$$1$g);
+var _react$D = _interopRequireDefault$J(require$$1$h);
 var _reactDom$6 = _interopRequireDefault$J(require$$2$9);
 var _reactLifecyclesCompat = require$$2$a;
 var _PropTypes = PropTypes$2;
@@ -116904,12 +116905,12 @@ function getNextChildMapping(nextProps, prevChildMapping, onExited) {
   return children;
 }
 const require$$0$1 = _dll_prop_types;
-const require$$1$f = _dll_react;
+const require$$1$g = _dll_react;
 (function (module, exports) {
   exports.__esModule = true;
   exports.default = void 0;
   var _propTypes = _interopRequireDefault(require$$0$1);
-  var _react = _interopRequireDefault(require$$1$f);
+  var _react = _interopRequireDefault(require$$1$g);
   var _reactLifecyclesCompat = require$$2$a;
   var _ChildMapping = ChildMapping;
   function _interopRequireDefault(obj) {
@@ -117046,13 +117047,13 @@ const require$$1$f = _dll_react;
 })(TransitionGroup, TransitionGroup.exports);
 getDefaultExportFromCjs(TransitionGroup.exports);
 const require$$0 = _dll_prop_types;
-const require$$1$e = _dll_react;
+const require$$1$f = _dll_react;
 const require$$2$8 = _dll_react_dom;
 (function (module, exports) {
   exports.__esModule = true;
   exports.default = void 0;
   var _propTypes = _interopRequireDefault(require$$0);
-  var _react = _interopRequireDefault(require$$1$e);
+  var _react = _interopRequireDefault(require$$1$f);
   var _reactDom = require$$2$8;
   var _TransitionGroup = _interopRequireDefault(TransitionGroup.exports);
   function _interopRequireDefault(obj) {
@@ -119434,13 +119435,13 @@ SvgIcon$1.default = _default$m;
   var _SvgIcon = _interopRequireDefault(SvgIcon$1);
 })(SvgIcon$2);
 getDefaultExportFromCjs(SvgIcon$2);
-const require$$1$d = _dll_react;
+const require$$1$e = _dll_react;
 var _interopRequireDefault$m = interopRequireDefault.exports;
 Object.defineProperty(createSvgIcon$1, "__esModule", {
   value: true
 });
 createSvgIcon$1.default = void 0;
-var _react$m = _interopRequireDefault$m(require$$1$d);
+var _react$m = _interopRequireDefault$m(require$$1$e);
 var _pure$1 = _interopRequireDefault$m(pure$1);
 var _SvgIcon$1 = _interopRequireDefault$m(SvgIcon$2);
 function createSvgIcon(path, displayName) {
@@ -119454,13 +119455,13 @@ function createSvgIcon(path, displayName) {
 }
 var _default$l = createSvgIcon;
 createSvgIcon$1.default = _default$l;
-const require$$1$c = _dll_react;
+const require$$1$d = _dll_react;
 var _interopRequireDefault$l = interopRequireDefault.exports;
 Object.defineProperty(Restore, "__esModule", {
   value: true
 });
 Restore.default = void 0;
-var _react$l = _interopRequireDefault$l(require$$1$c);
+var _react$l = _interopRequireDefault$l(require$$1$d);
 var _createSvgIcon$2 = _interopRequireDefault$l(createSvgIcon$1);
 var _default$k = (0, _createSvgIcon$2.default)(_react$l.default.createElement(_react$l.default.Fragment, null, _react$l.default.createElement("path", {
   fill: "none",
@@ -119470,13 +119471,13 @@ var _default$k = (0, _createSvgIcon$2.default)(_react$l.default.createElement(_r
 })), 'Restore');
 Restore.default = _default$k;
 var Undo = {};
-const require$$1$b = _dll_react;
+const require$$1$c = _dll_react;
 var _interopRequireDefault$k = interopRequireDefault.exports;
 Object.defineProperty(Undo, "__esModule", {
   value: true
 });
 Undo.default = void 0;
-var _react$k = _interopRequireDefault$k(require$$1$b);
+var _react$k = _interopRequireDefault$k(require$$1$c);
 var _createSvgIcon$1 = _interopRequireDefault$k(createSvgIcon$1);
 var _default$j = (0, _createSvgIcon$1.default)(_react$k.default.createElement(_react$k.default.Fragment, null, _react$k.default.createElement("path", {
   fill: "none",
@@ -119936,13 +119937,13 @@ function formControlState(_ref) {
 }
 var withFormControlContext$1 = {};
 var FormControlContext$1 = {};
-const require$$1$a = _dll_react;
+const require$$1$b = _dll_react;
 var _interopRequireDefault$j = interopRequireDefault.exports;
 Object.defineProperty(FormControlContext$1, "__esModule", {
   value: true
 });
 FormControlContext$1.default = void 0;
-var _react$j = _interopRequireDefault$j(require$$1$a);
+var _react$j = _interopRequireDefault$j(require$$1$b);
 var FormControlContext = _react$j.default.createContext();
 var _default$i = FormControlContext;
 FormControlContext$1.default = _default$i;
@@ -120761,7 +120762,7 @@ const require$$11$1 = _dll_prop_types;
 })(previewPrompt);
 getDefaultExportFromCjs(previewPrompt);
 var readable = {};
-const require$$1$9 = _dll_prop_types;
+const require$$1$a = _dll_prop_types;
 const require$$2$4 = _dll_react;
 (function (exports) {
   var _interopRequireDefault = interopRequireDefault.exports;
@@ -120769,7 +120770,7 @@ const require$$2$4 = _dll_react;
     value: true
   });
   exports["default"] = void 0;
-  var _propTypes = _interopRequireDefault(require$$1$9);
+  var _propTypes = _interopRequireDefault(require$$1$a);
   var _react = _interopRequireDefault(require$$2$4);
   var Readable = function Readable(props) {
     return _react["default"].createElement(_react["default"].Fragment, null, _react["default"].Children.map(props.children, function (child) {
@@ -120787,7 +120788,7 @@ const require$$2$4 = _dll_react;
 })(readable);
 getDefaultExportFromCjs(readable);
 var purpose = {};
-const require$$1$8 = _dll_prop_types;
+const require$$1$9 = _dll_prop_types;
 const require$$2$3 = _dll_react;
 (function (exports) {
   var _interopRequireDefault = interopRequireDefault.exports;
@@ -120795,7 +120796,7 @@ const require$$2$3 = _dll_react;
     value: true
   });
   exports["default"] = void 0;
-  var _propTypes = _interopRequireDefault(require$$1$8);
+  var _propTypes = _interopRequireDefault(require$$1$9);
   var _react = _interopRequireDefault(require$$2$3);
   var Purpose = function Purpose(props) {
     return _react["default"].createElement(_react["default"].Fragment, null, _react["default"].Children.map(props.children, function (child) {
@@ -121236,14 +121237,14 @@ const require$$2$2 = _dll_react;
 })(withDragContext);
 getDefaultExportFromCjs(withDragContext);
 var swap = {};
-const {cloneDeep: require$$1$7} = _dll_lodash;
+const {cloneDeep: require$$1$8} = _dll_lodash;
 (function (exports) {
   var _interopRequireDefault = interopRequireDefault.exports;
   Object.defineProperty(exports, "__esModule", {
     value: true
   });
   exports["default"] = void 0;
-  var _cloneDeep = _interopRequireDefault(require$$1$7);
+  var _cloneDeep = _interopRequireDefault(require$$1$8);
   var _default = function _default(arr, fromIndex, toIndex) {
     if (!arr || arr.length <= 1 || fromIndex === undefined || toIndex === undefined) {
       throw new Error(("swap requires a non-empty array, fromIndex, toIndex: ").concat(arr, ", ").concat(fromIndex, " ").concat(toIndex));
@@ -121564,13 +121565,13 @@ getDefaultExportFromCjs(drag);
 var Chip$2 = {};
 var Chip$1 = {};
 var Cancel$1 = {};
-const require$$1$6 = _dll_react;
+const require$$1$7 = _dll_react;
 var _interopRequireDefault$d = interopRequireDefault.exports;
 Object.defineProperty(Cancel$1, "__esModule", {
   value: true
 });
 Cancel$1.default = void 0;
-var _react$d = _interopRequireDefault$d(require$$1$6);
+var _react$d = _interopRequireDefault$d(require$$1$7);
 var _pure = _interopRequireDefault$d(pure$1);
 var _SvgIcon = _interopRequireDefault$d(SvgIcon$2);
 var _ref = _react$d.default.createElement("path", {
@@ -123598,7 +123599,7 @@ const require$$6$3 = _dll_classnames;
   exports["default"] = _default;
 })(correctInput);
 getDefaultExportFromCjs(correctInput);
-const require$$1$5 = _dll_react;
+const require$$1$6 = _dll_react;
 const require$$2$1 = _dll_prop_types;
 (function (exports) {
   var _interopRequireDefault = interopRequireDefault.exports;
@@ -123606,7 +123607,7 @@ const require$$2$1 = _dll_prop_types;
     value: true
   });
   exports["default"] = void 0;
-  var _react = _interopRequireDefault(require$$1$5);
+  var _react = _interopRequireDefault(require$$1$6);
   var _propTypes = _interopRequireDefault(require$$2$1);
   var _correctInput = _interopRequireDefault(correctInput);
   var Input = function Input(_ref) {
@@ -123642,14 +123643,14 @@ const require$$2$1 = _dll_prop_types;
   exports["default"] = _default;
 })(input);
 getDefaultExportFromCjs(input);
-const require$$1$4 = _dll_react;
+const require$$1$5 = _dll_react;
 (function (exports) {
   var _interopRequireDefault = interopRequireDefault.exports;
   Object.defineProperty(exports, "__esModule", {
     value: true
   });
   exports["default"] = void 0;
-  var _react = _interopRequireDefault(require$$1$4);
+  var _react = _interopRequireDefault(require$$1$5);
   var _input = _interopRequireDefault(input);
   var _withMask = withMask$1;
   var _default = (0, _withMask.withMask)('input', function (props) {
@@ -123679,6 +123680,27 @@ const require$$1$4 = _dll_react;
   exports["default"] = _default;
 })(constructedResponse);
 getDefaultExportFromCjs(constructedResponse);
+var customizable = {};
+const require$$1$4 = _dll_react;
+(function (exports) {
+  var _interopRequireDefault = interopRequireDefault.exports;
+  Object.defineProperty(exports, "__esModule", {
+    value: true
+  });
+  exports["default"] = void 0;
+  _interopRequireDefault(require$$1$4);
+  var _withMask = withMask$1;
+  var _default = (0, _withMask.withMask)('input', function (props) {
+    return function (node, data, onChange) {
+      var dataset = node.data ? node.data.dataset || ({}) : {};
+      if (dataset.component === 'input') {
+        return props.customMarkMarkupComponent(dataset.id);
+      }
+    };
+  });
+  exports["default"] = _default;
+})(customizable);
+getDefaultExportFromCjs(customizable);
 var inlineDropdown = {};
 var dropdown = {};
 var Menu$2 = {};
@@ -124789,6 +124811,12 @@ getDefaultExportFromCjs(inlineDropdown);
       return _constructedResponse["default"];
     }
   });
+  Object.defineProperty(exports, "Customizable", {
+    enumerable: true,
+    get: function get() {
+      return _customizable["default"];
+    }
+  });
   Object.defineProperty(exports, "DragInTheBlank", {
     enumerable: true,
     get: function get() {
@@ -124822,6 +124850,7 @@ getDefaultExportFromCjs(inlineDropdown);
   var _withMask = withMask$1;
   var _dragInTheBlank = _interopRequireDefault(dragInTheBlank);
   var _constructedResponse = _interopRequireDefault(constructedResponse);
+  var _customizable = _interopRequireDefault(customizable);
   var _inlineDropdown = _interopRequireDefault(inlineDropdown);
   var _componentize = _interopRequireDefault(componentize);
 })(maskMarkup);
@@ -124836,6 +124865,12 @@ getDefaultExportFromCjs(maskMarkup);
       return _maskMarkup.ConstructedResponse;
     }
   });
+  Object.defineProperty(exports, "Customizable", {
+    enumerable: true,
+    get: function get() {
+      return _maskMarkup.Customizable;
+    }
+  });
   Object.defineProperty(exports, "DragInTheBlank", {
     enumerable: true,
     get: function get() {
@@ -128123,26 +128158,26 @@ class Main extends React$1.Component {
   }
   static __initStatic() {
     this.propTypes = {
+      alwaysShowCorrect: PropTypes.bool,
+      animationsDisabled: PropTypes.bool,
       classes: PropTypes.object.isRequired,
-      prompt: PropTypes.string,
-      note: PropTypes.string,
-      showNote: PropTypes.bool,
-      env: PropTypes.object,
-      rationale: PropTypes.string,
       disabled: PropTypes.bool,
       displayType: PropTypes.string,
-      markup: PropTypes.string,
-      mode: PropTypes.string,
-      teacherInstructions: PropTypes.string,
-      value: PropTypes.object,
       feedback: PropTypes.object,
-      onChange: PropTypes.func,
-      alwaysShowCorrect: PropTypes.bool,
-      animationsDisabled: PropTypes.bool,
+      language: PropTypes.string,
+      markup: PropTypes.string,
       maxLengthPerChoice: PropTypes.array,
       maxLengthPerChoiceEnabled: PropTypes.bool,
+      mode: PropTypes.string,
+      note: PropTypes.string,
+      onChange: PropTypes.func,
       playerSpellCheckEnabled: PropTypes.bool,
-      language: PropTypes.string
+      prompt: PropTypes.string,
+      rationale: PropTypes.string,
+      role: PropTypes.string,
+      showNote: PropTypes.bool,
+      teacherInstructions: PropTypes.string,
+      value: PropTypes.object
     };
   }
   static __initStatic2() {
@@ -128205,8 +128240,7 @@ class Main extends React$1.Component {
   }
   render() {
     const {showCorrectAnswer, value} = this.state;
-    const {classes, mode, prompt, rationale, teacherInstructions, note, showNote, env, animationsDisabled, alwaysShowCorrect, maxLengthPerChoice, maxLengthPerChoiceEnabled, displayType, playerSpellCheckEnabled, language} = this.props;
-    const {role} = env || ({});
+    const {alwaysShowCorrect, animationsDisabled, classes, mode, displayType, role, language, maxLengthPerChoice, maxLengthPerChoiceEnabled, note, playerSpellCheckEnabled, prompt, rationale, showNote, teacherInstructions} = this.props;
     const displayNote = (showCorrectAnswer || mode === 'view' && role === 'instructor') && showNote && note;
     const mainClasses = classNames([classes.mainContainer, {
       [classes.noBorderColor]: alwaysShowCorrect
@@ -128217,7 +128251,7 @@ class Main extends React$1.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 121
+        lineNumber: 122
       }
     });
     const rationaleDiv = React$1.createElement(PreviewPrompt, {
@@ -128225,7 +128259,7 @@ class Main extends React$1.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 124
+        lineNumber: 125
       }
     });
     return React$1.createElement('div', {
@@ -128236,21 +128270,21 @@ class Main extends React$1.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 127
+        lineNumber: 128
       }
     }, mode === 'gather' && React$1.createElement('h2', {
       className: classes.srOnly,
       __self: this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 128
+        lineNumber: 129
       }
     }, "Fill in the Blank Question"), teacherInstructions && hasText(teacherInstructions) && React$1.createElement('div', {
       className: classes.collapsible,
       __self: this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 131
+        lineNumber: 132
       }
     }, !animationsDisabled ? React$1.createElement(Collapsible, {
       labels: {
@@ -128260,14 +128294,14 @@ class Main extends React$1.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 133
+        lineNumber: 134
       }
     }, teacherInstructionsDiv) : teacherInstructionsDiv), prompt && React$1.createElement(PreviewPrompt, {
       prompt: prompt,
       __self: this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 142
+        lineNumber: 143
       }
     }), !alwaysShowCorrect && React$1.createElement(CorrectAnswerToggle, {
       show: mode === 'evaluate',
@@ -128277,7 +128311,7 @@ class Main extends React$1.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 145
+        lineNumber: 146
       }
     }), React$1.createElement(maskMarkup$1.ConstructedResponse, {
       ...this.props,
@@ -128290,7 +128324,7 @@ class Main extends React$1.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 153
+        lineNumber: 154
       }
     }), displayNote && React$1.createElement('div', {
       className: classNames(classes.note, 'note'),
@@ -128307,7 +128341,7 @@ class Main extends React$1.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 171
+        lineNumber: 167
       }
     }, !animationsDisabled ? React$1.createElement(Collapsible, {
       labels: {
@@ -128317,7 +128351,7 @@ class Main extends React$1.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 173
+        lineNumber: 169
       }
     }, rationaleDiv) : rationaleDiv));
   }
@@ -128384,24 +128418,24 @@ class InlineDropdown extends HTMLElement {
     this._render = () => {
       if (this._model && this._session) {
         let elem = React.createElement(Main$1, {
-          teacherInstructions: this._model.teacherInstructions,
-          prompt: this._model.prompt,
-          note: this._model.note,
-          showNote: this._model.showNote,
-          env: this._model.env,
-          rationale: this._model.rationale,
-          disabled: this._model.disabled,
           choices: this._model.choices,
+          disabled: this._model.disabled,
+          displayType: this._model.displayType,
+          feedback: this._model.feedback,
+          language: this._model.language,
           markup: this._model.markup,
-          mode: this._model.mode,
           maxLengthPerChoice: this._model.maxLengthPerChoice,
           maxLengthPerChoiceEnabled: this._model.maxLengthPerChoiceEnabled,
+          mode: this._model.mode,
+          note: this._model.note,
+          onChange: this.changeSession,
           playerSpellCheckEnabled: this._model.playerSpellCheckEnabled,
-          value: this._session.value,
-          feedback: this._model.feedback,
-          displayType: this._model.displayType,
-          language: this._model.language,
-          onChange: this.changeSession
+          prompt: this._model.prompt,
+          rationale: this._model.rationale,
+          role: this._model.role,
+          showNote: this._model.showNote,
+          teacherInstructions: this._model.teacherInstructions,
+          value: this._session.value
         });
         ReactDOM.render(elem, this, () => {
           renderMath(this);

package/module/index.html

@@ -2,7 +2,7 @@
   <!doctype html>
   <html>
     <head>
-      <title>@pie-element/explicit-constructed-response@6.12.5</title>
+      <title>@pie-element/explicit-constructed-response@6.12.7</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

@@ -1,10 +1,10 @@
 {
   "name": "@pie-element/explicit-constructed-response",
-  "version": "6.12.5",
+  "version": "6.12.7",
   "modules": [
     {
       "name": "@pie-lib/pie-toolbox-math-rendering-module",
-      "version": "1.10.4"
+      "version": "1.12.0"
     },
     {
       "name": "@pie-lib/pie-toolbox-module",

package/module/print.html

@@ -2,7 +2,7 @@
   <!doctype html>
   <html>
     <head>
-      <title>@pie-element/explicit-constructed-response@6.12.5</title>
+      <title>@pie-element/explicit-constructed-response@6.12.7</title>
       <link
         href="https://fonts.googleapis.com/css?family=Roboto&display=swap"
         rel="stylesheet"