@khanacademy/perseus 45.0.0 → 46.0.0

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

@@ -4,17 +4,110 @@ import scoreInteractiveGraph from "./interactive-graphs/score-interactive-graph"
 import type { StatefulMafsGraphType } from "./interactive-graphs/stateful-mafs-graph";
 import type { QuadraticGraphState } from "./interactive-graphs/types";
 import type { Coord } from "../interactive2/types";
-import type { PerseusGraphType, PerseusGraphTypeAngle, PerseusGraphTypePoint, PerseusGraphTypePolygon, PerseusGraphTypeSegment, PerseusInteractiveGraphWidgetOptions } from "../perseus-types";
+import type { PerseusGraphType, PerseusGraphTypeAngle, PerseusGraphTypePoint, PerseusGraphTypePolygon, PerseusGraphTypeSegment, GraphRange, LockedFigure, PerseusImageBackground } from "../perseus-types";
 import type { ChangeHandler, WidgetProps } from "../types";
 import type { QuadraticCoefficient, Range, SineCoefficient } from "../util/geometry";
 import type { PerseusInteractiveGraphRubric, PerseusInteractiveGraphUserInput } from "../validation.types";
 import type { InteractiveGraphPromptJSON } from "../widget-ai-utils/interactive-graph/interactive-graph-ai-utils";
 import type { UnsupportedWidgetPromptJSON } from "../widget-ai-utils/unsupported-widget";
