@khanacademy/perseus 7.2.1 → 8.0.0

package/src/__tests__/renderer.test.tsx

@@ -149,7 +149,7 @@ describe("renderer", () => {
             mockRunLinter.mockClear();
 
             // Act
-            // @ts-expect-error [FEI-5003] - TS2345 - Argument of type '{ problemNum: number; linterContext: { readonly contentType: "exercise"; readonly highlightLint: true; readonly paths: readonly []; readonly stack: readonly []; }; }' is not assignable to parameter of type 'Pick<{}, never> & InexactPartial<Pick<{}, never>> & InexactPartial<Pick<DefaultProps, keyof DefaultProps>>'.
+            // @ts-expect-error - TS2345 - Argument of type '{ problemNum: number; linterContext: { readonly contentType: "exercise"; readonly highlightLint: true; readonly paths: readonly []; readonly stack: readonly []; }; }' is not assignable to parameter of type 'Pick<{}, never> & InexactPartial<Pick<{}, never>> & InexactPartial<Pick<DefaultProps, keyof DefaultProps>>'.
             rerender(question1, {...extraProps, problemNum: 1});
 
             // Assert
@@ -192,7 +192,7 @@ describe("renderer", () => {
                     ...question1.widgets,
                     // $FlowIgnore[prop-missing]
                     // $FlowIgnore[incompatible-cast]
-                    // @ts-expect-error [FEI-5003] - TS2352 - Conversion of type '{ type: undefined; static?: boolean | undefined; graded?: boolean | undefined; alignment?: string | undefined; options: PerseusCategorizerWidgetOptions | null | undefined; key?: number | undefined; version?: Version | undefined; } | ... 38 more ... | { ...; }' to type 'DropdownWidget' may be a mistake because neither type sufficiently overlaps with the other. If this was intentional, convert the expression to 'unknown' first.
+                    // @ts-expect-error - TS2352 - Conversion of type '{ type: undefined; static?: boolean | undefined; graded?: boolean | undefined; alignment?: string | undefined; options: PerseusCategorizerWidgetOptions | null | undefined; key?: number | undefined; version?: Version | undefined; } | ... 38 more ... | { ...; }' to type 'DropdownWidget' may be a mistake because neither type sufficiently overlaps with the other. If this was intentional, convert the expression to 'unknown' first.
                     "dropdown 1": {
                         ...question1.widgets["dropdown 1"],
                         // $FlowIgnore[incompatible-cast]
@@ -298,7 +298,7 @@ describe("renderer", () => {
             originalImage = window.Image;
             // Mock HTML Image so we can trigger onLoad callbacks and see full
             // image rendering.
-            // @ts-expect-error [FEI-5003] - TS2322 - Type 'Mock<Record<string, any>, [], any>' is not assignable to type 'new (width?: number | undefined, height?: number | undefined) => HTMLImageElement'.
+            // @ts-expect-error - TS2322 - Type 'Mock<Record<string, any>, [], any>' is not assignable to type 'new (width?: number | undefined, height?: number | undefined) => HTMLImageElement'.
             window.Image = jest.fn(() => {
                 const img: Record<string, any> = {};
                 images.push(img);
@@ -426,7 +426,7 @@ describe("renderer", () => {
 
             const wrapperStyle = getComputedStyle(
                 // $FlowIgnore[incompatible-call]
-                // @ts-expect-error [FEI-5003] - TS2345 - Argument of type 'HTMLElement | null' is not assignable to parameter of type 'Element'.
+                // @ts-expect-error - TS2345 - Argument of type 'HTMLElement | null' is not assignable to parameter of type 'Element'.
                 screen.getByAltText("This image has dimensions").parentElement, // eslint-disable-line testing-library/no-node-access
             );
             expect(wrapperStyle.maxWidth).toBe("420px");
@@ -452,7 +452,7 @@ describe("renderer", () => {
 
             const wrapperStyle = getComputedStyle(
                 // $FlowIgnore[incompatible-call]
-                // @ts-expect-error [FEI-5003] - TS2345 - Argument of type 'HTMLElement | null' is not assignable to parameter of type 'Element'.
+                // @ts-expect-error - TS2345 - Argument of type 'HTMLElement | null' is not assignable to parameter of type 'Element'.
                 screen.getByAltText("This image doesn't").parentElement, // eslint-disable-line testing-library/no-node-access
             );
             expect(wrapperStyle.maxWidth).toBe("");
@@ -683,11 +683,11 @@ describe("renderer", () => {
             );
             expect(zoomable).not.toBeUndefined();
             expect(zoomable).not.toBeNull();
-            // @ts-expect-error [FEI-5003] - TS2339 - Property 'style' does not exist on type 'Element'.
+            // @ts-expect-error - TS2339 - Property 'style' does not exist on type 'Element'.
             expect(zoomable.style.transform).not.toBe("");
 
             /* eslint-disable testing-library/no-node-access */
-            // @ts-expect-error [FEI-5003] - TS2531 - Object is possibly 'null'.
+            // @ts-expect-error - TS2531 - Object is possibly 'null'.
             expect(zoomable.parentElement.style.transform).not.toBe("");
             /* eslint-enable testing-library/no-node-access */
         });
@@ -1139,7 +1139,7 @@ describe("renderer", () => {
 
             const {renderer} = renderQuestion(mockedItem);
             const [widget1, widget2, widget3] = renderer.findWidgets(
-                // @ts-expect-error [FEI-5003] - TS2367 - This condition will always return 'false' since the types '"video" | "image" | "iframe" | "table" | "radio" | "definition" | "group" | "matrix" | "categorizer" | "cs-program" | "dropdown" | "example-graphie-widget" | "example-widget" | ... 26 more ... | "unit-input"' and '"mock-widget"' have no overlap.
+                // @ts-expect-error - TS2367 - This condition will always return 'false' since the types '"video" | "image" | "iframe" | "table" | "radio" | "definition" | "group" | "matrix" | "categorizer" | "cs-program" | "dropdown" | "example-graphie-widget" | "example-widget" | ... 26 more ... | "unit-input"' and '"mock-widget"' have no overlap.
                 (_, info) => info.type === "mock-widget",
             );
             widget1.restoreSerializedState = makeRestoreSerializedStateMock;
@@ -1311,7 +1311,7 @@ describe("renderer", () => {
                     break;
                 }
                 // eslint-disable-next-line testing-library/no-node-access
-                // @ts-expect-error [FEI-5003] - TS2322 - Type 'HTMLElement | null' is not assignable to type 'HTMLElement'.
+                // @ts-expect-error - TS2322 - Type 'HTMLElement | null' is not assignable to type 'HTMLElement'.
                 // eslint-disable-next-line testing-library/no-node-access
                 el = el.parentElement;
             }
@@ -1334,7 +1334,7 @@ describe("renderer", () => {
                     },
                 },
                 {},
-                // @ts-expect-error [FEI-5003] - TS2345 - Argument of type '{ problemNum: number; }' is not assignable to parameter of type 'Pick<{}, never> & InexactPartial<Pick<{}, never>> & InexactPartial<Pick<DefaultProps, keyof DefaultProps>>'.
+                // @ts-expect-error - TS2345 - Argument of type '{ problemNum: number; }' is not assignable to parameter of type 'Pick<{}, never> & InexactPartial<Pick<{}, never>> & InexactPartial<Pick<DefaultProps, keyof DefaultProps>>'.
                 {problemNum: 1},
             );
 
@@ -1349,7 +1349,7 @@ describe("renderer", () => {
             // Arrange
             const {renderer} = renderQuestion(mockedItem);
             const widgets = renderer.findWidgets(
-                // @ts-expect-error [FEI-5003] - TS2367 - This condition will always return 'false' since the types '"video" | "image" | "iframe" | "table" | "radio" | "definition" | "group" | "matrix" | "categorizer" | "cs-program" | "dropdown" | "example-graphie-widget" | "example-widget" | ... 26 more ... | "unit-input"' and '"mock-widget"' have no overlap.
+                // @ts-expect-error - TS2367 - This condition will always return 'false' since the types '"video" | "image" | "iframe" | "table" | "radio" | "definition" | "group" | "matrix" | "categorizer" | "cs-program" | "dropdown" | "example-graphie-widget" | "example-widget" | ... 26 more ... | "unit-input"' and '"mock-widget"' have no overlap.
                 (_, info) => info.type === "mock-widget",
             );
             widgets.forEach(
@@ -1376,7 +1376,7 @@ describe("renderer", () => {
             // Arrange
             const {renderer} = renderQuestion(mockedItem);
             const widgets = renderer.findWidgets(
-                // @ts-expect-error [FEI-5003] - TS2367 - This condition will always return 'false' since the types '"video" | "image" | "iframe" | "table" | "radio" | "definition" | "group" | "matrix" | "categorizer" | "cs-program" | "dropdown" | "example-graphie-widget" | "example-widget" | ... 26 more ... | "unit-input"' and '"mock-widget"' have no overlap.
+                // @ts-expect-error - TS2367 - This condition will always return 'false' since the types '"video" | "image" | "iframe" | "table" | "radio" | "definition" | "group" | "matrix" | "categorizer" | "cs-program" | "dropdown" | "example-graphie-widget" | "example-widget" | ... 26 more ... | "unit-input"' and '"mock-widget"' have no overlap.
                 (_, info) => info.type === "mock-widget",
             );
             widgets.forEach(
@@ -1489,7 +1489,7 @@ describe("renderer", () => {
 
             // Assert
             // "button" role is the WB dropdown's "opener" element
-            // @ts-expect-error [FEI-5003] - TS2345 - Argument of type 'Element | Text | null | undefined' is not assignable to parameter of type 'HTMLElement'.
+            // @ts-expect-error - TS2345 - Argument of type 'Element | Text | null | undefined' is not assignable to parameter of type 'HTMLElement'.
             expect(within(node).queryAllByRole("button")).toHaveLength(1);
         });
 

package/src/__tests__/server-item-renderer.test.tsx

@@ -18,13 +18,13 @@ import InputNumberExport from "../widgets/input-number";
 import RadioWidgetExport from "../widgets/radio";
 
 import MockAssetLoadingWidgetExport, {
-    MockAssetLoadingWidget,
     mockedAssetItem,
 } from "./mock-asset-loading-widget";
 import MockWidgetExport from "./mock-widget";
 
 import type {PerseusItem} from "../perseus-types";
 import type {APIOptions} from "../types";
+import type {MockAssetLoadingWidget} from "./mock-asset-loading-widget";
 
 // This looks alot like `widgets/__tests__/renderQuestion.jsx', except we use
 // the ServerItemRenderer instead of Renderer
@@ -167,7 +167,7 @@ describe("server item renderer", () => {
         const node = renderer.getDOMNodeForPath(["input-number 1"]);
 
         // Assert
-        // @ts-expect-error [FEI-5003] - TS2345 - Argument of type 'Element | Text | null | undefined' is not assignable to parameter of type 'HTMLElement'.
+        // @ts-expect-error - TS2345 - Argument of type 'Element | Text | null | undefined' is not assignable to parameter of type 'HTMLElement'.
         expect(await within(node).findAllByRole("textbox")).toHaveLength(1);
     });
 
@@ -300,7 +300,7 @@ describe("server item renderer", () => {
         // Act
         // setAssetStatus() is not part of the Widget interface, it's specific
         // this test.
-        // @ts-expect-error [FEI-5003] - TS2352 - Conversion of type 'Widget' to type 'MockAssetLoadingWidget' may be a mistake because neither type sufficiently overlaps with the other. If this was intentional, convert the expression to 'unknown' first.
+        // @ts-expect-error - TS2352 - Conversion of type 'Widget' to type 'MockAssetLoadingWidget' may be a mistake because neither type sufficiently overlaps with the other. If this was intentional, convert the expression to 'unknown' first.
         const widget = mockedWidget as MockAssetLoadingWidget;
         widget.setAssetStatus("ABC", true);
 

package/src/__tests__/tex-wrangler.test.ts

@@ -13,7 +13,7 @@ const assertWrangled = (toWrangle: string, check: string) => {
 
 const assertParsed = (toParse: undefined | string, check: string) => {
     // We ignore whitespace when comparing
-    // @ts-expect-error [FEI-5003] - TS2345 - Argument of type 'string | undefined' is not assignable to parameter of type 'string'.
+    // @ts-expect-error - TS2345 - Argument of type 'string | undefined' is not assignable to parameter of type 'string'.
     const parsed = parseTex(toParse).replace(whitespaceRegex, "");
     const checkNoSpace = check.replace(whitespaceRegex, "");
     expect(parsed).toBe(checkNoSpace);

package/src/article-renderer.tsx

@@ -5,7 +5,6 @@
 
 import * as PerseusLinter from "@khanacademy/perseus-linter";
 import classNames from "classnames";
-import PropTypes from "prop-types";
 import * as React from "react";
 
 import ProvideKeypad from "./mixins/provide-keypad";
@@ -13,42 +12,44 @@ import {ClassNames as ApiClassNames, ApiOptions} from "./perseus-api";
 import Renderer from "./renderer";
 import Util from "./util";
 
-const rendererProps = PropTypes.shape({
-    content: PropTypes.string,
-    widgets: PropTypes.objectOf(PropTypes.any),
-    images: PropTypes.objectOf(PropTypes.any),
-});
-
-class ArticleRenderer extends React.Component<any, any> {
+import type {KeypadProps} from "./mixins/provide-keypad";
+import type {PerseusRenderer} from "./perseus-types";
+import type {APIOptions} from "./types";
+import type {LinterContextProps} from "@khanacademy/perseus-linter";
+
+type Props = {
+    apiOptions: APIOptions;
+    json: PerseusRenderer | ReadonlyArray<PerseusRenderer>;
+
+    // Whether to use the new Bibliotron styles for articles
+    /**
+     * @deprecated Does nothing
+     */
+    useNewStyles: boolean;
+    linterContext: LinterContextProps;
+    legacyPerseusLint?: ReadonlyArray<string>;
+} & KeypadProps;
+
+type DefaultProps = {
+    apiOptions: Props["apiOptions"];
+    useNewStyles: Props["useNewStyles"];
+    linterContext: Props["linterContext"];
+};
+
+type State = {
+    keypadElement: any | null;
+};
+
+class ArticleRenderer extends React.Component<Props, State> {
     _currentFocus: any;
 
-    static propTypes = {
-        ...ProvideKeypad.propTypes,
-        apiOptions: PropTypes.shape({
-            onFocusChange: PropTypes.func,
-            isMobile: PropTypes.bool,
-        }),
-        json: PropTypes.oneOfType([
-            rendererProps,
-            PropTypes.arrayOf(rendererProps),
-        ]).isRequired,
-
-        // Whether to use the new Bibliotron styles for articles
-        /**
-         * @deprecated Does nothing
-         */
-        useNewStyles: PropTypes.bool,
-        linterContext: PerseusLinter.linterContextProps,
-        legacyPerseusLint: PropTypes.arrayOf(PropTypes.string),
-    };
-
-    static defaultProps: any = {
-        apiOptions: {},
+    static defaultProps: DefaultProps = {
+        apiOptions: ApiOptions.defaults,
         useNewStyles: false,
         linterContext: PerseusLinter.linterContextDefault,
     };
 
-    constructor(props: any) {
+    constructor(props: Props) {
         super(props);
         this.state = ProvideKeypad.getInitialState.call(this);
     }
@@ -58,7 +59,7 @@ class ArticleRenderer extends React.Component<any, any> {
         this._currentFocus = null;
     }
 
-    shouldComponentUpdate(nextProps: any, nextState: any): any {
+    shouldComponentUpdate(nextProps: Props, nextState: State): boolean {
         return nextProps !== this.props || nextState !== this.state;
     }
 
@@ -96,7 +97,7 @@ class ArticleRenderer extends React.Component<any, any> {
         if (this._currentFocus) {
             const [sectionRef, ...focusPath] = this._currentFocus;
             // eslint-disable-next-line react/no-string-refs
-            // @ts-expect-error [FEI-5003] - TS2339 - Property 'getInputPaths' does not exist on type 'ReactInstance'.
+            // @ts-expect-error - TS2339 - Property 'getInputPaths' does not exist on type 'ReactInstance'.
             const inputPaths = this.refs[sectionRef].getInputPaths();
             didFocusInput = inputPaths.some((inputPath) => {
                 return Util.inputPathsEqual(inputPath, focusPath);
@@ -107,18 +108,18 @@ class ArticleRenderer extends React.Component<any, any> {
             this.props.apiOptions.onFocusChange(
                 this._currentFocus,
                 prevFocusPath,
-                // @ts-expect-error [FEI-5003] - TS2339 - Property 'getDOMNode' does not exist on type 'never'.
+                // @ts-expect-error - TS2339 - Property 'getDOMNode' does not exist on type 'never'.
                 didFocusInput && keypadElement && keypadElement.getDOMNode(),
             );
         }
 
-        // @ts-expect-error [FEI-5003] - TS1345 - An expression of type 'void' cannot be tested for truthiness.
+        // @ts-expect-error - TS1345 - An expression of type 'void' cannot be tested for truthiness.
         if (keypadElement) {
             if (didFocusInput) {
-                // @ts-expect-error [FEI-5003] - TS2339 - Property 'activate' does not exist on type 'never'.
+                // @ts-expect-error - TS2339 - Property 'activate' does not exist on type 'never'.
                 keypadElement.activate();
             } else {
-                // @ts-expect-error [FEI-5003] - TS2339 - Property 'dismiss' does not exist on type 'never'.
+                // @ts-expect-error - TS2339 - Property 'dismiss' does not exist on type 'never'.
                 keypadElement.dismiss();
             }
         }
@@ -149,7 +150,7 @@ class ArticleRenderer extends React.Component<any, any> {
         if (this._currentFocus) {
             const [sectionRef, ...inputPath] = this._currentFocus;
             // eslint-disable-next-line react/no-string-refs
-            // @ts-expect-error [FEI-5003] - TS2339 - Property 'blurPath' does not exist on type 'ReactInstance'.
+            // @ts-expect-error - TS2339 - Property 'blurPath' does not exist on type 'ReactInstance'.
             this.refs[sectionRef].blurPath(inputPath);
         }
     };

package/src/components/__tests__/number-input.test.tsx

@@ -31,7 +31,7 @@ describe("NumberInput", function () {
         );
 
         const node = TestUtils.renderIntoDocument(<NumberInput {...props} />);
-        // @ts-expect-error [FEI-5003] - TS2345 - Argument of type 'Element | Text | null' is not assignable to parameter of type 'Element | Component<any, {}, any>'. | TS2345 - Argument of type 'void' is not assignable to parameter of type 'ReactInstance | null | undefined'.
+        // @ts-expect-error - TS2345 - Argument of type 'Element | Text | null' is not assignable to parameter of type 'Element | Component<any, {}, any>'. | TS2345 - Argument of type 'void' is not assignable to parameter of type 'ReactInstance | null | undefined'.
         TestUtils.Simulate.change(ReactDOM.findDOMNode(node), {
             target: {value: input},
         });
@@ -39,12 +39,12 @@ describe("NumberInput", function () {
     };
 
     it("basic input", function () {
-        // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 2.
+        // @ts-expect-error - TS2554 - Expected 3 arguments, but got 2.
         testInputResult("42", 42);
     });
 
     it("invalid input does not change", function () {
-        // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 2.
+        // @ts-expect-error - TS2554 - Expected 3 arguments, but got 2.
         testInputResult("asdf", STARTING_VALUE);
     });
 
@@ -78,7 +78,7 @@ describe("NumberInput", function () {
                 useArrowKeys={keysEnabled}
             />,
         );
-        // @ts-expect-error [FEI-5003] - TS2345 - Argument of type 'Element | Text | null' is not assignable to parameter of type 'Element | Component<any, {}, any>'. | TS2345 - Argument of type 'void' is not assignable to parameter of type 'ReactInstance | null | undefined'.
+        // @ts-expect-error - TS2345 - Argument of type 'Element | Text | null' is not assignable to parameter of type 'Element | Component<any, {}, any>'. | TS2345 - Argument of type 'void' is not assignable to parameter of type 'ReactInstance | null | undefined'.
         TestUtils.Simulate.keyDown(ReactDOM.findDOMNode(node), {key: key});
         expect(newVal).toEqual(endingValue);
     };

package/src/components/__tests__/sortable.test.tsx

@@ -89,10 +89,10 @@ describe("moveOptionToIndex", () => {
             throw new Error("Failed to render");
         }
 
-        // @ts-expect-error [FEI-5003] - TS2339 - Property 'moveOptionToIndex' does not exist on type 'never'.
+        // @ts-expect-error - TS2339 - Property 'moveOptionToIndex' does not exist on type 'never'.
         sortable.moveOptionToIndex("a", 1);
 
-        // @ts-expect-error [FEI-5003] - TS2339 - Property 'getOptions' does not exist on type 'never'.
+        // @ts-expect-error - TS2339 - Property 'getOptions' does not exist on type 'never'.
         expect(sortable?.getOptions()).toStrictEqual(["b", "a", "c"]);
     });
 

package/src/components/fixed-to-responsive.tsx

@@ -108,7 +108,7 @@ class FixedToResponsive extends React.Component<Props, State> {
         const spacer = (
             <div
                 style={{
-                    // @ts-expect-error [FEI-5003] - TS2362 - The left-hand side of an arithmetic operation must be of type 'any', 'number', 'bigint' or an enum type.
+                    // @ts-expect-error - TS2362 - The left-hand side of an arithmetic operation must be of type 'any', 'number', 'bigint' or an enum type.
                     paddingBottom: (1 / aspectRatio).toFixed(4) * 100 + "%",
                 }}
             />

package/src/components/graph.tsx

@@ -84,9 +84,9 @@ class Graph extends React.Component<Props> {
     protractor: any;
     ruler: any;
     _graphie: any;
-    // @ts-expect-error [FEI-5003] - TS2564 - Property '_hasSetupGraphieThisUpdate' has no initializer and is not definitely assigned in the constructor.
+    // @ts-expect-error - TS2564 - Property '_hasSetupGraphieThisUpdate' has no initializer and is not definitely assigned in the constructor.
     _hasSetupGraphieThisUpdate: boolean;
-    // @ts-expect-error [FEI-5003] - TS2564 - Property '_shouldSetupGraphie' has no initializer and is not definitely assigned in the constructor.
+    // @ts-expect-error - TS2564 - Property '_shouldSetupGraphie' has no initializer and is not definitely assigned in the constructor.
     _shouldSetupGraphie: boolean;
 
     static defaultProps: DefaultProps = {
@@ -187,7 +187,7 @@ class Graph extends React.Component<Props> {
 
         // eslint-disable-next-line react/no-string-refs
         const graphieDiv = ReactDOM.findDOMNode(this.refs.graphieDiv);
-        // @ts-expect-error [FEI-5003] - TS2769 - No overload matches this call. | TS2339 - Property 'empty' does not exist on type 'JQueryStatic'.
+        // @ts-expect-error - TS2769 - No overload matches this call. | TS2339 - Property 'empty' does not exist on type 'JQueryStatic'.
         $(graphieDiv).empty();
 
         // Content creators may need to explicitly add the dollar signs so the
@@ -266,7 +266,7 @@ class Graph extends React.Component<Props> {
             });
 
             $instructionsWrapper.append($instructions);
-            // @ts-expect-error [FEI-5003] - TS2769 - No overload matches this call. | TS2339 - Property 'append' does not exist on type 'JQueryStatic'.
+            // @ts-expect-error - TS2769 - No overload matches this call. | TS2339 - Property 'append' does not exist on type 'JQueryStatic'.
             $(graphieDiv).append($instructionsWrapper);
         } else {
             $instructionsWrapper = undefined;
@@ -281,7 +281,7 @@ class Graph extends React.Component<Props> {
                           $instructionsWrapper = null;
                       }
                       // eslint-disable-next-line @babel/no-invalid-this
-                      // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
+                      // @ts-expect-error - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
                       // eslint-disable-next-line @babel/no-invalid-this
                       this.props.onMouseDown(coord);
                   }, this)
@@ -346,7 +346,7 @@ class Graph extends React.Component<Props> {
         }
 
         if (this.props.showProtractor) {
-            // @ts-expect-error [FEI-5003] - TS2554 - Expected 2 arguments, but got 1.
+            // @ts-expect-error - TS2554 - Expected 2 arguments, but got 1.
             const coord = this.pointsFromNormalized([[0.5, 0.05]])[0];
             this.protractor = this._graphie.protractor(coord);
         }
@@ -358,7 +358,7 @@ class Graph extends React.Component<Props> {
         }
 
         if (this.props.showRuler) {
-            // @ts-expect-error [FEI-5003] - TS2554 - Expected 2 arguments, but got 1.
+            // @ts-expect-error - TS2554 - Expected 2 arguments, but got 1.
             const coord = this.pointsFromNormalized([[0.5, 0.25]])[0];
             const extent =
                 this._graphie.range[0][1] - this._graphie.range[0][0];
@@ -395,7 +395,7 @@ class Graph extends React.Component<Props> {
         if (imageData.url) {
             const scale = this.props.box[0] / interactiveSizes.defaultBoxSize;
             image = (
-                // @ts-expect-error [FEI-5003] - TS2741 - Property 'alt' is missing in type '{ src: any; width: any; height: any; scale: number; responsive: false; }' but required in type 'Pick<Readonly<Props> & Readonly<{ children?: ReactNode; }>, "children" | "height" | "width" | "title" | "alt" | "trackInteraction" | "preloader" | "allowFullBleed" | "extraGraphie" | "overrideAriaHidden">'.
+                // @ts-expect-error - TS2741 - Property 'alt' is missing in type '{ src: any; width: any; height: any; scale: number; responsive: false; }' but required in type 'Pick<Readonly<Props> & Readonly<{ children?: ReactNode; }>, "children" | "height" | "width" | "title" | "alt" | "trackInteraction" | "preloader" | "allowFullBleed" | "extraGraphie" | "overrideAriaHidden">'.
                 <SvgImage
                     src={imageData.url}
                     width={imageData.width}
@@ -415,11 +415,11 @@ class Graph extends React.Component<Props> {
                     width: this.props.box[0],
                     height: this.props.box[1],
                 }}
-                // @ts-expect-error [FEI-5003] - TS2339 - Property 'onMouseOut' does not exist on type 'Graph'.
+                // @ts-expect-error - TS2339 - Property 'onMouseOut' does not exist on type 'Graph'.
                 onMouseOut={this.onMouseOut}
-                // @ts-expect-error [FEI-5003] - TS2339 - Property 'onMouseOver' does not exist on type 'Graph'.
+                // @ts-expect-error - TS2339 - Property 'onMouseOver' does not exist on type 'Graph'.
                 onMouseOver={this.onMouseOver}
-                // @ts-expect-error [FEI-5003] - TS2339 - Property 'onClick' does not exist on type 'Graph'.
+                // @ts-expect-error - TS2339 - Property 'onClick' does not exist on type 'Graph'.
                 onClick={this.onClick}
             >
                 {image}

package/src/components/graphie-classes.ts

@@ -15,14 +15,14 @@ const deepEq = Util.deepEq;
  * GraphieMovables
  */
 function GraphieMovable(descriptor: any) {
-    // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
+    // @ts-expect-error - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
     _.extend(this, descriptor);
 }
 
 const abstractMethod = function () {
     throw new PerseusError(
         "Abstract method! Must be implemented by Graphie Movable" +
-            // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
+            // @ts-expect-error - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
             this.constructor.displayName,
         Errors.NotAllowed,
     );
@@ -64,16 +64,16 @@ const rewriteProps = function (props: any, childrenArray: any) {
  */
 const createClass = function (spec: any): any {
     const GraphieClass = function (props: any) {
-        // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
+        // @ts-expect-error - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
         if (!(this instanceof GraphieClass)) {
             throw new PerseusError(
                 "Use createElement or JSX with graphie movables",
                 Errors.NotAllowed,
             );
         }
-        // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
+        // @ts-expect-error - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
         this.props = rewriteProps(props, props.children || []);
-        // @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
+        // @ts-expect-error - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
         return this;
     };
 
@@ -125,7 +125,7 @@ const createSimpleClass = function (addFunction: any): any {
         },
 
         remove: function () {
-            // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 2.
+            // @ts-expect-error - TS2554 - Expected 3 arguments, but got 2.
             nestedMap(this._elements, (elem) => {
                 if (elem) {
                     elem.remove();
@@ -136,7 +136,7 @@ const createSimpleClass = function (addFunction: any): any {
         },
 
         toFront: function () {
-            // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 2.
+            // @ts-expect-error - TS2554 - Expected 3 arguments, but got 2.
             nestedMap(this._elements, (elem) => {
                 if (_.isFunction(elem.toFront)) {
                     elem.toFront();

package/src/components/graphie.tsx

@@ -120,7 +120,7 @@ class Graphie extends React.Component<Props> {
      * Use it for good and not evil.
      */
     getGraphie: () => any = () => {
-        // @ts-expect-error [FEI-5003] - TS2339 - Property '_graphie' does not exist on type 'Graphie'.
+        // @ts-expect-error - TS2339 - Property '_graphie' does not exist on type 'Graphie'.
         return this._graphie;
     };
 
@@ -164,9 +164,9 @@ class Graphie extends React.Component<Props> {
         this._removeMovables();
 
         const graphieDiv = ReactDOM.findDOMNode(this.graphieDivRef.current);
-        // @ts-expect-error [FEI-5003] - TS2769 - No overload matches this call. | TS2339 - Property 'empty' does not exist on type 'JQueryStatic'.
+        // @ts-expect-error - TS2769 - No overload matches this call. | TS2339 - Property 'empty' does not exist on type 'JQueryStatic'.
         $(graphieDiv).empty();
-        // @ts-expect-error [FEI-5003] - TS2339 - Property '_graphie' does not exist on type 'Graphie'.
+        // @ts-expect-error - TS2339 - Property '_graphie' does not exist on type 'Graphie'.
         const graphie = (this._graphie = createGraphie(graphieDiv));
 
         // This has to be called before addMouseLayer. You can re-init
@@ -193,7 +193,7 @@ class Graphie extends React.Component<Props> {
             // Overwrite fixed styles set in init()
             // TODO(alex): Either make this component always responsive by
             // itself, or always wrap it in other components so that it is.
-            // @ts-expect-error [FEI-5003] - TS2769 - No overload matches this call. | TS2554 - Expected 2 arguments, but got 1.
+            // @ts-expect-error - TS2769 - No overload matches this call. | TS2554 - Expected 2 arguments, but got 1.
             $(graphieDiv).css({width: "100%", height: "100%"});
             graphie.raphael.setSize("100%", "100%");
         }
@@ -212,13 +212,13 @@ class Graphie extends React.Component<Props> {
 
     _removeMovables: () => void = () => {
         // _.invoke works even when this._movables is undefined
-        // @ts-expect-error [FEI-5003] - TS2339 - Property '_movables' does not exist on type 'Graphie'.
+        // @ts-expect-error - TS2339 - Property '_movables' does not exist on type 'Graphie'.
         _.invoke(this._movables, "remove");
-        // @ts-expect-error [FEI-5003] - TS2339 - Property '_movables' does not exist on type 'Graphie'.
+        // @ts-expect-error - TS2339 - Property '_movables' does not exist on type 'Graphie'.
         this._movables = {};
     };
 
-    // @ts-expect-error [FEI-5003] - TS2322 - Type '(children: readonly any[], options: any) => ReactElement<any, string | JSXElementConstructor<any>> | readonly ReactElement<any, string | JSXElementConstructor<any>>[]' is not assignable to type '(children: readonly any[], arg2: any) => ReactElement<any, string | JSXElementConstructor<any>>'.
+    // @ts-expect-error - TS2322 - Type '(children: readonly any[], options: any) => ReactElement<any, string | JSXElementConstructor<any>> | readonly ReactElement<any, string | JSXElementConstructor<any>>[]' is not assignable to type '(children: readonly any[], arg2: any) => ReactElement<any, string | JSXElementConstructor<any>>'.
     _renderMovables: (
         children: ReadonlyArray<any>,
         arg2: any,
@@ -260,7 +260,7 @@ class Graphie extends React.Component<Props> {
         // elements occurring afterwards. If this happens, we set
         // `areMovablesOutOfOrder` to true:
         let areMovablesOutOfOrder = false;
-        // @ts-expect-error [FEI-5003] - TS2554 - Expected 3 arguments, but got 2.
+        // @ts-expect-error - TS2554 - Expected 3 arguments, but got 2.
         return nestedMap(children, (childDescriptor) => {
             if (!childDescriptor) {
                 // Still increment the key to avoid cascading key changes
@@ -333,7 +333,7 @@ class Graphie extends React.Component<Props> {
             }
 
             if (ref) {
-                // @ts-expect-error [FEI-5003] - TS2339 - Property 'movables' does not exist on type 'Graphie'.
+                // @ts-expect-error - TS2339 - Property 'movables' does not exist on type 'Graphie'.
                 this.movables[ref] = newMovables[key];
             }
 
@@ -343,18 +343,18 @@ class Graphie extends React.Component<Props> {
 
     // Sort of like react diffing, but for movables
     _updateMovables: () => void = () => {
-        // @ts-expect-error [FEI-5003] - TS2339 - Property '_graphie' does not exist on type 'Graphie'.
+        // @ts-expect-error - TS2339 - Property '_graphie' does not exist on type 'Graphie'.
         const graphie = this._graphie;
 
-        // @ts-expect-error [FEI-5003] - TS2339 - Property '_movables' does not exist on type 'Graphie'.
+        // @ts-expect-error - TS2339 - Property '_movables' does not exist on type 'Graphie'.
         const oldMovables = this._movables;
         const newMovables: Record<string, any> = {};
-        // @ts-expect-error [FEI-5003] - TS2339 - Property '_movables' does not exist on type 'Graphie'.
+        // @ts-expect-error - TS2339 - Property '_movables' does not exist on type 'Graphie'.
         this._movables = newMovables;
-        // @ts-expect-error [FEI-5003] - TS2339 - Property 'movables' does not exist on type 'Graphie'.
+        // @ts-expect-error - TS2339 - Property 'movables' does not exist on type 'Graphie'.
         this.movables = {};
 
-        // @ts-expect-error [FEI-5003] - TS2345 - Argument of type 'ReactNode' is not assignable to parameter of type 'readonly any[]'.
+        // @ts-expect-error - TS2345 - Argument of type 'ReactNode' is not assignable to parameter of type 'readonly any[]'.
         this._renderMovables(this.props.children, {
             nextKey: 1,
             graphie: graphie,

package/src/components/highlighting/highlightable-content.tsx

@@ -131,7 +131,7 @@ class HighlightableContent extends React.PureComponent<Props, State> {
     ) => {
         const {serializedHighlights} = this.props;
         const newSerializedHighlights = {...serializedHighlights} as const;
-        // @ts-expect-error [FEI-5003] - TS2542 - Index signature in type '{ readonly [x: string]: SerializedHighlight; }' only permits reading.
+        // @ts-expect-error - TS2542 - Index signature in type '{ readonly [x: string]: SerializedHighlight; }' only permits reading.
         delete newSerializedHighlights[keyToRemove];
         this.props.onSerializedHighlightsUpdate(newSerializedHighlights);
     };

package/src/components/highlighting/ui/highlight-renderer.tsx

@@ -53,7 +53,7 @@ type State = {
 class HighlightRenderer extends React.PureComponent<Props, State> {
     state: State = {
         cachedHighlightRects: this._computeRects(this.props),
-        // @ts-expect-error [FEI-5003] - TS2322 - Type '{ cachedHighlightRects: readonly Rect[]; tooltipIsHovered: boolean; }' is not assignable to type 'HighlightRendererState'.
+        // @ts-expect-error - TS2322 - Type '{ cachedHighlightRects: readonly Rect[]; tooltipIsHovered: boolean; }' is not assignable to type 'HighlightRendererState'.
         tooltipIsHovered: false,
     };
 

package/src/components/highlighting/ui/util.ts

@@ -117,7 +117,7 @@ function addClientRectsForText(
     mutableRects: Array<Rect>,
 ): void {
     const parentElement = textNode.parentElement;
-    // @ts-expect-error [FEI-5003] - TS2345 - Argument of type 'HTMLElement | null' is not assignable to parameter of type 'Element'.
+    // @ts-expect-error - TS2345 - Argument of type 'HTMLElement | null' is not assignable to parameter of type 'Element'.
     const computedStyle = window.getComputedStyle(parentElement);
 
     // NOTE(mdr): I'm not sure how computed line height works in all contexts
@@ -134,7 +134,7 @@ function addClientRectsForText(
     ) {
         const parsedLineHeight = parseFloat(computedStyle.lineHeight);
         if (!isNaN(parsedLineHeight)) {
-            // @ts-expect-error [FEI-5003] - TS2322 - Type 'number' is not assignable to type 'null'.
+            // @ts-expect-error - TS2322 - Type 'number' is not assignable to type 'null'.
             lineHeight = parsedLineHeight;
         }
     }