@pie-element/complex-rubric 3.4.10-next.6 → 3.5.0

package/module/configure.js

@@ -1,6 +1,6 @@
-import {_dll_react, _dll_prop_types, _dll_classnames, _dll_react_dom, _dll_debug, _dll_lodash, _dll_react_dom_server, _dll_pie_framework__mathquill} from "../../../@pie-lib/pie-toolbox-math-rendering-module@3.4.2/module/index.js";
+import {_dll_react, _dll_prop_types, _dll_classnames, _dll_react_dom, _dll_debug, _dll_lodash, _dll_react_dom_server, _dll_pie_framework__mathquill} from "../../../@pie-lib/pie-toolbox-math-rendering-module@3.4.3/module/index.js";
 import RubricConfigure from '@pie-element/rubric/configure/lib';
-import {_dll_pie_lib__pie_toolbox_editable_html, _dll_pie_lib__pie_toolbox_render_ui, _dll_pie_lib__pie_toolbox_config_ui} from "../../../@pie-lib/pie-toolbox-module@5.11.2/module/index.js";
+import {_dll_pie_lib__pie_toolbox_editable_html, _dll_pie_lib__pie_toolbox_render_ui, _dll_pie_lib__pie_toolbox_config_ui} from "../../../@pie-lib/pie-toolbox-module@5.11.3/module/index.js";
 function _mergeNamespaces(n, m) {
   m.forEach(function (e) {
     e && typeof e !== 'string' && !Array.isArray(e) && Object.keys(e).forEach(function (k) {
@@ -39515,16 +39515,16 @@ Transition.ENTERED = 3;
 Transition.EXITING = 4;
 var _default$32 = (0, _reactLifecyclesCompat.polyfill)(Transition);
 Transition$1.default = _default$32;
-var utils$8 = {};
-Object.defineProperty(utils$8, "__esModule", {
+var utils$9 = {};
+Object.defineProperty(utils$9, "__esModule", {
   value: true
 });
-utils$8.getTransitionProps = getTransitionProps;
-utils$8.reflow = void 0;
+utils$9.getTransitionProps = getTransitionProps;
+utils$9.reflow = void 0;
 var reflow = function reflow(node) {
   return node.scrollTop;
 };
-utils$8.reflow = reflow;
+utils$9.reflow = reflow;
 function getTransitionProps(props, options) {
   var timeout = props.timeout, _props$style = props.style, style = _props$style === void 0 ? {} : _props$style;
   return {
@@ -39551,7 +39551,7 @@ var _propTypes$1_ = _interopRequireDefault$3A(require$$9$Y);
 var _Transition$6 = _interopRequireDefault$3A(Transition$1);
 var _transitions$7 = transitions$1;
 var _withTheme$6 = _interopRequireDefault$3A(withTheme);
-var _utils$1G = utils$8;
+var _utils$1G = utils$9;
 var styles$1I = {
   entering: {
     opacity: 1
@@ -40089,7 +40089,7 @@ var _react$2O = _interopRequireDefault$3x(require$$8$D);
 var _propTypes$1X = _interopRequireDefault$3x(require$$9$X);
 var _Transition$5 = _interopRequireDefault$3x(Transition$1);
 var _withTheme$5 = _interopRequireDefault$3x(withTheme);
-var _utils$1E = utils$8;
+var _utils$1E = utils$9;
 function getScale(value) {
   return ("scale(").concat(value, ", ").concat(Math.pow(value, 2), ")");
 }
@@ -41882,7 +41882,7 @@ var _Transition$3 = _interopRequireDefault$3r(Transition$1);
 var _utils$1B = require$$13$h;
 var _withStyles$1r = _interopRequireDefault$3r(withStyles);
 var _transitions$6 = transitions$1;
-var _utils2$3 = utils$8;
+var _utils2$3 = utils$9;
 var styles$1B = function styles(theme) {
   return {
     container: {
@@ -126352,13 +126352,13 @@ InputLabel$1.default = _default$2B;
 var index$1y = getDefaultExportFromCjs(InputLabel$2);
 var FormControl$2 = {};
 var FormControl$1 = {};
-var utils$7 = {};
-Object.defineProperty(utils$7, "__esModule", {
+var utils$8 = {};
+Object.defineProperty(utils$8, "__esModule", {
   value: true
 });
-utils$7.hasValue = hasValue;
-utils$7.isFilled = isFilled;
-utils$7.isAdornedStart = isAdornedStart;
+utils$8.hasValue = hasValue;
+utils$8.isFilled = isFilled;
+utils$8.isAdornedStart = isAdornedStart;
 function hasValue(value) {
   return value != null && !(Array.isArray(value) && value.length === 0);
 }
@@ -126389,7 +126389,7 @@ var _react$2u = _interopRequireDefault$34(require$$9$P);
 var _propTypes$1K = _interopRequireDefault$34(require$$10$M);
 var _classnames$1l = _interopRequireDefault$34(require$$11$H);
 var _utils$1u = require$$13$h;
-var _utils2$2 = utils$7;
+var _utils2$2 = utils$8;
 var _withStyles$1k = _interopRequireDefault$34(withStyles);
 var _helpers$r = helpers;
 var _reactHelpers$9 = reactHelpers;
@@ -131339,7 +131339,7 @@ var _classnames$1g = _interopRequireDefault$2S(require$$13$c);
 var _warning$f = _interopRequireDefault$2S(warning_1);
 var _utils$1p = require$$13$h;
 var _Menu = _interopRequireDefault$2S(Menu$1);
-var _utils2$1 = utils$7;
+var _utils2$1 = utils$8;
 var _reactHelpers$7 = reactHelpers;
 function areEqualValues(a, b) {
   if ((0, _typeof2.default)(b) === 'object' && b !== null) {
@@ -131871,7 +131871,7 @@ var _withFormControlContext$6 = _interopRequireDefault$2P(withFormControlContext
 var _withStyles$1d = _interopRequireDefault$2P(withStyles);
 var _reactHelpers$5 = reactHelpers;
 var _Textarea = _interopRequireDefault$2P(Textarea$1);
-var _utils2 = utils$7;
+var _utils2 = utils$8;
 var styles$1n = function styles(theme) {
   var light = theme.palette.type === 'light';
   var placeholder = {
@@ -132668,17 +132668,17 @@ Select$1.default = _default$2g;
   var _Select = _interopRequireDefault(Select$1);
 })(Select$2);
 var index$1o = getDefaultExportFromCjs(Select$2);
-var utils$6 = {};
+var utils$7 = {};
 const require$$0$3 = _dll_pie_lib__pie_toolbox_editable_html;
-Object.defineProperty(utils$6, "__esModule", {
+Object.defineProperty(utils$7, "__esModule", {
   value: true
 });
-utils$6.filteredDefaultPlugins = void 0;
+utils$7.filteredDefaultPlugins = void 0;
 var _editableHtml$1 = require$$0$3;
 var filteredDefaultPlugins = (_editableHtml$1.DEFAULT_PLUGINS || []).filter(function (p) {
   return p !== 'table' && p !== 'bulleted-list' && p !== 'numbered-list';
 });
-utils$6.filteredDefaultPlugins = filteredDefaultPlugins;
+utils$7.filteredDefaultPlugins = filteredDefaultPlugins;
 const require$$1$U = _dll_react;
 const require$$2$p = _dll_classnames;
 const require$$4$17 = _dll_pie_lib__pie_toolbox_editable_html;
@@ -132699,7 +132699,7 @@ var _MenuItem$1 = _interopRequireDefault$2K(MenuItem$2);
 var _InputBase$3 = _interopRequireDefault$2K(InputBase$2);
 var _renderUi$2 = require$$10$G;
 var _grey = _interopRequireDefault$2K(grey$1);
-var _utils$1j = utils$6;
+var _utils$1j = utils$7;
 var BlockWidth = 200;
 common.BlockWidth = BlockWidth;
 var PrimaryBlockWidth = 200;
@@ -134436,6 +134436,9 @@ var defaults$1 = {};
         },
         textAlign: {
           disabled: true
+        },
+        showParagraphs: {
+          disabled: false
         }
       },
       expandedInput: {
@@ -155803,7 +155806,7 @@ var _Transition$1 = _interopRequireDefault$2b(Transition$1);
 var _ownerWindow = _interopRequireDefault$2b(ownerWindow$1);
 var _withTheme$4 = _interopRequireDefault$2b(withTheme);
 var _transitions$4 = transitions$1;
-var _utils$15 = utils$8;
+var _utils$15 = utils$9;
 var GUTTER = 24;
 function getTranslateValue(props, node) {
   var direction = props.direction;
@@ -162143,7 +162146,7 @@ var _reactDom$2 = _interopRequireDefault$1v(require$$12$i);
 var _Drawer = _interopRequireWildcard$4(Drawer$1);
 var _transitions$1 = transitions$1;
 var _withTheme$2 = _interopRequireDefault$1v(withTheme);
-var _utils$R = utils$8;
+var _utils$R = utils$9;
 var _NoSsr = _interopRequireDefault$1v(NoSsr$2);
 var _SwipeArea = _interopRequireDefault$1v(SwipeArea$1);
 var UNCERTAINTY_THRESHOLD = 3;
@@ -165164,7 +165167,7 @@ var _propTypes$5 = _interopRequireDefault$16(require$$9$k);
 var _Transition = _interopRequireDefault$16(Transition$1);
 var _transitions = transitions$1;
 var _withTheme = _interopRequireDefault$16(withTheme);
-var _utils$G = utils$8;
+var _utils$G = utils$9;
 var styles$5 = {
   entering: {
     transform: 'scale(1)'
@@ -167410,13 +167413,13 @@ var greaterThanEqual = set$f({
 });
 comparison$2.greaterThanEqual = greaterThanEqual;
 var vars$1 = {};
-var utils$5 = {};
+var utils$6 = {};
 const require$$3$i = _dll_lodash;
 var _interopRequireDefault$11 = interopRequireDefault.exports;
-Object.defineProperty(utils$5, "__esModule", {
+Object.defineProperty(utils$6, "__esModule", {
   value: true
 });
-utils$5.transformToKeySetStructure = utils$5.toKey = utils$5.toArray = utils$5.mkSet = utils$5.extendKeySet = void 0;
+utils$6.transformToKeySetStructure = utils$6.toKey = utils$6.toArray = utils$6.mkSet = utils$6.extendKeySet = void 0;
 var _toConsumableArray2$2 = _interopRequireDefault$11(toConsumableArray$3.exports);
 var _defineProperty2$7 = _interopRequireDefault$11(defineProperty$5.exports);
 var _lodash = _interopRequireDefault$11(require$$3$i);
@@ -167448,13 +167451,13 @@ var mkSet = function mkSet(category) {
     });
   };
 };
-utils$5.mkSet = mkSet;
+utils$6.mkSet = mkSet;
 var toArray = function toArray(o) {
   return Object.keys(o).map(function (k) {
     return o[k];
   });
 };
-utils$5.toArray = toArray;
+utils$6.toArray = toArray;
 var toKey = function toKey(category) {
   return function (v) {
     if (typeof v === 'string') {
@@ -167471,7 +167474,7 @@ var toKey = function toKey(category) {
     }
   };
 };
-utils$5.toKey = toKey;
+utils$6.toKey = toKey;
 var transformToKeySetStructure = function transformToKeySetStructure() {
   var data = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
   var structure = [];
@@ -167489,7 +167492,7 @@ var transformToKeySetStructure = function transformToKeySetStructure() {
   }
   return structure;
 };
-utils$5.transformToKeySetStructure = transformToKeySetStructure;
+utils$6.transformToKeySetStructure = transformToKeySetStructure;
 var latexAndNameDontExist = function latexAndNameDontExist(base) {
   return function (k) {
     var flattened = _lodash["default"].flatten(base);
@@ -167519,12 +167522,12 @@ var extendKeySet = function extendKeySet() {
   }
   return _final;
 };
-utils$5.extendKeySet = extendKeySet;
+utils$6.extendKeySet = extendKeySet;
 Object.defineProperty(vars$1, "__esModule", {
   value: true
 });
 vars$1.y = vars$1.x = vars$1.theta = void 0;
-var _utils$F = utils$5;
+var _utils$F = utils$6;
 var set$e = (0, _utils$F.mkSet)('vars');
 var x$1 = set$e({
   name: 'X',
@@ -167549,7 +167552,7 @@ Object.defineProperty(fractions$2, "__esModule", {
   value: true
 });
 fractions$2.xOverBlank = fractions$2.xBlankBlank = fractions$2.blankOverBlank = void 0;
-var _utils$E = utils$5;
+var _utils$E = utils$6;
 var set$d = (0, _utils$E.mkSet)('fractions');
 var blankOverBlank = set$d({
   name: 'blank/blank',
@@ -167579,7 +167582,7 @@ Object.defineProperty(exponent$2, "__esModule", {
   value: true
 });
 exponent$2.xToPowerOfN = exponent$2.squared = exponent$2.squareRoot = exponent$2.nthRoot = void 0;
-var _utils$D = utils$5;
+var _utils$D = utils$6;
 var set$c = (0, _utils$D.mkSet)('exponent');
 var squared = set$c({
   name: 'Squared',
@@ -167611,7 +167614,7 @@ Object.defineProperty(misc$2, "__esModule", {
   value: true
 });
 misc$2.similar = misc$2.plusMinus = misc$2.percentage = misc$2.parenthesis = misc$2.notSimilar = misc$2.notEqual = misc$2.nApprox = misc$2.brackets = misc$2.approx = misc$2.absValue = void 0;
-var _utils$C = utils$5;
+var _utils$C = utils$6;
 var set$b = (0, _utils$C.mkSet)('misc');
 var plusMinus = set$b({
   name: 'Plus or Minus',
@@ -167681,7 +167684,7 @@ Object.defineProperty(constants$2, "__esModule", {
   value: true
 });
 constants$2.pi = constants$2.infinity = constants$2.halfInfinity = constants$2.eulers = void 0;
-var _utils$B = utils$5;
+var _utils$B = utils$6;
 var set$a = (0, _utils$B.mkSet)('constants');
 var pi$2 = set$a({
   name: 'Pi',
@@ -167720,7 +167723,7 @@ Object.defineProperty(trigonometry$1, "__esModule", {
   value: true
 });
 trigonometry$1.tan = trigonometry$1.sin = trigonometry$1.sec = trigonometry$1.csc = trigonometry$1.cot = trigonometry$1.cos = void 0;
-var _utils$A = utils$5;
+var _utils$A = utils$6;
 var set$9 = (0, _utils$A.mkSet)('trigonometry');
 var sin$1 = set$9({
   name: 'sine',
@@ -167943,7 +167946,7 @@ Object.defineProperty(operators$1, "__esModule", {
   value: true
 });
 operators$1.circleDot = void 0;
-var _utils$z = utils$5;
+var _utils$z = utils$6;
 var set$7 = (0, _utils$z.mkSet)('operators');
 var circleDot = set$7({
   name: 'CircleDot',
@@ -167957,7 +167960,7 @@ Object.defineProperty(log$5, "__esModule", {
   value: true
 });
 log$5.logSubscript = log$5.log = log$5.ln = void 0;
-var _utils$y = utils$5;
+var _utils$y = utils$6;
 var set$6 = (0, _utils$y.mkSet)('log');
 var log$4 = set$6({
   name: 'Log',
@@ -167985,7 +167988,7 @@ Object.defineProperty(subSup$1, "__esModule", {
   value: true
 });
 subSup$1.superscript = subSup$1.subscript = void 0;
-var _utils$x = utils$5;
+var _utils$x = utils$6;
 var set$5 = (0, _utils$x.mkSet)('sub-sup');
 var superscript = set$5({
   name: 'Superscript',
@@ -168004,7 +168007,7 @@ Object.defineProperty(statistics$1, "__esModule", {
   value: true
 });
 statistics$1.yBar = statistics$1.xBar = statistics$1.smallSigma = statistics$1.sigma = statistics$1.mu = void 0;
-var _utils$w = utils$5;
+var _utils$w = utils$6;
 var set$4 = (0, _utils$w.mkSet)('statistics');
 var xBar = set$4({
   name: 'X Bar',
@@ -168063,7 +168066,7 @@ Object.defineProperty(basicOperators$1, "__esModule", {
 });
 basicOperators$1.plus = basicOperators$1.multiply = basicOperators$1.minus = basicOperators$1.equals = basicOperators$1.divide = void 0;
 var _chars$2 = chars;
-var _utils$v = utils$5;
+var _utils$v = utils$6;
 var set$3 = (0, _utils$v.mkSet)('operators');
 var equals = set$3({
   write: '=',
@@ -168098,7 +168101,7 @@ Object.defineProperty(matrices$1, "__esModule", {
   value: true
 });
 matrices$1.singleCellMatrix = matrices$1.doubleCellMatrix = void 0;
-var _utils$u = utils$5;
+var _utils$u = utils$6;
 var set$2 = (0, _utils$u.mkSet)('matrices');
 var singleCellMatrix = set$2({
   name: 'Single Cell Matrix',
@@ -168167,7 +168170,7 @@ Object.defineProperty(logic$1, "__esModule", {
   value: true
 });
 logic$1.therefore = logic$1.longDivision = void 0;
-var _utils$t = utils$5;
+var _utils$t = utils$6;
 var set$1 = (0, _utils$t.mkSet)('logic');
 var therefore = set$1({
   name: 'Therefore',
@@ -168187,7 +168190,7 @@ Object.defineProperty(navigation, "__esModule", {
 });
 navigation.right = navigation.left = void 0;
 var _chars$1 = chars;
-var _utils$s = utils$5;
+var _utils$s = utils$6;
 var set = (0, _utils$s.mkSet)('navigation');
 var left = set({
   label: _chars$1.LEFT_ARROW,
@@ -169650,7 +169653,7 @@ const require$$9$f = _dll_prop_types;
   var _react = _interopRequireDefault(require$$8$c);
   var _propTypes = _interopRequireDefault(require$$9$f);
   var _grades = grades;
-  var _utils = utils$5;
+  var _utils = utils$6;
   var _keypad = _interopRequireDefault(keypad);
   function _createSuper(Derived) {
     var hasNativeReflectConstruct = _isNativeReflectConstruct();
@@ -169842,6 +169845,22 @@ getDefaultExportFromCjs(horizontalKeypad);
   exports.removeBrackets = removeBrackets;
 })(mathInput);
 getDefaultExportFromCjs(mathInput);
+var utils$5 = {};
+Object.defineProperty(utils$5, "__esModule", {
+  value: true
+});
+utils$5.markFractionBaseSuperscripts = void 0;
+var markFractionBaseSuperscripts = function markFractionBaseSuperscripts() {
+  document.querySelectorAll('.mq-supsub.mq-sup-only').forEach(function (supsub) {
+    var prev = supsub.previousElementSibling;
+    if (prev && prev.classList.contains('mq-non-leaf') && prev.querySelector('.mq-fraction')) {
+      supsub.classList.add('mq-after-fraction-group');
+    } else {
+      supsub.classList.remove('mq-after-fraction-group');
+    }
+  });
+};
+utils$5.markFractionBaseSuperscripts = markFractionBaseSuperscripts;
 const require$$9$e = _dll_react;
 const require$$10$i = _dll_debug;
 const require$$11$i = _dll_prop_types;
@@ -169871,6 +169890,7 @@ const {isEqual: require$$18$3} = _dll_lodash;
   var _MenuItem = _interopRequireDefault(MenuItem$2);
   var _Select = _interopRequireDefault(Select$2);
   var _isEqual = _interopRequireDefault(require$$18$3);
+  var _utils = utils$5;
   function _createSuper(Derived) {
     var hasNativeReflectConstruct = _isNativeReflectConstruct();
     return function _createSuperInternal() {
@@ -169993,6 +170013,7 @@ const {isEqual: require$$18$3} = _dll_lodash;
       (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "onEditorChange", function (latex) {
         var _this$props2 = _this.props, onChange = _this$props2.onChange, noDecimal = _this$props2.noDecimal;
         (0, _mathInput.updateSpans)();
+        (0, _utils.markFractionBaseSuperscripts)();
         _this.updateDisable(true);
         if (noDecimal && (latex.indexOf('.') !== -1 || latex.indexOf(',') !== -1) && _this.input) {
           _this.input.clear();
@@ -170285,6 +170306,12 @@ const {isEqual: require$$18$3} = _dll_lodash;
               marginBottom: '0px !important'
             }
           },
+          '& .mq-math-mode .mq-fraction + .mq-supsub.mq-sup-only': {
+            verticalAlign: '0.4em !important'
+          },
+          '& .mq-math-mode .mq-supsub.mq-sup-only.mq-after-fraction-group': {
+            verticalAlign: '0.4em !important'
+          },
           '& .mq-math-mode .mq-denominator': {
             marginTop: '-5px !important',
             padding: '0.5em 0.1em 0.1em !important'
@@ -170547,6 +170574,7 @@ const require$$11$h = _dll_prop_types;
   var _styles = styles$1J;
   var _propTypes = _interopRequireDefault(require$$11$h);
   var _mathInput = mathInput;
+  var _utils = utils$5;
   function _createSuper(Derived) {
     var hasNativeReflectConstruct = _isNativeReflectConstruct();
     return function _createSuperInternal() {
@@ -170580,6 +170608,18 @@ const require$$11$h = _dll_prop_types;
       return _super.apply(this, arguments);
     }
     (0, _createClass2["default"])(RawMathPreview, [{
+      key: "componentDidMount",
+      value: function componentDidMount() {
+        (0, _utils.markFractionBaseSuperscripts)();
+      }
+    }, {
+      key: "componentDidUpdate",
+      value: function componentDidUpdate(prevProps) {
+        if (this.props.node.data.get('latex') !== prevProps.node.data.get('latex')) {
+          (0, _utils.markFractionBaseSuperscripts)();
+        }
+      }
+    }, {
       key: "render",
       value: function render() {
         log('[render] data: ', this.props.node.data);
@@ -170707,6 +170747,12 @@ const require$$11$h = _dll_prop_types;
             marginBottom: '0px !important'
           }
         },
+        '& .mq-math-mode .mq-fraction + .mq-supsub.mq-sup-only': {
+          verticalAlign: '0.4em !important'
+        },
+        '& .mq-math-mode .mq-supsub.mq-sup-only.mq-after-fraction-group': {
+          verticalAlign: '0.4em !important'
+        },
         '& .mq-overarrow-inner': {
           paddingTop: '0 !important',
           border: 'none !important'
@@ -177554,7 +177600,7 @@ var _interopRequireDefault$i = interopRequireDefault.exports;
 Object.defineProperty(serialization, "__esModule", {
   value: true
 });
-serialization.valueToHtml = serialization.reduceMultipleBrs = serialization.reactAttributes = serialization.parseStyleString = serialization.htmlToValue = serialization.getBase64 = serialization.extraCSSRulesOpts = serialization.TEXT_RULE = serialization.INLINE_TAGS = void 0;
+serialization.valueToHtml = serialization.reduceMultipleBrs = serialization.reactAttributes = serialization.parseStyleString = serialization.htmlToValue = serialization.handleHtml = serialization.getBase64 = serialization.extraCSSRulesOpts = serialization.TEXT_RULE = serialization.INLINE_TAGS = void 0;
 var _defineProperty2$3 = _interopRequireDefault$i(defineProperty$5.exports);
 var _slateHtmlSerializer = _interopRequireDefault$i(require$$2$h);
 var _react$h = _interopRequireDefault$i(require$$3$a);
@@ -178029,9 +178075,13 @@ var fixHtmlCode = function fixHtmlCode(markup) {
   parseNode(wrapperEl);
   return wrapperEl.innerHTML;
 };
+var handleHtml = function handleHtml(html) {
+  return fixHtmlCode(reduceRedundantNewLineCharacters(reduceMultipleBrs(html)));
+};
+serialization.handleHtml = handleHtml;
 var htmlToValue = function htmlToValue(html) {
   try {
-    return serializer.deserialize(fixHtmlCode(reduceRedundantNewLineCharacters(reduceMultipleBrs(html))));
+    return serializer.deserialize(handleHtml(html));
   } catch (e) {
     console.log("Couldn't parse html: ", e);
     return {};
@@ -180737,7 +180787,7 @@ const require$$21 = _dll_debug;
   exports.serialization = serialization$1;
   var _insertImageHandler = _interopRequireDefault(insertImageHandler);
   var _plugins = plugins;
-  var _excluded = ["customPlugins"];
+  var _excluded = ["customPlugins", "showParagraphs"];
   function _getRequireWildcardCache(nodeInterop) {
     if (typeof WeakMap !== "function") return null;
     var cacheBabelInterop = new WeakMap();
@@ -181587,11 +181637,13 @@ const require$$21 = _dll_debug;
     }, {
       key: "render",
       value: function render() {
-        var _classNames, _this4 = this, _value$document;
-        var _this$props2 = this.props, disabled = _this$props2.disabled, spellCheck = _this$props2.spellCheck, highlightShape = _this$props2.highlightShape, classes = _this$props2.classes, className = _this$props2.className, placeholder = _this$props2.placeholder, pluginProps = _this$props2.pluginProps, onKeyDown = _this$props2.onKeyDown;
+        var _classNames, _this4 = this, _value$document, _classNames2;
+        var _this$props2 = this.props, disabled = _this$props2.disabled, spellCheck = _this$props2.spellCheck, highlightShape = _this$props2.highlightShape, classes = _this$props2.classes, className = _this$props2.className;
+        _this$props2.isEditor;
+        var placeholder = _this$props2.placeholder, pluginProps = _this$props2.pluginProps, onKeyDown = _this$props2.onKeyDown;
         var _ref4 = pluginProps || ({});
         _ref4.customPlugins;
-        var otherPluginProps = (0, _objectWithoutProperties2["default"])(_ref4, _excluded);
+        var showParagraphs = _ref4.showParagraphs, otherPluginProps = (0, _objectWithoutProperties2["default"])(_ref4, _excluded);
         var _this$state4 = this.state, value = _this$state4.value, focusedNode = _this$state4.focusedNode, toolbarOpts = _this$state4.toolbarOpts, dialog = _this$state4.dialog, scheduled = _this$state4.scheduled;
         log('[render] value: ', value);
         var sizeStyle = this.buildSizeStyle();
@@ -181647,7 +181699,7 @@ const require$$21 = _dll_debug;
           readOnly: disabled,
           spellCheck: spellCheck,
           autoCorrect: spellCheck,
-          className: (0, _classnames["default"])((0, _defineProperty2["default"])({}, classes.noPadding, toolbarOpts === null || toolbarOpts === void 0 ? void 0 : toolbarOpts.noPadding), classes.slateEditor),
+          className: (0, _classnames["default"])((_classNames2 = {}, (0, _defineProperty2["default"])(_classNames2, classes.noPadding, toolbarOpts === null || toolbarOpts === void 0 ? void 0 : toolbarOpts.noPadding), (0, _defineProperty2["default"])(_classNames2, classes.showParagraph, showParagraphs && !showParagraphs.disabled), _classNames2), classes.slateEditor),
           style: {
             minHeight: sizeStyle.minHeight,
             height: sizeStyle.height,
@@ -181710,6 +181762,7 @@ const require$$21 = _dll_debug;
     autoWidthToolbar: _propTypes["default"].bool,
     pluginProps: _propTypes["default"].any,
     placeholder: _propTypes["default"].string,
+    isEditor: _propTypes["default"].bool,
     responseAreaProps: _propTypes["default"].shape({
       type: _propTypes["default"].oneOf(['explicit-constructed-response', 'inline-dropdown', 'drag-in-the-blank', 'math-templated']),
       options: _propTypes["default"].object,
@@ -181759,7 +181812,8 @@ const require$$21 = _dll_debug;
     toolbarOpts: defaultToolbarOpts,
     responseAreaProps: defaultResponseAreaProps,
     languageCharactersProps: defaultLanguageCharactersProps,
-    extraCSSRules: null
+    extraCSSRules: null,
+    isEditor: false
   });
   var styles = {
     withBg: {
@@ -181796,6 +181850,13 @@ const require$$21 = _dll_debug;
         border: '1px solid #dfe2e5'
       }
     },
+    showParagraph: {
+      '& > div:has(+ div)::after': {
+        display: 'block',
+        content: '"¶"',
+        color: '#146EB3'
+      }
+    },
     toolbarOnTop: {
       marginTop: '45px'
     },
@@ -181980,7 +182041,7 @@ const require$$15$2 = _dll_debug;
       });
       (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "onChange", function (value, done) {
         var html = (0, _serialization.valueToHtml)(value);
-        var htmlParsed = (0, _parseHtml.parseDegrees)(html);
+        var htmlParsed = (0, _serialization.handleHtml)((0, _parseHtml.parseDegrees)(html));
         if (html !== _this.props.markup && _this.props.onChange) {
           _this.props.onChange(htmlParsed);
         }
@@ -182042,7 +182103,7 @@ const require$$15$2 = _dll_debug;
           return;
         }
         var v = (0, _serialization.htmlToValue)(props.markup);
-        var current = (0, _serialization.htmlToValue)(props.markup);
+        var current = (0, _serialization.htmlToValue)(this.props.markup);
         if (v.equals && !v.equals(current)) {
           this.setState({
             value: v
@@ -255709,6 +255770,9 @@ const multiTraitDefaultConfiguration = {
     },
     textAlign: {
       disabled: true
+    },
+    showParagraphs: {
+      disabled: false
     }
   },
   expandedInput: {
@@ -255844,6 +255908,9 @@ const rubricDefaultConfiguration = {
     },
     textAlign: {
       disabled: true
+    },
+    showParagraphs: {
+      disabled: false
     }
   },
   showExcludeZero: {
@@ -255870,6 +255937,9 @@ const rubriclessDefaultConfiguration = {
     },
     textAlign: {
       disabled: true
+    },
+    showParagraphs: {
+      disabled: false
     }
   },
   showExcludeZero: {