@nteract/mathjax - npm Package Compare versions

Comparing version 3.0.1 to 3.0.3-alpha.0

examples.md

 The MathJax component provides a way to both load MathJax on the page and render MathJax Nodes. Many people love ❤️ beautifully typeset mathematics, and these components are the way to provide it.
 
 ```jsx
-var MathJax = require(".");
+const { Provider, Node } = require("@nteract/mathjax");
 
@@ -10,12 +10,12 @@ const tex = String.raw`f(x) = \int_{-\infty}^\infty
 
-<MathJax.Provider>
+<Provider>
   <p>
-    This is an inline math formula: <MathJax.Node inline>a = b</MathJax.Node>
+    This is an inline math formula: <Node inline>a = b</Node>
     <span> and a block one:</span>
-    <MathJax.Node>{tex}</MathJax.Node>
+    <Node>{tex}</Node>
   </p>
-</MathJax.Provider>;
+</Provider>;
 ```
 
-The components are written in a React 16+ way to both load mathjax through a `<Provider />` and render individual MathJax nodes with `<MathJax.Node />`. React does the heavy lifting of knowing what changed and the `<MathJax.Node>` component triggers having MathJax do what it's good at — _typesetting mathematics_!
+The components are written in a React 16+ way to both load mathjax through a `<Provider />` and render individual MathJax nodes with `<Node />`. React does the heavy lifting of knowing what changed and the `<Node>` component triggers having MathJax do what it's good at — _typesetting mathematics_!
 
@@ -25,3 +25,3 @@ This semi-contrived example shows
 ```jsx
-var MathJax = require(".");
+const { Provider, Node } = require("@nteract/mathjax");
 
@@ -61,3 +61,3 @@ const verbs = ["do", "can", "should", "will"];
     return (
-      <MathJax.Provider options={{ messageStyle: "none" }}>
+      <Provider options={{ messageStyle: "none" }}>
         <p>
@@ -78,6 +78,6 @@ We{" "}
           update
-          <MathJax.Node inline>{"n^" + this.state.exponent}</MathJax.Node> pieces
-          of a paragraph without triggering a MathJax re-render.
+          <Node inline>{"n^" + this.state.exponent}</Node> pieces of a paragraph
+          without triggering a MathJax re-render.
         </p>
-      </MathJax.Provider>
+      </Provider>
     );
@@ -90,8 +90,8 @@ }
 
-If you use `<MathJax.Node />` with no provider, a `<MathJax.Provider />` is created for you automatically.
+If you use `<Node />` with no provider, a `<Provider />` is created for you automatically.
 
 ```jsx
-var MathJax = require(".");
+const { Node } = require("@nteract/mathjax");
 
-<MathJax.Node>a = b</MathJax.Node>;
+<Node>a = b</Node>;
 ```

lib/context.js

 "use strict";
-
-var _interopRequireWildcard = require("@babel/runtime-corejs2/helpers/interopRequireWildcard");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
-var React = _interopRequireWildcard(require("react"));
-
-/*  strict */
-var MathJaxContext = React.createContext({
-  MathJax: null,
-  input: "tex",
-  hasProviderAbove: null
-});
-var _default = MathJaxContext;
-exports.default = _default;
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];
+    result["default"] = mod;
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const React = __importStar(require("react"));
+const contextValue = {
+    MathJax: undefined,
+    input: "tex",
+    hasProviderAbove: undefined
+};
+const MathJaxContext = React.createContext(contextValue);
+exports.default = MathJaxContext;

lib/index.js

 "use strict";
-
-var _interopRequireDefault = require("@babel/runtime-corejs2/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "Node", {
-  enumerable: true,
-  get: function get() {
-    return _node.default;
-  }
-});
-Object.defineProperty(exports, "Text", {
-  enumerable: true,
-  get: function get() {
-    return _text.default;
-  }
-});
-Object.defineProperty(exports, "Context", {
-  enumerable: true,
-  get: function get() {
-    return _context.default;
-  }
-});
-Object.defineProperty(exports, "Provider", {
-  enumerable: true,
-  get: function get() {
-    return _provider.default;
-  }
-});
-exports.default = void 0;
-
-var _node = _interopRequireDefault(require("./node"));
-
-var _text = _interopRequireDefault(require("./text"));
-
-var _context = _interopRequireDefault(require("./context"));
-
-var _provider = _interopRequireDefault(require("./provider"));
-
-//  strict
-var _default = {
-  Node: _node.default,
-  Text: _text.default,
-  Provider: _provider.default,
-  Context: _context.default
-};
-exports.default = _default;
+Object.defineProperty(exports, "__esModule", { value: true });
+var node_1 = require("./node");
+exports.Node = node_1.default;
+var text_1 = require("./text");
+exports.Text = text_1.default;
+var context_1 = require("./context");
+exports.Context = context_1.default;
+var provider_1 = require("./provider");
+exports.Provider = provider_1.default;

