@pie-element/math-inline 5.9.8 → 5.9.11

package/module/configure.js

@@ -1,7 +1,7 @@
-import {_dll_react, _dll_prop_types, _dll_material_ui__core, _dll_material_ui__core_styles, _dll_classnames, _dll_lodash, _dll_debug, _dll_react_dom} from "../../../@pie-lib/shared-module@^1.4.13/module/index.js";
-import {_dll_pie_lib__config_ui} from "../../../@pie-lib/config-module@^1.2.0/module/index.js";
-import {_dll_pie_lib__editable_html} from "../../../@pie-lib/editable-html-module@^1.5.0/module/index.js";
-import {_dll_pie_lib__math_toolbar, _dll_pie_framework__mathquill} from "../../../@pie-lib/math-edit-module@^1.2.0/module/index.js";
+import {_dll_react, _dll_prop_types, _dll_material_ui__core, _dll_material_ui__core_styles, _dll_classnames, _dll_lodash, _dll_material_ui__icons, _dll_debug, _dll_react_dom} from "../../../@pie-lib/shared-module@^1.4.19/module/index.js";
+import {_dll_pie_lib__config_ui} from "../../../@pie-lib/config-module@^1.3.1/module/index.js";
+import {_dll_pie_lib__editable_html} from "../../../@pie-lib/editable-html-module@^1.5.6/module/index.js";
+import {_dll_pie_lib__math_toolbar, _dll_pie_framework__mathquill} from "../../../@pie-lib/math-edit-module@^1.2.6/module/index.js";
 const React$3 = _dll_react;
 const PropTypes$2 = _dll_prop_types;
 const {Card: Card} = _dll_material_ui__core;
