@khanacademy/perseus 9.0.0 → 10.0.0

package/dist/item-renderer.d.ts

@@ -3,8 +3,9 @@ import HintsRenderer from "./hints-renderer";
 import Renderer from "./renderer";
 import type { KeypadProps } from "./mixins/provide-keypad";
 import type { PerseusItem } from "./perseus-types";
-import type { APIOptions, FocusPath, LinterContextProps, PerseusDependenciesV2 } from "./types";
+import type { APIOptions, FocusPath, PerseusDependenciesV2 } from "./types";
 import type { KEScore } from "@khanacademy/perseus-core";
+import type { LinterContextProps } from "@khanacademy/perseus-linter";
 type Props = // These props are used by the ProvideKeypad mixin.
 KeypadProps & {
     apiOptions: APIOptions;

package/dist/multi-items/multi-renderer.d.ts

@@ -6,10 +6,11 @@ import type { Item, ContentNode, HintNode, TagsNode } from "./item-types";
 import type { Shape, ArrayShape } from "./shape-types";
 import type { Tree } from "./tree-types";
 import type { TreeMapper, ContentMapper, HintMapper, Path } from "./trees";
+import type { PropsFor } from "@khanacademy/wonder-blocks-core";
 type Hint = any;
 type Score = any;
 type SerializedState = any;
-type RendererProps = JSX.LibraryManagedAttributes<typeof Renderer, React.ComponentProps<typeof Renderer>>;
+type RendererProps = PropsFor<typeof Renderer>;
 type ContentRendererElement = React.ReactElement<any>;
 type HintRendererElement = React.ReactElement<any>;
 type ContentRendererData = {

package/dist/renderer.d.ts

@@ -2,7 +2,8 @@ import * as React from "react";
 import InteractionTracker from "./interaction-tracker";
 import TranslationLinter from "./translation-linter";
 import type { PerseusRenderer, PerseusWidgetOptions } from "./perseus-types";
-import type { APIOptions, APIOptionsWithDefaults, FilterCriterion, FocusPath, LinterContextProps, PerseusScore, WidgetInfo, WidgetProps } from "./types";
+import type { APIOptions, APIOptionsWithDefaults, FilterCriterion, FocusPath, PerseusScore, WidgetInfo, WidgetProps } from "./types";
+import type { LinterContextProps } from "@khanacademy/perseus-linter";
 import "./styles/perseus-renderer.less";
 type WidgetState = {
     isMobile?: boolean;
@@ -68,12 +69,6 @@ type State = {
     jiptContent: any;
     lastUsedWidgetId: string | null | undefined;
 };
-type Context = LinterContextProps & {
-    content: string;
-    widgets: {
-        [id: string]: any;
-    };
-};
 type DefaultProps = {
     alwaysUpdate: Props["alwaysUpdate"];
     content: Props["content"];
@@ -103,7 +98,7 @@ declare class Renderer extends React.Component<Props, State> {
     translationIndex: number;
     widgetIds: Array<string>;
     static defaultProps: DefaultProps;
-    constructor(props: Props, context: Context);
+    constructor(props: Props);
     componentDidMount(): void;
     UNSAFE_componentWillReceiveProps(nextProps: Props): void;
     shouldComponentUpdate(nextProps: Props, nextState: State): any | boolean;

package/dist/types.d.ts

@@ -5,6 +5,7 @@ import type { PerseusWidget } from "./perseus-types";
 import type { SizeClass } from "./util/sizing-utils";
 import type { KeypadAPI } from "@khanacademy/math-input";
 import type { AnalyticsEventHandlerFn } from "@khanacademy/perseus-core";
+import type { LinterContextProps } from "@khanacademy/perseus-linter";
 import type { Result } from "@khanacademy/wonder-blocks-data";
 import type * as React from "react";
 export type FocusPath = ReadonlyArray<string> | null | undefined;
@@ -202,12 +203,6 @@ export type APIOptionsWithDefaults = Readonly<APIOptions & {
     showAlignmentOptions: NonNullable<APIOptions["showAlignmentOptions"]>;
     useDraftEditor: NonNullable<APIOptions["useDraftEditor"]>;
 }>;
-export type LinterContextProps = {
-    contentType: string;
-    highlightLint: boolean;
-    paths: ReadonlyArray<string>;
-    stack: ReadonlyArray<string>;
-};
 export type Tracking = "" | "all";
 export type TrackingGradedGroupExtraArguments = {
     status: "correct" | "incorrect" | "invalid";

package/dist/widget-container.d.ts

@@ -1,6 +1,7 @@
 import * as React from "react";
 import type { PerseusWidgetOptions } from "./perseus-types";
-import type { LinterContextProps, WidgetProps } from "./types";
+import type { WidgetProps } from "./types";
+import type { LinterContextProps } from "@khanacademy/perseus-linter";
 type Props = {
     shouldHighlight: boolean;
     type: string;

package/dist/widgets/expression.d.ts

@@ -153,7 +153,7 @@ declare const _default: Readonly<{
         onChange: import("../types").ChangeHandler;
         trackInteraction: (extraData?: {} | undefined) => void;
         isLastUsedWidget: boolean;
-        linterContext: import("../types").LinterContextProps;
+        linterContext: import("@khanacademy/perseus-linter").LinterContextProps;
         containerSizeClass: import("../util/sizing-utils").SizeClass;
     } & import("../types").PerseusDependenciesV2 & {
         apiOptions: Readonly<Readonly<{
@@ -211,16 +211,16 @@ declare const _default: Readonly<{
         }>;
         buttonSets: readonly string[];
         functions: readonly string[];
-        linterContext: import("../types").LinterContextProps;
+        linterContext: import("@khanacademy/perseus-linter").LinterContextProps;
         onBlur: (blurPath: import("../types").FocusPath) => void;
         onFocus: (blurPath: import("../types").FocusPath) => void;
         times: boolean;
         value: string;
-    }, "static" | "trackInteraction" | "onChange" | "problemNum" | "questionCompleted" | "keypadElement" | "alignment" | "findWidgets" | "buttonsVisible" | "containerSizeClass" | "widgetId" | "keypadConfiguration" | "reviewModeRubric" | "isLastUsedWidget" | "analytics"> & {
+    }, "static" | "trackInteraction" | "onChange" | "problemNum" | "questionCompleted" | "keypadElement" | "alignment" | "buttonsVisible" | "containerSizeClass" | "widgetId" | "findWidgets" | "keypadConfiguration" | "reviewModeRubric" | "isLastUsedWidget" | "analytics"> & {
         value?: string | undefined;
         onFocus?: ((blurPath: import("../types").FocusPath) => void) | undefined;
         onBlur?: ((blurPath: import("../types").FocusPath) => void) | undefined;
-        linterContext?: import("../types").LinterContextProps | undefined;
+        linterContext?: import("@khanacademy/perseus-linter").LinterContextProps | undefined;
         apiOptions?: Readonly<Readonly<{
             isArticle?: boolean | undefined;
             onInputError?: ((widgetId: any, value: string, message?: string | null | undefined) => unknown) | undefined;
@@ -359,7 +359,7 @@ declare const _default: Readonly<{
         onChange: import("../types").ChangeHandler;
         trackInteraction: (extraData?: {} | undefined) => void;
         isLastUsedWidget: boolean;
-        linterContext: import("../types").LinterContextProps;
+        linterContext: import("@khanacademy/perseus-linter").LinterContextProps;
         containerSizeClass: import("../util/sizing-utils").SizeClass;
     } & import("../types").PerseusDependenciesV2 & {
         apiOptions: Readonly<Readonly<{
@@ -417,16 +417,16 @@ declare const _default: Readonly<{
         }>;
         buttonSets: readonly string[];
         functions: readonly string[];
-        linterContext: import("../types").LinterContextProps;
+        linterContext: import("@khanacademy/perseus-linter").LinterContextProps;
         onBlur: (blurPath: import("../types").FocusPath) => void;
         onFocus: (blurPath: import("../types").FocusPath) => void;
         times: boolean;
         value: string;
-    }, "static" | "trackInteraction" | "onChange" | "problemNum" | "questionCompleted" | "keypadElement" | "alignment" | "findWidgets" | "buttonsVisible" | "containerSizeClass" | "widgetId" | "keypadConfiguration" | "reviewModeRubric" | "isLastUsedWidget" | "analytics"> & {
+    }, "static" | "trackInteraction" | "onChange" | "problemNum" | "questionCompleted" | "keypadElement" | "alignment" | "buttonsVisible" | "containerSizeClass" | "widgetId" | "findWidgets" | "keypadConfiguration" | "reviewModeRubric" | "isLastUsedWidget" | "analytics"> & {
         value?: string | undefined;
         onFocus?: ((blurPath: import("../types").FocusPath) => void) | undefined;
         onBlur?: ((blurPath: import("../types").FocusPath) => void) | undefined;
-        linterContext?: import("../types").LinterContextProps | undefined;
+        linterContext?: import("@khanacademy/perseus-linter").LinterContextProps | undefined;
         apiOptions?: Readonly<Readonly<{
             isArticle?: boolean | undefined;
             onInputError?: ((widgetId: any, value: string, message?: string | null | undefined) => unknown) | undefined;

package/dist/widgets/grapher.d.ts

@@ -4,6 +4,7 @@ import type { Coord } from "../interactive2/types";
 import type { PerseusGrapherWidgetOptions } from "../perseus-types";
 import type { PerseusScore, WidgetProps } from "../types";
 import type { GridDimensions } from "../util";
+import type { PropsFor } from "@khanacademy/wonder-blocks-core";
 type UserInput = any;
 type RenderProps = {
     availableTypes: PerseusGrapherWidgetOptions["availableTypes"];
@@ -30,7 +31,7 @@ declare class Grapher extends React.Component<Props> {
         box: NonNullable<Props["graph"]["box"]>;
         gridStep: NonNullable<Props["graph"]["gridStep"]>;
     }): ReadonlyArray<GridDimensions>;
-    _calculateMobileTickStep(gridStep: JSX.LibraryManagedAttributes<typeof Graphie, Required<React.ComponentProps<typeof Graphie>>>["gridStep"], step: JSX.LibraryManagedAttributes<typeof Graphie, Required<React.ComponentProps<typeof Graphie>>>["step"], ranges: JSX.LibraryManagedAttributes<typeof Graphie, Required<React.ComponentProps<typeof Graphie>>>["ranges"]): any;
+    _calculateMobileTickStep(gridStep: NonNullable<PropsFor<typeof Graphie>["gridStep"]>, step: NonNullable<PropsFor<typeof Graphie>["step"]>, ranges: NonNullable<PropsFor<typeof Graphie>["ranges"]>): any;
     _setupGraphie: (arg1: any, arg2: any) => void;
     showHairlines: (arg1: Coord) => void;
     hideHairlines: () => void;

package/dist/widgets/passage-ref.d.ts

@@ -1,6 +1,7 @@
 import * as React from "react";
 import type { PerseusPassageRefWidgetOptions } from "../perseus-types";
-import type { ChangeFn, PerseusScore, WidgetProps, LinterContextProps } from "../types";
+import type { ChangeFn, PerseusScore, WidgetProps } from "../types";
+import type { LinterContextProps } from "@khanacademy/perseus-linter";
 type UserInput = RenderProps & {
     static: boolean | null | undefined;
     reviewModeRubric: Rubric;

package/package.json

@@ -3,7 +3,7 @@
     "description": "Core Perseus API (includes renderers and widgets)",
     "author": "Khan Academy",
     "license": "MIT",
-    "version": "9.0.0",
+    "version": "10.0.0",
     "publishConfig": {
         "access": "public"
     },
@@ -23,7 +23,7 @@
     "dependencies": {
         "@khanacademy/kas": "^0.3.1",
         "@khanacademy/kmath": "^0.1.2",
-        "@khanacademy/math-input": "^10.0.0",
+        "@khanacademy/math-input": "^10.0.1",
         "@khanacademy/perseus-core": "0.2.0",
         "@khanacademy/perseus-linter": "^0.3.2",
         "@khanacademy/pure-markdown": "^0.2.4",

package/src/__tests__/renderer.test.tsx

@@ -149,7 +149,6 @@ describe("renderer", () => {
             mockRunLinter.mockClear();
 
             // Act
-            // @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
@@ -1334,7 +1333,6 @@ describe("renderer", () => {
                     },
                 },
                 {},
-                // @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},
             );
 

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

@@ -28,6 +28,7 @@ import MockWidgetExport from "./mock-widget";
 import type {PerseusItem} from "../perseus-types";
 import type {APIOptions} from "../types";
 import type {MockAssetLoadingWidget} from "./mock-asset-loading-widget";
+import type {PropsFor} from "@khanacademy/wonder-blocks-core";
 
 // This looks alot like `widgets/__tests__/renderQuestion.jsx', except we use
 // the ServerItemRenderer instead of Renderer
@@ -35,10 +36,7 @@ const renderQuestion = (
     question: PerseusItem,
     apiOptions: APIOptions = Object.freeze({}),
     optionalProps: Partial<
-        JSX.LibraryManagedAttributes<
-            typeof WrappedServerItemRenderer,
-            React.ComponentProps<typeof WrappedServerItemRenderer>
-        >
+        PropsFor<typeof WrappedServerItemRenderer>
     > = Object.freeze({}),
 ): {
     container: HTMLElement;

package/src/components/info-tip.tsx

@@ -9,10 +9,9 @@ import * as React from "react";
 
 import ReactComponentsInfoTip from "./info-tip/info-tip";
 
-type Props = JSX.LibraryManagedAttributes<
-    typeof ReactComponentsInfoTip,
-    React.ComponentProps<typeof ReactComponentsInfoTip>
->;
+import type {PropsFor} from "@khanacademy/wonder-blocks-core";
+
+type Props = PropsFor<typeof ReactComponentsInfoTip>;
 
 type State = {
     didMount: boolean;

package/src/components/input-with-examples.tsx

@@ -12,7 +12,7 @@ import MathOutput from "./math-output";
 import TextInput from "./text-input";
 import Tooltip, {HorizontalDirection, VerticalDirection} from "./tooltip";
 
-import type {LinterContextProps} from "../types";
+import type {LinterContextProps} from "@khanacademy/perseus-linter";
 import type {StyleType} from "@khanacademy/wonder-blocks-core";
 
 const {captureScratchpadTouchStart} = Util;

package/src/components/sortable.tsx

@@ -13,8 +13,8 @@ import {ClassNames as ApiClassNames} from "../perseus-api";
 import Renderer from "../renderer";
 import Util from "../util";
 
-import type {LinterContextProps} from "../types";
 import type {Position} from "../util";
+import type {LinterContextProps} from "@khanacademy/perseus-linter";
 
 export enum Layout {
     HORIZONTAL = "horizontal",

package/src/hint-renderer.tsx

@@ -8,7 +8,8 @@ import Renderer from "./renderer";
 import {baseUnitPx, hintBorderWidth, kaGreen, gray97} from "./styles/constants";
 import mediaQueries from "./styles/media-queries";
 
-import type {APIOptions, LinterContextProps} from "./types";
+import type {APIOptions} from "./types";
+import type {LinterContextProps} from "@khanacademy/perseus-linter";
 
 type Props = {
     apiOptions: APIOptions;

package/src/hints-renderer.tsx

@@ -22,12 +22,9 @@ import Util from "./util";
 
 import type Renderer from "./renderer";
 import type {APIOptionsWithDefaults} from "./types";
+import type {PropsFor} from "@khanacademy/wonder-blocks-core";
 
-type Props = JSX.LibraryManagedAttributes<
-    Renderer,
-    // @ts-expect-error - TS2344 - Type 'Renderer' does not satisfy the constraint 'keyof IntrinsicElements | JSXElementConstructor<any>'.
-    React.ComponentProps<typeof Renderer>
-> & {
+type Props = PropsFor<typeof Renderer> & {
     className?: string;
     // note (mcurtis): I think this should be $ReadOnlyArray<PerseusRenderer>,
     // but things spiraled out of control when I tried to change it
@@ -36,7 +33,6 @@ type Props = JSX.LibraryManagedAttributes<
 };
 
 type DefaultProps = {
-    // @ts-expect-error - TS2339 - Property 'linterContext' does not exist on type '{ className?: string | undefined; hints: readonly any[]; hintsVisible?: number | undefined; }'.
     linterContext: Props["linterContext"];
 };
 
@@ -126,7 +122,6 @@ class HintsRenderer extends React.Component<Props, State> {
         // false in hints.
         return {
             ...ApiOptions.defaults,
-            // @ts-expect-error - TS2339 - Property 'apiOptions' does not exist on type 'Readonly<{ className?: string | undefined; hints: readonly any[]; hintsVisible?: number | undefined; }> & Readonly<{ children?: ReactNode; }>'.
             ...this.props.apiOptions,
             readOnly: false,
         };
@@ -196,10 +191,8 @@ class HintsRenderer extends React.Component<Props, State> {
                     ref={"hintRenderer" + i}
                     key={"hintRenderer" + i}
                     apiOptions={apiOptions}
-                    // @ts-expect-error - TS2339 - Property 'findExternalWidgets' does not exist on type 'Readonly<{ className?: string | undefined; hints: readonly any[]; hintsVisible?: number | undefined; }> & Readonly<{ children?: ReactNode; }>'.
                     findExternalWidgets={this.props.findExternalWidgets}
                     linterContext={PerseusLinter.pushContextStack(
-                        // @ts-expect-error - TS2339 - Property 'linterContext' does not exist on type 'Readonly<{ className?: string | undefined; hints: readonly any[]; hintsVisible?: number | undefined; }> & Readonly<{ children?: ReactNode; }>'.
                         this.props.linterContext,
                         "hints[" + i + "]",
                     )}

package/src/index.ts

@@ -109,7 +109,6 @@ export type {
     ImageUploader,
     JiptLabelStore,
     JiptRenderer,
-    LinterContextProps,
     PerseusDependencies,
     PerseusScore,
     Version,

package/src/item-renderer.tsx

@@ -17,13 +17,9 @@ import reactRender from "./util/react-render";
 
 import type {KeypadProps} from "./mixins/provide-keypad";
 import type {PerseusItem} from "./perseus-types";
-import type {
-    APIOptions,
-    FocusPath,
-    LinterContextProps,
-    PerseusDependenciesV2,
-} from "./types";
+import type {APIOptions, FocusPath, PerseusDependenciesV2} from "./types";
 import type {KEScore} from "@khanacademy/perseus-core";
+import type {LinterContextProps} from "@khanacademy/perseus-linter";
 
 const {mapObject} = Objective;
 
@@ -228,7 +224,6 @@ class ItemRenderer extends React.Component<Props, State> {
                     ref={(node) => (this.hintsRenderer = node)}
                     hints={this.props.item.hints}
                     hintsVisible={this.state.hintsVisible}
-                    // @ts-expect-error - TS2769 - No overload matches this call.
                     apiOptions={apiOptions}
                     linterContext={PerseusLinter.pushContextStack(
                         this.props.linterContext,

package/src/multi-items/multi-renderer.tsx

@@ -61,16 +61,13 @@ import type {Item, ContentNode, HintNode, TagsNode} from "./item-types";
 import type {Shape, ArrayShape} from "./shape-types";
 import type {Tree} from "./tree-types";
 import type {TreeMapper, ContentMapper, HintMapper, Path} from "./trees";
+import type {PropsFor} from "@khanacademy/wonder-blocks-core";
 
 type Hint = any; // TODO(mdr)
 type Score = any; // TODO(mdr)
 type SerializedState = any; // TODO(mdr)
 
-type RendererProps = JSX.LibraryManagedAttributes<
-    typeof Renderer,
-    // @ts-expect-error - TS2344 - Type 'typeof Renderer' does not satisfy the constraint 'keyof IntrinsicElements | JSXElementConstructor<any>'.
-    React.ComponentProps<typeof Renderer>
->;
+type RendererProps = PropsFor<typeof Renderer>;
 
 type ContentRendererElement = React.ReactElement<any>;
 type HintRendererElement = React.ReactElement<any>;
@@ -314,7 +311,6 @@ class MultiRenderer extends React.Component<Props, State> {
             makeRenderer: () => (
                 <HintsRenderer
                     {...this._getRendererProps()}
-                    // @ts-expect-error - TS2769 - No overload matches this call.
                     findExternalWidgets={findExternalWidgets}
                     hints={[hint]}
                 />
@@ -514,7 +510,6 @@ class MultiRenderer extends React.Component<Props, State> {
             (renderers as any).firstN = (n: any) => (
                 <HintsRenderer
                     {...this._getRendererProps()}
-                    // @ts-expect-error - TS2769 - No overload matches this call.
                     findExternalWidgets={
                         hintRendererDatas[0]
                             ? hintRendererDatas[0].findExternalWidgets

package/src/renderer.tsx

@@ -35,11 +35,11 @@ import type {
     APIOptionsWithDefaults,
     FilterCriterion,
     FocusPath,
-    LinterContextProps,
     PerseusScore,
     WidgetInfo,
     WidgetProps,
 } from "./types";
+import type {LinterContextProps} from "@khanacademy/perseus-linter";
 
 import "./styles/perseus-renderer.less";
 
@@ -250,8 +250,8 @@ class Renderer extends React.Component<Props, State> {
         linterContext: PerseusLinter.linterContextDefault,
     };
 
-    constructor(props: Props, context: Context) {
-        super(props, context);
+    constructor(props: Props) {
+        super(props);
         this._translationLinter = new TranslationLinter();
 
         this.state = {

package/src/server-item-renderer.tsx

@@ -421,7 +421,6 @@ export class ServerItemRenderer
             <HintsRenderer
                 hints={this.props.item.hints}
                 hintsVisible={this.props.hintsVisible}
-                // @ts-expect-error - TS2769 - No overload matches this call.
                 apiOptions={apiOptions}
                 ref={(elem) => (this.hintsRenderer = elem)}
             />

package/src/types.ts

@@ -5,6 +5,7 @@ import type {PerseusWidget} from "./perseus-types";
 import type {SizeClass} from "./util/sizing-utils";
 import type {KeypadAPI} from "@khanacademy/math-input";
 import type {AnalyticsEventHandlerFn} from "@khanacademy/perseus-core";
+import type {LinterContextProps} from "@khanacademy/perseus-linter";
 import type {Result} from "@khanacademy/wonder-blocks-data";
 import type * as React from "react";
 
@@ -375,14 +376,6 @@ export type APIOptionsWithDefaults = Readonly<
     }
 >;
 
-export type LinterContextProps = {
-    contentType: string;
-    highlightLint: boolean;
-    paths: ReadonlyArray<string>;
-    stack: ReadonlyArray<string>;
-    // additional properties can be added to the context by widgets
-};
-
 export type Tracking =
     // Track interactions once
     | ""

package/src/widget-container.tsx

@@ -9,7 +9,8 @@ import {containerSizeClass, getClassFromWidth} from "./util/sizing-utils";
 import * as Widgets from "./widgets";
 
 import type {PerseusWidgetOptions} from "./perseus-types";
-import type {LinterContextProps, WidgetProps} from "./types";
+import type {WidgetProps} from "./types";
+import type {LinterContextProps} from "@khanacademy/perseus-linter";
 
 type Props = {
     shouldHighlight: boolean;

package/src/widgets/__tests__/renderQuestion.tsx

@@ -10,27 +10,20 @@ import {registerAllWidgetsForTesting} from "../../util/register-all-widgets-for-
 
 import type {PerseusRenderer} from "../../perseus-types";
 import type {APIOptions} from "../../types";
+import type {PropsFor} from "@khanacademy/wonder-blocks-core";
 
 type RenderResult = ReturnType<typeof render>;
 
 export const renderQuestion = (
     question: PerseusRenderer,
     apiOptions: APIOptions = Object.freeze({}),
-    extraProps?: JSX.LibraryManagedAttributes<
-        typeof Perseus.Renderer,
-        // @ts-expect-error - TS2344 - Type 'typeof Renderer' does not satisfy the constraint 'keyof IntrinsicElements | JSXElementConstructor<any>'.
-        React.ComponentProps<typeof Perseus.Renderer>
-    >,
+    extraProps?: PropsFor<typeof Perseus.Renderer>,
 ): {
     container: HTMLElement;
     renderer: Perseus.Renderer;
     rerender: (
         question: PerseusRenderer,
-        extraProps?: JSX.LibraryManagedAttributes<
-            typeof Perseus.Renderer,
-            // @ts-expect-error - TS2344 - Type 'typeof Renderer' does not satisfy the constraint 'keyof IntrinsicElements | JSXElementConstructor<any>'.
-            React.ComponentProps<typeof Perseus.Renderer>
-        >,
+        extraProps?: PropsFor<typeof Perseus.Renderer>,
     ) => void;
     unmount: RenderResult["unmount"];
 } => {
@@ -57,7 +50,6 @@ export const renderQuestion = (
     }
     const renderAgain = (
         question: PerseusRenderer,
-        // @ts-expect-error - TS2344 - Type 'typeof Renderer' does not satisfy the constraint 'keyof IntrinsicElements | JSXElementConstructor<any>'.
         extraProps: undefined | React.ComponentProps<typeof Perseus.Renderer>,
     ) => {
         rerender(

package/src/widgets/expression.tsx

@@ -30,6 +30,7 @@ import type {
     WidgetProps,
 } from "../types";
 import type {Keys as Key} from "@khanacademy/math-input";
+import type {PropsFor} from "@khanacademy/wonder-blocks-core";
 
 type InputPath = ReadonlyArray<string>;
 
@@ -673,13 +674,7 @@ const propUpgrades = {
 
 const ExpressionWithDependencies = React.forwardRef<
     Expression,
-    Omit<
-        JSX.LibraryManagedAttributes<
-            typeof Expression,
-            React.ComponentProps<typeof Expression>
-        >,
-        keyof ReturnType<typeof useDependencies>
-    >
+    Omit<PropsFor<typeof Expression>, keyof ReturnType<typeof useDependencies>>
 >((props, ref) => {
     const deps = useDependencies();
     return <Expression ref={ref} analytics={deps.analytics} {...props} />;

package/src/widgets/grapher.tsx

@@ -36,6 +36,7 @@ import type {ChangeableProps} from "../mixins/changeable";
 import type {PerseusGrapherWidgetOptions} from "../perseus-types";
 import type {PerseusScore, WidgetExports, WidgetProps} from "../types";
 import type {GridDimensions} from "../util";
+import type {PropsFor} from "@khanacademy/wonder-blocks-core";
 
 // @ts-expect-error - TS2339 - Property 'MovablePoint' does not exist on type 'typeof Graphie'.
 const MovablePoint = Graphie.MovablePoint;
@@ -473,18 +474,9 @@ class Grapher extends React.Component<Props> {
     }
 
     _calculateMobileTickStep(
-        gridStep: JSX.LibraryManagedAttributes<
-            typeof Graphie,
-            Required<React.ComponentProps<typeof Graphie>>
-        >["gridStep"],
-        step: JSX.LibraryManagedAttributes<
-            typeof Graphie,
-            Required<React.ComponentProps<typeof Graphie>>
-        >["step"],
-        ranges: JSX.LibraryManagedAttributes<
-            typeof Graphie,
-            Required<React.ComponentProps<typeof Graphie>>
-        >["ranges"],
+        gridStep: NonNullable<PropsFor<typeof Graphie>["gridStep"]>,
+        step: NonNullable<PropsFor<typeof Graphie>["step"]>,
+        ranges: NonNullable<PropsFor<typeof Graphie>["ranges"]>,
     ): any {
         const tickStep = Util.constrainedTickStepsFromTickSteps(step, ranges);
 

package/src/widgets/passage-ref.tsx

@@ -13,9 +13,9 @@ import type {
     PerseusScore,
     WidgetExports,
     WidgetProps,
-    LinterContextProps,
 } from "../types";
 import type {Passage, Reference} from "./passage";
+import type {LinterContextProps} from "@khanacademy/perseus-linter";
 
 const EN_DASH = "\u2013";