@khanacademy/perseus 7.2.1 → 9.0.0

package/dist/widgets/expression.d.ts

@@ -1,11 +1,20 @@
-import { Keys as Key } from "@khanacademy/math-input";
+import { KeypadType } from "@khanacademy/math-input";
 import * as React from "react";
+import { useDependencies } from "../dependencies";
 import type { PerseusExpressionWidgetOptions } from "../perseus-types";
 import type { PerseusScore, WidgetProps } from "../types";
+import type { Keys as Key } from "@khanacademy/math-input";
 type InputPath = ReadonlyArray<string>;
 type Rubric = PerseusExpressionWidgetOptions;
+type RenderProps = {
+    buttonSets: PerseusExpressionWidgetOptions["buttonSets"];
+    buttonsVisible?: PerseusExpressionWidgetOptions["buttonsVisible"];
+    functions: PerseusExpressionWidgetOptions["functions"];
+    times: PerseusExpressionWidgetOptions["times"];
+    keypadConfiguration: ReturnType<typeof keypadConfigurationForProps>;
+};
 type ExternalProps = WidgetProps<RenderProps, Rubric>;
-export type Props = ExternalProps & {
+export type Props = ExternalProps & ReturnType<typeof useDependencies> & {
     apiOptions: NonNullable<ExternalProps["apiOptions"]>;
     buttonSets: NonNullable<ExternalProps["buttonSets"]>;
     functions: NonNullable<ExternalProps["functions"]>;
@@ -56,22 +65,219 @@ export declare class Expression extends React.Component<Props, ExpressionState>
     getInputPaths: () => ReadonlyArray<ReadonlyArray<any>>;
     getGrammarTypeForPath: (inputPath: string) => string;
     setInputValue: (path: string, newValue: string, cb: () => void) => void;
+    sendExpressionEvaluatedEvent(result: "correct" | "incorrect" | "invalid"): void;
     render(): React.ReactNode | React.ReactElement<React.ComponentProps<"div">>;
 }
-type RenderProps = {
-    buttonSets: any;
-    buttonsVisible?: "always" | "focused" | "never";
-    functions: ReadonlyArray<string>;
-    keypadConfiguration: {
-        extraKeys: ReadonlyArray<any | string>;
-        keypadType: any;
-    };
-    times: boolean;
+/**
+ * Determine the keypad configuration parameters for the input, based on the
+ * provided properties.
+ *
+ * There are two configuration parameters to be passed to the keypad:
+ *   (1) The keypad type. For the Expression widget, we always use the
+ *       Expression keypad.
+ *   (2) The extra keys; namely, any variables or constants (like Pi) that need
+ *       to be included as keys on the keypad. These are scraped from the answer
+ *       forms.
+ */
+declare const keypadConfigurationForProps: (widgetOptions: PerseusExpressionWidgetOptions) => {
+    keypadType: KeypadType;
+    extraKeys: string[];
 };
 declare const _default: Readonly<{
     name: string;
     displayName: string;
-    getWidget?: (() => typeof Expression) | undefined;
+    getWidget?: (() => React.ForwardRefExoticComponent<Omit<Pick<RenderProps & {
+        widgetId: string;
+        alignment: string | null | undefined;
+        static: boolean | null | undefined;
+        problemNum: number | null | undefined;
+        apiOptions: Readonly<Readonly<{
+            isArticle?: boolean | undefined;
+            onInputError?: ((widgetId: any, value: string, message?: string | null | undefined) => unknown) | undefined;
+            onFocusChange?: ((newFocusPath: import("../types").FocusPath, oldFocusPath: import("../types").FocusPath, keypadElement?: HTMLElement | undefined, focusedElement?: HTMLElement | undefined) => unknown) | undefined;
+            GroupMetadataEditor?: React.ComponentType<any> | undefined;
+            showAlignmentOptions?: boolean | undefined;
+            readOnly?: boolean | undefined;
+            answerableCallback?: ((arg1: boolean) => unknown) | undefined;
+            getAnotherHint?: (() => unknown) | undefined;
+            interactionCallback?: (() => unknown) | undefined;
+            groupAnnotator?: ((groupNumber: number, widgetId: string) => React.ReactNode) | undefined;
+            imagePlaceholder?: React.ReactNode;
+            widgetPlaceholder?: React.ReactNode;
+            baseElements?: {
+                Link: React.ComponentType<any>;
+            } | undefined;
+            imagePreloader?: ((dimensions: import("../types").Dimensions) => React.ReactNode) | undefined;
+            trackInteraction?: ((args: {
+                type: string;
+                id: string;
+                correct?: boolean | undefined;
+            } & Partial<import("../types").TrackingGradedGroupExtraArguments> & Partial<import("../types").TrackingSequenceExtraArguments>) => void) | undefined;
+            customKeypad?: boolean | undefined;
+            useV2Keypad?: boolean | undefined;
+            nativeKeypadProxy?: ((blur: () => void) => import("@khanacademy/math-input").KeypadAPI) | undefined;
+            isMobile?: boolean | undefined;
+            setDrawingAreaAvailable?: ((arg1: boolean) => unknown) | undefined;
+            useDraftEditor?: boolean | undefined;
+            hintProgressColor?: string | undefined;
+            canScrollPage?: boolean | undefined;
+            inModal?: boolean | undefined;
+            crossOutEnabled?: boolean | undefined;
+            editorChangeDelay?: number | undefined;
+        }> & {
+            GroupMetadataEditor: NonNullable<React.ComponentType<any> | undefined>;
+            baseElements: {
+                Link: React.ComponentType<any>;
+            };
+            canScrollPage: NonNullable<boolean | undefined>;
+            crossOutEnabled: NonNullable<boolean | undefined>;
+            editorChangeDelay: number;
+            groupAnnotator: (groupNumber: number, widgetId: string) => React.ReactNode;
+            inModal: NonNullable<boolean | undefined>;
+            isArticle: NonNullable<boolean | undefined>;
+            isMobile: NonNullable<boolean | undefined>;
+            useV2Keypad: NonNullable<boolean | undefined>;
+            onFocusChange: (newFocusPath: import("../types").FocusPath, oldFocusPath: import("../types").FocusPath, keypadElement?: HTMLElement | undefined, focusedElement?: HTMLElement | undefined) => unknown;
+            onInputError: (widgetId: any, value: string, message?: string | null | undefined) => unknown;
+            readOnly: NonNullable<boolean | undefined>;
+            setDrawingAreaAvailable: (arg1: boolean) => unknown;
+            showAlignmentOptions: NonNullable<boolean | undefined>;
+            useDraftEditor: NonNullable<boolean | undefined>;
+        }>;
+        keypadElement?: any;
+        questionCompleted?: boolean | undefined;
+        onFocus: (blurPath: import("../types").FocusPath) => void;
+        onBlur: (blurPath: import("../types").FocusPath) => void;
+        findWidgets: (arg1: import("../types").FilterCriterion) => readonly any[];
+        reviewModeRubric: PerseusExpressionWidgetOptions;
+        onChange: import("../types").ChangeHandler;
+        trackInteraction: (extraData?: {} | undefined) => void;
+        isLastUsedWidget: boolean;
+        linterContext: import("../types").LinterContextProps;
+        containerSizeClass: import("../util/sizing-utils").SizeClass;
+    } & import("../types").PerseusDependenciesV2 & {
+        apiOptions: Readonly<Readonly<{
+            isArticle?: boolean | undefined;
+            onInputError?: ((widgetId: any, value: string, message?: string | null | undefined) => unknown) | undefined;
+            onFocusChange?: ((newFocusPath: import("../types").FocusPath, oldFocusPath: import("../types").FocusPath, keypadElement?: HTMLElement | undefined, focusedElement?: HTMLElement | undefined) => unknown) | undefined;
+            GroupMetadataEditor?: React.ComponentType<any> | undefined;
+            showAlignmentOptions?: boolean | undefined;
+            readOnly?: boolean | undefined;
+            answerableCallback?: ((arg1: boolean) => unknown) | undefined;
+            getAnotherHint?: (() => unknown) | undefined;
+            interactionCallback?: (() => unknown) | undefined;
+            groupAnnotator?: ((groupNumber: number, widgetId: string) => React.ReactNode) | undefined;
+            imagePlaceholder?: React.ReactNode;
+            widgetPlaceholder?: React.ReactNode;
+            baseElements?: {
+                Link: React.ComponentType<any>;
+            } | undefined;
+            imagePreloader?: ((dimensions: import("../types").Dimensions) => React.ReactNode) | undefined;
+            trackInteraction?: ((args: {
+                type: string;
+                id: string;
+                correct?: boolean | undefined;
+            } & Partial<import("../types").TrackingGradedGroupExtraArguments> & Partial<import("../types").TrackingSequenceExtraArguments>) => void) | undefined;
+            customKeypad?: boolean | undefined;
+            useV2Keypad?: boolean | undefined;
+            nativeKeypadProxy?: ((blur: () => void) => import("@khanacademy/math-input").KeypadAPI) | undefined;
+            isMobile?: boolean | undefined;
+            setDrawingAreaAvailable?: ((arg1: boolean) => unknown) | undefined;
+            useDraftEditor?: boolean | undefined;
+            hintProgressColor?: string | undefined;
+            canScrollPage?: boolean | undefined;
+            inModal?: boolean | undefined;
+            crossOutEnabled?: boolean | undefined;
+            editorChangeDelay?: number | undefined;
+        }> & {
+            GroupMetadataEditor: NonNullable<React.ComponentType<any> | undefined>;
+            baseElements: {
+                Link: React.ComponentType<any>;
+            };
+            canScrollPage: NonNullable<boolean | undefined>;
+            crossOutEnabled: NonNullable<boolean | undefined>;
+            editorChangeDelay: number;
+            groupAnnotator: (groupNumber: number, widgetId: string) => React.ReactNode;
+            inModal: NonNullable<boolean | undefined>;
+            isArticle: NonNullable<boolean | undefined>;
+            isMobile: NonNullable<boolean | undefined>;
+            useV2Keypad: NonNullable<boolean | undefined>;
+            onFocusChange: (newFocusPath: import("../types").FocusPath, oldFocusPath: import("../types").FocusPath, keypadElement?: HTMLElement | undefined, focusedElement?: HTMLElement | undefined) => unknown;
+            onInputError: (widgetId: any, value: string, message?: string | null | undefined) => unknown;
+            readOnly: NonNullable<boolean | undefined>;
+            setDrawingAreaAvailable: (arg1: boolean) => unknown;
+            showAlignmentOptions: NonNullable<boolean | undefined>;
+            useDraftEditor: NonNullable<boolean | undefined>;
+        }>;
+        buttonSets: readonly string[];
+        functions: readonly string[];
+        linterContext: import("../types").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"> & {
+        value?: string | undefined;
+        onFocus?: ((blurPath: import("../types").FocusPath) => void) | undefined;
+        onBlur?: ((blurPath: import("../types").FocusPath) => void) | undefined;
+        linterContext?: import("../types").LinterContextProps | undefined;
+        apiOptions?: Readonly<Readonly<{
+            isArticle?: boolean | undefined;
+            onInputError?: ((widgetId: any, value: string, message?: string | null | undefined) => unknown) | undefined;
+            onFocusChange?: ((newFocusPath: import("../types").FocusPath, oldFocusPath: import("../types").FocusPath, keypadElement?: HTMLElement | undefined, focusedElement?: HTMLElement | undefined) => unknown) | undefined;
+            GroupMetadataEditor?: React.ComponentType<any> | undefined;
+            showAlignmentOptions?: boolean | undefined;
+            readOnly?: boolean | undefined;
+            answerableCallback?: ((arg1: boolean) => unknown) | undefined;
+            getAnotherHint?: (() => unknown) | undefined;
+            interactionCallback?: (() => unknown) | undefined;
+            groupAnnotator?: ((groupNumber: number, widgetId: string) => React.ReactNode) | undefined;
+            imagePlaceholder?: React.ReactNode;
+            widgetPlaceholder?: React.ReactNode;
+            baseElements?: {
+                Link: React.ComponentType<any>;
+            } | undefined;
+            imagePreloader?: ((dimensions: import("../types").Dimensions) => React.ReactNode) | undefined;
+            trackInteraction?: ((args: {
+                type: string;
+                id: string;
+                correct?: boolean | undefined;
+            } & Partial<import("../types").TrackingGradedGroupExtraArguments> & Partial<import("../types").TrackingSequenceExtraArguments>) => void) | undefined;
+            customKeypad?: boolean | undefined;
+            useV2Keypad?: boolean | undefined;
+            nativeKeypadProxy?: ((blur: () => void) => import("@khanacademy/math-input").KeypadAPI) | undefined;
+            isMobile?: boolean | undefined;
+            setDrawingAreaAvailable?: ((arg1: boolean) => unknown) | undefined;
+            useDraftEditor?: boolean | undefined;
+            hintProgressColor?: string | undefined;
+            canScrollPage?: boolean | undefined;
+            inModal?: boolean | undefined;
+            crossOutEnabled?: boolean | undefined;
+            editorChangeDelay?: number | undefined;
+        }> & {
+            GroupMetadataEditor: NonNullable<React.ComponentType<any> | undefined>;
+            baseElements: {
+                Link: React.ComponentType<any>;
+            };
+            canScrollPage: NonNullable<boolean | undefined>;
+            crossOutEnabled: NonNullable<boolean | undefined>;
+            editorChangeDelay: number;
+            groupAnnotator: (groupNumber: number, widgetId: string) => React.ReactNode;
+            inModal: NonNullable<boolean | undefined>;
+            isArticle: NonNullable<boolean | undefined>;
+            isMobile: NonNullable<boolean | undefined>;
+            useV2Keypad: NonNullable<boolean | undefined>;
+            onFocusChange: (newFocusPath: import("../types").FocusPath, oldFocusPath: import("../types").FocusPath, keypadElement?: HTMLElement | undefined, focusedElement?: HTMLElement | undefined) => unknown;
+            onInputError: (widgetId: any, value: string, message?: string | null | undefined) => unknown;
+            readOnly: NonNullable<boolean | undefined>;
+            setDrawingAreaAvailable: (arg1: boolean) => unknown;
+            showAlignmentOptions: NonNullable<boolean | undefined>;
+            useDraftEditor: NonNullable<boolean | undefined>;
+        }> | undefined;
+        times?: boolean | undefined;
+        buttonSets?: readonly string[] | undefined;
+        functions?: readonly string[] | undefined;
+    } & {}, "analytics"> & React.RefAttributes<Expression>>) | undefined;
     accessible?: boolean | ((props: any) => boolean) | undefined;
     hidden?: boolean | undefined;
     version?: import("../types").Version | undefined;
@@ -86,6 +292,197 @@ declare const _default: Readonly<{
     propUpgrades?: {
         [key: string]: (arg1: any) => any;
     } | undefined;
-    widget: typeof Expression;
+    widget: React.ForwardRefExoticComponent<Omit<Pick<RenderProps & {
+        widgetId: string;
+        alignment: string | null | undefined;
+        static: boolean | null | undefined;
+        problemNum: number | null | undefined;
+        apiOptions: Readonly<Readonly<{
+            isArticle?: boolean | undefined;
+            onInputError?: ((widgetId: any, value: string, message?: string | null | undefined) => unknown) | undefined;
+            onFocusChange?: ((newFocusPath: import("../types").FocusPath, oldFocusPath: import("../types").FocusPath, keypadElement?: HTMLElement | undefined, focusedElement?: HTMLElement | undefined) => unknown) | undefined;
+            GroupMetadataEditor?: React.ComponentType<any> | undefined;
+            showAlignmentOptions?: boolean | undefined;
+            readOnly?: boolean | undefined;
+            answerableCallback?: ((arg1: boolean) => unknown) | undefined;
+            getAnotherHint?: (() => unknown) | undefined;
+            interactionCallback?: (() => unknown) | undefined;
+            groupAnnotator?: ((groupNumber: number, widgetId: string) => React.ReactNode) | undefined;
+            imagePlaceholder?: React.ReactNode;
+            widgetPlaceholder?: React.ReactNode;
+            baseElements?: {
+                Link: React.ComponentType<any>;
+            } | undefined;
+            imagePreloader?: ((dimensions: import("../types").Dimensions) => React.ReactNode) | undefined;
+            trackInteraction?: ((args: {
+                type: string;
+                id: string;
+                correct?: boolean | undefined;
+            } & Partial<import("../types").TrackingGradedGroupExtraArguments> & Partial<import("../types").TrackingSequenceExtraArguments>) => void) | undefined;
+            customKeypad?: boolean | undefined;
+            useV2Keypad?: boolean | undefined;
+            nativeKeypadProxy?: ((blur: () => void) => import("@khanacademy/math-input").KeypadAPI) | undefined;
+            isMobile?: boolean | undefined;
+            setDrawingAreaAvailable?: ((arg1: boolean) => unknown) | undefined;
+            useDraftEditor?: boolean | undefined;
+            hintProgressColor?: string | undefined;
+            canScrollPage?: boolean | undefined;
+            inModal?: boolean | undefined;
+            crossOutEnabled?: boolean | undefined;
+            editorChangeDelay?: number | undefined;
+        }> & {
+            GroupMetadataEditor: NonNullable<React.ComponentType<any> | undefined>;
+            baseElements: {
+                Link: React.ComponentType<any>;
+            };
+            canScrollPage: NonNullable<boolean | undefined>;
+            crossOutEnabled: NonNullable<boolean | undefined>;
+            editorChangeDelay: number;
+            groupAnnotator: (groupNumber: number, widgetId: string) => React.ReactNode;
+            inModal: NonNullable<boolean | undefined>;
+            isArticle: NonNullable<boolean | undefined>;
+            isMobile: NonNullable<boolean | undefined>;
+            useV2Keypad: NonNullable<boolean | undefined>;
+            onFocusChange: (newFocusPath: import("../types").FocusPath, oldFocusPath: import("../types").FocusPath, keypadElement?: HTMLElement | undefined, focusedElement?: HTMLElement | undefined) => unknown;
+            onInputError: (widgetId: any, value: string, message?: string | null | undefined) => unknown;
+            readOnly: NonNullable<boolean | undefined>;
+            setDrawingAreaAvailable: (arg1: boolean) => unknown;
+            showAlignmentOptions: NonNullable<boolean | undefined>;
+            useDraftEditor: NonNullable<boolean | undefined>;
+        }>;
+        keypadElement?: any;
+        questionCompleted?: boolean | undefined;
+        onFocus: (blurPath: import("../types").FocusPath) => void;
+        onBlur: (blurPath: import("../types").FocusPath) => void;
+        findWidgets: (arg1: import("../types").FilterCriterion) => readonly any[];
+        reviewModeRubric: PerseusExpressionWidgetOptions;
+        onChange: import("../types").ChangeHandler;
+        trackInteraction: (extraData?: {} | undefined) => void;
+        isLastUsedWidget: boolean;
+        linterContext: import("../types").LinterContextProps;
+        containerSizeClass: import("../util/sizing-utils").SizeClass;
+    } & import("../types").PerseusDependenciesV2 & {
+        apiOptions: Readonly<Readonly<{
+            isArticle?: boolean | undefined;
+            onInputError?: ((widgetId: any, value: string, message?: string | null | undefined) => unknown) | undefined;
+            onFocusChange?: ((newFocusPath: import("../types").FocusPath, oldFocusPath: import("../types").FocusPath, keypadElement?: HTMLElement | undefined, focusedElement?: HTMLElement | undefined) => unknown) | undefined;
+            GroupMetadataEditor?: React.ComponentType<any> | undefined;
+            showAlignmentOptions?: boolean | undefined;
+            readOnly?: boolean | undefined;
+            answerableCallback?: ((arg1: boolean) => unknown) | undefined;
+            getAnotherHint?: (() => unknown) | undefined;
+            interactionCallback?: (() => unknown) | undefined;
+            groupAnnotator?: ((groupNumber: number, widgetId: string) => React.ReactNode) | undefined;
+            imagePlaceholder?: React.ReactNode;
+            widgetPlaceholder?: React.ReactNode;
+            baseElements?: {
+                Link: React.ComponentType<any>;
+            } | undefined;
+            imagePreloader?: ((dimensions: import("../types").Dimensions) => React.ReactNode) | undefined;
+            trackInteraction?: ((args: {
+                type: string;
+                id: string;
+                correct?: boolean | undefined;
+            } & Partial<import("../types").TrackingGradedGroupExtraArguments> & Partial<import("../types").TrackingSequenceExtraArguments>) => void) | undefined;
+            customKeypad?: boolean | undefined;
+            useV2Keypad?: boolean | undefined;
+            nativeKeypadProxy?: ((blur: () => void) => import("@khanacademy/math-input").KeypadAPI) | undefined;
+            isMobile?: boolean | undefined;
+            setDrawingAreaAvailable?: ((arg1: boolean) => unknown) | undefined;
+            useDraftEditor?: boolean | undefined;
+            hintProgressColor?: string | undefined;
+            canScrollPage?: boolean | undefined;
+            inModal?: boolean | undefined;
+            crossOutEnabled?: boolean | undefined;
+            editorChangeDelay?: number | undefined;
+        }> & {
+            GroupMetadataEditor: NonNullable<React.ComponentType<any> | undefined>;
+            baseElements: {
+                Link: React.ComponentType<any>;
+            };
+            canScrollPage: NonNullable<boolean | undefined>;
+            crossOutEnabled: NonNullable<boolean | undefined>;
+            editorChangeDelay: number;
+            groupAnnotator: (groupNumber: number, widgetId: string) => React.ReactNode;
+            inModal: NonNullable<boolean | undefined>;
+            isArticle: NonNullable<boolean | undefined>;
+            isMobile: NonNullable<boolean | undefined>;
+            useV2Keypad: NonNullable<boolean | undefined>;
+            onFocusChange: (newFocusPath: import("../types").FocusPath, oldFocusPath: import("../types").FocusPath, keypadElement?: HTMLElement | undefined, focusedElement?: HTMLElement | undefined) => unknown;
+            onInputError: (widgetId: any, value: string, message?: string | null | undefined) => unknown;
+            readOnly: NonNullable<boolean | undefined>;
+            setDrawingAreaAvailable: (arg1: boolean) => unknown;
+            showAlignmentOptions: NonNullable<boolean | undefined>;
+            useDraftEditor: NonNullable<boolean | undefined>;
+        }>;
+        buttonSets: readonly string[];
+        functions: readonly string[];
+        linterContext: import("../types").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"> & {
+        value?: string | undefined;
+        onFocus?: ((blurPath: import("../types").FocusPath) => void) | undefined;
+        onBlur?: ((blurPath: import("../types").FocusPath) => void) | undefined;
+        linterContext?: import("../types").LinterContextProps | undefined;
+        apiOptions?: Readonly<Readonly<{
+            isArticle?: boolean | undefined;
+            onInputError?: ((widgetId: any, value: string, message?: string | null | undefined) => unknown) | undefined;
+            onFocusChange?: ((newFocusPath: import("../types").FocusPath, oldFocusPath: import("../types").FocusPath, keypadElement?: HTMLElement | undefined, focusedElement?: HTMLElement | undefined) => unknown) | undefined;
+            GroupMetadataEditor?: React.ComponentType<any> | undefined;
+            showAlignmentOptions?: boolean | undefined;
+            readOnly?: boolean | undefined;
+            answerableCallback?: ((arg1: boolean) => unknown) | undefined;
+            getAnotherHint?: (() => unknown) | undefined;
+            interactionCallback?: (() => unknown) | undefined;
+            groupAnnotator?: ((groupNumber: number, widgetId: string) => React.ReactNode) | undefined;
+            imagePlaceholder?: React.ReactNode;
+            widgetPlaceholder?: React.ReactNode;
+            baseElements?: {
+                Link: React.ComponentType<any>;
+            } | undefined;
+            imagePreloader?: ((dimensions: import("../types").Dimensions) => React.ReactNode) | undefined;
+            trackInteraction?: ((args: {
+                type: string;
+                id: string;
+                correct?: boolean | undefined;
+            } & Partial<import("../types").TrackingGradedGroupExtraArguments> & Partial<import("../types").TrackingSequenceExtraArguments>) => void) | undefined;
+            customKeypad?: boolean | undefined;
+            useV2Keypad?: boolean | undefined;
+            nativeKeypadProxy?: ((blur: () => void) => import("@khanacademy/math-input").KeypadAPI) | undefined;
+            isMobile?: boolean | undefined;
+            setDrawingAreaAvailable?: ((arg1: boolean) => unknown) | undefined;
+            useDraftEditor?: boolean | undefined;
+            hintProgressColor?: string | undefined;
+            canScrollPage?: boolean | undefined;
+            inModal?: boolean | undefined;
+            crossOutEnabled?: boolean | undefined;
+            editorChangeDelay?: number | undefined;
+        }> & {
+            GroupMetadataEditor: NonNullable<React.ComponentType<any> | undefined>;
+            baseElements: {
+                Link: React.ComponentType<any>;
+            };
+            canScrollPage: NonNullable<boolean | undefined>;
+            crossOutEnabled: NonNullable<boolean | undefined>;
+            editorChangeDelay: number;
+            groupAnnotator: (groupNumber: number, widgetId: string) => React.ReactNode;
+            inModal: NonNullable<boolean | undefined>;
+            isArticle: NonNullable<boolean | undefined>;
+            isMobile: NonNullable<boolean | undefined>;
+            useV2Keypad: NonNullable<boolean | undefined>;
+            onFocusChange: (newFocusPath: import("../types").FocusPath, oldFocusPath: import("../types").FocusPath, keypadElement?: HTMLElement | undefined, focusedElement?: HTMLElement | undefined) => unknown;
+            onInputError: (widgetId: any, value: string, message?: string | null | undefined) => unknown;
+            readOnly: NonNullable<boolean | undefined>;
+            setDrawingAreaAvailable: (arg1: boolean) => unknown;
+            showAlignmentOptions: NonNullable<boolean | undefined>;
+            useDraftEditor: NonNullable<boolean | undefined>;
+        }> | undefined;
+        times?: boolean | undefined;
+        buttonSets?: readonly string[] | undefined;
+        functions?: readonly string[] | undefined;
+    } & {}, "analytics"> & React.RefAttributes<Expression>>;
 }>;
 export default _default;

package/dist/widgets/graded-group.d.ts

@@ -1,7 +1,7 @@
 import * as React from "react";
-import { ANSWER_BAR_STATES } from "./graded-group-answer-bar";
 import type { PerseusGradedGroupWidgetOptions } from "../perseus-types";
-import type { WidgetProps } from "../types";
+import type { TrackingGradedGroupExtraArguments, WidgetProps } from "../types";
+import type { ANSWER_BAR_STATES } from "./graded-group-answer-bar";
 declare const GRADING_STATUSES: {
     readonly ungraded: "ungraded";
     readonly correct: "correct";
@@ -10,7 +10,7 @@ declare const GRADING_STATUSES: {
 };
 type Rubric = PerseusGradedGroupWidgetOptions;
 type RenderProps = PerseusGradedGroupWidgetOptions;
-type Props = WidgetProps<RenderProps, Rubric> & {
+type Props = WidgetProps<RenderProps, Rubric, TrackingGradedGroupExtraArguments> & {
     inGradedGroupSet?: boolean;
     onNextQuestion?: () => unknown;
 };

package/dist/widgets/interactive-graph.d.ts

@@ -1,8 +1,8 @@
 import * as React from "react";
-import { QuadraticCoefficient, SineCoefficient, Range } from "../util/geometry";
 import type { Coord } from "../interactive2/types";
 import type { PerseusGraphType, PerseusGraphTypeAngle, PerseusGraphTypePoint, PerseusGraphTypePolygon, PerseusGraphTypeSegment, PerseusInteractiveGraphWidgetOptions } from "../perseus-types";
 import type { PerseusScore, WidgetProps } from "../types";
+import type { QuadraticCoefficient, SineCoefficient, Range } from "../util/geometry";
 type RenderProps = PerseusInteractiveGraphWidgetOptions;
 type Rubric = PerseusInteractiveGraphWidgetOptions;
 type Props = WidgetProps<RenderProps, Rubric>;

package/dist/widgets/sequence.d.ts

@@ -1,8 +1,8 @@
 import * as React from "react";
-import { PerseusSequenceWidgetOptions } from "../perseus-types";
-import type { WidgetProps } from "../types";
+import type { PerseusSequenceWidgetOptions } from "../perseus-types";
+import type { TrackingSequenceExtraArguments, WidgetProps } from "../types";
 type Rubric = PerseusSequenceWidgetOptions;
-type ExternalProps = WidgetProps<PerseusSequenceWidgetOptions, Rubric>;
+type ExternalProps = WidgetProps<PerseusSequenceWidgetOptions, Rubric, TrackingSequenceExtraArguments>;
 type Props = ExternalProps;
 type DefaultProps = {
     json: Props["json"];

package/dist/widgets/table.d.ts

@@ -6,7 +6,14 @@ declare class Table extends React.Component<any> {
         editableHeaders: PropTypes.Requireable<boolean>;
         Editor: PropTypes.Requireable<(...args: any[]) => any>;
         headers: PropTypes.Requireable<(string | null | undefined)[]>;
-        keypadElement: any;
+        keypadElement: PropTypes.Requireable<PropTypes.InferProps<{
+            activate: PropTypes.Validator<(...args: any[]) => any>;
+            dismiss: PropTypes.Validator<(...args: any[]) => any>;
+            configure: PropTypes.Validator<(...args: any[]) => any>;
+            setCursor: PropTypes.Validator<(...args: any[]) => any>;
+            setKeyHandler: PropTypes.Validator<(...args: any[]) => any>;
+            getDOMNode: PropTypes.Validator<(...args: any[]) => any>;
+        }>>;
         trackInteraction: PropTypes.Validator<(...args: any[]) => any>;
         linterContext: PropTypes.Requireable<PropTypes.InferProps<{
             contentType: PropTypes.Requireable<string>;

package/dist/widgets.d.ts

@@ -1,5 +1,5 @@
-import * as React from "react";
 import type { Alignment, Tracking, Version, WidgetExports, WidgetInfo, WidgetTransform } from "./types";
+import type * as React from "react";
 type Editor = any;
 export declare const registerWidget: (name: string, widget: WidgetExports) => void;
 export declare const registerWidgets: (widgets: ReadonlyArray<WidgetExports>) => void;

package/package.json

@@ -3,7 +3,7 @@
     "description": "Core Perseus API (includes renderers and widgets)",
     "author": "Khan Academy",
     "license": "MIT",
-    "version": "7.2.1",
+    "version": "9.0.0",
     "publishConfig": {
         "access": "public"
     },
@@ -22,30 +22,30 @@
     },
     "dependencies": {
         "@khanacademy/kas": "^0.3.1",
-        "@khanacademy/kmath": "^0.1.1",
-        "@khanacademy/math-input": "^8.1.2",
-        "@khanacademy/perseus-core": "0.1.1",
-        "@khanacademy/perseus-linter": "^0.3.1",
-        "@khanacademy/pure-markdown": "^0.2.3",
-        "@khanacademy/simple-markdown": "^0.9.3"
+        "@khanacademy/kmath": "^0.1.2",
+        "@khanacademy/math-input": "^10.0.0",
+        "@khanacademy/perseus-core": "0.2.0",
+        "@khanacademy/perseus-linter": "^0.3.2",
+        "@khanacademy/pure-markdown": "^0.2.4",
+        "@khanacademy/simple-markdown": "^0.10.0"
     },
     "devDependencies": {
-        "@khanacademy/wonder-blocks-button": "^4.0.8",
-        "@khanacademy/wonder-blocks-clickable": "^3.0.8",
+        "@khanacademy/wonder-blocks-button": "^4.1.3",
+        "@khanacademy/wonder-blocks-clickable": "^4.0.0",
         "@khanacademy/wonder-blocks-color": "^2.0.1",
-        "@khanacademy/wonder-blocks-core": "^5.0.4",
-        "@khanacademy/wonder-blocks-data": "^11.0.8",
-        "@khanacademy/wonder-blocks-dropdown": "^3.0.8",
-        "@khanacademy/wonder-blocks-form": "^4.0.8",
+        "@khanacademy/wonder-blocks-core": "^6.0.0",
+        "@khanacademy/wonder-blocks-data": "^12.0.0",
+        "@khanacademy/wonder-blocks-dropdown": "^3.0.21",
+        "@khanacademy/wonder-blocks-form": "^4.3.3",
         "@khanacademy/wonder-blocks-i18n": "^2.0.2",
-        "@khanacademy/wonder-blocks-layout": "^2.0.8",
-        "@khanacademy/wonder-blocks-link": "^4.0.8",
-        "@khanacademy/wonder-blocks-modal": "^4.0.8",
-        "@khanacademy/wonder-blocks-popover": "^2.0.8",
-        "@khanacademy/wonder-blocks-progress-spinner": "^2.0.8",
+        "@khanacademy/wonder-blocks-layout": "^2.0.17",
+        "@khanacademy/wonder-blocks-link": "^5.0.0",
+        "@khanacademy/wonder-blocks-modal": "^4.0.19",
+        "@khanacademy/wonder-blocks-popover": "^3.0.0",
+        "@khanacademy/wonder-blocks-progress-spinner": "^2.0.17",
         "@khanacademy/wonder-blocks-spacing": "^3.0.5",
-        "@khanacademy/wonder-blocks-tooltip": "^2.0.8",
-        "@khanacademy/wonder-blocks-typography": "^2.0.5",
+        "@khanacademy/wonder-blocks-tooltip": "^2.1.2",
+        "@khanacademy/wonder-blocks-typography": "^2.1.3",
         "@khanacademy/wonder-stuff-core": "^1.2.2",
         "aphrodite": "^1.2.5",
         "classnames": "^1.1.4",
@@ -56,29 +56,29 @@
         "jquery": "^2.1.1",
         "katex": "^0.11.1",
         "lodash.debounce": "^4.0.8",
-        "perseus-build-settings": "^0.1.0",
+        "perseus-build-settings": "^0.2.0",
         "prop-types": "^15.6.1",
         "react": "16.14.0",
         "react-dom": "16.14.0",
         "underscore": "^1.4.4"
     },
     "peerDependencies": {
-        "@khanacademy/wonder-blocks-button": "^4.0.8",
-        "@khanacademy/wonder-blocks-clickable": "^3.0.8",
+        "@khanacademy/wonder-blocks-button": "^4.1.3",
+        "@khanacademy/wonder-blocks-clickable": "^4.0.0",
         "@khanacademy/wonder-blocks-color": "^2.0.1",
-        "@khanacademy/wonder-blocks-core": "^5.0.4",
-        "@khanacademy/wonder-blocks-data": "^11.0.8",
-        "@khanacademy/wonder-blocks-dropdown": "^3.0.8",
-        "@khanacademy/wonder-blocks-form": "^4.0.8",
+        "@khanacademy/wonder-blocks-core": "^6.0.0",
+        "@khanacademy/wonder-blocks-data": "^12.0.0",
+        "@khanacademy/wonder-blocks-dropdown": "^3.0.21",
+        "@khanacademy/wonder-blocks-form": "^4.3.3",
         "@khanacademy/wonder-blocks-i18n": "^2.0.2",
-        "@khanacademy/wonder-blocks-layout": "^2.0.8",
-        "@khanacademy/wonder-blocks-link": "^4.0.8",
-        "@khanacademy/wonder-blocks-modal": "^4.0.8",
-        "@khanacademy/wonder-blocks-popover": "^2.0.8",
-        "@khanacademy/wonder-blocks-progress-spinner": "^2.0.8",
+        "@khanacademy/wonder-blocks-layout": "^2.0.17",
+        "@khanacademy/wonder-blocks-link": "^5.0.0",
+        "@khanacademy/wonder-blocks-modal": "^4.0.19",
+        "@khanacademy/wonder-blocks-popover": "^3.0.0",
+        "@khanacademy/wonder-blocks-progress-spinner": "^2.0.17",
         "@khanacademy/wonder-blocks-spacing": "^3.0.5",
-        "@khanacademy/wonder-blocks-tooltip": "^2.0.8",
-        "@khanacademy/wonder-blocks-typography": "^2.0.5",
+        "@khanacademy/wonder-blocks-tooltip": "^2.1.2",
+        "@khanacademy/wonder-blocks-typography": "^2.1.3",
         "@khanacademy/wonder-stuff-core": "^1.2.2",
         "aphrodite": "^1.2.5",
         "classnames": "^1.1.4",