@@ -80,6 +80,11 @@ const styles$2 = theme => ({
   },
   configLabel: {
     marginRight: 'auto'
+  },
+  errorText: {
+    fontSize: '12px',
+    color: 'red',
+    padding: '5px 0'
   }
 });
 class Response extends React$3.Component {
@@ -252,7 +257,7 @@ class Response extends React$3.Component {
     };
   }
   render() {
-    const {classes, mode, defaultResponse, index, response, cAllowTrailingZeros, cIgnoreOrder} = this.props;
+    const {classes, mode, defaultResponse, index, response, cAllowTrailingZeros, cIgnoreOrder, error} = this.props;
     const {showKeypad} = this.state;
     const {validation, answer, alternates, ignoreOrder, allowTrailingZeros} = response;
     const hasAlternates = Object.keys(alternates || ({})).length > 0;
@@ -269,21 +274,21 @@ class Response extends React$3.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$2,
-        lineNumber: 271
+        lineNumber: 278
       }
     }, React$3.createElement(CardContent, {
       className: classes.cardContent,
       __self: this,
       __source: {
         fileName: _jsxFileName$2,
-        lineNumber: 272
+        lineNumber: 279
       }
     }, React$3.createElement('div', {
       className: classes.titleBar,
       __self: this,
       __source: {
         fileName: _jsxFileName$2,
-        lineNumber: 273
+        lineNumber: 280
       }
     }, React$3.createElement(Typography, {
       className: classes.title,
@@ -291,7 +296,7 @@ class Response extends React$3.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$2,
-        lineNumber: 274
+        lineNumber: 281
       }
     }, "Response", ' ', ''), React$3.createElement(InputContainer$2, {
       label: "Validation",
@@ -299,7 +304,7 @@ class Response extends React$3.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$2,
-        lineNumber: 282
+        lineNumber: 289
       }
     }, React$3.createElement(Select$1, {
       className: classes.select,
@@ -308,28 +313,28 @@ class Response extends React$3.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$2,
-        lineNumber: 286
+        lineNumber: 293
       }
     }, React$3.createElement(MenuItem$1, {
       value: "literal",
       __self: this,
       __source: {
         fileName: _jsxFileName$2,
-        lineNumber: 291
+        lineNumber: 298
       }
     }, "Literal Validation"), React$3.createElement(MenuItem$1, {
       value: "symbolic",
       __self: this,
       __source: {
         fileName: _jsxFileName$2,
-        lineNumber: 292
+        lineNumber: 299
       }
     }, "Symbolic Validation")))), validation === 'literal' && React$3.createElement('div', {
       className: classes.flexContainer,
       __self: this,
       __source: {
         fileName: _jsxFileName$2,
-        lineNumber: 297
+        lineNumber: 304
       }
     }, cAllowTrailingZeros.enabled && React$3.createElement(FormControlLabel, {
       label: cAllowTrailingZeros.label,
@@ -339,13 +344,13 @@ class Response extends React$3.Component {
         __self: this,
         __source: {
           fileName: _jsxFileName$2,
-          lineNumber: 302
+          lineNumber: 309
         }
       }),
       __self: this,
       __source: {
         fileName: _jsxFileName$2,
-        lineNumber: 299
+        lineNumber: 306
       }
     }), cIgnoreOrder.enabled && React$3.createElement(FormControlLabel, {
       label: cIgnoreOrder.label,
@@ -355,26 +360,26 @@ class Response extends React$3.Component {
         __self: this,
         __source: {
           fileName: _jsxFileName$2,
-          lineNumber: 316
+          lineNumber: 323
         }
       }),
       __self: this,
       __source: {
         fileName: _jsxFileName$2,
-        lineNumber: 313
+        lineNumber: 320
       }
     })), React$3.createElement('div', {
       className: classes.inputContainer,
       __self: this,
       __source: {
         fileName: _jsxFileName$2,
-        lineNumber: 325
+        lineNumber: 332
       }
     }, React$3.createElement(InputLabel$1, {
       __self: this,
       __source: {
         fileName: _jsxFileName$2,
-        lineNumber: 326
+        lineNumber: 333
       }
     }, "Correct Answer"), React$3.createElement(MathToolbar$1, {
       keypadMode: mode,
@@ -385,31 +390,39 @@ class Response extends React$3.Component {
       onChange: this.onAnswerChange,
       onFocus: this.onFocus,
       onDone: this.onDone,
+      error: error && error.answer,
+      __self: this,
+      __source: {
+        fileName: _jsxFileName$2,
+        lineNumber: 334
+      }
+    }), error && error.answer ? React$3.createElement('div', {
+      className: classes.errorText,
       __self: this,
       __source: {
         fileName: _jsxFileName$2,
-        lineNumber: 327
+        lineNumber: 345
       }
-    })), hasAlternates && Object.keys(alternates).map((alternateId, altIdx) => React$3.createElement('div', {
+    }, error.answer) : null), hasAlternates && Object.keys(alternates).map((alternateId, altIdx) => React$3.createElement('div', {
       className: classes.inputContainer,
       key: alternateId,
       __self: this,
       __source: {
         fileName: _jsxFileName$2,
-        lineNumber: 340
+        lineNumber: 349
       }
     }, React$3.createElement('div', {
       className: classes.alternateBar,
       __self: this,
       __source: {
         fileName: _jsxFileName$2,
-        lineNumber: 341
+        lineNumber: 350
       }
     }, React$3.createElement(InputLabel$1, {
       __self: this,
       __source: {
         fileName: _jsxFileName$2,
-        lineNumber: 342
+        lineNumber: 351
       }
     }, "Alternate", Object.keys(alternates).length > 1 ? ` ${altIdx + 1}` : ''), React$3.createElement(Button, {
       className: classes.removeAlternateButton,
@@ -418,7 +431,7 @@ class Response extends React$3.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$2,
-        lineNumber: 346
+        lineNumber: 355
       }
     }, "Remove")), React$3.createElement(MathToolbar$1, {
       classNames: classNames,
@@ -429,17 +442,25 @@ class Response extends React$3.Component {
       onChange: this.onAlternateAnswerChange(alternateId),
       onFocus: this.onAlternateFocus(alternateId),
       onDone: this.onAlternateDone(alternateId),
+      error: error && error[altIdx + 1],
+      __self: this,
+      __source: {
+        fileName: _jsxFileName$2,
+        lineNumber: 363
+      }
+    }), error && error[altIdx + 1] ? React$3.createElement('div', {
+      className: classes.errorText,
       __self: this,
       __source: {
         fileName: _jsxFileName$2,
-        lineNumber: 354
+        lineNumber: 374
       }
-    }))), React$3.createElement('div', {
+    }, error[altIdx + 1]) : null)), React$3.createElement('div', {
       className: classes.configPanel,
       __self: this,
       __source: {
         fileName: _jsxFileName$2,
-        lineNumber: 366
+        lineNumber: 377
       }
     }, React$3.createElement(Button, {
       className: classes.alternateButton,
@@ -448,14 +469,14 @@ class Response extends React$3.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$2,
-        lineNumber: 367
+        lineNumber: 378
       }
     }, "ADD ALTERNATE"), React$3.createElement('div', {
       className: classes.checkboxContainer,
       __self: this,
       __source: {
         fileName: _jsxFileName$2,
-        lineNumber: 374
+        lineNumber: 385
       }
     }))));
   }