-type RenderProps = PerseusInteractiveGraphWidgetOptions;
+type RenderProps = {
+    /**
+     * Where the little black axis lines & labels (ticks) should render.
+     * Also known as the tick step. default [1, 1]
+     *
+     * NOTE(kevinb): perseus_data.go defines this as Array<number>
+     */
+    step: [number, number];
+    /**
+     * Where the grid lines on the graph will render. default [1, 1]
+     *
+     * NOTE(kevinb): perseus_data.go defines this as Array<number>
+     */
+    gridStep?: [x: number, y: number];
+    /**
+     * Where the graph points will lock to when they are dragged. default [0.5, 0.5]
+     *
+     * NOTE(kevinb): perseus_data.go defines this as Array<number>
+     */
+    snapStep?: [x: number, y: number];
+    /**
+     * An optional image to use in the background
+     */
+    backgroundImage?: PerseusImageBackground;
+    /**
+     * The type of markings to display on the graph.
+     * - graph: shows the axes and the grid lines
+     * - grid: shows only the grid lines
+     * - none: shows no markings
+     */
+    markings: "graph" | "grid" | "none";
+    /**
+     * How to label the X and Y axis.  default: ["x", "y"]
+     */
+    labels: ReadonlyArray<string>;
+    /**
+     * Whether to show the Protractor tool overlaid on top of the graph
+     */
+    showProtractor: boolean;
+    /**
+     * Whether to show the Ruler tool overlaid on top of the graph.
+     * @deprecated - no longer used by the InteractiveGraph widget. The
+     * property is kept on this type to prevent its accidental reuse in future
+     * features, since it may appear in production data.
+     */
+    showRuler?: boolean;
+    /**
+     * Whether to show tooltips on the graph
+     */
+    showTooltips?: boolean;
+    /**
+     * The unit to show on the ruler.  e.g. "mm", "cm",  "m", "km", "in", "ft",
+     * "yd", "mi".
+     * @deprecated - no longer used by the InteractiveGraph widget. The
+     * property is kept on this type to prevent its accidental reuse in future
+     * features, since it may appear in production data.
+     */
+    rulerLabel?: string;
+    /**
+     * How many ticks to show on the ruler.  e.g. 1, 2, 4, 8, 10, 16. Must be
+     * an integer.
+     * @deprecated - no longer used by the InteractiveGraph widget. The
+     * property is kept on this type to prevent its accidental reuse in future
+     * features, since it may appear in production data.
+     */
+    rulerTicks?: number;
+    /**
+     * The X and Y coordinate ranges for the view of the graph.  default: [[-10, 10], [-10, 10]]
+     *
+     * NOTE(kevinb): perseus_data.go defines this as Array<Array<number>>
+     */
+    range: GraphRange;
+    /**
+     * The type of graph
+     */
+    graph: PerseusGraphType;
+    /**
+     * The correct kind of graph, if being used to select function type
+     */
+    correct: PerseusGraphType;
+    /**
+     * Shapes (points, chords, etc) displayed on the graph that cannot be moved
+     * by the user.
+     */
+    lockedFigures?: ReadonlyArray<LockedFigure>;
+    /**
+     * Aria label that applies to the entire graph.
+     */
+    fullGraphAriaLabel?: string;
+    /**
+     * Aria description that applies to the entire graph.
+     */
+    fullGraphAriaDescription?: string;
+};
 type Props = WidgetProps<RenderProps, PerseusInteractiveGraphRubric>;
 type State = any;
 type DefaultProps = {
-    labels: Props["labels"];
+    labels: ReadonlyArray<string>;
     range: Props["range"];
     step: Props["step"];
     backgroundImage: Props["backgroundImage"];

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

@@ -11,12 +11,12 @@ export type MafsGraphProps = {
     backgroundImage?: InteractiveGraphProps["backgroundImage"];
     lockedFigures?: InteractiveGraphProps["lockedFigures"];
     step: InteractiveGraphProps["step"];
-    gridStep: InteractiveGraphProps["gridStep"];
+    gridStep: [x: number, y: number];
     containerSizeClass: InteractiveGraphProps["containerSizeClass"];
     markings: InteractiveGraphProps["markings"];
     showTooltips: Required<InteractiveGraphProps["showTooltips"]>;
     showProtractor: boolean;
-    labels: InteractiveGraphProps["labels"];
+    labels: ReadonlyArray<string>;
     fullGraphAriaLabel?: InteractiveGraphProps["fullGraphAriaLabel"];
     fullGraphAriaDescription?: InteractiveGraphProps["fullGraphAriaDescription"];
     state: InteractiveGraphState;

package/dist/widgets/interactive-graphs/stateful-mafs-graph.d.ts

@@ -11,15 +11,15 @@ export type StatefulMafsGraphProps = {
     correct: PerseusGraphType;
     lockedFigures?: InteractiveGraphProps["lockedFigures"];
     range: InteractiveGraphProps["range"];
-    snapStep: InteractiveGraphProps["snapStep"];
+    snapStep: [x: number, y: number];
     step: InteractiveGraphProps["step"];
-    gridStep: InteractiveGraphProps["gridStep"];
+    gridStep: [x: number, y: number];
     containerSizeClass: InteractiveGraphProps["containerSizeClass"];
     markings: InteractiveGraphProps["markings"];
     onChange: InteractiveGraphProps["onChange"];
     showTooltips: Required<InteractiveGraphProps["showTooltips"]>;
     showProtractor: boolean;
-    labels: InteractiveGraphProps["labels"];
+    labels: ReadonlyArray<string>;
     fullGraphAriaLabel?: InteractiveGraphProps["fullGraphAriaLabel"];
     fullGraphAriaDescription?: InteractiveGraphProps["fullGraphAriaDescription"];
     readOnly: boolean;

package/dist/widgets/number-line/score-number-line.d.ts

@@ -1,4 +1,4 @@
 import type { PerseusScore } from "../../types";
-import type { PerseusNumberLineRubric, PerseusNumberLineUserInput } from "../../validation.types";
-declare function scoreNumberLine(state: PerseusNumberLineUserInput, rubric: PerseusNumberLineRubric): PerseusScore;
+import type { PerseusNumberLineScoringData, PerseusNumberLineUserInput } from "../../validation.types";
+declare function scoreNumberLine(userInput: PerseusNumberLineUserInput, scoringData: PerseusNumberLineScoringData): PerseusScore;
 export default scoreNumberLine;

package/dist/widgets/number-line/validate-number-line.d.ts

@@ -0,0 +1,12 @@
+import type { PerseusScore } from "../../types";
+import type { PerseusNumberLineUserInput } from "../../validation.types";
+/**
+ * Checks user input is within the allowed range and not the same as the initial
+ * state.
+ * @param userInput
+ * @see 'scoreNumberLine' for the scoring logic.
+ */
+declare function validateNumberLine(userInput: PerseusNumberLineUserInput): Extract<PerseusScore, {
+    type: "invalid";
+}> | null;
+export default validateNumberLine;

package/dist/widgets/numeric-input/numeric-input.d.ts

@@ -15,7 +15,7 @@ type Props = ExternalProps & {
     apiOptions: NonNullable<ExternalProps["apiOptions"]>;
     coefficient: NonNullable<ExternalProps["coefficient"]>;
     answerForms: NonNullable<ExternalProps["answerForms"]>;
-    labelText: NonNullable<ExternalProps["labelText"]>;
+    labelText: string;
     linterContext: NonNullable<ExternalProps["linterContext"]>;
     currentValue: string;
 };
@@ -31,6 +31,7 @@ type DefaultProps = {
 };
 type State = {
     previousValues: ReadonlyArray<string>;
+    isFocused: boolean;
 };
 export declare class NumericInput extends React.Component<Props, State> implements Widget {
     static contextType: React.Context<{
@@ -42,7 +43,11 @@ export declare class NumericInput extends React.Component<Props, State> implemen
     static defaultProps: DefaultProps;
     static getUserInputFromProps(props: Props): PerseusNumericInputUserInput;
     state: State;
-    examples: () => ReadonlyArray<string>;
+    /**
+     * Generates a string that demonstrates how to input the various supported
+     * answer forms.
+     */
+    examples(): ReadonlyArray<string>;
     shouldShowExamples: () => boolean;
     focus: () => boolean;
     focusInputPath: () => void;

package/package.json

@@ -3,7 +3,7 @@
     "description": "Core Perseus API (includes renderers and widgets)",
     "author": "Khan Academy",
     "license": "MIT",
-    "version": "45.0.0",
+    "version": "46.0.0",
     "publishConfig": {
         "access": "public"
     },