Rough out UserInput type

packages/perseus/src/__tests__/renderer-api.test.tsx

@@ -19,6 +19,7 @@ import inputNumber1Item from "./test-items/input-number-1-item";
 import inputNumber2Item from "./test-items/input-number-2-item";
 import tableItem from "./test-items/table-item";
 
+import type {PerseusInputNumberUserInput} from "../validation.types";
 import type {UserEvent} from "@testing-library/user-event";
 
 const itemWidget = inputNumber1Item;
@@ -75,8 +76,9 @@ describe("Perseus API", function () {
             const {renderer} = renderQuestion(inputNumber1Item.question);
             act(() =>
                 renderer.setInputValue(["input-number 1"], "3", function () {
-                    const guess = renderer.getUserInput()[0];
-                    expect(guess.currentValue).toBe("3");
+                    const guess =
+                        renderer.getUserInput()[0] as PerseusInputNumberUserInput;
+                    expect(guess?.currentValue).toBe("3");
                     done();
                 }),
             );

packages/perseus/src/index.ts

@@ -197,7 +197,6 @@ export type {
     PerseusPythonProgramWidgetOptions,
     PerseusRadioWidgetOptions,
     PerseusExampleWidgetOptions,
-    PerseusExampleGraphieWidgetOptions,
     PerseusSimpleMarkdownTesterWidgetOptions,
     PerseusRenderer,
     PerseusWidget,

packages/perseus/src/mixins/widget-prop-denylist.ts

@@ -35,14 +35,4 @@ const denylist = [
     "keypadElement",
 ];
 
-export const removeDenylistProps = (props: any): any => {
-    const newProps = {...props} as const;
-    for (const prop of denylist) {
-        if (prop in newProps) {
-            delete newProps[prop];
-        }
-    }
-    return newProps;
-};
-
 export default denylist;

packages/perseus/src/perseus-types.ts

@@ -380,24 +380,6 @@ export type PerseusExampleWidgetOptions = {
     value: string;
 };
 
-export type PerseusExampleGraphieGraph = {
-    box: Size;
-    range: [Coord, Coord];
-    labels: ReadonlyArray<string>;
-    markings: "graph" | "grid" | "none";
-    gridStep: [number, number];
-    step: [number, number];
-    showProtractor?: boolean;
-    showRuler?: boolean;
-    valid?: boolean;
-    backgroundImage?: PerseusImageBackground | null;
-};
-
-export type PerseusExampleGraphieWidgetOptions = {
-    graph: PerseusExampleGraphieGraph;
-    coord: [Coord, Coord] | null;
-};
-
 export type PerseusExplanationWidgetOptions = {
     // Translatable Text; The clickable text to expand an explanation.  e.g. "What is an apple?"
     showPrompt: string;
@@ -1619,7 +1601,6 @@ export type PerseusWidgetOptions =
     | PerseusCSProgramWidgetOptions
     | PerseusDefinitionWidgetOptions
     | PerseusDropdownWidgetOptions
-    | PerseusExampleGraphieWidgetOptions
     | PerseusExampleWidgetOptions
     | PerseusExplanationWidgetOptions
     | PerseusExpressionWidgetOptions

packages/perseus/src/renderer.tsx

@@ -47,6 +47,7 @@ import type {
     PerseusScore,
     WidgetProps,
 } from "./types";
+import type {UserInput} from "./validation.types";
 import type {KeypadAPI} from "@khanacademy/math-input";
 import type {LinterContextProps} from "@khanacademy/perseus-linter";
 
@@ -103,11 +104,6 @@ type SetWidgetPropsFn = (
     silent?: boolean,
 ) => void;
 
-// The return type for getUserInput. Widgets have full control of what is
-// returned so it's not easily typed (some widgets return a scalar (string),
-// some return a custom-built object
-type WidgetUserInput = any;
-
 type SerializedState = {
     [id: string]: any;
 };
@@ -149,7 +145,7 @@ export type Widget = {
         // TODO(jeremy): I think this is actually a callback
         focus?: () => unknown,
     ) => void;
-    getUserInput?: () => WidgetUserInput | null | undefined;
+    getUserInput?: () => UserInput | null | undefined;
     simpleValidate?: (
         options?: any,
         onOutputError?: (
@@ -1760,17 +1756,16 @@ class Renderer extends React.Component<Props, State> {
     /**
      * Returns an array of the widget `.getUserInput()` results
      */
-    getUserInput: () => ReadonlyArray<WidgetUserInput | null | undefined> =
-        () => {
-            return this.widgetIds.map((id: string) => {
-                const widget = this.getWidgetInstance(id);
-                if (widget && widget.getUserInput) {
-                    // TODO(Jeremy): Add the widget ID in here so we can more
-                    // easily correlate it to the widget state.
-                    return widget.getUserInput();
-                }
-            });
-        };
+    getUserInput: () => ReadonlyArray<UserInput | null | undefined> = () => {
+        return this.widgetIds.map((id: string) => {
+            const widget = this.getWidgetInstance(id);
+            if (widget && widget.getUserInput) {
+                // TODO(Jeremy): Add the widget ID in here so we can more
+                // easily correlate it to the widget state.
+                return widget.getUserInput();
+            }
+        });
+    };
 
     /**
      * Returns an array of all widget IDs in the order they occur in
@@ -1790,7 +1785,7 @@ class Renderer extends React.Component<Props, State> {
      * so we should aim to remove one of these functions.
      */
     getUserInputForWidgets: () => {
-        [widgetId: string]: WidgetUserInput | null | undefined;
+        [widgetId: string]: UserInput | null | undefined;
     } = () => {
         return mapObjectFromArray(this.widgetIds, (id) => {
             const widget = this.getWidgetInstance(id);

packages/perseus/src/types.ts

@@ -552,6 +552,9 @@ export type FilterCriterion =
       ) => boolean);
 
 // NOTE: Rubric should always be the corresponding widget options type for the component.
+// TODO: in fact, is it really the rubric? WidgetOptions is what we use to configure the widget
+// (which is what this seems to be for)
+// and Rubric is what we use to score the widgets (which not all widgets need validation)
 export type WidgetProps<
     RenderProps,
     Rubric,