@@ -467,6 +488,16 @@ const ResponseTypes = {
   advanced: 'Advanced Multi',
   simple: 'Simple'
 };
+const generateValidationMessage = (model = {}, config = {}) => {
+  const {maxResponseAreas} = config;
+  const {responseType} = model;
+  let responseAreasMessage = '';
+  const answersMessage = '\nAll correct answers (the primary and any alternates) should not be empty and should be unique.';
+  if (responseType === 'Advanced Multi') {
+    responseAreasMessage = '\nThere should be at least 1 ' + (maxResponseAreas ? `and at most ${maxResponseAreas} ` : '') + 'response area' + (maxResponseAreas ? 's' : '') + ' defined.';
+  }
+  return 'Validation requirements:' + answersMessage + responseAreasMessage;
+};
 const React$2 = _dll_react;
 const PropTypes$1 = _dll_prop_types;
 const cx = _dll_classnames;
@@ -474,7 +505,9 @@ const {withStyles: withStyles$1} = _dll_material_ui__core_styles;
 const {InputLabel: InputLabel} = _dll_material_ui__core;
 const {Select: Select} = _dll_material_ui__core;
 const {MenuItem: MenuItem} = _dll_material_ui__core;
+const {Tooltip: Tooltip} = _dll_material_ui__core;
 const {isEqual: isEqual} = _dll_lodash;
+const {Info: Info} = _dll_material_ui__icons;
 const EditableHtml$1 = _dll_pie_lib__editable_html;
 const {InputContainer: InputContainer$1} = _dll_pie_lib__config_ui;
 const {MathToolbar: MathToolbar} = _dll_pie_lib__math_toolbar;
@@ -570,6 +603,16 @@ const styles$1 = theme => ({
         }
       }
     }
+  },
+  tooltip: {
+    fontSize: '12px',
+    whiteSpace: 'pre',
+    maxWidth: '500px'
+  },
+  errorText: {
+    fontSize: '12px',
+    color: 'red',
+    padding: '5px 0'
   }
 });
 const REGEX = /{{response}}/gm;