lib/load-script.js

 "use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.load = load;
-exports.default = void 0;
 // Extracted from https://github.com/eldargab/load-script
-var defaultOptions = {
-  type: "text/javascript",
-  charset: "utf8",
-  async: false,
-  text: undefined,
-  attrs: undefined
+Object.defineProperty(exports, "__esModule", { value: true });
+const defaultOptions = {
+    type: "text/javascript",
+    charset: "utf8",
+    async: false,
+    text: undefined,
+    attrs: undefined
 };
-
 function load(src, opts, cb) {
-  var head = document.head || document.getElementsByTagName("head")[0];
-  var script = document.createElement("script");
-
-  if (typeof opts === "function") {
-    cb = opts;
-    opts = defaultOptions;
-  }
-
-  opts = opts || defaultOptions;
-
-  cb = cb || function () {};
-
-  script.type = opts.type || "text/javascript";
-  script.charset = opts.charset || "utf8";
-  script.async = "async" in opts ? !!opts.async : true;
-  script.src = src;
-
-  if (opts.attrs) {
-    setAttributes(script, opts.attrs);
-  }
-
-  if (opts.text) {
-    script.text = "" + opts.text;
-  }
-
-  var onend = "onload" in script ? stdOnEnd : ieOnEnd;
-  onend(script, cb); // some good legacy browsers (firefox) fail the 'in' detection above
-  // so as a fallback we always set onload
-  // old IE will ignore this and new IE will set onload
-
-  if (!script.onload) {
-    stdOnEnd(script, cb);
-  }
-
-  head.appendChild(script);
+    const head = document.head || document.getElementsByTagName("head")[0];
+    const script = document.createElement("script");
+    if (typeof opts === "function") {
+        cb = opts;
+        opts = defaultOptions;
+    }
+    opts = opts || defaultOptions;
+    cb = cb || function () { };
+    script.type = opts.type || "text/javascript";
+    script.charset = opts.charset || "utf8";
+    script.async = "async" in opts ? !!opts.async : true;
+    script.src = src;
+    if (opts.attrs) {
+        setAttributes(script, opts.attrs);
+    }
+    if (opts.text) {
+        script.text = "" + opts.text;
+    }
+    const onend = "onload" in script ? stdOnEnd : ieOnEnd;
+    onend(script, cb);
+    // some good legacy browsers (firefox) fail the 'in' detection above
+    // so as a fallback we always set onload
+    // old IE will ignore this and new IE will set onload
+    if (!script.onload) {
+        stdOnEnd(script, cb);
+    }
+    head.appendChild(script);
 }
-
+exports.load = load;
 function setAttributes(script, attrs) {
-  for (var attr in attrs) {
-    script.setAttribute(attr, attrs[attr]);
-  }
+    for (let attr in attrs) {
+        script.setAttribute(attr, attrs[attr]);
+    }
 }
-
 function stdOnEnd(script, cb) {
-  script.onload = function () {
-    this.onerror = this.onload = null;
-    cb(null, script);
-  };
-
-  script.onerror = function () {
-    // this.onload = null here is necessary
-    // because even IE9 works not like others
-    this.onerror = this.onload = null;
-    cb(new Error("Failed to load " + this.src), script);
-  };
+    script.onload = function () {
+        this.onerror = this.onload = null;
+        cb(script);
+    };
+    script.onerror = function () {
+        // this.onload = null here is necessary
+        // because even IE9 works not like others
+        this.onerror = this.onload = null;
+        cb(script, new Error("Failed to load " + this.src));
+    };
 }
-
 function ieOnEnd(script, cb) {
-  script.onreadystatechange = function () {
-    if (this.readyState != "complete" && this.readyState != "loaded") return;
-    this.onreadystatechange = null;
-    cb(null, script); // there is no way to catch loading errors in IE8
-  };
+    script.onreadystatechange = function () {
+        if (this.readyState != "complete" && this.readyState != "loaded")
+            return;
+        this.onreadystatechange = null;
+        cb(script); // there is no way to catch loading errors in IE8
+    };
 }
-
-var _default = load;
-exports.default = _default;
+exports.default = load;

lib/node.js

 "use strict";
-
-var _interopRequireWildcard = require("@babel/runtime-corejs2/helpers/interopRequireWildcard");
-
-var _interopRequireDefault = require("@babel/runtime-corejs2/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs2/helpers/defineProperty"));
-
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime-corejs2/helpers/classCallCheck"));
-
-var _createClass2 = _interopRequireDefault(require("@babel/runtime-corejs2/helpers/createClass"));
-
-var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime-corejs2/helpers/possibleConstructorReturn"));
-
-var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime-corejs2/helpers/getPrototypeOf"));
-
-var _inherits2 = _interopRequireDefault(require("@babel/runtime-corejs2/helpers/inherits"));
-
-var React = _interopRequireWildcard(require("react"));
-
-var _context = _interopRequireDefault(require("./context"));
-
-var _provider = _interopRequireDefault(require("./provider"));
-
-var types = {
-  ascii: "asciimath",
-  tex: "tex"
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];
+    result["default"] = mod;
+    return result;
 };
