@khanacademy/perseus-editor 4.1.6 → 4.1.8

package/dist/components/widget-editor.d.ts

@@ -1,4 +1,5 @@
 import * as React from "react";
+import type Editor from "../editor";
 import type { PerseusWidget } from "@khanacademy/perseus";
 type WidgetEditorProps = {
     id: string;
@@ -11,6 +12,7 @@ type WidgetEditorState = {
     widgetInfo: PerseusWidget;
 };
 declare class WidgetEditor extends React.Component<WidgetEditorProps, WidgetEditorState> {
+    widget: React.RefObject<Editor>;
     constructor(props: WidgetEditorProps);
     UNSAFE_componentWillReceiveProps(nextProps: WidgetEditorProps): void;
     _toggleWidget: (e: React.SyntheticEvent) => void;
@@ -23,7 +25,12 @@ declare class WidgetEditor extends React.Component<WidgetEditorProps, WidgetEdit
         alignment: string | undefined;
         static: boolean | undefined;
         graded: boolean | undefined;
-        options: any;
+        options: {
+            content: string;
+            images: any;
+            replace: any;
+            widgets: Record<any, any>;
+        };
         version: import("../../../perseus/src/perseus-types").Version | undefined;
     };
     render(): React.ReactNode;

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.1.6";
+const libVersion = "4.1.8";
 addLibraryVersionToPerseusDebug(libName, libVersion);
 
 function _extends() {
@@ -20573,6 +20573,7 @@ const _upgradeWidgetInfo = props => {
 class WidgetEditor extends React.Component {
   constructor(props) {
     super(props);
+    this.widget = void 0;
     this._toggleWidget = e => {
       e.preventDefault();
       this.setState({
@@ -20580,11 +20581,10 @@ class WidgetEditor extends React.Component {
       });
     };
     this._handleWidgetChange = (newProps, cb, silent) => {
-      const newWidgetInfo = Object.assign({}, this.state.widgetInfo);
-      newWidgetInfo.options = Object.assign(
-      // eslint-disable-next-line react/no-string-refs
-      // @ts-expect-error - TS2339 - Property 'serialize' does not exist on type 'ReactInstance'.
-      this.refs.widget.serialize(), newProps);
+      var _this$widget$current$, _this$widget$current;
+      const newWidgetInfo = _extends({}, this.state.widgetInfo, {
+        options: _extends({}, this.state.widgetInfo.options, (_this$widget$current$ = (_this$widget$current = this.widget.current) == null ? void 0 : _this$widget$current.serialize()) != null ? _this$widget$current$ : {}, newProps)
+      });
       this.props.onChange(newWidgetInfo, cb, silent);
     };
     this._toggleStatic = e => {
@@ -20601,9 +20601,8 @@ class WidgetEditor extends React.Component {
       this.props.onChange(newWidgetInfo);
     };
     this.getSaveWarnings = () => {
-      // eslint-disable-next-line react/no-string-refs
-      // @ts-expect-error - TS2339 - Property 'getSaveWarnings' does not exist on type 'ReactInstance'.
-      const issuesFunc = this.refs.widget.getSaveWarnings;
+      var _this$widget$current2;
+      const issuesFunc = (_this$widget$current2 = this.widget.current) == null ? void 0 : _this$widget$current2.getSaveWarnings;
       return issuesFunc ? issuesFunc() : [];
     };
     this.serialize = () => {
@@ -20618,7 +20617,7 @@ class WidgetEditor extends React.Component {
         graded: widgetInfo.graded,
         // eslint-disable-next-line react/no-string-refs
         // @ts-expect-error - TS2339 - Property 'serialize' does not exist on type 'ReactInstance'.
-        options: this.refs.widget.serialize(),
+        options: this.widget.current.serialize(),
         version: widgetInfo.version
       };
     };
@@ -20626,6 +20625,7 @@ class WidgetEditor extends React.Component {
       showWidget: false,
       widgetInfo: _upgradeWidgetInfo(props)
     };
+    this.widget = /*#__PURE__*/React.createRef();
   }
 
   // eslint-disable-next-line react/no-unsafe
@@ -20674,10 +20674,8 @@ class WidgetEditor extends React.Component {
       title: "Remove image widget"
     })), /*#__PURE__*/React.createElement("div", {
       className: "perseus-widget-editor-content " + (this.state.showWidget ? "enter" : "leave")
-    }, Ed && /*#__PURE__*/React.createElement(Ed
-    // eslint-disable-next-line react/no-string-refs
-    , _extends({
-      ref: "widget",
+    }, Ed && /*#__PURE__*/React.createElement(Ed, _extends({
+      ref: this.widget,
       onChange: this._handleWidgetChange,
       static: widgetInfo.static,
       apiOptions: this.props.apiOptions
@@ -24374,366 +24372,222 @@ function _objectWithoutPropertiesLoose(source, excluded) {
   return target;
 }
 
-var hubble = {exports: {}};
+var isObject = function isObject(obj) {
+  return obj === Object(obj);
+};
+var merge = function merge() {
+  var obj = {};
+  for (var i = 0; i < arguments.length; i++) {
+    var source = arguments[i];
+    if (source) {
+      for (var prop in source) {
+        obj[prop] = source[prop];
+      }
+    }
+  }
+  return obj;
+};
+var clone = function clone(obj) {
+  if (!isObject(obj)) {
+    return obj;
+  }
+  return Array.isArray(obj) ? obj.slice() : merge(obj);
+};
 
-(function (module, exports) {
-	(function webpackUniversalModuleDefinition(root, factory) {
-	  module.exports = factory();
-	})(commonjsGlobal, function () {
-	  return (/******/function (modules) {
-	      // webpackBootstrap
-	      /******/ // The module cache
-	      /******/
-	      var installedModules = {};
-	      /******/
-	      /******/ // The require function
-	      /******/
-	      function __webpack_require__(moduleId) {
-	        /******/
-	        /******/ // Check if module is in cache
-	        /******/if (installedModules[moduleId]) {
-	          /******/return installedModules[moduleId].exports;
-	          /******/
-	        }
-	        /******/ // Create a new module (and put it into the cache)
-	        /******/
-	        var module = installedModules[moduleId] = {
-	          /******/i: moduleId,
-	          /******/l: false,
-	          /******/exports: {}
-	          /******/
-	        };
-	        /******/
-	        /******/ // Execute the module function
-	        /******/
-	        modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
-	        /******/
-	        /******/ // Flag the module as loaded
-	        /******/
-	        module.l = true;
-	        /******/
-	        /******/ // Return the exports of the module
-	        /******/
-	        return module.exports;
-	        /******/
-	      }
-	      /******/
-	      /******/
-	      /******/ // expose the modules object (__webpack_modules__)
-	      /******/
-	      __webpack_require__.m = modules;
-	      /******/
-	      /******/ // expose the module cache
-	      /******/
-	      __webpack_require__.c = installedModules;
-	      /******/
-	      /******/ // define getter function for harmony exports
-	      /******/
-	      __webpack_require__.d = function (exports, name, getter) {
-	        /******/if (!__webpack_require__.o(exports, name)) {
-	          /******/Object.defineProperty(exports, name, {
-	            /******/configurable: false,
-	            /******/enumerable: true,
-	            /******/get: getter
-	            /******/
-	          });
-	          /******/
-	        }
-	        /******/
-	      };
-	      /******/
-	      /******/ // getDefaultExport function for compatibility with non-harmony modules
-	      /******/
-	      __webpack_require__.n = function (module) {
-	        /******/var getter = module && module.__esModule ? /******/function getDefault() {
-	          return module['default'];
-	        } : /******/function getModuleExports() {
-	          return module;
-	        };
-	        /******/
-	        __webpack_require__.d(getter, 'a', getter);
-	        /******/
-	        return getter;
-	        /******/
-	      };
-	      /******/
-	      /******/ // Object.prototype.hasOwnProperty.call
-	      /******/
-	      __webpack_require__.o = function (object, property) {
-	        return Object.prototype.hasOwnProperty.call(object, property);
-	      };
-	      /******/
-	      /******/ // __webpack_public_path__
-	      /******/
-	      __webpack_require__.p = "";
-	      /******/
-	      /******/ // Load entry module and return exports
-	      /******/
-	      return __webpack_require__(__webpack_require__.s = 1);
-	      /******/
-	    }
-	    /************************************************************************/
-	    /******/([/* 0 */
-	    /***/function (module, exports) {
-	      var isObject = function isObject(obj) {
-	        return obj === Object(obj);
-	      };
-	      var merge = function merge() {
-	        var obj = {};
-	        for (var i = 0; i < arguments.length; i++) {
-	          var source = arguments[i];
-	          if (source) {
-	            for (var prop in source) {
-	              obj[prop] = source[prop];
-	            }
-	          }
-	        }
-	        return obj;
-	      };
-	      var clone = function clone(obj) {
-	        if (!isObject(obj)) {
-	          return obj;
-	        }
-	        return Array.isArray(obj) ? obj.slice() : merge(obj);
-	      };
-	      module.exports = {
-	        isObject: isObject,
-	        merge: merge,
-	        clone: clone
-	      };
+/* TODO batch *all* mutations
+ * idea: freeze / thaw implementations for all types
+ * lens constructor thaws, freeze delegates to type's freeze
+ */
 
-	      /***/
-	    }, /* 1 */
-	    /***/function (module, exports, __webpack_require__) {
-	      /* TODO batch *all* mutations
-	       * idea: freeze / thaw implementations for all types
-	       * lens constructor thaws, freeze delegates to type's freeze
-	       */
-
-	      var util = __webpack_require__(0);
-	      var clone = util.clone;
-	      var isObject = util.isObject;
-	      var merge = util.merge;
-	      var arr = __webpack_require__(2);
-	      var obj = __webpack_require__(3);
-	      var str = __webpack_require__(4);
-
-	      // equivalents, without requiring it
-	      // find the implementation to use for a given object
-	      var dispatch = function dispatch(x) {
-	        if (Array.isArray(x)) {
-	          return arr;
-	        } else if (isObject(x)) {
-	          return obj;
-	        } else if (typeof x === "string") {
-	          return str;
-	        }
-	      };
+// equivalents, without requiring it
+// find the implementation to use for a given object
+var dispatch = function dispatch(x) {
+  if (Array.isArray(x)) {
+    return arr;
+  } else if (isObject(x)) {
+    return obj;
+  } else if (typeof x === "string") {
+    return str;
+  }
+};
 
-	      // This is underscore with a different name
-	      var lens = function lens(obj) {
-	        if (obj instanceof lens) {
-	          return obj;
-	        }
-	        if (!(this instanceof lens)) {
-	          return new lens(obj);
-	        }
-	        var ops = dispatch(obj);
-	        this._wrapped = ops.thaw ? ops.thaw(obj) : obj;
-	      };
-	      lens.prototype.freeze = function () {
-	        var obj = this._wrapped;
-	        var ops = dispatch(obj);
-	        return ops.freeze ? ops.freeze(obj) : obj;
-	      };
-	      lens.prototype.zoom = function (lensArr) {
-	        if (this._zoomStack === undefined) {
-	          this._zoomStack = [];
-	        }
-	        this._zoomStack.push({
-	          zoom: lensArr,
-	          wrapped: this._wrapped
-	        });
-	        this._wrapped = lens(this._wrapped).get(lensArr);
-	        return this;
-	      };
-	      lens.prototype.deZoom = function () {
-	        var frame = this._zoomStack.pop();
-	        this._wrapped = lens(frame.wrapped).set(frame.zoom, this._wrapped).freeze();
-	        return this;
-	      };
-	      lens.prototype.get = function (lensArr) {
-	        var obj = this._wrapped;
-	        for (var i = 0; i < lensArr.length; i++) {
-	          obj = dispatch(obj).get(obj, lensArr[i]);
-	        }
-	        return obj;
-	      };
-	      lens.prototype.mod = function (lensArr, f) {
-	        var obj = this._wrapped;
-	        var newObj = clone(obj);
-	        var ops = dispatch(obj);
-	        if (lensArr.length === 0) {
-	          this._wrapped = f(this._wrapped);
-	        } else if (lensArr.length === 1) {
-	          this._wrapped = ops.mod(newObj, lensArr[0], f);
-	        } else {
-	          var monocle = lensArr[0];
-	          var shortLens = lensArr.slice(1);
+// This is underscore with a different name
+var lens = function lens(obj) {
+  if (obj instanceof lens) {
+    return obj;
+  }
+  if (!(this instanceof lens)) {
+    return new lens(obj);
+  }
+  var ops = dispatch(obj);
+  this._wrapped = ops.thaw ? ops.thaw(obj) : obj;
+};
+lens.prototype.freeze = function () {
+  var obj = this._wrapped;
+  var ops = dispatch(obj);
+  return ops.freeze ? ops.freeze(obj) : obj;
+};
+lens.prototype.zoom = function (lensArr) {
+  if (this._zoomStack === undefined) {
+    this._zoomStack = [];
+  }
+  this._zoomStack.push({
+    zoom: lensArr,
+    wrapped: this._wrapped
+  });
+  this._wrapped = lens(this._wrapped).get(lensArr);
+  return this;
+};
+lens.prototype.deZoom = function () {
+  var frame = this._zoomStack.pop();
+  this._wrapped = lens(frame.wrapped).set(frame.zoom, this._wrapped).freeze();
+  return this;
+};
+lens.prototype.get = function (lensArr) {
+  var obj = this._wrapped;
+  for (var i = 0; i < lensArr.length; i++) {
+    obj = dispatch(obj).get(obj, lensArr[i]);
+  }
+  return obj;
+};
+lens.prototype.mod = function (lensArr, f) {
+  var obj = this._wrapped;
+  var newObj = clone(obj);
+  var ops = dispatch(obj);
+  if (lensArr.length === 0) {
+    this._wrapped = f(this._wrapped);
+  } else if (lensArr.length === 1) {
+    this._wrapped = ops.mod(newObj, lensArr[0], f);
+  } else {
+    var monocle = lensArr[0];
+    var shortLens = lensArr.slice(1);
 
-	          // newObj = ops.mod(obj[monocle], shortLens, f);
+    // newObj = ops.mod(obj[monocle], shortLens, f);
 
-	          newObj[monocle] = lens(obj[monocle]).mod(shortLens, f).freeze();
-	          this._wrapped = newObj;
-	        }
-	        return this;
-	      };
+    newObj[monocle] = lens(obj[monocle]).mod(shortLens, f).freeze();
+    this._wrapped = newObj;
+  }
+  return this;
+};
 
-	      // TODO - move to individual files
-	      lens.prototype.merge = function (lensArr, props) {
-	        this._wrapped = lens(this._wrapped).mod(lensArr, function (oldProps) {
-	          return merge(oldProps, props);
-	        }).freeze();
-	        return this;
-	      };
+// TODO - move to individual files
+lens.prototype.merge = function (lensArr, props) {
+  this._wrapped = lens(this._wrapped).mod(lensArr, function (oldProps) {
+    return merge(oldProps, props);
+  }).freeze();
+  return this;
+};
 
-	      // Lens must have length >= 1 or there would be nothing to return
-	      lens.prototype.del = function (lensArr) {
-	        var obj = this._wrapped;
-	        var ops = dispatch(obj);
-	        if (lensArr.length === 1) {
-	          this._wrapped = ops.del(obj, lensArr[0]);
-	        } else {
-	          var monocle = lensArr[0];
-	          var shortLens = lensArr.slice(1);
-	          var newObj = clone(obj);
-	          newObj[monocle] = lens(obj[monocle]).del(shortLens).freeze();
-	          this._wrapped = newObj;
-	        }
-	        return this;
-	      };
-	      lens.prototype.set = function (lensArr, set) {
-	        return this.mod(lensArr, function () {
-	          return set;
-	        });
-	      };
-	      module.exports = lens;
+// Lens must have length >= 1 or there would be nothing to return
+lens.prototype.del = function (lensArr) {
+  var obj = this._wrapped;
+  var ops = dispatch(obj);
+  if (lensArr.length === 1) {
+    this._wrapped = ops.del(obj, lensArr[0]);
+  } else {
+    var monocle = lensArr[0];
+    var shortLens = lensArr.slice(1);
+    var newObj = clone(obj);
+    newObj[monocle] = lens(obj[monocle]).del(shortLens).freeze();
+    this._wrapped = newObj;
+  }
+  return this;
+};
+lens.prototype.set = function (lensArr, set) {
+  return this.mod(lensArr, function () {
+    return set;
+  });
+};
 
-	      /***/
-	    }, /* 2 */
-	    /***/function (module, exports) {
-	      var get = function get(arr, monocle) {
-	        return arr[monocle];
-	      };
-	      var set = function set(arr, monocle, val) {
-	        var newArr = arr.splice();
-	        newArr[monocle] = val;
-	        return newArr;
-	      };
-	      var mod = function mod(arr, monocle, f) {
-	        var newArr = arr.slice();
-	        newArr[monocle] = f(arr[monocle]);
-	        return newArr;
-	      };
-	      var del = function del(arr, monocle) {
-	        var newArr = arr.slice();
-	        newArr.splice(monocle, 1);
-	        return newArr;
-	      };
+// ARRAY FUNCTIONS
 
-	      /*
-	      // Lens must point to a member of an array. We'll insert into that array.
-	      lens.prototype.insertAt = function(lensArr, toInsert) {
-	          var obj = this._wrapped;
-	      
-	          var arrLens = lensArr.slice(0, -1);
-	          var arr = lens(obj).get(arrLens).slice(); // slice to copy
-	      
-	          var arrIdx = lensArr[lensArr.length-1];
-	          arr.splice(arrIdx, 0, toInsert);
-	          return lens(obj).set(arrLens, arr);
-	      };
-	      
-	      lens.prototype.insertBefore = lens.prototype.insertAt;
-	      lens.prototype.insertAfter = function(lensArr, toInsert) {
-	          var newLens = lensArr.slice();
-	          newLens[newLens.length-1] += 1;
-	          return lens(this._wrapped).insertAt(newLens, toInsert);
-	      };
-	      */
+const arr = {
+  get: function (arr, monocle) {
+    return arr[monocle];
+  },
+  set: function (arr, monocle, val) {
+    var newArr = arr.splice();
+    newArr[monocle] = val;
+    return newArr;
+  },
+  mod: function (arr, monocle, f) {
+    var newArr = arr.slice();
+    newArr[monocle] = f(arr[monocle]);
+    return newArr;
+  },
+  del: function (arr, monocle) {
+    var newArr = arr.slice();
+    newArr.splice(monocle, 1);
+    return newArr;
+  }
+};
 
-	      module.exports = {
-	        get: get,
-	        set: set,
-	        mod: mod,
-	        del: del
-	      };
+/*
+// Lens must point to a member of an array. We'll insert into that array.
+lens.prototype.insertAt = function(lensArr, toInsert) {
+    var obj = this._wrapped;
 
-	      /***/
-	    }, /* 3 */
-	    /***/function (module, exports, __webpack_require__) {
-	      var clone = __webpack_require__(0).clone;
-	      var get = function get(obj, monocle) {
-	        return obj[monocle];
-	      };
-	      var set = function set(obj, monocle, val) {
-	        var newObj = clone(obj);
-	        newObj[monocle] = val;
-	        return newObj;
-	      };
-	      var mod = function mod(obj, monocle, f) {
-	        var newObj = clone(obj);
-	        newObj[monocle] = f(obj[monocle]);
-	        return newObj;
-	      };
-	      var del = function del(obj, monocle) {
-	        var newObj = clone(obj);
-	        delete newObj[monocle];
-	        return newObj;
-	      };
-	      module.exports = {
-	        get: get,
-	        set: set,
-	        mod: mod,
-	        del: del
-	      };
+    var arrLens = lensArr.slice(0, -1);
+    var arr = lens(obj).get(arrLens).slice(); // slice to copy
 
-	      /***/
-	    }, /* 4 */
-	    /***/function (module, exports) {
-	      var get = function get(arr, monocle) {
-	        return arr[monocle];
-	      };
-	      var set = function set(arr, monocle, val) {
-	        var newArr = arr.splice();
-	        newArr[monocle] = val;
-	        return newArr;
-	      };
-	      var mod = function mod(arr, monocle, f) {
-	        var newArr = arr.splice();
-	        newArr[monocle] = f(arr[monocle]);
-	        return newArr;
-	      };
-	      var del = function del(arr, monocle) {
-	        var newArr = arr.slice();
-	        newArr.splice(monocle);
-	        return newArr;
-	      };
-	      module.exports = {
-	        get: get,
-	        set: set,
-	        mod: mod,
-	        del: del
-	      };
+    var arrIdx = lensArr[lensArr.length-1];
+    arr.splice(arrIdx, 0, toInsert);
+    return lens(obj).set(arrLens, arr);
+};
 
-	      /***/
-	    }
-	    /******/])
-	  );
-	});
-} (hubble));
+lens.prototype.insertBefore = lens.prototype.insertAt;
+lens.prototype.insertAfter = function(lensArr, toInsert) {
+    var newLens = lensArr.slice();
+    newLens[newLens.length-1] += 1;
+    return lens(this._wrapped).insertAt(newLens, toInsert);
+};
+*/
+
+// OBJECT FUNCTIONS
+
+const obj = {
+  get: function (obj, monocle) {
+    return obj[monocle];
+  },
+  set: function (obj, monocle, val) {
+    var newObj = clone(obj);
+    newObj[monocle] = val;
+    return newObj;
+  },
+  mod: function (obj, monocle, f) {
+    var newObj = clone(obj);
+    newObj[monocle] = f(obj[monocle]);
+    return newObj;
+  },
+  del: function (obj, monocle) {
+    var newObj = clone(obj);
+    delete newObj[monocle];
+    return newObj;
+  }
+};
+
+// STRING FUNCTIONS
 
-var lens = /*@__PURE__*/getDefaultExportFromCjs(hubble.exports);
+const str = {
+  get: function (arr, monocle) {
+    return arr[monocle];
+  },
+  set: function (arr, monocle, val) {
+    var newArr = arr.splice();
+    newArr[monocle] = val;
+    return newArr;
+  },
+  mod: function (arr, monocle, f) {
+    var newArr = arr.splice();
+    newArr[monocle] = f(arr[monocle]);
+    return newArr;
+  },
+  del: function (arr, monocle) {
+    var newArr = arr.slice();
+    newArr.splice(monocle);
+    return newArr;
+  }
+};
 
 const _excluded$3 = ["children", "color", "onClick"];
 class SimpleButton extends React.Component {