@pie-lib/math-toolbar 1.12.1-beta.0 → 1.14.0

package/lib/index.js

@@ -0,0 +1,287 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "MathPreview", {
+  enumerable: true,
+  get: function get() {
+    return _mathPreview["default"];
+  }
+});
+exports.RawPureToolbar = exports.PureToolbar = exports.MathToolbar = void 0;
+
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+
+var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
+
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _editorAndPad = _interopRequireDefault(require("./editor-and-pad"));
+
+var _doneButton = require("./done-button");
+
+var _styles = require("@material-ui/core/styles");
+
+var _mathPreview = _interopRequireDefault(require("./math-preview"));
+
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
+
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+
+var MathToolbar = /*#__PURE__*/function (_React$Component) {
+  (0, _inherits2["default"])(MathToolbar, _React$Component);
+
+  var _super = _createSuper(MathToolbar);
+
+  function MathToolbar(props) {
+    var _this;
+
+    (0, _classCallCheck2["default"])(this, MathToolbar);
+    _this = _super.call(this, props);
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "done", function () {
+      _this.props.onDone(_this.state.latex);
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "onChange", function (latex) {
+      _this.setState({
+        latex: latex
+      });
+
+      _this.props.onChange(latex);
+    });
+    _this.state = {
+      latex: props.latex
+    };
+    return _this;
+  }
+
+  (0, _createClass2["default"])(MathToolbar, [{
+    key: "UNSAFE_componentWillReceiveProps",
+    value: function UNSAFE_componentWillReceiveProps(nextProps) {
+      this.setState({
+        latex: nextProps.latex
+      });
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var latex = this.state.latex;
+      var _this$props = this.props,
+          classNames = _this$props.classNames,
+          autoFocus = _this$props.autoFocus,
+          allowAnswerBlock = _this$props.allowAnswerBlock,
+          onAnswerBlockAdd = _this$props.onAnswerBlockAdd,
+          controlledKeypad = _this$props.controlledKeypad,
+          controlledKeypadMode = _this$props.controlledKeypadMode,
+          keypadMode = _this$props.keypadMode,
+          noDecimal = _this$props.noDecimal,
+          additionalKeys = _this$props.additionalKeys,
+          showKeypad = _this$props.showKeypad,
+          onFocus = _this$props.onFocus,
+          onBlur = _this$props.onBlur,
+          hideDoneButton = _this$props.hideDoneButton,
+          error = _this$props.error,
+          keyPadCharacterRef = _this$props.keyPadCharacterRef,
+          setKeypadInteraction = _this$props.setKeypadInteraction,
+          maxResponseAreas = _this$props.maxResponseAreas;
+      return /*#__PURE__*/_react["default"].createElement(PureToolbar, {
+        autoFocus: autoFocus,
+        classNames: classNames,
+        onAnswerBlockAdd: onAnswerBlockAdd,
+        allowAnswerBlock: allowAnswerBlock,
+        latex: latex,
+        additionalKeys: additionalKeys,
+        noDecimal: noDecimal,
+        keypadMode: keypadMode,
+        keyPadCharacterRef: keyPadCharacterRef,
+        setKeypadInteraction: setKeypadInteraction,
+        onChange: this.onChange,
+        onDone: this.done,
+        onFocus: onFocus,
+        onBlur: onBlur,
+        showKeypad: showKeypad,
+        controlledKeypad: controlledKeypad,
+        controlledKeypadMode: controlledKeypadMode,
+        hideDoneButton: hideDoneButton,
+        error: error,
+        maxResponseAreas: maxResponseAreas
+      });
+    }
+  }]);
+  return MathToolbar;
+}(_react["default"].Component);
+
+exports.MathToolbar = MathToolbar;
+(0, _defineProperty2["default"])(MathToolbar, "propTypes", {
+  autoFocus: _propTypes["default"].bool,
+  allowAnswerBlock: _propTypes["default"].bool,
+  controlledKeypad: _propTypes["default"].bool,
+  controlledKeypadMode: _propTypes["default"].bool,
+  keypadMode: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number]),
+  classNames: _propTypes["default"].object,
+  error: _propTypes["default"].string,
+  maxResponseAreas: _propTypes["default"].number,
+  showKeypad: _propTypes["default"].bool,
+  noDecimal: _propTypes["default"].bool,
+  additionalKeys: _propTypes["default"].array,
+  latex: _propTypes["default"].string.isRequired,
+  onAnswerBlockAdd: _propTypes["default"].func,
+  onChange: _propTypes["default"].func,
+  onDone: _propTypes["default"].func.isRequired,
+  onFocus: _propTypes["default"].func,
+  onBlur: _propTypes["default"].func,
+  hideDoneButton: _propTypes["default"].bool,
+  keyPadCharacterRef: _propTypes["default"].func,
+  setKeypadInteraction: _propTypes["default"].func
+});
+(0, _defineProperty2["default"])(MathToolbar, "defaultProps", {
+  classNames: {},
+  keypadMode: 'item-authoring',
+  autoFocus: false,
+  allowAnswerBlock: false,
+  controlledKeypad: false,
+  controlledKeypadMode: false,
+  noDecimal: false,
+  showKeypad: true,
+  additionalKeys: [],
+  onChange: function onChange() {},
+  onAnswerBlockAdd: function onAnswerBlockAdd() {},
+  onFocus: function onFocus() {},
+  hideDoneButton: false
+});
+
+var RawPureToolbar = /*#__PURE__*/function (_React$Component2) {
+  (0, _inherits2["default"])(RawPureToolbar, _React$Component2);
+
+  var _super2 = _createSuper(RawPureToolbar);
+
+  function RawPureToolbar() {
+    (0, _classCallCheck2["default"])(this, RawPureToolbar);
+    return _super2.apply(this, arguments);
+  }
+
+  (0, _createClass2["default"])(RawPureToolbar, [{
+    key: "render",
+    value: function render() {
+      var _this$props2 = this.props,
+          classNames = _this$props2.classNames,
+          autoFocus = _this$props2.autoFocus,
+          allowAnswerBlock = _this$props2.allowAnswerBlock,
+          onAnswerBlockAdd = _this$props2.onAnswerBlockAdd,
+          controlledKeypad = _this$props2.controlledKeypad,
+          controlledKeypadMode = _this$props2.controlledKeypadMode,
+          additionalKeys = _this$props2.additionalKeys,
+          showKeypad = _this$props2.showKeypad,
+          keypadMode = _this$props2.keypadMode,
+          noDecimal = _this$props2.noDecimal,
+          hideInput = _this$props2.hideInput,
+          noLatexHandling = _this$props2.noLatexHandling,
+          layoutForKeyPad = _this$props2.layoutForKeyPad,
+          keyPadCharacterRef = _this$props2.keyPadCharacterRef,
+          setKeypadInteraction = _this$props2.setKeypadInteraction,
+          latex = _this$props2.latex,
+          onChange = _this$props2.onChange,
+          onDone = _this$props2.onDone,
+          onFocus = _this$props2.onFocus,
+          onBlur = _this$props2.onBlur,
+          hideDoneButton = _this$props2.hideDoneButton,
+          hideDoneButtonBackground = _this$props2.hideDoneButtonBackground,
+          classes = _this$props2.classes,
+          error = _this$props2.error,
+          maxResponseAreas = _this$props2.maxResponseAreas;
+      return /*#__PURE__*/_react["default"].createElement("div", {
+        className: (0, _classnames["default"])(classes.pureToolbar, (classNames || {}).toolbar),
+        ref: keyPadCharacterRef
+      }, /*#__PURE__*/_react["default"].createElement("div", null), /*#__PURE__*/_react["default"].createElement(_editorAndPad["default"], {
+        autoFocus: autoFocus,
+        keypadMode: keypadMode,
+        classNames: classNames || {},
+        controlledKeypad: controlledKeypad,
+        controlledKeypadMode: controlledKeypadMode,
+        noDecimal: noDecimal,
+        hideInput: hideInput,
+        noLatexHandling: noLatexHandling,
+        layoutForKeyPad: layoutForKeyPad,
+        showKeypad: showKeypad,
+        additionalKeys: additionalKeys,
+        allowAnswerBlock: allowAnswerBlock,
+        onAnswerBlockAdd: onAnswerBlockAdd,
+        latex: latex,
+        onChange: onChange,
+        onFocus: onFocus,
+        onBlur: onBlur,
+        error: error,
+        maxResponseAreas: maxResponseAreas,
+        setKeypadInteraction: setKeypadInteraction
+      }), (!controlledKeypad || controlledKeypad && showKeypad) && !hideDoneButton && /*#__PURE__*/_react["default"].createElement(_doneButton.DoneButton, {
+        hideBackground: hideDoneButtonBackground,
+        onClick: onDone
+      }));
+    }
+  }]);
+  return RawPureToolbar;
+}(_react["default"].Component);
+
+exports.RawPureToolbar = RawPureToolbar;
+(0, _defineProperty2["default"])(RawPureToolbar, "propTypes", {
+  classNames: _propTypes["default"].object,
+  latex: _propTypes["default"].string.isRequired,
+  keypadMode: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number]),
+  hideInput: _propTypes["default"].bool,
+  noLatexHandling: _propTypes["default"].bool,
+  layoutForKeyPad: _propTypes["default"].object,
+  onChange: _propTypes["default"].func.isRequired,
+  onDone: _propTypes["default"].func.isRequired,
+  onBlur: _propTypes["default"].func,
+  onAnswerBlockAdd: _propTypes["default"].func,
+  additionalKeys: _propTypes["default"].array,
+  onFocus: _propTypes["default"].func,
+  classes: _propTypes["default"].object.isRequired,
+  autoFocus: _propTypes["default"].bool,
+  noDecimal: _propTypes["default"].bool,
+  allowAnswerBlock: _propTypes["default"].bool,
+  controlledKeypad: _propTypes["default"].bool,
+  controlledKeypadMode: _propTypes["default"].bool,
+  showKeypad: _propTypes["default"].bool,
+  hideDoneButton: _propTypes["default"].bool,
+  hideDoneButtonBackground: _propTypes["default"].bool,
+  error: _propTypes["default"].any,
+  maxResponseAreas: _propTypes["default"].number,
+  keyPadCharacterRef: _propTypes["default"].object,
+  setKeypadInteraction: _propTypes["default"].func
+});
+(0, _defineProperty2["default"])(RawPureToolbar, "defaultProps", {
+  classNames: {},
+  hideDoneButtonBackground: false
+});
+
+var styles = function styles() {
+  return {
+    pureToolbar: {
+      display: 'flex',
+      width: '100%',
+      zIndex: 8,
+      alignItems: 'center'
+    }
+  };
+};
+
+var PureToolbar = (0, _styles.withStyles)(styles)(RawPureToolbar);
+exports.PureToolbar = PureToolbar;
+//# sourceMappingURL=index.js.map

