@pie-element/math-inline 5.9.11 → 6.1.0

package/docs/pie-schema.json

@@ -518,6 +518,27 @@
         }
       }
     },
+    "ConfigureMaxImageDimensionsProp": {
+      "title": "ConfigureMaxImageDimensionsProp",
+      "type": "object",
+      "properties": {
+        "teacherInstructions": {
+          "description": "Indicates the max dimension for images in teacher instructions",
+          "type": "number",
+          "title": "teacherInstructions"
+        },
+        "prompt": {
+          "description": "Indicates the max dimension for images in prompt - this is also the default dimension for all other input fields if it's not specified",
+          "type": "number",
+          "title": "prompt"
+        },
+        "rationale": {
+          "description": "Indicates the max dimension for images in rationale",
+          "type": "number",
+          "title": "rationale"
+        }
+      }
+    },
     "ComplexFeedbackType": {
       "title": "ComplexFeedbackType",
       "type": "object",

package/docs/pie-schema.json.md

@@ -266,6 +266,22 @@ Indicates the label for the item that has to be displayed in the Settings Panel
 Indicates the value of the item if it affects config-ui
 (eg.: if item is a switch and displaying an input on the config-ui depends on the switch value: on/off)
 
+## `ConfigureMaxImageDimensionsProp` (object)
+
+Properties of the `ConfigureMaxImageDimensionsProp` object:
+
+### `teacherInstructions` (number)
+
+Indicates the max dimension for images in teacher instructions
+
+### `prompt` (number)
+
+Indicates the max dimension for images in prompt - this is also the default dimension for all other input fields if it's not specified
+
+### `rationale` (number)
+
+Indicates the max dimension for images in rationale
+
 ## `ComplexFeedbackType` (object)
 
 Properties of the `ComplexFeedbackType` object:

package/lib/simple-question-block.js

@@ -44,39 +44,47 @@ var SimpleQuestionBlockRaw = /*#__PURE__*/function (_React$Component) {
 
   var _super = _createSuper(SimpleQuestionBlockRaw);
 
-  function SimpleQuestionBlockRaw() {
+  function SimpleQuestionBlockRaw(props) {
     var _this;
 
     (0, _classCallCheck2["default"])(this, SimpleQuestionBlockRaw);
-
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-
-    _this = _super.call.apply(_super, [this].concat(args));
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "state", {
-      showKeypad: true
+    _this = _super.call(this, props);
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "mathToolBarContainsTarget", function (e) {
+      return document.getElementById(_this.mathToolBarId).contains(e.target);
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleClick", function (e) {
+      try {
+        if (!_this.mathToolBarContainsTarget(e)) {
+          _this.setState({
+            showKeypad: false
+          });
+        }
+      } catch (e) {// console.log(e.toString());
+      }
     });
     (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "onFocus", function () {
       return _this.setState({
         showKeypad: true
       });
     });
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "onBlur", function (e) {
-      var _ref = e || {},
-          relatedTarget = _ref.relatedTarget,
-          currentTarget = _ref.currentTarget;
-
-      if (!relatedTarget || !currentTarget || relatedTarget.offsetParent !== currentTarget.offsetParent) {
-        _this.setState({
-          showKeypad: false
-        });
-      }
-    });
+    _this.state = {
+      showKeypad: true
+    };
+    _this.mathToolBarId = "math-toolbar-".concat(new Date().getTime());
     return _this;
   }
 
   (0, _createClass2["default"])(SimpleQuestionBlockRaw, [{
+    key: "componentDidMount",
+    value: function componentDidMount() {
+      window.addEventListener('click', this.handleClick);
+    }
+  }, {
+    key: "componentWillUnmount",
+    value: function componentWillUnmount() {
+      window.removeEventListener('click', this.handleClick);
+    }
+  }, {
     key: "render",
     value: function render() {
       var _cx;
@@ -89,19 +97,16 @@ var SimpleQuestionBlockRaw = /*#__PURE__*/function (_React$Component) {
           emptyResponse = _this$props.emptyResponse,
           onSimpleResponseChange = _this$props.onSimpleResponseChange;
 
-      var _ref2 = model || {},
-          config = _ref2.config,
-          disabled = _ref2.disabled,
-          correctness = _ref2.correctness,
-          view = _ref2.view;
+      var _ref = model || {},
+          config = _ref.config,
+          disabled = _ref.disabled,
+          correctness = _ref.correctness;
 
       if (!config) {
         return;
       }
 
       var correct = correctness && correctness.correct;
-      var showAsCorrect = !emptyResponse && (showCorrect || correct);
-      var showAsIncorrect = !emptyResponse && !correct && !showCorrect && !view;
       var responses = config.responses,
           equationEditor = config.equationEditor;
       return /*#__PURE__*/_react["default"].createElement("div", {
@@ -110,7 +115,9 @@ var SimpleQuestionBlockRaw = /*#__PURE__*/function (_React$Component) {
         className: (0, _classnames["default"])(classes["static"], (_cx = {}, (0, _defineProperty2["default"])(_cx, classes.incorrect, !emptyResponse && !correct && !showCorrect), (0, _defineProperty2["default"])(_cx, classes.correct, !emptyResponse && (correct || showCorrect)), _cx))
       }, /*#__PURE__*/_react["default"].createElement(_mathInput.mq.Static, {
         latex: showCorrect ? responses && responses.length && responses[0].answer : session.response || ''
-      })) : /*#__PURE__*/_react["default"].createElement(_mathToolbar.MathToolbar, {
+      })) : /*#__PURE__*/_react["default"].createElement("div", {
+        id: this.mathToolBarId
+      }, /*#__PURE__*/_react["default"].createElement(_mathToolbar.MathToolbar, {
         classNames: {
           editor: classes.responseEditor
         },
@@ -119,11 +126,10 @@ var SimpleQuestionBlockRaw = /*#__PURE__*/function (_React$Component) {
         onChange: onSimpleResponseChange,
         onDone: function onDone() {},
         onFocus: this.onFocus,
-        onBlur: this.onBlur,
         controlledKeypad: true,
         showKeypad: this.state.showKeypad,
         hideDoneButton: true
-      }));
+      })));
     }
   }]);
   return SimpleQuestionBlockRaw;