@@ -756,8 +799,10 @@ class GeneralConfigBlock extends React$2.Component {
   render() {
     const {classes, model, imageSupport, configuration, promptEnabled, rationaleEnabled, toolbarOpts} = this.props;
     const {showKeypad} = this.state;
-    const {prompt, expression, equationEditor, promptEquationEditor = '8', responses, responseType, rationale, spellCheckEnabled} = model;
-    const {rationale: cRationale = {}, prompt: cPrompt = {}, ignoreOrder: cIgnoreOrder = {}, allowTrailingZeros: cAllowTrailingZeros = {}} = configuration || ({});
+    const {prompt, expression, equationEditor, promptEquationEditor = '8', responses, responseType, rationale, spellCheckEnabled, errors = {}} = model;
+    const {rationale: cRationale = {}, prompt: cPrompt = {}, ignoreOrder: cIgnoreOrder = {}, allowTrailingZeros: cAllowTrailingZeros = {}, maxResponseAreas} = configuration || ({});
+    const validationMessage = generateValidationMessage(configuration, model);
+    const {responsesErrors, responseAreasError} = errors;
     const classNames = {
       editor: classes.responseEditor,
       mathToolbar: classes.mathToolbar
@@ -769,7 +814,7 @@ class GeneralConfigBlock extends React$2.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 357
+        lineNumber: 372
       }
     }, promptEnabled && React$2.createElement(InputContainer$1, {
       label: cPrompt.label,
@@ -777,7 +822,7 @@ class GeneralConfigBlock extends React$2.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 362
+        lineNumber: 377
       }
     }, React$2.createElement(EditableHtml$1, {
       onFocus: this.onPromptFocus,
@@ -791,7 +836,7 @@ class GeneralConfigBlock extends React$2.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 363
+        lineNumber: 378
       }
     })), rationaleEnabled && React$2.createElement(InputContainer$1, {
       label: cRationale.label,
@@ -799,7 +844,7 @@ class GeneralConfigBlock extends React$2.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 376
+        lineNumber: 391
       }
     }, React$2.createElement(EditableHtml$1, {
       className: classes.prompt,
@@ -817,16 +862,63 @@ class GeneralConfigBlock extends React$2.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 380
+        lineNumber: 395
+      }
+    })), React$2.createElement('div', {
+      className: classes.flexContainer,
+      style: {
+        justifyContent: 'flex-start'
+      },
+      __self: this,
+      __source: {
+        fileName: _jsxFileName$1,
+        lineNumber: 411
+      }
+    }, React$2.createElement('h3', {
+      __self: this,
+      __source: {
+        fileName: _jsxFileName$1,
+        lineNumber: 412
       }
-    })), responseType === ResponseTypes.advanced && [React$2.createElement(InputContainer$1, {
+    }, "Define Response"), React$2.createElement(Tooltip, {
+      classes: {
+        tooltip: classes.tooltip
+      },
+      disableFocusListener: true,
+      disableTouchListener: true,
+      placement: 'right',
+      title: validationMessage,
+      __self: this,
+      __source: {
+        fileName: _jsxFileName$1,
+        lineNumber: 413
+      }
+    }, React$2.createElement(Info, {
+      fontSize: 'small',
+      color: 'primary',
+      style: {
+        marginLeft: '5px'
+      },
+      __self: this,
+      __source: {
+        fileName: _jsxFileName$1,
+        lineNumber: 420
+      }
+    }))), responseAreasError && React$2.createElement('div', {
+      className: classes.errorText,
+      __self: this,
+      __source: {
+        fileName: _jsxFileName$1,
+        lineNumber: 423
+      }
+    }, responseAreasError), responseType === ResponseTypes.advanced && [React$2.createElement(InputContainer$1, {
       key: "templateEditorType",
       label: "Response Template Equation Editor",
       className: classes.selectContainer,
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 397
+        lineNumber: 426
       }
     }, React$2.createElement(Select, {
       className: classes.select,
@@ -835,91 +927,91 @@ class GeneralConfigBlock extends React$2.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 402
+        lineNumber: 431
       }
     }, React$2.createElement(MenuItem, {
       value: "non-negative-integers",
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 407
+        lineNumber: 436
       }
     }, "Numeric - Non-Negative Integers"), React$2.createElement(MenuItem, {
       value: "integers",
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 408
+        lineNumber: 437
       }
     }, "Numeric - Integers"), React$2.createElement(MenuItem, {
       value: "decimals",
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 409
+        lineNumber: 438
       }
     }, "Numeric - Decimals"), React$2.createElement(MenuItem, {
       value: "fractions",
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 410
+        lineNumber: 439
       }
     }, "Numeric - Fractions"), React$2.createElement(MenuItem, {
       value: 1,
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 411
+        lineNumber: 440
       }
     }, "Grade 1 - 2"), React$2.createElement(MenuItem, {
       value: 3,
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 412
+        lineNumber: 441
       }
     }, "Grade 3 - 5"), React$2.createElement(MenuItem, {
       value: 6,
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 413
+        lineNumber: 442
       }
     }, "Grade 6 - 7"), React$2.createElement(MenuItem, {
       value: 8,
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 414
+        lineNumber: 443
       }
     }, "Grade 8 - HS"), React$2.createElement(MenuItem, {
       value: 'geometry',
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 415
+        lineNumber: 444
       }
     }, "Geometry"), React$2.createElement(MenuItem, {
       value: 'advanced-algebra',
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 416
+        lineNumber: 445
       }
     }, "Advanced Algebra"), React$2.createElement(MenuItem, {
       value: 'statistics',
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 417
+        lineNumber: 446
       }
     }, "Statistics"), React$2.createElement(MenuItem, {
       value: 'item-authoring',
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 418
+        lineNumber: 447
       }
     }, "Item Authoring"))), React$2.createElement('div', {
       className: classes.inputContainer,
@@ -927,14 +1019,14 @@ class GeneralConfigBlock extends React$2.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 421
+        lineNumber: 450
       }
     }, React$2.createElement(InputLabel, {
       className: classes.templateTitle,
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 422
+        lineNumber: 451
       }
     }, "RESPONSE TEMPLATE"), React$2.createElement(MathToolbar, {
       classNames: classNames,
@@ -946,23 +1038,25 @@ class GeneralConfigBlock extends React$2.Component {
       onChange: this.onChange('expression'),
       onFocus: this.onFocus,
       onDone: this.onDone,
+      maxResponseAreas: maxResponseAreas,
+      error: responseAreasError,
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 425
+        lineNumber: 454
       }
-    }))], React$2.createElement('h3', {
+    }))], React$2.createElement('h4', {
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 438
+        lineNumber: 469
       }
     }, "Define Correct Response"), React$2.createElement('div', {
       className: classes.flexContainer,
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 439
+        lineNumber: 470
       }
     }, React$2.createElement(InputContainer$1, {
       label: "Equation Editor",
@@ -970,7 +1064,7 @@ class GeneralConfigBlock extends React$2.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 440
+        lineNumber: 471
       }
     }, React$2.createElement(Select, {
       className: classes.select,
@@ -979,91 +1073,91 @@ class GeneralConfigBlock extends React$2.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 444
+        lineNumber: 475
       }
     }, React$2.createElement(MenuItem, {
       value: "non-negative-integers",
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 449
+        lineNumber: 480
       }
     }, "Numeric - Non-Negative Integers"), React$2.createElement(MenuItem, {
       value: "integers",
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 450
+        lineNumber: 481
       }
     }, "Numeric - Integers"), React$2.createElement(MenuItem, {
       value: "decimals",
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 451
+        lineNumber: 482
       }
     }, "Numeric - Decimals"), React$2.createElement(MenuItem, {
       value: "fractions",
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 452
+        lineNumber: 483
       }
     }, "Numeric - Fractions"), React$2.createElement(MenuItem, {
       value: 1,
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 453
+        lineNumber: 484
       }
     }, "Grade 1 - 2"), React$2.createElement(MenuItem, {
       value: 3,
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 454
+        lineNumber: 485
       }
     }, "Grade 3 - 5"), React$2.createElement(MenuItem, {
       value: 6,
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 455
+        lineNumber: 486
       }
     }, "Grade 6 - 7"), React$2.createElement(MenuItem, {
       value: 8,
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 456
+        lineNumber: 487
       }
     }, "Grade 8 - HS"), React$2.createElement(MenuItem, {
       value: 'geometry',
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 457
+        lineNumber: 488
       }
     }, "Geometry"), React$2.createElement(MenuItem, {
       value: 'advanced-algebra',
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 458
+        lineNumber: 489
       }
     }, "Advanced Algebra"), React$2.createElement(MenuItem, {
       value: 'statistics',
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 459
+        lineNumber: 490
       }
     }, "Statistics"), React$2.createElement(MenuItem, {
       value: 'item-authoring',
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 460
+        lineNumber: 491
       }
     }, "Item Authoring")))), responsesToUse.map((response, idx) => React$2.createElement(Response$1, {
       key: response.id,
@@ -1074,10 +1168,11 @@ class GeneralConfigBlock extends React$2.Component {
       index: idx,
       cIgnoreOrder: cIgnoreOrder,
       cAllowTrailingZeros: cAllowTrailingZeros,
+      error: responsesErrors && responsesErrors[idx],
       __self: this,
       __source: {
         fileName: _jsxFileName$1,
-        lineNumber: 465
+        lineNumber: 496
       }
     })));
   }