@khanacademy/perseus-editor 1.1.0 → 2.0.0

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

@@ -1,5 +1,4 @@
 /* eslint-disable @babel/no-invalid-this, one-var, react/no-unsafe, react/sort-comp */
-// @flow
 import {number as knumber} from "@khanacademy/kmath";
 import {
     components,
@@ -12,7 +11,7 @@ import * as React from "react";
 import ReactDOM from "react-dom";
 import _ from "underscore";
 
-import BlurInput from "../components/blur-input.jsx";
+import BlurInput from "../components/blur-input";
 
 const {InfoTip, NumberInput, RangeInput, TextListEditor} = components;
 const Plotter = PlotterWidget.widget;
@@ -24,7 +23,7 @@ const BAR = "bar",
     DOTPLOT = "dotplot";
 
 // Return a copy of array with length n, padded with given value
-function padArray(array, n, value) {
+function padArray(array: any, n, value: any) {
     const copy = _.clone(array);
     copy.length = n;
     for (let i = array.length; i < n; i++) {
@@ -37,7 +36,7 @@ const editorDefaults = {
     scaleY: 1,
     maxY: 10,
     snapsPerLine: 2,
-};
+} as const;
 
 const widgetPropTypes = {
     type: PropTypes.oneOf([BAR, LINE, PIC, HISTOGRAM, DOTPLOT]),
@@ -60,16 +59,16 @@ const widgetPropTypes = {
     correct: PropTypes.arrayOf(PropTypes.number),
     static: PropTypes.bool,
     onChange: PropTypes.func,
-};
+} as const;
 
 const formatNumber = (num) => "$" + knumber.round(num, 2) + "$";
 
-type Props = $FlowFixMe;
-type State = $FlowFixMe;
+type Props = any;
+type State = any;
 
 class PlotterEditor extends React.Component<Props, State> {
     static propTypes = widgetPropTypes;
-    static widgetName: string = "plotter";
+    static widgetName = "plotter" as const;
 
     static defaultProps: Props = {
         ...editorDefaults,
@@ -109,7 +108,7 @@ class PlotterEditor extends React.Component<Props, State> {
         this.fetchPic(this.props.picUrl);
     }
 
-    UNSAFE_componentWillReceiveProps(nextProps: $FlowFixMe) {
+    UNSAFE_componentWillReceiveProps(nextProps: any) {
         this.fetchPic(nextProps.picUrl);
 
         if (nextProps.static) {
@@ -119,7 +118,7 @@ class PlotterEditor extends React.Component<Props, State> {
         }
     }
 
-    fetchPic: (string) => $FlowFixMe = (url) => {
+    fetchPic: (arg1: string) => any = (url) => {
         if (this.state.loadedUrl !== url) {
             const pic = new Image();
             pic.src = url;
@@ -132,7 +131,7 @@ class PlotterEditor extends React.Component<Props, State> {
         }
     };
 
-    render(): React.Node {
+    render(): React.ReactNode {
         const setFromScale = _.contains(
             [LINE, HISTOGRAM, DOTPLOT],
             this.props.type,
@@ -141,7 +140,7 @@ class PlotterEditor extends React.Component<Props, State> {
         const props = {
             trackInteraction: () => {},
             ...this.props,
-        };
+        } as const;
 
         return (
             <div className="perseus-widget-plotter-editor">
@@ -155,8 +154,10 @@ class PlotterEditor extends React.Component<Props, State> {
                                     <input
                                         type="radio"
                                         name="chart-type"
+                                        // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                         checked={this.props.type === type}
                                         onChange={_.partial(
+                                            // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                             this.changeType,
                                             type,
                                         )}
@@ -179,9 +180,11 @@ class PlotterEditor extends React.Component<Props, State> {
                                     <input
                                         type="text"
                                         onChange={_.partial(
+                                            // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                             this.changeLabel,
                                             i,
                                         )}
+                                        // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                                         defaultValue={this.props.labels[i]}
                                     />
                                 </label>
@@ -369,32 +372,32 @@ class PlotterEditor extends React.Component<Props, State> {
         );
     }
 
-    handleChangeTickStep: (number) => void = (value) => {
+    handleChangeTickStep: (arg1: number) => void = (value) => {
         this.setState({
             tickStep: value,
         });
     };
 
-    handleChangeRange: ([number, number]) => void = (newValue) => {
+    handleChangeRange: (arg1: [number, number]) => void = (newValue) => {
         this.setState({
             minX: newValue[0],
             maxX: newValue[1],
         });
     };
 
-    changeLabelInterval: (number) => void = (value) => {
+    changeLabelInterval: (arg1: number) => void = (value) => {
         this.props.onChange({
             labelInterval: value,
         });
     };
 
-    handlePlotterChange: ($FlowFixMe) => void = (newProps) => {
-        const props = {};
+    handlePlotterChange: (arg1: any) => void = (newProps) => {
+        const props: Record<string, any> = {};
         props[this.state.editing] = newProps.values;
         this.props.onChange(props);
     };
 
-    changeType: ($FlowFixMe) => void = (type) => {
+    changeType: (arg1: any) => void = (type) => {
         let categories;
         if (type === HISTOGRAM) {
             // Switching to histogram, add a label (0) to the left
@@ -411,19 +414,18 @@ class PlotterEditor extends React.Component<Props, State> {
         if (categories) {
             // eslint-disable-next-line react/no-string-refs
             const node = ReactDOM.findDOMNode(this.refs.categories);
-            // $FlowFixMe[incompatible-use]
-            // $FlowFixMe[prop-missing]
+            // @ts-expect-error [FEI-5003] - TS2531 - Object is possibly 'null'. | TS2339 - Property 'value' does not exist on type 'Element | Text'.
             node.value = categories.join(", ");
         }
     };
 
-    changeLabel: (number, $FlowFixMe) => void = (i, e) => {
+    changeLabel: (arg1: number, arg2: any) => void = (i, e) => {
         const labels = _.clone(this.props.labels);
         labels[i] = e.target.value;
         this.props.onChange({labels: labels});
     };
 
-    changePicUrl: (string) => void = (value) => {
+    changePicUrl: (arg1: string) => void = (value) => {
         // We don't need the labels and other data in the plotter, so just
         // extract the raw image and use that.
         // TODO(emily): Maybe indicate that such a change has happened?
@@ -432,7 +434,7 @@ class PlotterEditor extends React.Component<Props, State> {
         this.props.onChange({picUrl: url});
     };
 
-    changeCategories: ($FlowFixMe) => void = (categories) => {
+    changeCategories: (arg1: any) => void = (categories) => {
         let n = categories.length;
         if (this.props.type === HISTOGRAM) {
             // Histograms with n labels/categories have n - 1 buckets
@@ -447,11 +449,11 @@ class PlotterEditor extends React.Component<Props, State> {
         });
     };
 
-    changeScale: ($FlowFixMe) => void = (e) => {
+    changeScale: (arg1: any) => void = (e) => {
         const oldScale = this.props.scaleY;
         const newScale = +e.target.value || editorDefaults.scaleY;
 
-        const scale = function (value) {
+        const scale = function (value: any) {
             return (value * newScale) / oldScale;
         };
 
@@ -464,24 +466,23 @@ class PlotterEditor extends React.Component<Props, State> {
             starting: _.map(this.props.starting, scale),
         });
 
-        // $FlowFixMe[prop-missing]
-        // $FlowFixMe[incompatible-use]
+        // @ts-expect-error [FEI-5003] - TS2531 - Object is possibly 'null'. | TS2339 - Property 'value' does not exist on type 'Element | Text'.
         ReactDOM.findDOMNode(this.refs.maxY).value = maxY; // eslint-disable-line react/no-string-refs
     };
 
-    changeMax: ($FlowFixMe) => void = (e) => {
+    changeMax: (arg1: any) => void = (e) => {
         this.props.onChange({
             maxY: +e.target.value || editorDefaults.maxY,
         });
     };
 
-    changeSnaps: ($FlowFixMe) => void = (e) => {
+    changeSnaps: (arg1: any) => void = (e) => {
         this.props.onChange({
             snapsPerLine: +e.target.value || editorDefaults.snapsPerLine,
         });
     };
 
-    changeEditing: (string) => void = (editing) => {
+    changeEditing: (arg1: string) => void = (editing) => {
         this.setState({editing: editing});
     };
 
@@ -507,12 +508,11 @@ class PlotterEditor extends React.Component<Props, State> {
         // eslint-disable-next-line react/no-string-refs
         const node = ReactDOM.findDOMNode(this.refs.categories);
 
-        // $FlowFixMe[incompatible-use]
-        // $FlowFixMe[prop-missing]
+        // @ts-expect-error [FEI-5003] - TS2531 - Object is possibly 'null'. | TS2339 - Property 'value' does not exist on type 'Element | Text'.
         node.value = categories.join(", ");
     };
 
-    serialize: () => $FlowFixMe = () => {
+    serialize: () => any = () => {
         const json = _.pick(
             this.props,
             "correct",
@@ -527,6 +527,7 @@ class PlotterEditor extends React.Component<Props, State> {
         );
 
         if (this.props.type === PIC) {
+            // @ts-expect-error [FEI-5003] - TS2339 - Property 'picUrl' does not exist on type 'Pick<Readonly<any> & Readonly<{ children?: ReactNode; }>, "type" | "correct" | "labels" | "categories" | "starting" | "scaleY" | "maxY" | "snapsPerLine" | "labelInterval">'.
             json.picUrl = this.props.picUrl;
         }
 

package/src/widgets/radio/{editor.jsx → editor.tsx}

@@ -1,5 +1,4 @@
 /* eslint-disable jsx-a11y/anchor-is-valid, react/forbid-prop-types, react/sort-comp */
-// @flow
 import {
     components,
     icons,
@@ -12,12 +11,12 @@ import PropTypes from "prop-types";
 import * as React from "react";
 import _ from "underscore";
 
-import Editor from "../../editor.jsx";
+import Editor from "../../editor";
 
 const {InlineIcon, PropCheckBox} = components;
 const {iconPlus, iconTrash} = icons;
 
-class ChoiceEditor extends React.Component<$FlowFixMe> {
+class ChoiceEditor extends React.Component<any> {
     static propTypes = {
         apiOptions: ApiOptions.propTypes,
 
@@ -28,7 +27,7 @@ class ChoiceEditor extends React.Component<$FlowFixMe> {
         onDelete: PropTypes.func,
     };
 
-    render(): React.Node {
+    render(): React.ReactNode {
         const checkedClass = this.props.choice.correct
             ? "correct"
             : "incorrect";
@@ -96,7 +95,7 @@ class ChoiceEditor extends React.Component<$FlowFixMe> {
     }
 }
 
-class RadioEditor extends React.Component<$FlowFixMe> {
+class RadioEditor extends React.Component<any> {
     static propTypes = {
         ...Changeable.propTypes,
         apiOptions: ApiOptions.propTypes,
@@ -121,9 +120,9 @@ class RadioEditor extends React.Component<$FlowFixMe> {
         static: PropTypes.bool,
     };
 
-    static widgetName: string = "radio";
+    static widgetName = "radio" as const;
 
-    static defaultProps: $FlowFixMe = {
+    static defaultProps: any = {
         choices: [{}, {}],
         displayCount: null,
         randomize: false,
@@ -133,7 +132,7 @@ class RadioEditor extends React.Component<$FlowFixMe> {
         deselectEnabled: false,
     };
 
-    render(): React.Node {
+    render(): React.ReactNode {
         const numCorrect = _.reduce(
             this.props.choices,
             function (memo, choice) {
@@ -248,12 +247,12 @@ class RadioEditor extends React.Component<$FlowFixMe> {
         );
     }
 
-    change: (...args: $ReadOnlyArray<mixed>) => $FlowFixMe = (...args) => {
-        // $FlowFixMe[incompatible-call]
+    change: (...args: ReadonlyArray<unknown>) => any = (...args) => {
+        // @ts-expect-error [FEI-5003] - TS2345 - Argument of type 'readonly unknown[]' is not assignable to parameter of type 'any[]'.
         return Changeable.change.apply(this, args);
     };
 
-    onMultipleSelectChange: ($FlowFixMe) => $FlowFixMe = (allowMultiple) => {
+    onMultipleSelectChange: (arg1: any) => any = (allowMultiple) => {
         allowMultiple = allowMultiple.multipleSelect;
 
         const numCorrect = _.reduce(
@@ -284,12 +283,12 @@ class RadioEditor extends React.Component<$FlowFixMe> {
         }
     };
 
-    onCountChoicesChange: ($FlowFixMe) => void = (count) => {
+    onCountChoicesChange: (arg1: any) => void = (count) => {
         count = count.countChoices;
         this.props.onChange({countChoices: count});
     };
 
-    onChange: ($FlowFixMe) => void = ({checked}) => {
+    onChange: (arg1: any) => void = ({checked}) => {
         const choices = _.map(this.props.choices, (choice, i) => {
             return _.extend({}, choice, {
                 correct: checked[i],
@@ -303,7 +302,7 @@ class RadioEditor extends React.Component<$FlowFixMe> {
         this.props.onChange({choices: choices});
     };
 
-    onContentChange: ($FlowFixMe, $FlowFixMe) => void = (
+    onContentChange: (arg1: any, arg2: any) => void = (
         choiceIndex,
         newContent,
     ) => {
@@ -314,7 +313,7 @@ class RadioEditor extends React.Component<$FlowFixMe> {
         this.props.onChange({choices: choices});
     };
 
-    onClueChange: ($FlowFixMe, $FlowFixMe) => void = (choiceIndex, newClue) => {
+    onClueChange: (arg1: any, arg2: any) => void = (choiceIndex, newClue) => {
         const choices = this.props.choices.slice();
         choices[choiceIndex] = _.extend({}, choices[choiceIndex], {
             clue: newClue,
@@ -325,7 +324,7 @@ class RadioEditor extends React.Component<$FlowFixMe> {
         this.props.onChange({choices: choices});
     };
 
-    onDelete: (number) => void = (choiceIndex) => {
+    onDelete: (arg1: number) => void = (choiceIndex) => {
         const choices = this.props.choices.slice();
         const deleted = choices[choiceIndex];
 
@@ -338,11 +337,11 @@ class RadioEditor extends React.Component<$FlowFixMe> {
         });
     };
 
-    addChoice: (boolean, $FlowFixMe) => void = (noneOfTheAbove, e) => {
+    addChoice: (arg1: boolean, arg2: any) => void = (noneOfTheAbove, e) => {
         e.preventDefault();
 
         const choices = this.props.choices.slice();
-        const newChoice = {isNoneOfTheAbove: noneOfTheAbove};
+        const newChoice = {isNoneOfTheAbove: noneOfTheAbove} as const;
         const addIndex =
             choices.length - (this.props.hasNoneOfTheAbove ? 1 : 0);
 
@@ -356,6 +355,7 @@ class RadioEditor extends React.Component<$FlowFixMe> {
             },
             () => {
                 // eslint-disable-next-line react/no-string-refs
+                // @ts-expect-error [FEI-5003] - TS2339 - Property 'refs' does not exist on type 'ReactInstance'.
                 this.refs[`choice-editor${addIndex}`].refs[
                     "content-editor"
                 ].focus();
@@ -363,24 +363,25 @@ class RadioEditor extends React.Component<$FlowFixMe> {
         );
     };
 
-    setDisplayCount: (number) => void = (num) => {
+    setDisplayCount: (arg1: number) => void = (num) => {
         this.props.onChange({displayCount: num});
     };
 
     focus: () => boolean = () => {
         // eslint-disable-next-line react/no-string-refs
+        // @ts-expect-error [FEI-5003] - TS2339 - Property 'refs' does not exist on type 'ReactInstance'.
         this.refs["choice-editor0"].refs["content-editor"].focus();
         return true;
     };
 
-    getSaveWarnings: () => $ReadOnlyArray<string> = () => {
+    getSaveWarnings: () => ReadonlyArray<string> = () => {
         if (!_.some(_.pluck(this.props.choices, "correct"))) {
             return ["No choice is marked as correct."];
         }
         return [];
     };
 
-    serialize: () => $FlowFixMe = () => {
+    serialize: () => any = () => {
         return _.pick(
             this.props,
             "choices",

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

@@ -1,11 +1,10 @@
-// @flow
 import {components, Changeable, EditorJsonify} from "@khanacademy/perseus";
 import PropTypes from "prop-types";
 import * as React from "react";
 
 const {NumberInput, TextInput} = components;
 
-type Props = $FlowFixMe;
+type Props = any;
 
 class ReactionDiagramWidgetEditor extends React.Component<Props> {
     static propTypes = {
@@ -16,7 +15,7 @@ class ReactionDiagramWidgetEditor extends React.Component<Props> {
         smiles: PropTypes.arrayOf(PropTypes.string),
     };
 
-    static widgetName: "reaction-diagram" = "reaction-diagram";
+    static widgetName = "reaction-diagram" as const;
 
     static defaultProps: Props = {
         smiles: ["", ""],
@@ -24,44 +23,49 @@ class ReactionDiagramWidgetEditor extends React.Component<Props> {
         separators: [{type: "right", topText: "", bottomText: ""}],
     };
 
-    change: ($FlowFixMe, $FlowFixMe, $FlowFixMe) => $FlowFixMe = (...args) => {
+    change: (arg1: any, arg2: any, arg3: any) => any = (...args) => {
         return Changeable.change.apply(this, args);
     };
 
-    updateMolecule: (number) => (string) => void = (idx) => {
+    updateMolecule: (arg1: number) => (arg1: string) => void = (idx) => {
         return function (newValue: string) {
+            // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
             const newSmiles = [...this.props.smiles];
             newSmiles[idx] = newValue;
+            // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
             this.change({smiles: newSmiles});
         }.bind(this);
     };
 
-    updateRotation: (number) => ($FlowFixMe) => void = (idx) => {
+    updateRotation: (arg1: number) => (arg1: any) => void = (idx) => {
         return function (newValue) {
+            // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
             const newRot = [...this.props.rotationAngle];
             newRot[idx] = newValue;
+            // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
             this.change({rotationAngle: newRot});
         }.bind(this);
     };
 
-    updateSeparators: (number, string) => (string) => void = (
+    updateSeparators: (arg1: number, arg2: string) => (arg1: string) => void = (
         idx,
         propName,
     ) => {
-        return (newValue) => {
+        return (newValue: string) => {
             const newSep = this.props.separators.map((sep) => {
                 return {...sep};
             });
             newSep[idx][propName] = newValue;
+            // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
             this.change({separators: newSep});
         };
     };
 
-    serialize: () => $FlowFixMe = () => {
+    serialize: () => any = () => {
         return EditorJsonify.serialize.call(this);
     };
 
-    render(): React.Node {
+    render(): React.ReactNode {
         // TODO(colin): use styling instead of &nbsp hacks.
         return (
             <div>

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

@@ -1,19 +1,18 @@
 /* eslint-disable jsx-a11y/anchor-is-valid, no-alert, react/sort-comp */
-// @flow
 import {components, icons, ApiOptions} from "@khanacademy/perseus";
 import PropTypes from "prop-types";
 import * as React from "react";
 import _ from "underscore";
 
-import Editor from "../editor.jsx";
+import Editor from "../editor";
 
 const {InlineIcon} = components;
 const {iconCircleArrowDown, iconCircleArrowUp, iconPlus, iconTrash} = icons;
 
-type StepControlButtonProps = $FlowFixMe;
+type StepControlButtonProps = any;
 
 class StepControlButton extends React.Component<StepControlButtonProps> {
-    render(): React.Node {
+    render(): React.ReactNode {
         return (
             <a
                 href="#"
@@ -34,7 +33,7 @@ class StepControlButton extends React.Component<StepControlButtonProps> {
     }
 }
 
-type SequenceEditorProps = $FlowFixMe;
+type SequenceEditorProps = any;
 
 class SequenceEditor extends React.Component<SequenceEditorProps> {
     static propTypes = {
@@ -49,7 +48,7 @@ class SequenceEditor extends React.Component<SequenceEditorProps> {
         onChange: PropTypes.func.isRequired,
     };
 
-    static widgetName: "sequence" = "sequence";
+    static widgetName = "sequence" as const;
 
     static defaultProps: SequenceEditorProps = {
         json: [
@@ -61,7 +60,7 @@ class SequenceEditor extends React.Component<SequenceEditorProps> {
         ],
     };
 
-    render(): React.Node {
+    render(): React.ReactNode {
         return (
             <div className="perseus-sequence-editor">
                 {_.map(this.props.json, (json, i) => {
@@ -130,22 +129,23 @@ class SequenceEditor extends React.Component<SequenceEditorProps> {
         );
     }
 
-    _handleEditorChange: (number, $FlowFixMe) => void = (i, newProps) => {
+    _handleEditorChange: (arg1: number, arg2: any) => void = (i, newProps) => {
         const steps = _.clone(this.props.json);
         steps[i] = _.extend({}, steps[i], newProps);
         this.props.onChange({json: steps});
     };
 
-    serialize: () => $FlowFixMe = () => {
+    serialize: () => any = () => {
         return {
             json: _.times(this.props.json.length, (i) => {
                 // eslint-disable-next-line react/no-string-refs
+                // @ts-expect-error [FEI-5003] - TS2339 - Property 'serialize' does not exist on type 'ReactInstance'.
                 return this.refs["editor" + i].serialize();
             }),
         };
     };
 
-    _handleMoveStepEarlier: (number) => void = (i) => {
+    _handleMoveStepEarlier: (arg1: number) => void = (i) => {
         if (i === 0) {
             return;
         }
@@ -158,7 +158,7 @@ class SequenceEditor extends React.Component<SequenceEditorProps> {
         });
     };
 
-    _handleMoveStepLater: (number) => void = (i) => {
+    _handleMoveStepLater: (arg1: number) => void = (i) => {
         const steps = _.clone(this.props.json);
         if (i + 1 === steps.length) {
             return;
@@ -171,7 +171,7 @@ class SequenceEditor extends React.Component<SequenceEditorProps> {
         });
     };
 
-    _handleAddStepAfter: (number) => void = (i) => {
+    _handleAddStepAfter: (arg1: number) => void = (i) => {
         // We do a full serialization here because we
         // might be copying widgets:
         const steps = _.clone(this.props.json);
@@ -193,7 +193,7 @@ class SequenceEditor extends React.Component<SequenceEditorProps> {
         });
     };
 
-    _handleRemoveStep: (number) => void = (i) => {
+    _handleRemoveStep: (arg1: number) => void = (i) => {
         const steps = _.clone(this.props.json);
         steps.splice(i, 1);
         this.props.onChange({

package/src/widgets/{simple-markdown-tester-editor.jsx → simple-markdown-tester-editor.tsx}

@@ -1,5 +1,4 @@
 /* eslint-disable react/sort-comp */
-// @flow
 /**
  * This is the editor for the simple-markdown-tester widget. This is what shows
  * up on the left side of the screen in the demo. Only the question writer
@@ -8,10 +7,10 @@
 import {Changeable, EditorJsonify} from "@khanacademy/perseus";
 import * as React from "react";
 
-type TextAreaProps = $FlowFixMe;
+type TextAreaProps = any;
 
 class TextArea extends React.Component<TextAreaProps> {
-    render(): React.Node {
+    render(): React.ReactNode {
         return (
             <textarea
                 // eslint-disable-next-line react/no-string-refs
@@ -24,31 +23,32 @@ class TextArea extends React.Component<TextAreaProps> {
 
     focus = () => {
         // eslint-disable-next-line react/no-string-refs
+        // @ts-expect-error [FEI-5003] - TS2339 - Property 'focus' does not exist on type 'ReactInstance'.
         this.refs.input.focus();
         return true;
     };
 
-    changeValue = (e) => {
+    changeValue = (e: any) => {
         // Translating from the js event e to the value
         // of the textbox to send to onChange
         this.props.onChange(e.target.value);
     };
 }
 
-type SimpleMarkdownTesterEditorProps = $FlowFixMe;
+type SimpleMarkdownTesterEditorProps = any;
 
 class SimpleMarkdownTesterEditor extends React.Component<SimpleMarkdownTesterEditorProps> {
     static propTypes = {
         ...Changeable.propTypes,
     };
 
-    static widgetName: "simple-markdown-tester" = "simple-markdown-tester";
+    static widgetName = "simple-markdown-tester" as const;
 
     static defaultProps: SimpleMarkdownTesterEditorProps = {
         value: "",
     };
 
-    render(): React.Node {
+    render(): React.ReactNode {
         return (
             <div>
                 <label>
@@ -56,6 +56,7 @@ class SimpleMarkdownTesterEditor extends React.Component<SimpleMarkdownTesterEdi
                     <div>
                         <TextArea
                             value={this.props.value}
+                            // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 1.
                             onChange={this.change("value")}
                             // eslint-disable-next-line react/no-string-refs
                             ref="input"
@@ -66,17 +67,18 @@ class SimpleMarkdownTesterEditor extends React.Component<SimpleMarkdownTesterEdi
         );
     }
 
-    change: ($FlowFixMe, $FlowFixMe, $FlowFixMe) => $FlowFixMe = (...args) => {
+    change: (arg1: any, arg2: any, arg3: any) => any = (...args) => {
         return Changeable.change.apply(this, args);
     };
 
     focus: () => boolean = () => {
         // eslint-disable-next-line react/no-string-refs
+        // @ts-expect-error [FEI-5003] - TS2339 - Property 'focus' does not exist on type 'ReactInstance'.
         this.refs.input.focus();
         return true;
     };
 
-    serialize: () => $FlowFixMe = () => {
+    serialize: () => any = () => {
         return EditorJsonify.serialize.call(this);
     };
 }