@khanacademy/perseus-editor 4.0.0 → 4.1.0

package/CHANGELOG.md

@@ -1,5 +1,20 @@
 # @khanacademy/perseus-editor
 
+## 4.1.0
+
+### Minor Changes
+
+-   [#895](https://github.com/Khan/perseus/pull/895) [`15b4bc02`](https://github.com/Khan/perseus/commit/15b4bc02d65fd1900e01ce7dd35863c1be579d73) Thanks [@jeremywiebe](https://github.com/jeremywiebe)! - Convert ImageEditor compoment to modern React class component
+
+*   [#937](https://github.com/Khan/perseus/pull/937) [`ef898f77`](https://github.com/Khan/perseus/commit/ef898f77f45f3494f5012d2db52a3461aad93c69) Thanks [@nishasy](https://github.com/nishasy)! - bumped mathquill version + minor type updates
+
+### Patch Changes
+
+-   Updated dependencies [[`15b4bc02`](https://github.com/Khan/perseus/commit/15b4bc02d65fd1900e01ce7dd35863c1be579d73), [`0b737502`](https://github.com/Khan/perseus/commit/0b7375023826ef5ee46eb5ae00136b2356e10be4), [`ef898f77`](https://github.com/Khan/perseus/commit/ef898f77f45f3494f5012d2db52a3461aad93c69), [`319e330e`](https://github.com/Khan/perseus/commit/319e330ed77d2145266a9b231693ac65320032a2), [`3bfd44e3`](https://github.com/Khan/perseus/commit/3bfd44e37643cdd13392fbaabb9fb4370378d2b3), [`59ce1e09`](https://github.com/Khan/perseus/commit/59ce1e0990cecd1123d7b9a671b032fcd03ce1b1), [`ef898f77`](https://github.com/Khan/perseus/commit/ef898f77f45f3494f5012d2db52a3461aad93c69), [`f16e4184`](https://github.com/Khan/perseus/commit/f16e4184a24dcdaafc0cb4ebde5651f5bb135df9), [`247f8b1b`](https://github.com/Khan/perseus/commit/247f8b1be0647c39a5cabd9ce72a216d750a707b), [`62e04cfa`](https://github.com/Khan/perseus/commit/62e04cfa3139c6417442cbb96f8012d098a7c279), [`583becef`](https://github.com/Khan/perseus/commit/583becefbf690e96df709bcb7f8150cf686deadf)]:
+    -   @khanacademy/perseus@19.1.0
+    -   @khanacademy/math-input@17.0.0
+    -   @khanacademy/kmath@0.1.9
+
 ## 4.0.0
 
 ### Major Changes

package/dist/es/index.js

@@ -25,7 +25,7 @@ import * as i18n$1 from '@khanacademy/wonder-blocks-i18n';
 
 // This file is processed by a Rollup plugin (replace) to inject the production
 const libName = "@khanacademy/perseus-editor";
-const libVersion = "4.0.0";
+const libVersion = "4.1.0";
 addLibraryVersionToPerseusDebug(libName, libVersion);
 
 function _extends() {
@@ -28112,6 +28112,7 @@ IframeEditor.defaultProps = {
   allowTopNavigation: false
 };
 
+/* eslint-disable jsx-a11y/anchor-is-valid, react/sort-comp */
 const {
   InfoTip: InfoTip$f,
   InlineIcon: InlineIcon$4,
@@ -28136,37 +28137,23 @@ const INTERNALLY_HOSTED_URL_RE = new RegExp("^(https?|web\\+graphie)://[^/]*" +
  * Alignment option for captions, relative to specified coordinates.
  */
 const captionAlignments = ["center", "above", "above right", "right", "below right", "below", "below left", "left", "above left"];
-const ImageEditor = createReactClass({
-  displayName: "ImageEditor",
-  propTypes: _extends({}, Changeable.propTypes),
-  statics: {
-    widgetName: "image"
-  },
-  componentDidMount: function () {
+class ImageEditor extends React.Component {
+  constructor(...args) {
+    super(...args);
+    this._isMounted = false;
+    this.state = {
+      backgroundImageError: ""
+    };
+  }
+  componentDidMount() {
     // TODO(scottgrant): This is a hack to remove the deprecated call to
     // this.isMounted() but is still considered an anti-pattern.
     this._isMounted = true;
-  },
-  componentWillUnmount: function () {
+  }
+  componentWillUnmount() {
     this._isMounted = false;
-  },
-  getDefaultProps: function () {
-    return {
-      title: "",
-      range: [defaultRange, defaultRange],
-      box: [defaultBoxSize, defaultBoxSize],
-      backgroundImage: defaultBackgroundImage$1,
-      labels: [],
-      alt: "",
-      caption: ""
-    };
-  },
-  getInitialState: function () {
-    return {
-      backgroundImageError: ""
-    };
-  },
-  render: function () {
+  }
+  render() {
     const backgroundImage = this.props.backgroundImage;
     const imageSettings = /*#__PURE__*/React.createElement("div", {
       className: "image-settings"
@@ -28207,8 +28194,8 @@ const ImageEditor = createReactClass({
       },
       onChange: url => this.onUrlChange(url, false)
     })), backgroundImage.url && imageSettings);
-  },
-  _renderRowForLabel: function (label, i) {
+  }
+  _renderRowForLabel(label, i) {
     return /*#__PURE__*/React.createElement("tr", {
       key: i
     }, /*#__PURE__*/React.createElement("td", null, /*#__PURE__*/React.createElement(RangeInput$4, {
@@ -28247,19 +28234,19 @@ const ImageEditor = createReactClass({
       ,
       onClick: this.removeLabel.bind(this, i)
     }, /*#__PURE__*/React.createElement(InlineIcon$4, icons.iconTrash))));
-  },
+  }
   change(...args) {
     return Changeable.change.apply(this, args);
-  },
-  removeLabel: function (labelIndex, e) {
+  }
+  removeLabel(labelIndex, e) {
     e.preventDefault();
-    const labels = _(this.props.labels).clone();
+    const labels = [...this.props.labels];
     labels.splice(labelIndex, 1);
     this.props.onChange({
       labels: labels
     });
-  },
-  onCoordinateChange: function (labelIndex, newCoordinates) {
+  }
+  onCoordinateChange(labelIndex, newCoordinates) {
     const labels = this.props.labels.slice();
     labels[labelIndex] = _.extend({}, labels[labelIndex], {
       coordinates: newCoordinates
@@ -28267,8 +28254,8 @@ const ImageEditor = createReactClass({
     this.props.onChange({
       labels: labels
     });
-  },
-  onContentChange: function (labelIndex, e) {
+  }
+  onContentChange(labelIndex, e) {
     const newContent = e.target.value;
     const labels = this.props.labels.slice();
     labels[labelIndex] = _.extend({}, labels[labelIndex], {
@@ -28277,8 +28264,8 @@ const ImageEditor = createReactClass({
     this.props.onChange({
       labels: labels
     });
-  },
-  onAlignmentChange: function (labelIndex, e) {
+  }
+  onAlignmentChange(labelIndex, e) {
     const newAlignment = e.target.value;
     const labels = this.props.labels.slice();
     labels[labelIndex] = _.extend({}, labels[labelIndex], {
@@ -28287,8 +28274,8 @@ const ImageEditor = createReactClass({
     this.props.onChange({
       labels: labels
     });
-  },
-  setUrl: function (url, width, height, silent) {
+  }
+  setUrl(url, width, height, silent) {
     // Because this calls into WidgetEditor._handleWidgetChange, which
     // checks for this widget's ref to serialize it.
     //
@@ -28306,11 +28293,12 @@ const ImageEditor = createReactClass({
       backgroundImage: image,
       box: box
     }, null, silent);
-  },
+  }
+
   // silently load the image when the component mounts
   // silently update url and sizes when the image loads
   // noisily load the image in response to the author changing it
-  onUrlChange: async function (url, silent) {
+  async onUrlChange(url, silent) {
     // Check if we've been passed something that looks like a URL
     if (!url) {
       this.setUrl(url, 0, 0, silent);
@@ -28337,18 +28325,29 @@ const ImageEditor = createReactClass({
         backgroundImageError: `There was an error loading the image URL: ${JSON.stringify(error, null, 2)}`
       });
     }
-  },
-  onRangeChange: function (type, newRange) {
+  }
+  onRangeChange(type, newRange) {
     const range = this.props.range.slice();
     range[type] = newRange;
     this.props.onChange({
       range: range
     });
-  },
+  }
   serialize() {
     return EditorJsonify.serialize.call(this);
   }
-});
+}
+ImageEditor.displayName = "ImageEditor";
+ImageEditor.widgetName = "image";
+ImageEditor.defaultProps = {
+  title: "",
+  range: [defaultRange, defaultRange],
+  box: [defaultBoxSize, defaultBoxSize],
+  backgroundImage: defaultBackgroundImage$1,
+  labels: [],
+  alt: "",
+  caption: ""
+};
 
 /* eslint-disable react/sort-comp */
 const {