package/lib/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/index.jsx"],"names":["MathToolbar","props","onDone","state","latex","setState","onChange","nextProps","classNames","autoFocus","allowAnswerBlock","onAnswerBlockAdd","controlledKeypad","controlledKeypadMode","keypadMode","noDecimal","additionalKeys","showKeypad","onFocus","onBlur","hideDoneButton","error","keyPadCharacterRef","setKeypadInteraction","maxResponseAreas","done","React","Component","PropTypes","bool","oneOfType","string","number","object","array","isRequired","func","RawPureToolbar","hideInput","noLatexHandling","layoutForKeyPad","hideDoneButtonBackground","classes","pureToolbar","toolbar","any","styles","display","width","zIndex","alignItems","PureToolbar"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport cx from 'classnames';\nimport EditorAndPad from './editor-and-pad';\nimport { DoneButton } from './done-button';\nimport { withStyles } from '@material-ui/core/styles';\nimport MathPreview from './math-preview';\n\nexport { MathPreview };\n\nexport class MathToolbar extends React.Component {\n  static propTypes = {\n    autoFocus: PropTypes.bool,\n    allowAnswerBlock: PropTypes.bool,\n    controlledKeypad: PropTypes.bool,\n    controlledKeypadMode: PropTypes.bool,\n    keypadMode: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n    classNames: PropTypes.object,\n    error: PropTypes.string,\n    maxResponseAreas: PropTypes.number,\n    showKeypad: PropTypes.bool,\n    noDecimal: PropTypes.bool,\n    additionalKeys: PropTypes.array,\n    latex: PropTypes.string.isRequired,\n    onAnswerBlockAdd: PropTypes.func,\n    onChange: PropTypes.func,\n    onDone: PropTypes.func.isRequired,\n    onFocus: PropTypes.func,\n    onBlur: PropTypes.func,\n    hideDoneButton: PropTypes.bool,\n    keyPadCharacterRef: PropTypes.func,\n    setKeypadInteraction: PropTypes.func,\n  };\n\n  static defaultProps = {\n    classNames: {},\n    keypadMode: 'item-authoring',\n    autoFocus: false,\n    allowAnswerBlock: false,\n    controlledKeypad: false,\n    controlledKeypadMode: false,\n    noDecimal: false,\n    showKeypad: true,\n    additionalKeys: [],\n    onChange: () => {},\n    onAnswerBlockAdd: () => {},\n    onFocus: () => {},\n    hideDoneButton: false,\n  };\n\n  constructor(props) {\n    super(props);\n    this.state = {\n      latex: props.latex,\n    };\n  }\n\n  done = () => {\n    this.props.onDone(this.state.latex);\n  };\n\n  UNSAFE_componentWillReceiveProps(nextProps) {\n    this.setState({ latex: nextProps.latex });\n  }\n\n  onChange = (latex) => {\n    this.setState({ latex });\n    this.props.onChange(latex);\n  };\n\n  render() {\n    const { latex } = this.state;\n    const {\n      classNames,\n      autoFocus,\n      allowAnswerBlock,\n      onAnswerBlockAdd,\n      controlledKeypad,\n      controlledKeypadMode,\n      keypadMode,\n      noDecimal,\n      additionalKeys,\n      showKeypad,\n      onFocus,\n      onBlur,\n      hideDoneButton,\n      error,\n      keyPadCharacterRef,\n      setKeypadInteraction,\n      maxResponseAreas,\n    } = this.props;\n\n    return (\n      <PureToolbar\n        autoFocus={autoFocus}\n        classNames={classNames}\n        onAnswerBlockAdd={onAnswerBlockAdd}\n        allowAnswerBlock={allowAnswerBlock}\n        latex={latex}\n        additionalKeys={additionalKeys}\n        noDecimal={noDecimal}\n        keypadMode={keypadMode}\n        keyPadCharacterRef={keyPadCharacterRef}\n        setKeypadInteraction={setKeypadInteraction}\n        onChange={this.onChange}\n        onDone={this.done}\n        onFocus={onFocus}\n        onBlur={onBlur}\n        showKeypad={showKeypad}\n        controlledKeypad={controlledKeypad}\n        controlledKeypadMode={controlledKeypadMode}\n        hideDoneButton={hideDoneButton}\n        error={error}\n        maxResponseAreas={maxResponseAreas}\n      />\n    );\n  }\n}\n\nexport class RawPureToolbar extends React.Component {\n  static propTypes = {\n    classNames: PropTypes.object,\n    latex: PropTypes.string.isRequired,\n    keypadMode: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n    hideInput: PropTypes.bool,\n    noLatexHandling: PropTypes.bool,\n    layoutForKeyPad: PropTypes.object,\n    onChange: PropTypes.func.isRequired,\n    onDone: PropTypes.func.isRequired,\n    onBlur: PropTypes.func,\n    onAnswerBlockAdd: PropTypes.func,\n    additionalKeys: PropTypes.array,\n    onFocus: PropTypes.func,\n    classes: PropTypes.object.isRequired,\n    autoFocus: PropTypes.bool,\n    noDecimal: PropTypes.bool,\n    allowAnswerBlock: PropTypes.bool,\n    controlledKeypad: PropTypes.bool,\n    controlledKeypadMode: PropTypes.bool,\n    showKeypad: PropTypes.bool,\n    hideDoneButton: PropTypes.bool,\n    hideDoneButtonBackground: PropTypes.bool,\n    error: PropTypes.any,\n    maxResponseAreas: PropTypes.number,\n    keyPadCharacterRef: PropTypes.object,\n    setKeypadInteraction: PropTypes.func,\n  };\n\n  static defaultProps = {\n    classNames: {},\n    hideDoneButtonBackground: false,\n  };\n\n  render() {\n    const {\n      classNames,\n      autoFocus,\n      allowAnswerBlock,\n      onAnswerBlockAdd,\n      controlledKeypad,\n      controlledKeypadMode,\n      additionalKeys,\n      showKeypad,\n      keypadMode,\n      noDecimal,\n      hideInput,\n      noLatexHandling,\n      layoutForKeyPad,\n      keyPadCharacterRef,\n      setKeypadInteraction,\n      latex,\n      onChange,\n      onDone,\n      onFocus,\n      onBlur,\n      hideDoneButton,\n      hideDoneButtonBackground,\n      classes,\n      error,\n      maxResponseAreas,\n    } = this.props;\n\n    return (\n      <div className={cx(classes.pureToolbar, (classNames || {}).toolbar)} ref={keyPadCharacterRef}>\n        <div />\n        <EditorAndPad\n          autoFocus={autoFocus}\n          keypadMode={keypadMode}\n          classNames={classNames || {}}\n          controlledKeypad={controlledKeypad}\n          controlledKeypadMode={controlledKeypadMode}\n          noDecimal={noDecimal}\n          hideInput={hideInput}\n          noLatexHandling={noLatexHandling}\n          layoutForKeyPad={layoutForKeyPad}\n          showKeypad={showKeypad}\n          additionalKeys={additionalKeys}\n          allowAnswerBlock={allowAnswerBlock}\n          onAnswerBlockAdd={onAnswerBlockAdd}\n          latex={latex}\n          onChange={onChange}\n          onFocus={onFocus}\n          onBlur={onBlur}\n          error={error}\n          maxResponseAreas={maxResponseAreas}\n          setKeypadInteraction={setKeypadInteraction}\n        />\n        {(!controlledKeypad || (controlledKeypad && showKeypad)) && !hideDoneButton && (\n          <DoneButton hideBackground={hideDoneButtonBackground} onClick={onDone} />\n        )}\n      </div>\n    );\n  }\n}\nconst styles = () => ({\n  pureToolbar: {\n    display: 'flex',\n    width: '100%',\n    zIndex: 8,\n    alignItems: 'center',\n  },\n});\n\nexport const PureToolbar = withStyles(styles)(RawPureToolbar);\n"],"file":"index.js"}