package/lib/simple-question-block.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/simple-question-block.jsx"],"names":["SimpleQuestionBlockRaw","showKeypad","setState","e","relatedTarget","currentTarget","offsetParent","props","classes","model","showCorrect","session","emptyResponse","onSimpleResponseChange","config","disabled","correctness","view","correct","showAsCorrect","showAsIncorrect","responses","equationEditor","expression","incorrect","length","answer","response","editor","responseEditor","onFocus","onBlur","state","React","Component","PropTypes","object","func","isRequired","bool","SimpleQuestionBlock","theme","display","justifyContent","width","maxWidth","height","textAlign","padding","spacing","unit","border","color","primaryLight","marginTop","marginBottom","text","background","fontSize","letterSpacing"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { MathToolbar } from '@pie-lib/math-toolbar';\nimport { mq } from '@pie-lib/math-input';\nimport cx from 'classnames';\nimport { withStyles } from '@material-ui/core/styles';\nimport PropTypes from 'prop-types';\nimport { color } from '@pie-lib/render-ui';\n\nexport class SimpleQuestionBlockRaw extends React.Component {\n  static propTypes = {\n    classes: PropTypes.object,\n    onSimpleResponseChange: PropTypes.func,\n    model: PropTypes.object.isRequired,\n    emptyResponse: PropTypes.bool,\n    session: PropTypes.object.isRequired,\n    showCorrect: PropTypes.bool\n  };\n\n  state = {\n    showKeypad: true\n  };\n\n  onFocus = () => this.setState({ showKeypad: true });\n\n  onBlur = (e) => {\n    const { relatedTarget, currentTarget } = e || {};\n\n    if (!relatedTarget || !currentTarget || (relatedTarget.offsetParent !== currentTarget.offsetParent)) {\n      this.setState({ showKeypad: false });\n    }\n  };\n\n  render() {\n    const {\n      classes,\n      model,\n      showCorrect,\n      session,\n      emptyResponse,\n      onSimpleResponseChange\n    } = this.props;\n    const { config, disabled, correctness, view } = model || {};\n\n    if (!config) {\n      return;\n    }\n\n    const correct = correctness && correctness.correct;\n    const showAsCorrect = !emptyResponse && (showCorrect || correct);\n    const showAsIncorrect = !emptyResponse && !correct && !showCorrect && !view;\n    const { responses, equationEditor } = config;\n\n    return (\n      <div className={classes.expression}>\n        {showCorrect || disabled ? (\n          <div\n            className={cx(classes.static, {\n              [classes.incorrect]: !emptyResponse && !correct && !showCorrect,\n                  [classes.correct]: !emptyResponse && (correct || showCorrect)\n            })}\n          >\n            <mq.Static\n              latex={\n                showCorrect ? (responses && responses.length && responses[0].answer) : (session.response || '')\n              }\n            />\n          </div>\n        ) : (\n          <MathToolbar\n            classNames={{ editor: classes.responseEditor }}\n            latex={session.response || ''}\n            keypadMode={equationEditor}\n            onChange={onSimpleResponseChange}\n            onDone={() => {}}\n            onFocus={this.onFocus}\n            onBlur={this.onBlur}\n            controlledKeypad={true}\n            showKeypad={this.state.showKeypad}\n            hideDoneButton={true}\n          />\n        )}\n      </div>\n    );\n  }\n}\nconst SimpleQuestionBlock = withStyles(theme => ({\n  responseEditor: {\n    display: 'flex',\n    justifyContent: 'center',\n    width: 'auto',\n    maxWidth: 'fit-content',\n    height: 'auto',\n    textAlign: 'left',\n    padding: theme.spacing.unit,\n    '&.mq-math-mode': {\n      border: `1px solid ${color.primaryLight()}`\n    }\n  },\n  expression: {\n    marginTop: theme.spacing.unit * 2,\n    marginBottom: theme.spacing.unit * 2,\n    padding: theme.spacing.unit\n  },\n  static: {\n    color: color.text(),\n    background: color.background(),\n    border: `1px solid ${color.primaryLight()}`,\n    width: 'fit-content',\n    fontSize: '1rem',\n    padding: theme.spacing.unit / 2,\n    '& > .mq-math-mode': {\n      '& > .mq-hasCursor': {\n        '& > .mq-cursor': {\n          display: 'none'\n        }\n      }\n    }\n  },\n  correct: {\n    border: `2px solid ${color.correct()} !important`,\n    padding: theme.spacing.unit,\n    letterSpacing: '0.5px',\n  },\n  incorrect: {\n    border: `2px solid ${color.incorrect()} !important`,\n    padding: theme.spacing.unit,\n    letterSpacing: '0.5px',\n  }\n}))(SimpleQuestionBlockRaw);\n\nexport default SimpleQuestionBlock;\n"],"file":"simple-question-block.js"}
+{"version":3,"sources":["../src/simple-question-block.jsx"],"names":["SimpleQuestionBlockRaw","props","e","document","getElementById","mathToolBarId","contains","target","mathToolBarContainsTarget","setState","showKeypad","state","Date","getTime","window","addEventListener","handleClick","removeEventListener","classes","model","showCorrect","session","emptyResponse","onSimpleResponseChange","config","disabled","correctness","correct","responses","equationEditor","expression","incorrect","length","answer","response","editor","responseEditor","onFocus","React","Component","PropTypes","object","func","isRequired","bool","SimpleQuestionBlock","theme","display","justifyContent","width","maxWidth","height","textAlign","padding","spacing","unit","border","color","primaryLight","marginTop","marginBottom","text","background","fontSize","letterSpacing"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { MathToolbar } from '@pie-lib/math-toolbar';\nimport { mq } from '@pie-lib/math-input';\nimport cx from 'classnames';\nimport { withStyles } from '@material-ui/core/styles';\nimport PropTypes from 'prop-types';\nimport { color } from '@pie-lib/render-ui';\n\nexport class SimpleQuestionBlockRaw extends React.Component {\n  static propTypes = {\n    classes: PropTypes.object,\n    onSimpleResponseChange: PropTypes.func,\n    model: PropTypes.object.isRequired,\n    emptyResponse: PropTypes.bool,\n    session: PropTypes.object.isRequired,\n    showCorrect: PropTypes.bool\n  };\n\n  constructor(props) {\n    super(props);\n\n    this.state = {\n      showKeypad: true\n    };\n    this.mathToolBarId = `math-toolbar-${new Date().getTime()}`;\n  }\n\n  componentDidMount() {\n    window.addEventListener('click', this.handleClick);\n  }\n\n  componentWillUnmount() {\n    window.removeEventListener('click', this.handleClick);\n  }\n\n  mathToolBarContainsTarget = e => document.getElementById(this.mathToolBarId).contains(e.target);\n\n  handleClick = (e) => {\n    try {\n      if (!this.mathToolBarContainsTarget(e)) {\n        this.setState({ showKeypad: false });\n      }\n    } catch (e) {\n      // console.log(e.toString());\n    }\n  }\n\n  onFocus = () => this.setState({ showKeypad: true })\n\n  render() {\n    const {\n      classes,\n      model,\n      showCorrect,\n      session,\n      emptyResponse,\n      onSimpleResponseChange\n    } = this.props;\n    const { config, disabled, correctness } = model || {};\n\n    if (!config) {\n      return;\n    }\n\n    const correct = correctness && correctness.correct;\n    const { responses, equationEditor } = config;\n\n    return (\n      <div className={classes.expression}>\n        {showCorrect || disabled ? (\n          <div\n            className={cx(classes.static, {\n              [classes.incorrect]: !emptyResponse && !correct && !showCorrect,\n              [classes.correct]: !emptyResponse && (correct || showCorrect)\n            })}\n          >\n            <mq.Static\n              latex={\n                showCorrect ? (responses && responses.length && responses[0].answer) : (session.response || '')\n              }\n            />\n          </div>\n        ) : (\n          <div id={this.mathToolBarId}>\n            <MathToolbar\n              classNames={{ editor: classes.responseEditor }}\n              latex={session.response || ''}\n              keypadMode={equationEditor}\n              onChange={onSimpleResponseChange}\n              onDone={() => {\n              }}\n              onFocus={this.onFocus}\n              controlledKeypad={true}\n              showKeypad={this.state.showKeypad}\n              hideDoneButton={true}\n            />\n          </div>\n        )}\n      </div>\n    );\n  }\n}\n\nconst SimpleQuestionBlock = withStyles(theme => ({\n  responseEditor: {\n    display: 'flex',\n    justifyContent: 'center',\n    width: 'auto',\n    maxWidth: 'fit-content',\n    height: 'auto',\n    textAlign: 'left',\n    padding: theme.spacing.unit,\n    '&.mq-math-mode': {\n      border: `1px solid ${color.primaryLight()}`\n    }\n  },\n  expression: {\n    marginTop: theme.spacing.unit * 2,\n    marginBottom: theme.spacing.unit * 2,\n    padding: theme.spacing.unit\n  },\n  static: {\n    color: color.text(),\n    background: color.background(),\n    border: `1px solid ${color.primaryLight()}`,\n    width: 'fit-content',\n    fontSize: '1rem',\n    padding: theme.spacing.unit / 2,\n    '& > .mq-math-mode': {\n      '& > .mq-hasCursor': {\n        '& > .mq-cursor': {\n          display: 'none'\n        }\n      }\n    }\n  },\n  correct: {\n    border: `2px solid ${color.correct()} !important`,\n    padding: theme.spacing.unit,\n    letterSpacing: '0.5px',\n  },\n  incorrect: {\n    border: `2px solid ${color.incorrect()} !important`,\n    padding: theme.spacing.unit,\n    letterSpacing: '0.5px',\n  }\n}))(SimpleQuestionBlockRaw);\n\nexport default SimpleQuestionBlock;\n"],"file":"simple-question-block.js"}

package/package.json

@@ -4,7 +4,7 @@
     "access": "public"
   },
   "repository": "pie-framework/pie-elements",
-  "version": "5.9.11",
+  "version": "6.1.0",
   "main": "lib/index.js",
   "description": "",
   "scripts": {
@@ -15,10 +15,10 @@
     "@material-ui/core": "^3.9.2",
     "@pie-framework/mathquill": "^1.1.0",
     "@pie-framework/pie-player-events": "^0.1.0",
-    "@pie-lib/correct-answer-toggle": "^2.3.38",
-    "@pie-lib/math-input": "^6.6.9",
-    "@pie-lib/math-toolbar": "^1.9.3",
-    "@pie-lib/render-ui": "^4.12.8",
+    "@pie-lib/correct-answer-toggle": "^2.3.39",
+    "@pie-lib/math-input": "^6.6.10",
+    "@pie-lib/math-toolbar": "^1.9.4",
+    "@pie-lib/render-ui": "^4.12.9",
     "classnames": "^2.2.5",
     "debug": "^4.1.1",
     "lodash": "^4.17.10",
@@ -28,7 +28,7 @@
   },
   "author": "",
   "license": "ISC",
-  "gitHead": "3f3d6edc68890098821978ebd5a8b90da31ab222",
+  "gitHead": "9b55e36b358084c7a96a08bad969f4856d6802da",
   "module": "src/index.js",
   "exports": {
     ".": "./src/index.js",