@khanacademy/perseus-editor 1.1.0 → 2.0.0

package/src/widgets/{interaction-editor.jsx → interaction-editor.tsx}

@@ -1,5 +1,4 @@
 /* eslint-disable @babel/no-invalid-this, react/no-unsafe, react/sort-comp */
-// @flow
 import {
     components,
     Changeable,
@@ -16,9 +15,9 @@ import PropTypes from "prop-types";
 import * as React from "react";
 import _ from "underscore";
 
-import GraphSettings from "../components/graph-settings.jsx";
+import GraphSettings from "../components/graph-settings";
 
-import ConstraintEditor from "./interaction/constraint-editor.jsx";
+import ConstraintEditor from "./interaction/constraint-editor";
 
 const {MathInput, NumberInput, TextInput} = components;
 const {getDependencies} = Dependencies;
@@ -37,9 +36,9 @@ const defaultInteractionProps = {
         markings: "graph",
     },
     elements: [],
-};
+} as const;
 
-type PointEditorProps = $FlowFixMe;
+type PointEditorProps = any;
 
 //
 // Editor for non-interactive points
@@ -60,7 +59,7 @@ class PointEditor extends React.Component<PointEditorProps> {
         color: KhanColors.BLACK,
     };
 
-    render(): React.Node {
+    render(): React.ReactNode {
         const {TeX} = getDependencies();
 
         return (
@@ -71,6 +70,7 @@ class PointEditor extends React.Component<PointEditorProps> {
                         buttonSets={[]}
                         buttonsVisible="never"
                         value={this.props.coordX}
+                        // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
                         onChange={this.change("coordX")}
                     />
                     <TeX>,</TeX>{" "}
@@ -78,6 +78,7 @@ class PointEditor extends React.Component<PointEditorProps> {
                         buttonSets={[]}
                         buttonsVisible="never"
                         value={this.props.coordY}
+                        // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
                         onChange={this.change("coordY")}
                     />
                     <TeX>\Large)</TeX>
@@ -85,6 +86,7 @@ class PointEditor extends React.Component<PointEditorProps> {
                 <div className="perseus-widget-row">
                     <ColorPicker
                         value={this.props.color}
+                        // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
                         onChange={this.change("color")}
                     />
                 </div>
@@ -92,7 +94,7 @@ class PointEditor extends React.Component<PointEditorProps> {
         );
     }
 
-    change: ($FlowFixMe, $FlowFixMe, $FlowFixMe) => $FlowFixMe = (...args) => {
+    change: (arg1: any, arg2: any, arg3: any) => any = (...args) => {
         return Changeable.change.apply(this, args);
     };
 
@@ -101,7 +103,7 @@ class PointEditor extends React.Component<PointEditorProps> {
     };
 }
 
-type LineEditorProps = $FlowFixMe;
+type LineEditorProps = any;
 
 //
 // Editor for non-interactive line segments
@@ -132,7 +134,7 @@ class LineEditor extends React.Component<LineEditorProps> {
         strokeWidth: 2,
     };
 
-    render(): React.Node {
+    render(): React.ReactNode {
         const {TeX} = getDependencies();
 
         return (
@@ -143,6 +145,7 @@ class LineEditor extends React.Component<LineEditorProps> {
                         buttonSets={[]}
                         buttonsVisible="never"
                         value={this.props.startX}
+                        // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
                         onChange={this.change("startX")}
                     />
                     <TeX>,</TeX>{" "}
@@ -150,6 +153,7 @@ class LineEditor extends React.Component<LineEditorProps> {
                         buttonSets={[]}
                         buttonsVisible="never"
                         value={this.props.startY}
+                        // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
                         onChange={this.change("startY")}
                     />
                     <TeX>\Large)</TeX>
@@ -160,6 +164,7 @@ class LineEditor extends React.Component<LineEditorProps> {
                         buttonSets={[]}
                         buttonsVisible="never"
                         value={this.props.endX}
+                        // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
                         onChange={this.change("endX")}
                     />
                     <TeX>,</TeX>{" "}
@@ -167,6 +172,7 @@ class LineEditor extends React.Component<LineEditorProps> {
                         buttonSets={[]}
                         buttonsVisible="never"
                         value={this.props.endY}
+                        // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
                         onChange={this.change("endY")}
                     />
                     <TeX>\Large)</TeX>
@@ -174,17 +180,20 @@ class LineEditor extends React.Component<LineEditorProps> {
                 <div className="perseus-widget-row">
                     <ColorPicker
                         value={this.props.color}
+                        // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
                         onChange={this.change("color")}
                     />
                 </div>
                 <div className="perseus-widget-row">
                     <DashPicker
                         value={this.props.strokeDasharray}
+                        // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
                         onChange={this.change("strokeDasharray")}
                     />
                     &nbsp; &nbsp;
                     <ArrowPicker
                         value={this.props.arrows}
+                        // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
                         onChange={this.change("arrows")}
                     />
                 </div>
@@ -194,6 +203,7 @@ class LineEditor extends React.Component<LineEditorProps> {
                         <NumberInput
                             value={this.props.strokeWidth}
                             placeholder={2}
+                            // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
                             onChange={this.change("strokeWidth")}
                         />
                     </div>
@@ -202,7 +212,7 @@ class LineEditor extends React.Component<LineEditorProps> {
         );
     }
 
-    change: ($FlowFixMe, $FlowFixMe, $FlowFixMe) => $FlowFixMe = (...args) => {
+    change: (arg1: any, arg2: any, arg3: any) => any = (...args) => {
         return Changeable.change.apply(this, args);
     };
 
@@ -211,7 +221,7 @@ class LineEditor extends React.Component<LineEditorProps> {
     };
 }
 
-type MovablePointEditorProps = $FlowFixMe;
+type MovablePointEditorProps = any;
 
 //
 // Editor for interactive movable points
@@ -241,7 +251,7 @@ class MovablePointEditor extends React.Component<MovablePointEditorProps> {
         constraintYMax: "10",
     };
 
-    render(): React.Node {
+    render(): React.ReactNode {
         const {TeX} = getDependencies();
 
         return (
@@ -271,6 +281,7 @@ class MovablePointEditor extends React.Component<MovablePointEditorProps> {
                         onChange={this.change("varSubscript")}
                     />
                 </div>
+                {/* @ts-expect-error [FEI-5003] - TS2769 - No overload matches this call. */}
                 <ConstraintEditor {...this.props} />
             </div>
         );
@@ -285,7 +296,7 @@ class MovablePointEditor extends React.Component<MovablePointEditorProps> {
     };
 }
 
-type MovableLineEditorProps = $FlowFixMe;
+type MovableLineEditorProps = any;
 
 //
 // Editor for interactive movable line segments
@@ -319,7 +330,7 @@ class MovableLineEditor extends React.Component<MovableLineEditorProps> {
         constraintYMax: "10",
     };
 
-    render(): React.Node {
+    render(): React.ReactNode {
         const {TeX} = getDependencies();
 
         return (
@@ -378,6 +389,7 @@ class MovableLineEditor extends React.Component<MovableLineEditorProps> {
                 <div className="perseus-widget-row">
                     All constraints are applied to the start point.
                 </div>
+                {/* @ts-expect-error [FEI-5003] - TS2769 - No overload matches this call. */}
                 <ConstraintEditor {...this.props} />
             </div>
         );
@@ -392,7 +404,7 @@ class MovableLineEditor extends React.Component<MovableLineEditorProps> {
     };
 }
 
-type FunctionEditorProps = $FlowFixMe;
+type FunctionEditorProps = any;
 
 //
 // Editor for function plots
@@ -419,7 +431,7 @@ class FunctionEditor extends React.Component<FunctionEditorProps> {
         strokeWidth: 2,
     };
 
-    render(): React.Node {
+    render(): React.ReactNode {
         const {TeX} = getDependencies();
 
         return (
@@ -430,6 +442,7 @@ class FunctionEditor extends React.Component<FunctionEditorProps> {
                         buttonSets={[]}
                         buttonsVisible="never"
                         value={this.props.value}
+                        // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
                         onChange={this.change("value")}
                     />
                 </div>
@@ -439,6 +452,7 @@ class FunctionEditor extends React.Component<FunctionEditorProps> {
                         buttonSets={[]}
                         buttonsVisible="never"
                         value={this.props.rangeMin}
+                        // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
                         onChange={this.change("rangeMin")}
                     />
                     <TeX>,</TeX>{" "}
@@ -446,6 +460,7 @@ class FunctionEditor extends React.Component<FunctionEditorProps> {
                         buttonSets={[]}
                         buttonsVisible="never"
                         value={this.props.rangeMax}
+                        // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
                         onChange={this.change("rangeMax")}
                     />
                     <TeX>\Large)</TeX>
@@ -453,12 +468,14 @@ class FunctionEditor extends React.Component<FunctionEditorProps> {
                 <div className="perseus-widget-row">
                     <ColorPicker
                         value={this.props.color}
+                        // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
                         onChange={this.change("color")}
                     />
                 </div>
                 <div className="perseus-widget-row">
                     <DashPicker
                         value={this.props.strokeDasharray}
+                        // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
                         onChange={this.change("strokeDasharray")}
                     />
                 </div>
@@ -468,6 +485,7 @@ class FunctionEditor extends React.Component<FunctionEditorProps> {
                         <NumberInput
                             value={this.props.strokeWidth}
                             placeholder={2}
+                            // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
                             onChange={this.change("strokeWidth")}
                         />
                     </div>
@@ -476,7 +494,7 @@ class FunctionEditor extends React.Component<FunctionEditorProps> {
         );
     }
 
-    change: ($FlowFixMe, $FlowFixMe, $FlowFixMe) => $FlowFixMe = (...args) => {
+    change: (arg1: any, arg2: any, arg3: any) => any = (...args) => {
         return Changeable.change.apply(this, args);
     };
 
@@ -485,7 +503,7 @@ class FunctionEditor extends React.Component<FunctionEditorProps> {
     };
 }
 
-type ParametricEditorProps = $FlowFixMe;
+type ParametricEditorProps = any;
 
 //
 // Editor for parametric plots
@@ -514,7 +532,7 @@ class ParametricEditor extends React.Component<ParametricEditorProps> {
         strokeWidth: 2,
     };
 
-    render(): React.Node {
+    render(): React.ReactNode {
         const {TeX} = getDependencies();
 
         return (
@@ -525,6 +543,7 @@ class ParametricEditor extends React.Component<ParametricEditorProps> {
                         buttonSets={[]}
                         buttonsVisible="never"
                         value={this.props.x}
+                        // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
                         onChange={this.change("x")}
                     />
                 </div>
@@ -534,6 +553,7 @@ class ParametricEditor extends React.Component<ParametricEditorProps> {
                         buttonSets={[]}
                         buttonsVisible="never"
                         value={this.props.y}
+                        // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
                         onChange={this.change("y")}
                     />
                 </div>
@@ -543,6 +563,7 @@ class ParametricEditor extends React.Component<ParametricEditorProps> {
                         buttonSets={[]}
                         buttonsVisible="never"
                         value={this.props.rangeMin}
+                        // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
                         onChange={this.change("rangeMin")}
                     />
                     <TeX>,</TeX>{" "}
@@ -550,6 +571,7 @@ class ParametricEditor extends React.Component<ParametricEditorProps> {
                         buttonSets={[]}
                         buttonsVisible="never"
                         value={this.props.rangeMax}
+                        // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
                         onChange={this.change("rangeMax")}
                     />
                     <TeX>\Large)</TeX>
@@ -557,12 +579,14 @@ class ParametricEditor extends React.Component<ParametricEditorProps> {
                 <div className="perseus-widget-row">
                     <ColorPicker
                         value={this.props.color}
+                        // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
                         onChange={this.change("color")}
                     />
                 </div>
                 <div className="perseus-widget-row">
                     <DashPicker
                         value={this.props.strokeDasharray}
+                        // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
                         onChange={this.change("strokeDasharray")}
                     />
                 </div>
@@ -572,6 +596,7 @@ class ParametricEditor extends React.Component<ParametricEditorProps> {
                         <NumberInput
                             value={this.props.strokeWidth}
                             placeholder={2}
+                            // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
                             onChange={this.change("strokeWidth")}
                         />
                     </div>
@@ -580,7 +605,7 @@ class ParametricEditor extends React.Component<ParametricEditorProps> {
         );
     }
 
-    change: ($FlowFixMe, $FlowFixMe, $FlowFixMe) => $FlowFixMe = (...args) => {
+    change: (arg1: any, arg2: any, arg3: any) => any = (...args) => {
         return Changeable.change.apply(this, args);
     };
 
@@ -589,7 +614,7 @@ class ParametricEditor extends React.Component<ParametricEditorProps> {
     };
 }
 
-type LabelEditorProps = $FlowFixMe;
+type LabelEditorProps = any;
 
 //
 // Editor for labels
@@ -613,7 +638,7 @@ class LabelEditor extends React.Component<LabelEditorProps> {
         label: "\\phi",
     };
 
-    render(): React.Node {
+    render(): React.ReactNode {
         const {TeX} = getDependencies();
 
         return (
@@ -621,6 +646,7 @@ class LabelEditor extends React.Component<LabelEditorProps> {
                 <div className="perseus-widget-row">
                     <TextInput
                         value={this.props.label}
+                        // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
                         onChange={this.change("label")}
                         style={{
                             width: "100%",
@@ -633,6 +659,7 @@ class LabelEditor extends React.Component<LabelEditorProps> {
                         buttonSets={[]}
                         buttonsVisible="never"
                         value={this.props.coordX}
+                        // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
                         onChange={this.change("coordX")}
                     />
                     <TeX>,</TeX>{" "}
@@ -640,6 +667,7 @@ class LabelEditor extends React.Component<LabelEditorProps> {
                         buttonSets={[]}
                         buttonsVisible="never"
                         value={this.props.coordY}
+                        // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
                         onChange={this.change("coordY")}
                     />
                     <TeX>\Large)</TeX>
@@ -647,6 +675,7 @@ class LabelEditor extends React.Component<LabelEditorProps> {
                 <div className="perseus-widget-row">
                     <ColorPicker
                         value={this.props.color}
+                        // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
                         onChange={this.change("color")}
                     />
                 </div>
@@ -654,7 +683,7 @@ class LabelEditor extends React.Component<LabelEditorProps> {
         );
     }
 
-    change: ($FlowFixMe, $FlowFixMe, $FlowFixMe) => $FlowFixMe = (...args) => {
+    change: (arg1: any, arg2: any, arg3: any) => any = (...args) => {
         return Changeable.change.apply(this, args);
     };
 
@@ -663,7 +692,7 @@ class LabelEditor extends React.Component<LabelEditorProps> {
     };
 }
 
-type RectangleEditorProps = $FlowFixMe;
+type RectangleEditorProps = any;
 
 //
 // Editor for rectangles
@@ -688,7 +717,7 @@ class RectangleEditor extends React.Component<RectangleEditorProps> {
         color: KhanColors.LIGHT_BLUE,
     };
 
-    render(): React.Node {
+    render(): React.ReactNode {
         const {TeX} = getDependencies();
 
         return (
@@ -699,6 +728,7 @@ class RectangleEditor extends React.Component<RectangleEditorProps> {
                         buttonSets={[]}
                         buttonsVisible="never"
                         value={this.props.coordX}
+                        // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
                         onChange={this.change("coordX")}
                     />
                     <TeX>,</TeX>{" "}
@@ -706,6 +736,7 @@ class RectangleEditor extends React.Component<RectangleEditorProps> {
                         buttonSets={[]}
                         buttonsVisible="never"
                         value={this.props.coordY}
+                        // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
                         onChange={this.change("coordY")}
                     />
                     <TeX>\Large)</TeX>
@@ -716,6 +747,7 @@ class RectangleEditor extends React.Component<RectangleEditorProps> {
                         buttonSets={[]}
                         buttonsVisible="never"
                         value={this.props.width}
+                        // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
                         onChange={this.change("width")}
                     />
                 </div>
@@ -725,6 +757,7 @@ class RectangleEditor extends React.Component<RectangleEditorProps> {
                         buttonSets={[]}
                         buttonsVisible="never"
                         value={this.props.height}
+                        // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
                         onChange={this.change("height")}
                     />
                 </div>
@@ -732,6 +765,7 @@ class RectangleEditor extends React.Component<RectangleEditorProps> {
                     <ColorPicker
                         value={this.props.color}
                         lightColors={true}
+                        // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
                         onChange={this.change("color")}
                     />
                 </div>
@@ -742,7 +776,7 @@ class RectangleEditor extends React.Component<RectangleEditorProps> {
         );
     }
 
-    change: ($FlowFixMe, $FlowFixMe, $FlowFixMe) => $FlowFixMe = (...args) => {
+    change: (arg1: any, arg2: any, arg3: any) => any = (...args) => {
         return Changeable.change.apply(this, args);
     };
 
@@ -751,12 +785,12 @@ class RectangleEditor extends React.Component<RectangleEditorProps> {
     };
 }
 
-type InteractionEditorProps = $FlowFixMe;
-type InteractionEditorState = $FlowFixMe;
+type InteractionEditorProps = any;
+type InteractionEditorState = any;
 
 class InteractionEditor extends React.Component<
     InteractionEditorProps,
-    InteractionEditorState,
+    InteractionEditorState
 > {
     // TODO(eater): Make more better
     static propTypes = {
@@ -766,7 +800,7 @@ class InteractionEditor extends React.Component<
         graph: PropTypes.objectOf(PropTypes.any),
     };
 
-    static widgetName: "interaction" = "interaction";
+    static widgetName = "interaction" as const;
     static defaultProps: InteractionEditorProps = defaultInteractionProps;
 
     state: InteractionEditorState = {
@@ -781,9 +815,7 @@ class InteractionEditor extends React.Component<
         });
     }
 
-    _getAllVarSubscripts(
-        elements: $ReadOnlyArray<$FlowFixMe>,
-    ): $ReadOnlyArray<$FlowFixMe> {
+    _getAllVarSubscripts(elements: ReadonlyArray<any>): ReadonlyArray<any> {
         return _.map(
             _.where(elements, {type: "movable-point"}),
             (element) => element.options.varSubscript,
@@ -802,18 +834,17 @@ class InteractionEditor extends React.Component<
             );
     }
 
-    _getAllFunctionNames(
-        elements: $ReadOnlyArray<$FlowFixMe>,
-    ): $ReadOnlyArray<string> {
+    _getAllFunctionNames(elements: ReadonlyArray<any>): ReadonlyArray<string> {
         return _.map(
             _.where(elements, {type: "function"}),
             (element) => element.options.funcName,
         );
     }
 
-    _updateGraphProps: ($FlowFixMe) => $FlowFixMe = (newProps) => {
+    _updateGraphProps: (arg1: any) => any = (newProps) => {
         // TODO(eater): GraphSettings should name this tickStep instead
         // of step. Grr..
+        // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
         this.change({
             graph: _.extend(_.omit(newProps, "step"), {
                 tickStep: newProps.step,
@@ -821,7 +852,9 @@ class InteractionEditor extends React.Component<
         });
     };
 
-    _addNewElement: (SyntheticInputEvent<>) => void = (e) => {
+    _addNewElement: (arg1: React.ChangeEvent<HTMLInputElement>) => void = (
+        e,
+    ) => {
         const elementType = e.target.value;
         if (elementType === "") {
             return;
@@ -851,17 +884,20 @@ class InteractionEditor extends React.Component<
                     : elementType === "rectangle"
                     ? _.clone(RectangleEditor.defaultProps)
                     : {},
-        };
+        } as const;
 
         let nextSubscript;
         if (elementType === "movable-point") {
             nextSubscript =
                 _.max([_.max(this.state.usedVarSubscripts), -1]) + 1;
+            // @ts-expect-error [FEI-5003] - TS2339 - Property 'varSubscript' does not exist on type '{}'.
             newElement.options.varSubscript = nextSubscript;
         } else if (elementType === "movable-line") {
             nextSubscript =
                 _.max([_.max(this.state.usedVarSubscripts), -1]) + 1;
+            // @ts-expect-error [FEI-5003] - TS2339 - Property 'startSubscript' does not exist on type '{}'.
             newElement.options.startSubscript = nextSubscript;
+            // @ts-expect-error [FEI-5003] - TS2339 - Property 'endSubscript' does not exist on type '{}'.
             newElement.options.endSubscript = nextSubscript + 1;
         } else if (elementType === "function") {
             // TODO(eater): The 22nd function added will be {(x) since '{'
@@ -876,41 +912,47 @@ class InteractionEditor extends React.Component<
                     "e".charCodeAt(0),
                 ]) + 1,
             );
+            // @ts-expect-error [FEI-5003] - TS2339 - Property 'funcName' does not exist on type '{}'.
             newElement.options.funcName = nextLetter;
         }
+        // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
         this.change({
             elements: this.props.elements.concat(newElement),
         });
     };
 
-    _deleteElement: (number) => void = (index) => {
+    _deleteElement: (arg1: number) => void = (index) => {
         const element = this.props.elements[index];
+        // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
         this.change({elements: _.without(this.props.elements, element)});
     };
 
-    _moveElementUp: (number) => void = (index) => {
+    _moveElementUp: (arg1: number) => void = (index) => {
         const element = this.props.elements[index];
         const newElements = _.without(this.props.elements, element);
         newElements.splice(index - 1, 0, element);
+        // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
         this.change({elements: newElements});
     };
 
-    _moveElementDown: (number) => void = (index) => {
+    _moveElementDown: (arg1: number) => void = (index) => {
         const element = this.props.elements[index];
         const newElements = _.without(this.props.elements, element);
         newElements.splice(index + 1, 0, element);
+        // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
         this.change({elements: newElements});
     };
 
-    change: ($FlowFixMe, $FlowFixMe, $FlowFixMe) => $FlowFixMe = (...args) => {
+    change: (arg1: any, arg2: any, arg3: any) => any = (...args) => {
         return Changeable.change.apply(this, args);
     };
 
-    render(): React.Node {
+    render(): React.ReactNode {
         const {TeX} = getDependencies();
 
         return (
             <div className="perseus-widget-interaction-editor">
+                {/* @ts-expect-error [FEI-5003] - TS2322 - Type '{ children: (false | Element)[]; title: string; }' is not assignable to type 'Pick<Readonly<ElementContainerProps> & Readonly<{ children?: ReactNode; }>, "children" | "onDelete" | "onDown" | "onUp">'. */}
                 <ElementContainer title="Grid settings">
                     <GraphSettings
                         editableSettings={["canvas", "graph"]}
@@ -951,18 +993,23 @@ class InteractionEditor extends React.Component<
                                     onUp={
                                         n === 0
                                             ? null
-                                            : this._moveElementUp.bind(this, n)
+                                            : // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation. | TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
+                                              this._moveElementUp.bind(this, n)
                                     }
                                     // eslint-disable-next-line react/jsx-no-bind
                                     onDown={
+                                        // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                         n === this.props.elements.length - 1
                                             ? null
-                                            : this._moveElementDown.bind(
+                                            : // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
+                                              this._moveElementDown.bind(
+                                                  // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                                   this,
                                                   n,
                                               )
                                     }
                                     // eslint-disable-next-line react/jsx-no-bind
+                                    // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation. | TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                     onDelete={this._deleteElement.bind(this, n)}
                                     key={element.key}
                                 >
@@ -971,6 +1018,7 @@ class InteractionEditor extends React.Component<
                                         onChange={(newProps) => {
                                             const elements = JSON.parse(
                                                 JSON.stringify(
+                                                    // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                                     this.props.elements,
                                                 ),
                                             );
@@ -978,6 +1026,7 @@ class InteractionEditor extends React.Component<
                                                 elements[n].options,
                                                 newProps,
                                             );
+                                            // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                             this.change({elements: elements});
                                         }}
                                     />
@@ -1015,18 +1064,23 @@ class InteractionEditor extends React.Component<
                                     onUp={
                                         n === 0
                                             ? null
-                                            : this._moveElementUp.bind(this, n)
+                                            : // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation. | TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
+                                              this._moveElementUp.bind(this, n)
                                     }
                                     // eslint-disable-next-line react/jsx-no-bind
                                     onDown={
+                                        // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                         n === this.props.elements.length - 1
                                             ? null
-                                            : this._moveElementDown.bind(
+                                            : // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
+                                              this._moveElementDown.bind(
+                                                  // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                                   this,
                                                   n,
                                               )
                                     }
                                     // eslint-disable-next-line react/jsx-no-bind
+                                    // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation. | TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                     onDelete={this._deleteElement.bind(this, n)}
                                     key={element.key}
                                 >
@@ -1035,6 +1089,7 @@ class InteractionEditor extends React.Component<
                                         onChange={(newProps) => {
                                             const elements = JSON.parse(
                                                 JSON.stringify(
+                                                    // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                                     this.props.elements,
                                                 ),
                                             );
@@ -1042,6 +1097,7 @@ class InteractionEditor extends React.Component<
                                                 elements[n].options,
                                                 newProps,
                                             );
+                                            // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                             this.change({elements: elements});
                                         }}
                                     />
@@ -1067,18 +1123,23 @@ class InteractionEditor extends React.Component<
                                     onUp={
                                         n === 0
                                             ? null
-                                            : this._moveElementUp.bind(this, n)
+                                            : // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation. | TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
+                                              this._moveElementUp.bind(this, n)
                                     }
                                     // eslint-disable-next-line react/jsx-no-bind
                                     onDown={
+                                        // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                         n === this.props.elements.length - 1
                                             ? null
-                                            : this._moveElementDown.bind(
+                                            : // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
+                                              this._moveElementDown.bind(
+                                                  // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                                   this,
                                                   n,
                                               )
                                     }
                                     // eslint-disable-next-line react/jsx-no-bind
+                                    // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation. | TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                     onDelete={this._deleteElement.bind(this, n)}
                                     key={element.key}
                                 >
@@ -1087,6 +1148,7 @@ class InteractionEditor extends React.Component<
                                         onChange={(newProps) => {
                                             const elements = JSON.parse(
                                                 JSON.stringify(
+                                                    // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                                     this.props.elements,
                                                 ),
                                             );
@@ -1094,6 +1156,7 @@ class InteractionEditor extends React.Component<
                                                 elements[n].options,
                                                 newProps,
                                             );
+                                            // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                             this.change({elements: elements});
                                         }}
                                     />
@@ -1127,18 +1190,23 @@ class InteractionEditor extends React.Component<
                                     onUp={
                                         n === 0
                                             ? null
-                                            : this._moveElementUp.bind(this, n)
+                                            : // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation. | TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
+                                              this._moveElementUp.bind(this, n)
                                     }
                                     // eslint-disable-next-line react/jsx-no-bind
                                     onDown={
+                                        // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                         n === this.props.elements.length - 1
                                             ? null
-                                            : this._moveElementDown.bind(
+                                            : // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
+                                              this._moveElementDown.bind(
+                                                  // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                                   this,
                                                   n,
                                               )
                                     }
                                     // eslint-disable-next-line react/jsx-no-bind
+                                    // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation. | TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                     onDelete={this._deleteElement.bind(this, n)}
                                     key={element.key}
                                 >
@@ -1147,6 +1215,7 @@ class InteractionEditor extends React.Component<
                                         onChange={(newProps) => {
                                             const elements = JSON.parse(
                                                 JSON.stringify(
+                                                    // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                                     this.props.elements,
                                                 ),
                                             );
@@ -1154,6 +1223,7 @@ class InteractionEditor extends React.Component<
                                                 elements[n].options,
                                                 newProps,
                                             );
+                                            // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                             this.change({elements: elements});
                                         }}
                                     />
@@ -1177,17 +1247,22 @@ class InteractionEditor extends React.Component<
                                     onUp={
                                         n === 0
                                             ? null
-                                            : this._moveElementUp.bind(this, n)
+                                            : // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation. | TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
+                                              this._moveElementUp.bind(this, n)
                                     }
                                     // eslint-disable-next-line react/jsx-no-bind
                                     onDown={
+                                        // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                         n === this.props.elements.length - 1
                                             ? null
-                                            : this._moveElementDown.bind(
+                                            : // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
+                                              this._moveElementDown.bind(
+                                                  // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                                   this,
                                                   n,
                                               )
                                     }
+                                    // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                     onDelete={this._deleteElement}
                                     key={element.key}
                                 >
@@ -1196,6 +1271,7 @@ class InteractionEditor extends React.Component<
                                         onChange={(newProps) => {
                                             const elements = JSON.parse(
                                                 JSON.stringify(
+                                                    // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                                     this.props.elements,
                                                 ),
                                             );
@@ -1203,6 +1279,7 @@ class InteractionEditor extends React.Component<
                                                 elements[n].options,
                                                 newProps,
                                             );
+                                            // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                             this.change({elements: elements});
                                         }}
                                     />
@@ -1217,17 +1294,22 @@ class InteractionEditor extends React.Component<
                                     onUp={
                                         n === 0
                                             ? null
-                                            : this._moveElementUp.bind(this, n)
+                                            : // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation. | TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
+                                              this._moveElementUp.bind(this, n)
                                     }
                                     // eslint-disable-next-line react/jsx-no-bind
                                     onDown={
+                                        // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                         n === this.props.elements.length - 1
                                             ? null
-                                            : this._moveElementDown.bind(
+                                            : // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
+                                              this._moveElementDown.bind(
+                                                  // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                                   this,
                                                   n,
                                               )
                                     }
+                                    // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                     onDelete={this._deleteElement}
                                     key={element.key}
                                 >
@@ -1236,6 +1318,7 @@ class InteractionEditor extends React.Component<
                                         onChange={(newProps) => {
                                             const elements = JSON.parse(
                                                 JSON.stringify(
+                                                    // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                                     this.props.elements,
                                                 ),
                                             );
@@ -1243,6 +1326,7 @@ class InteractionEditor extends React.Component<
                                                 elements[n].options,
                                                 newProps,
                                             );
+                                            // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                             this.change({elements: elements});
                                         }}
                                     />
@@ -1266,17 +1350,22 @@ class InteractionEditor extends React.Component<
                                     onUp={
                                         n === 0
                                             ? null
-                                            : this._moveElementUp.bind(this, n)
+                                            : // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation. | TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
+                                              this._moveElementUp.bind(this, n)
                                     }
                                     // eslint-disable-next-line react/jsx-no-bind
                                     onDown={
+                                        // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                         n === this.props.elements.length - 1
                                             ? null
-                                            : this._moveElementDown.bind(
+                                            : // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
+                                              this._moveElementDown.bind(
+                                                  // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                                   this,
                                                   n,
                                               )
                                     }
+                                    // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                     onDelete={this._deleteElement}
                                     key={element.key}
                                 >
@@ -1285,6 +1374,7 @@ class InteractionEditor extends React.Component<
                                         onChange={(newProps) => {
                                             const elements = JSON.parse(
                                                 JSON.stringify(
+                                                    // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                                     this.props.elements,
                                                 ),
                                             );
@@ -1292,6 +1382,7 @@ class InteractionEditor extends React.Component<
                                                 elements[n].options,
                                                 newProps,
                                             );
+                                            // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                             this.change({elements: elements});
                                         }}
                                     />
@@ -1323,17 +1414,22 @@ class InteractionEditor extends React.Component<
                                     onUp={
                                         n === 0
                                             ? null
-                                            : this._moveElementUp.bind(this, n)
+                                            : // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation. | TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
+                                              this._moveElementUp.bind(this, n)
                                     }
                                     // eslint-disable-next-line react/jsx-no-bind
                                     onDown={
+                                        // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                         n === this.props.elements.length - 1
                                             ? null
-                                            : this._moveElementDown.bind(
+                                            : // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
+                                              this._moveElementDown.bind(
+                                                  // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                                   this,
                                                   n,
                                               )
                                     }
+                                    // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                     onDelete={this._deleteElement}
                                     key={element.key}
                                 >
@@ -1342,6 +1438,7 @@ class InteractionEditor extends React.Component<
                                         onChange={(newProps) => {
                                             const elements = JSON.parse(
                                                 JSON.stringify(
+                                                    // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                                     this.props.elements,
                                                 ),
                                             );
@@ -1349,6 +1446,7 @@ class InteractionEditor extends React.Component<
                                                 elements[n].options,
                                                 newProps,
                                             );
+                                            // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                             this.change({elements: elements});
                                         }}
                                     />
@@ -1359,6 +1457,7 @@ class InteractionEditor extends React.Component<
                     this,
                 )}
                 <div className="perseus-widget-interaction-editor-select-element">
+                    {/* @ts-expect-error [FEI-5003] - TS2322 - Type '(arg1: ChangeEvent<HTMLInputElement>) => void' is not assignable to type 'ChangeEventHandler<HTMLSelectElement>'. */}
                     <select onChange={this._addNewElement}>
                         <option value="">Add an element{"\u2026"}</option>
                         <option disabled>--</option>
@@ -1381,7 +1480,7 @@ class InteractionEditor extends React.Component<
         /* eslint-enable max-len */
     }
 
-    serialize: () => $FlowFixMe = () => {
+    serialize: () => any = () => {
         return EditorJsonify.serialize.call(this);
     };
 }