-
-var MathJaxNode_ =
-/*#__PURE__*/
-function (_React$Component) {
-  (0, _inherits2.default)(MathJaxNode_, _React$Component);
-
-  function MathJaxNode_(props) {
-    var _this;
-
-    (0, _classCallCheck2.default)(this, MathJaxNode_);
-    _this = (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(MathJaxNode_).call(this, props));
-    _this.nodeRef = React.createRef();
-    return _this;
-  }
-  /**
-   * Render the math once the node is mounted
-   */
-
-
-  (0, _createClass2.default)(MathJaxNode_, [{
-    key: "componentDidMount",
-    value: function componentDidMount() {
-      this.typeset();
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const React = __importStar(require("react"));
+const types = {
+    ascii: "asciimath",
+    tex: "tex"
+};
+const context_1 = __importDefault(require("./context"));
+const provider_1 = __importDefault(require("./provider"));
+class MathJaxNode_ extends React.Component {
+    constructor(props) {
+        super(props);
+        this.nodeRef = React.createRef();
     }
     /**
+     * Render the math once the node is mounted
+     */
+    componentDidMount() {
+        this.typeset();
+    }
+    /**
      * Update the jax, force update if the display mode changed
      */
-
-  }, {
-    key: "componentDidUpdate",
-    value: function componentDidUpdate(prevProps) {
-      var forceUpdate = prevProps.inline !== this.props.inline || prevProps.children !== this.props.children;
-      this.typeset(forceUpdate);
+    componentDidUpdate(prevProps) {
+        const forceUpdate = prevProps.inline !== this.props.inline ||
+            prevProps.children !== this.props.children;
+        this.typeset(forceUpdate);
     }
@@ -71,7 +42,4 @@ /**
      */
-
-  }, {
-    key: "componentWillUnmount",
-    value: function componentWillUnmount() {
-      this.clear();
+    componentWillUnmount() {
+        this.clear();
     }
@@ -81,21 +49,14 @@ /**
      */
-
-  }, {
-    key: "clear",
-    value: function clear() {
-      var MathJax = this.props.MathJax;
-
-      if (!MathJax) {
-        return;
-      }
-
-      if (!this.script) {
-        return;
-      }
-
-      var jax = MathJax.Hub.getJaxFor(this.script);
-
-      if (jax) {
-        jax.Remove();
-      }
+    clear() {
+        const MathJax = this.props.MathJax;
+        if (!MathJax) {
+            return;
+        }
+        if (!this.script) {
+            return;
+        }
+        const jax = MathJax.Hub.getJaxFor(this.script);
+        if (jax) {
+            jax.Remove();
+        }
     }
@@ -106,31 +67,23 @@ /**
      */
-
-  }, {
-    key: "typeset",
-    value: function typeset() {
-      var forceUpdate = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
-      var MathJax = this.props.MathJax;
-
-      if (!MathJax || !MathJax.Hub) {
-        throw Error("Could not find MathJax while attempting typeset! It's likely the MathJax script hasn't been loaded or MathJax.Context is not in the hierarchy.");
-      }
-
-      var text = this.props.children;
-
-      if (forceUpdate) {
-        this.clear();
-      }
-
-      if (forceUpdate || !this.script) {
-        this.setScriptText(text);
-      }
-
-      if (!this.script) return;
-      var reprocess = ["Reprocess", MathJax.Hub, this.script];
-
-      if (!this.props.onRender) {
-        MathJax.Hub.Queue(reprocess);
-      } else {
-        MathJax.Hub.Queue(reprocess, this.props.onRender);
-      }
+    typeset(forceUpdate = false) {
+        const { MathJax } = this.props;
+        if (!MathJax || !MathJax.Hub) {
+            throw Error("Could not find MathJax while attempting typeset! It's likely the MathJax script hasn't been loaded or MathJax.Context is not in the hierarchy.");
+        }
+        const text = this.props.children;
+        if (forceUpdate) {
+            this.clear();
+        }
+        if (forceUpdate || !this.script) {
+            this.setScriptText(text);
+        }
+        if (!this.script)
+            return;
+        const reprocess = ["Reprocess", MathJax.Hub, this.script];
+        if (!this.props.onRender) {
+            MathJax.Hub.Queue(reprocess);
+        }
+        else {
+            MathJax.Hub.Queue(reprocess, this.props.onRender);
+        }
     }
@@ -141,85 +94,39 @@ /**
      */
-
-  }, {
-    key: "setScriptText",
-    value: function setScriptText(text) {
-      var inline = this.props.inline;
-      var type = types[this.props.input];
-
-      if (!this.script) {
-        this.script = document.createElement("script");
-        this.script.type = "math/".concat(type, "; ").concat(inline ? "" : "mode=display");
-        this.nodeRef.current.appendChild(this.script);
-      } // It _should_ be defined at this point, we'll just return at this point now
-
-
-      if (!this.script) {
-        return;
-      }
-
-      if ("text" in this.script) {
-        // IE8, etc
+    setScriptText(text) {
+        const inline = this.props.inline;
+        const type = types[this.props.input];
+        if (!this.script) {
+            this.script = document.createElement("script");
+            this.script.type = `math/${type}; ${inline ? "" : "mode=display"}`;
+            this.nodeRef.current.appendChild(this.script);
+        }
+        // It _should_ be defined at this point, we'll just return at this point now
+        if (!this.script) {
+            return;
+        }
         this.script.text = text;
-      } else {
-        this.script.textContent = text;
-      }
     }
-  }, {
-    key: "render",
-    value: function render() {
-      return React.createElement("span", {
-        ref: this.nodeRef
-      });
+    render() {
+        return React.createElement("span", { ref: this.nodeRef });
     }
-  }]);
-  return MathJaxNode_;
-}(React.Component);
-
-var MathJaxNode =
-/*#__PURE__*/
-function (_React$PureComponent) {
-  (0, _inherits2.default)(MathJaxNode, _React$PureComponent);
-
-  function MathJaxNode() {
-    (0, _classCallCheck2.default)(this, MathJaxNode);
-    return (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(MathJaxNode).apply(this, arguments));
-  }
-
-  (0, _createClass2.default)(MathJaxNode, [{
-    key: "render",
-    value: function render() {
-      var _this2 = this;
-
-      return React.createElement(_context.default.Consumer, null, function (_ref) {
-        var MathJax = _ref.MathJax,
-            input = _ref.input,
-            hasProviderAbove = _ref.hasProviderAbove;
-
-        // If there is no <Provider /> in the above tree, create our own
-        if (!hasProviderAbove) {
-          return React.createElement(_provider.default, null, React.createElement(MathJaxNode, _this2.props));
-        }
-
-        if (!MathJax) {
-          return null;
-        }
-
-        return React.createElement(MathJaxNode_, {
-          inline: _this2.props.inline,
-          onRender: _this2.props.onRender,
-          input: input,
-          MathJax: MathJax,
-          hasProviderAbove: hasProviderAbove
-        }, _this2.props.children);
-      });
+}
+class MathJaxNode extends React.PureComponent {
+    render() {
+        return (React.createElement(context_1.default.Consumer, null, ({ MathJax, input, hasProviderAbove }) => {
+            // If there is no <Provider /> in the above tree, create our own
+            if (!hasProviderAbove) {
+                return (React.createElement(provider_1.default, null,
+                    React.createElement(MathJaxNode, Object.assign({}, this.props))));
+            }
+            if (!MathJax) {
+                return null;
+            }
+            return (React.createElement(MathJaxNode_, { inline: this.props.inline, onRender: this.props.onRender, input: input, MathJax: MathJax, hasProviderAbove: hasProviderAbove }, this.props.children));
+        }));
     }
-  }]);
-  return MathJaxNode;
-}(React.PureComponent);
-
-(0, _defineProperty2.default)(MathJaxNode, "defaultProps", {
-  inline: false,
-  onRender: null
-});
-var _default = MathJaxNode;
-exports.default = _default;
+}
+MathJaxNode.defaultProps = {
+    inline: false,
+    onRender: null
+};
+exports.default = MathJaxNode;

lib/provider.js

 "use strict";
-
-var _interopRequireWildcard = require("@babel/runtime-corejs2/helpers/interopRequireWildcard");
-
-var _interopRequireDefault = require("@babel/runtime-corejs2/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
-var _objectSpread2 = _interopRequireDefault(require("@babel/runtime-corejs2/helpers/objectSpread"));
-
-var _keys = _interopRequireDefault(require("@babel/runtime-corejs2/core-js/object/keys"));
-
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime-corejs2/helpers/classCallCheck"));
-
-var _createClass2 = _interopRequireDefault(require("@babel/runtime-corejs2/helpers/createClass"));
-
-var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime-corejs2/helpers/possibleConstructorReturn"));
-
-var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime-corejs2/helpers/getPrototypeOf"));
-
-var _inherits2 = _interopRequireDefault(require("@babel/runtime-corejs2/helpers/inherits"));
-
-var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime-corejs2/helpers/assertThisInitialized"));
-
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs2/helpers/defineProperty"));
-
-var React = _interopRequireWildcard(require("react"));
-
-var _loadScript = _interopRequireDefault(require("./load-script"));
-
-var _context = _interopRequireDefault(require("./context.js"));
-
-//  strict
-
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];
+    result["default"] = mod;
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const React = __importStar(require("react"));
+const load_script_1 = __importDefault(require("./load-script"));
+const context_1 = __importDefault(require("./context"));
 /**
  * MathJax Provider
  */
-var Provider =
-/*#__PURE__*/
-function (_React$Component) {
-  (0, _inherits2.default)(Provider, _React$Component);
-
-  function Provider(props) {
-    var _this;
-
-    (0, _classCallCheck2.default)(this, Provider);
-    _this = (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(Provider).call(this, props));
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)((0, _assertThisInitialized2.default)(_this)), "onLoad", function () {
-      if (typeof MathJax === "undefined" || !MathJax || !MathJax.Hub) {
-        _this.props.onError(new Error("MathJax not really loaded even though onLoad called"));
-
-        return;
-      }
-
-      var options = _this.props.options;
-
-      if (options != null && (0, _keys.default)(options).length > 0) {
-        MathJax.Hub.Config(options);
-      }
-
-      MathJax.Hub.Register.StartupHook("End", function () {
-        if (typeof MathJax === "undefined" || !MathJax) {
-          _this.props.onError(new Error("MathJax became undefined in the middle of processing"));
-
-          return;
+class Provider extends React.Component {
+    constructor(props) {
+        super(props);
+        this.onLoad = () => {
+            if (typeof MathJax === "undefined" || !MathJax || !MathJax.Hub) {
+                this.props.onError(new Error("MathJax not really loaded even though onLoad called"));
+                return;
+            }
+            const options = this.props.options;
+            if (options != null && Object.keys(options).length > 0) {
+                MathJax.Hub.Config(options);
+            }
+            MathJax.Hub.Register.StartupHook("End", () => {
+                if (typeof MathJax === "undefined" || !MathJax) {
+                    this.props.onError(new Error("MathJax became undefined in the middle of processing"));
+                    return;
+                }
+                MathJax.Hub.processSectionDelay = this.props.delay;
+                if (this.props.didFinishTypeset) {
+                    this.props.didFinishTypeset();
+                }
+            });
+            MathJax.Hub.Register.MessageHook("Math Processing Error", (message) => {
+                if (this.props.onError) {
+                    this.props.onError(new Error(message));
+                }
+            });
+            if (this.props.onLoad) {
+                this.props.onLoad();
+            }
+            this.setState({
+                MathJax
+            });
+        };
+        this.state = {
+            MathJax: undefined,
+            input: this.props.input,
+            hasProviderAbove: true
+        };
+    }
+    static getDerivedStateFromProps(props, state) {
+        if (state.input !== props.input) {
+            return Object.assign({}, state, { input: props.input });
         }
-
-        MathJax.Hub.processSectionDelay = _this.props.delay;
-
-        if (_this.props.didFinishTypeset) {
-          _this.props.didFinishTypeset();
+        return null;
+    }
+    componentDidMount() {
+        const src = this.props.src;
+        if (src == null) {
+            return this.onLoad();
         }
-      });
-      MathJax.Hub.Register.MessageHook("Math Processing Error", function (message) {
-        if (_this.props.onError) {
-          _this.props.onError(new Error(message));
+        if (typeof MathJax === "undefined" || !MathJax || !MathJax.Hub) {
+            return load_script_1.default(src, this.onLoad);
         }
-      });
-
-      if (_this.props.onLoad) {
-        _this.props.onLoad();
-      }
-
-      _this.setState({
-        MathJax: MathJax
-      });
-    });
-    _this.state = {
-      MathJax: undefined,
-      input: _this.props.input,
-      hasProviderAbove: true
-    };
-    return _this;
-  }
-
-  (0, _createClass2.default)(Provider, [{
-    key: "componentDidMount",
-    value: function componentDidMount() {
-      var src = this.props.src;
-
-      if (src == null) {
-        return this.onLoad();
-      }
-
-      if (typeof MathJax === "undefined" || !MathJax || !MathJax.Hub) {
-        return (0, _loadScript.default)(src, this.onLoad);
-      }
-
-      this.onLoad();
+        this.onLoad();
     }
-  }, {
-    key: "render",
-    value: function render() {
-      return React.createElement(_context.default.Provider, {
-        value: this.state
-      }, this.props.children);
+    render() {
+        return (React.createElement(context_1.default.Provider, { value: this.state }, this.props.children));
     }
-  }], [{
-    key: "getDerivedStateFromProps",
-    value: function getDerivedStateFromProps(props, state) {
-      if (state.input !== props.input) {
-        return (0, _objectSpread2.default)({}, state, {
-          input: props.input
-        });
-      }
-
-      return null;
+}
+Provider.defaultProps = {
+    src: "https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-MML-AM_CHTML",
+    input: "tex",
+    didFinishTypeset: null,
+    delay: 0,
+    options: {},
+    loading: null,
+    noGate: false,
+    onLoad: null,
+    onError: (err) => {
+        console.error(err);
     }
-  }]);
-  return Provider;
-}(React.Component);
-
-(0, _defineProperty2.default)(Provider, "defaultProps", {
-  src: "https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-MML-AM_CHTML",
-  input: "tex",
-  didFinishTypeset: null,
-  delay: 0,
-  options: {},
-  loading: null,
-  noGate: false,
-  onLoad: null,
-  onError: function onError(err) {
-    console.error(err);
-  }
-});
-var _default = Provider;
-exports.default = _default;
+};
+exports.default = Provider;

lib/text.js

 "use strict";
-
-var _interopRequireWildcard = require("@babel/runtime-corejs2/helpers/interopRequireWildcard");
-
-var _interopRequireDefault = require("@babel/runtime-corejs2/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs2/helpers/defineProperty"));
-
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime-corejs2/helpers/classCallCheck"));
-
-var _createClass2 = _interopRequireDefault(require("@babel/runtime-corejs2/helpers/createClass"));
-
-var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime-corejs2/helpers/possibleConstructorReturn"));
-
-var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime-corejs2/helpers/getPrototypeOf"));
-
-var _inherits2 = _interopRequireDefault(require("@babel/runtime-corejs2/helpers/inherits"));
-
-var React = _interopRequireWildcard(require("react"));
-
-var _context = _interopRequireDefault(require("./context"));
-
-var _provider = _interopRequireDefault(require("./provider"));
-
-var MathJaxText_ =
-/*#__PURE__*/
-function (_React$Component) {
-  (0, _inherits2.default)(MathJaxText_, _React$Component);
-
-  function MathJaxText_(props) {
-    var _this;
-
-    (0, _classCallCheck2.default)(this, MathJaxText_);
-    _this = (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(MathJaxText_).call(this, props));
-    _this.nodeRef = React.createRef();
-    return _this;
-  }
-
-  (0, _createClass2.default)(MathJaxText_, [{
-    key: "componentDidMount",
-    value: function componentDidMount() {
-      this.typeset();
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];
+    result["default"] = mod;
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const React = __importStar(require("react"));
+const context_1 = __importDefault(require("./context"));
+const provider_1 = __importDefault(require("./provider"));
+class MathJaxText_ extends React.Component {
+    constructor(props) {
+        super(props);
+        this.nodeRef = React.createRef();
     }
-  }, {
-    key: "componentDidUpdate",
-    value: function componentDidUpdate() {
-      this.typeset();
+    componentDidMount() {
+        this.typeset();
     }
-  }, {
-    key: "typeset",
-    value: function typeset() {
-      var MathJax = this.props.MathJax;
-
-      if (!MathJax || !MathJax.Hub) {
-        throw Error("Could not find MathJax while attempting typeset! It's likely the MathJax script hasn't been loaded or MathJax.Context is not in the hierarchy.");
-      }
-
-      var typeset = ["Typeset", MathJax.Hub, this.nodeRef.current];
-
-      if (!this.props.onRender) {
-        MathJax.Hub.Queue(typeset);
-      } else {
-        MathJax.Hub.Queue(typeset, this.props.onRender);
-      }
+    componentDidUpdate() {
+        this.typeset();
     }
-  }, {
-    key: "render",
-    value: function render() {
-      return React.createElement("div", {
-        ref: this.nodeRef
-      }, this.props.children);
-    }
-  }]);
-  return MathJaxText_;
-}(React.Component);
-
-var MathJaxText =
-/*#__PURE__*/
-function (_React$PureComponent) {
-  (0, _inherits2.default)(MathJaxText, _React$PureComponent);
-
-  function MathJaxText() {
-    (0, _classCallCheck2.default)(this, MathJaxText);
-    return (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(MathJaxText).apply(this, arguments));
-  }
-
-  (0, _createClass2.default)(MathJaxText, [{
-    key: "render",
-    value: function render() {
-      var _this2 = this;
-
-      return React.createElement(_context.default.Consumer, null, function (_ref) {
-        var MathJax = _ref.MathJax,
-            input = _ref.input,
-            hasProviderAbove = _ref.hasProviderAbove;
-
-        // If there is no <Provider /> in the above tree, create our own
-        if (!hasProviderAbove) {
-          return React.createElement(_provider.default, null, React.createElement(MathJaxText, _this2.props));
+    typeset() {
+        const { MathJax } = this.props;
+        if (!MathJax || !MathJax.Hub) {
+            throw Error("Could not find MathJax while attempting typeset! It's likely the MathJax script hasn't been loaded or MathJax.Context is not in the hierarchy.");
         }
-
-        if (!MathJax) {
-          return null;
+        const typeset = ["Typeset", MathJax.Hub, this.nodeRef.current];
+        if (!this.props.onRender) {
+            MathJax.Hub.Queue(typeset);
         }
-
-        return React.createElement(MathJaxText_, {
-          onRender: _this2.props.onRender,
-          input: input,
-          MathJax: MathJax,
-          hasProviderAbove: hasProviderAbove
-        }, _this2.props.children);
-      });
+        else {
+            MathJax.Hub.Queue(typeset, this.props.onRender);
+        }
     }
-  }]);
-  return MathJaxText;
-}(React.PureComponent);
-
-(0, _defineProperty2.default)(MathJaxText, "defaultProps", {
-  onRender: null
-});
-var _default = MathJaxText;
-exports.default = _default;
+    render() {
+        return React.createElement("div", { ref: this.nodeRef }, this.props.children);
+    }
+}
+class MathJaxText extends React.PureComponent {
+    render() {
+        return (React.createElement(context_1.default.Consumer, null, ({ MathJax, input, hasProviderAbove }) => {
+            // If there is no <Provider /> in the above tree, create our own
+            if (!hasProviderAbove) {
+                return (React.createElement(provider_1.default, null,
+                    React.createElement(MathJaxText, Object.assign({}, this.props))));
+            }
+            if (!MathJax) {
+                return null;
+            }
+            return (React.createElement(MathJaxText_, { onRender: this.props.onRender, input: input, MathJax: MathJax, hasProviderAbove: hasProviderAbove }, this.props.children));
+        }));
+    }
+}
+MathJaxText.defaultProps = {
+    onRender: null
+};
+exports.default = MathJaxText;

package.json

 {
   "name": "@nteract/mathjax",
-  "version": "3.0.1",
+  "version": "3.0.3-alpha.0",
   "description": "React components for MathJax",
   "main": "lib/index.js",
-  "nteractDesktop": "src/index.js",
+  "types": "lib/index.d.ts",
+  "nteractDesktop": "src/index.ts",
   "publishConfig": {
     "access": "public"
   },
-  "scripts": {
-    "prepare": "npm run build",
-    "prepublishOnly": "npm run build && npm run build:flow",
-    "build": "npm run build:clean && npm run build:lib",
-    "build:clean": "rimraf lib",
-    "build:flow": "flow-copy-source -v -i '**/__tests__/**' src lib",
-    "build:lib": "babel -d lib src --ignore '**/__tests__/**' --config-file ../../babel.config.js",
-    "build:lib:watch": "npm run build:lib -- --watch",
-    "build:watch": "npm run build:clean && npm run build:lib:watch && npm run build:flow"
-  },
+  "scripts": {},
   "repository": "https://github.com/nteract/nteract/tree/master/packages/mathjax",
@@ -26,7 +18,3 @@ "keywords": [
   "license": "BSD-3-Clause",
-  "dependencies": {
-    "@babel/runtime-corejs2": "^7.0.0",
-    "babel-runtime": "^6.26.0"
-  },
-  "gitHead": "e4bdb34c3c0402b67e32c6f224f793558157977d"
+  "gitHead": "9ef8b723c581862d5c56b7ffd62a21393e7d83b9"
 }

README.md

@@ -1,12 +0,23 @@
-# MathJax React components for nteract usage
+# @nteract/actions
 
-There are two main components to work with, `<MathJax.Context>` and
-`<MathJax.Node>`. The `<MathJax.Context>` component loads MathJax and makes it
-available to children elements via the React context API. `<MathJax.Node>` takes
-raw text for rendering and has MathJax do the heavy lifting.
+This package contains two main components, `<MathJax.Context>` and `<MathJax.Node>`. The `<MathJax.Context>` component loads MathJax and makes it available to children elements via the React Context API. `<MathJax.Node>` takes raw text for rendering and uses MathJax to render formatted math.
 
-```js
+## Installation
+
+```
+$ yarn add @nteract/mathjax
+```
+
+```
+$ npm install --save @nteract/mathjax
+```
+
+## Usage
+
+The Redux reducer below shows how we can leverage the actions and action types in this package to create a reducer for managing the status of a save event.
+
+```javascript
 import MathJax from "@nteract/mathjax";
 
-const PrettyMath = text => {
+export default text => {
   return (
@@ -20,1 +31,13 @@ <MathJax.Context>
 ```
+
+## Documentation
+
+You can view the reference documentation for `@nteract/mathjax` in the [component docs](https://components.nteract.io/#nteractmathjax).
+
+## Support
+
+If you experience an issue while using this package or have a feature request, please file an issue on the [issue board](https://github.com/nteract/nteract/issues/new/choose) and add the `pkg:mathjax` label.
+
+## License
+
+[BSD-3-Clause](https://choosealicense.com/licenses/bsd-3-clause/)

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Dependency count

0

decreased by-100%

Number of package files

27

increased by35%

Number of lines in readme file

43

increased by115%

Worsened metrics

Total package byte prevSize

36321

decreased by-5.18%

Lines of code

960

decreased by-2.83%

Number of low quality alerts

2

increased by100%

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• - Removed@babel/runtime-corejs2@^7.0.0

• - Removedbabel-runtime@^6.26.0

• - Removed@babel/runtime-corejs2@7.26.0(transitive)

• - Removedbabel-runtime@6.26.0(transitive)

• - Removedcore-js@2.6.12(transitive)

• - Removedregenerator-runtime@0.11.10.14.1(transitive)