package/lib/math-preview.js

@@ -0,0 +1,240 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.RawMathPreview = void 0;
+
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _debug = _interopRequireDefault(require("debug"));
+
+var _styles = require("@material-ui/core/styles");
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _mathInput = require("@pie-lib/math-input");
+
+var _utils = require("./utils");
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
+
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+
+var _mq$CommonMqStyles = _mathInput.mq.CommonMqStyles,
+    commonMqFontStyles = _mq$CommonMqStyles.commonMqFontStyles,
+    longdivStyles = _mq$CommonMqStyles.longdivStyles,
+    supsubStyles = _mq$CommonMqStyles.supsubStyles;
+var log = (0, _debug["default"])('@pie-lib:math-toolbar:math-preview');
+
+var RawMathPreview = /*#__PURE__*/function (_React$Component) {
+  (0, _inherits2["default"])(RawMathPreview, _React$Component);
+
+  var _super = _createSuper(RawMathPreview);
+
+  function RawMathPreview() {
+    (0, _classCallCheck2["default"])(this, RawMathPreview);
+    return _super.apply(this, arguments);
+  }
+
+  (0, _createClass2["default"])(RawMathPreview, [{
+    key: "componentDidMount",
+    value: function componentDidMount() {
+      (0, _utils.markFractionBaseSuperscripts)();
+    }
+  }, {
+    key: "componentDidUpdate",
+    value: function componentDidUpdate(prevProps) {
+      // Re-run only if LaTeX changed
+      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);
+      var latex = this.props.node.data.get('latex');
+      var _this$props = this.props,
+          classes = _this$props.classes,
+          isSelected = _this$props.isSelected,
+          onFocus = _this$props.onFocus,
+          onBlur = _this$props.onBlur;
+      return /*#__PURE__*/_react["default"].createElement("div", {
+        className: (0, _classnames["default"])(classes.root, isSelected && classes.selected)
+      }, ' ', /*#__PURE__*/_react["default"].createElement("span", {
+        className: classes.insideOverlay
+      }), /*#__PURE__*/_react["default"].createElement(_mathInput.mq.Static, {
+        latex: latex,
+        onFocus: onFocus,
+        onBlur: onBlur
+      }));
+    }
+  }]);
+  return RawMathPreview;
+}(_react["default"].Component);
+
+exports.RawMathPreview = RawMathPreview;
+(0, _defineProperty2["default"])(RawMathPreview, "propTypes", {
+  latex: _propTypes["default"].string,
+  node: _propTypes["default"].object,
+  classes: _propTypes["default"].object,
+  isSelected: _propTypes["default"].bool,
+  onFocus: _propTypes["default"].func,
+  onBlur: _propTypes["default"].func
+});
+
+var mp = function mp(theme) {
+  return {
+    root: _objectSpread(_objectSpread(_objectSpread({
+      display: 'inline-flex',
+      alignItems: 'center',
+      position: 'relative',
+      '& *': commonMqFontStyles
+    }, supsubStyles), longdivStyles), {}, {
+      '& > .mq-math-mode': {
+        border: 'solid 1px lightgrey'
+      },
+      '& > .mq-focused': {
+        outline: 'none',
+        boxShadow: 'none',
+        border: 'solid 1px black',
+        borderRadius: '0px'
+      },
+      '& > .mq-math-mode .mq-root-block': {
+        paddingTop: '7px !important'
+      },
+      '& > .mq-math-mode .mq-overarc ': {
+        paddingTop: '0.45em !important'
+      },
+      '& > .mq-math-mode .mq-sqrt-prefix': {
+        verticalAlign: 'baseline !important',
+        top: '1px !important',
+        left: '-0.1em !important'
+      },
+      '& > .mq-math-mode .mq-denominator': {
+        marginTop: '-5px !important',
+        padding: '0.5em 0.1em 0.1em !important'
+      },
+      '& > .mq-math-mode .mq-numerator, .mq-math-mode .mq-over': {
+        padding: '0 0.1em !important',
+        paddingBottom: '0 !important',
+        marginBottom: '-2px'
+      },
+      '& > .mq-math-mode .mq-longdiv .mq-longdiv-inner .mq-empty': {
+        paddingTop: '6px !important',
+        paddingLeft: '4px !important'
+      },
+      '& > .mq-math-mode .mq-longdiv .mq-longdiv-inner': {
+        marginLeft: '0 !important'
+      },
+      '& > .mq-math-mode .mq-overarrow': {
+        fontFamily: 'Roboto, Helvetica, Arial, sans-serif !important'
+      },
+      '& > .mq-math-mode .mq-paren': {
+        verticalAlign: 'top !important',
+        padding: '1px 0.1em !important'
+      },
+      '& > .mq-math-mode .mq-sqrt-stem': {
+        borderTop: '0.07em solid',
+        marginLeft: '-1.5px',
+        marginTop: '-2px !important',
+        paddingTop: '5px !important'
+      },
+      '& .mq-overarrow-inner': {
+        paddingTop: '0 !important',
+        border: 'none !important'
+      },
+      '& .mq-editable-field .mq-cursor': {
+        marginTop: '-15px !important'
+      },
+      '& .mq-overarrow.mq-arrow-both': {
+        top: '7.5px',
+        marginTop: '0px',
+        minWidth: '1.23em',
+        '& *': {
+          lineHeight: '1 !important'
+        },
+        '&:before': {
+          top: '-0.4em',
+          left: '-1px'
+        },
+        // NOTE: This workaround adds `!important` to enforce the correct positioning and styling
+        // of `.mq-overarrow.mq-arrow-both` elements in MathQuill. This ensures consistent display
+        // regardless of the order in which MathQuill is initialized on our websites.
+        //
+        // In the future, investigate why MathQuill scripts and styles are being initialized
+        // more than once and address the root cause to prevent potential conflicts and ensure
+        // optimal performance.
+        '&:after': {
+          top: '0px !important',
+          position: 'absolute !important',
+          right: '-2px'
+        },
+        '&.mq-empty:after': {
+          top: '-0.45em'
+        }
+      },
+      '& .mq-overarrow.mq-arrow-right': {
+        '&:before': {
+          top: '-0.4em',
+          right: '-1px'
+        }
+      },
+      '& .mq-overarrow-inner-right': {
+        display: 'none !important'
+      },
+      '& .mq-overarrow-inner-left': {
+        display: 'none !important'
+      },
+      '& .mq-longdiv-inner': {
+        borderTop: '1px solid !important',
+        paddingTop: '1.5px !important'
+      },
+      '& .mq-parallelogram': {
+        lineHeight: 0.85
+      },
+      '& span[data-prime="true"]': {
+        fontFamily: 'Roboto, Helvetica, Arial, sans-serif !important'
+      }
+    }),
+    selected: {
+      border: "solid 1px ".concat(theme.palette.primary.main),
+      '& > .mq-math-mode': {
+        border: 'solid 0px lightgrey'
+      }
+    },
+    insideOverlay: {
+      position: 'absolute',
+      bottom: 0,
+      left: 0,
+      right: 0,
+      top: 0
+    }
+  };
+};
+
+var _default = (0, _styles.withStyles)(mp)(RawMathPreview);
+
+exports["default"] = _default;
+//# sourceMappingURL=math-preview.js.map

package/lib/math-preview.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/math-preview.jsx"],"names":["mq","CommonMqStyles","commonMqFontStyles","longdivStyles","supsubStyles","log","RawMathPreview","prevProps","props","node","data","get","latex","classes","isSelected","onFocus","onBlur","root","selected","insideOverlay","React","Component","PropTypes","string","object","bool","func","mp","theme","display","alignItems","position","border","outline","boxShadow","borderRadius","paddingTop","verticalAlign","top","left","marginTop","padding","paddingBottom","marginBottom","paddingLeft","marginLeft","fontFamily","borderTop","minWidth","lineHeight","right","palette","primary","main","bottom"],"mappings":"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","sourcesContent":["import React from 'react';\nimport classNames from 'classnames';\nimport debug from 'debug';\nimport { withStyles } from '@material-ui/core/styles';\nimport PropTypes from 'prop-types';\nimport { mq } from '@pie-lib/math-input';\nimport { markFractionBaseSuperscripts } from './utils';\n\nconst { commonMqFontStyles, longdivStyles, supsubStyles } = mq.CommonMqStyles;\n\nconst log = debug('@pie-lib:math-toolbar:math-preview');\n\nexport class RawMathPreview extends React.Component {\n  static propTypes = {\n    latex: PropTypes.string,\n    node: PropTypes.object,\n    classes: PropTypes.object,\n    isSelected: PropTypes.bool,\n    onFocus: PropTypes.func,\n    onBlur: PropTypes.func,\n  };\n\n  componentDidMount() {\n    markFractionBaseSuperscripts();\n  }\n\n  componentDidUpdate(prevProps) {\n    // Re-run only if LaTeX changed\n    if (this.props.node.data.get('latex') !== prevProps.node.data.get('latex')) {\n      markFractionBaseSuperscripts();\n    }\n  }\n\n  render() {\n    log('[render] data: ', this.props.node.data);\n    const latex = this.props.node.data.get('latex');\n    const { classes, isSelected, onFocus, onBlur } = this.props;\n    return (\n      <div className={classNames(classes.root, isSelected && classes.selected)}>\n        {' '}\n        <span className={classes.insideOverlay} />\n        <mq.Static latex={latex} onFocus={onFocus} onBlur={onBlur} />\n      </div>\n    );\n  }\n}\n\nconst mp = (theme) => ({\n  root: {\n    display: 'inline-flex',\n    alignItems: 'center',\n    position: 'relative',\n    '& *': commonMqFontStyles,\n    ...supsubStyles,\n    ...longdivStyles,\n    '& > .mq-math-mode': {\n      border: 'solid 1px lightgrey',\n    },\n    '& > .mq-focused': {\n      outline: 'none',\n      boxShadow: 'none',\n      border: 'solid 1px black',\n      borderRadius: '0px',\n    },\n    '& > .mq-math-mode .mq-root-block': {\n      paddingTop: '7px !important',\n    },\n    '& > .mq-math-mode .mq-overarc ': {\n      paddingTop: '0.45em !important',\n    },\n    '& > .mq-math-mode .mq-sqrt-prefix': {\n      verticalAlign: 'baseline !important',\n      top: '1px !important',\n      left: '-0.1em !important',\n    },\n    '& > .mq-math-mode .mq-denominator': {\n      marginTop: '-5px !important',\n      padding: '0.5em 0.1em 0.1em !important',\n    },\n    '& > .mq-math-mode .mq-numerator, .mq-math-mode .mq-over': {\n      padding: '0 0.1em !important',\n      paddingBottom: '0 !important',\n      marginBottom: '-2px',\n    },\n    '& > .mq-math-mode .mq-longdiv .mq-longdiv-inner .mq-empty': {\n      paddingTop: '6px !important',\n      paddingLeft: '4px !important',\n    },\n    '& > .mq-math-mode .mq-longdiv .mq-longdiv-inner': {\n      marginLeft: '0 !important',\n    },\n    '& > .mq-math-mode .mq-overarrow': {\n      fontFamily: 'Roboto, Helvetica, Arial, sans-serif !important',\n    },\n    '& > .mq-math-mode .mq-paren': {\n      verticalAlign: 'top !important',\n      padding: '1px 0.1em !important',\n    },\n\n    '& > .mq-math-mode .mq-sqrt-stem': {\n      borderTop: '0.07em solid',\n      marginLeft: '-1.5px',\n      marginTop: '-2px !important',\n      paddingTop: '5px !important',\n    },\n\n    '& .mq-overarrow-inner': {\n      paddingTop: '0 !important',\n      border: 'none !important',\n    },\n    '& .mq-editable-field .mq-cursor': {\n      marginTop: '-15px !important',\n    },\n    '& .mq-overarrow.mq-arrow-both': {\n      top: '7.5px',\n      marginTop: '0px',\n      minWidth: '1.23em',\n      '& *': {\n        lineHeight: '1 !important',\n      },\n      '&:before': {\n        top: '-0.4em',\n        left: '-1px',\n      },\n      // NOTE: This workaround adds `!important` to enforce the correct positioning and styling\n      // of `.mq-overarrow.mq-arrow-both` elements in MathQuill. This ensures consistent display\n      // regardless of the order in which MathQuill is initialized on our websites.\n      //\n      // In the future, investigate why MathQuill scripts and styles are being initialized\n      // more than once and address the root cause to prevent potential conflicts and ensure\n      // optimal performance.\n      '&:after': {\n        top: '0px !important',\n        position: 'absolute !important',\n        right: '-2px',\n      },\n      '&.mq-empty:after': {\n        top: '-0.45em',\n      },\n    },\n    '& .mq-overarrow.mq-arrow-right': {\n      '&:before': {\n        top: '-0.4em',\n        right: '-1px',\n      },\n    },\n    '& .mq-overarrow-inner-right': {\n      display: 'none !important',\n    },\n    '& .mq-overarrow-inner-left': {\n      display: 'none !important',\n    },\n    '& .mq-longdiv-inner': {\n      borderTop: '1px solid !important',\n      paddingTop: '1.5px !important',\n    },\n    '& .mq-parallelogram': {\n      lineHeight: 0.85,\n    },\n    '& span[data-prime=\"true\"]': {\n      fontFamily: 'Roboto, Helvetica, Arial, sans-serif !important',\n    },\n  },\n  selected: {\n    border: `solid 1px ${theme.palette.primary.main}`,\n    '& > .mq-math-mode': {\n      border: 'solid 0px lightgrey',\n    },\n  },\n  insideOverlay: {\n    position: 'absolute',\n    bottom: 0,\n    left: 0,\n    right: 0,\n    top: 0,\n  },\n});\n\nexport default withStyles(mp)(RawMathPreview);\n"],"file":"math-preview.js"}