@khanacademy/perseus 26.1.0 → 27.0.1

package/dist/perseus-types.d.ts

@@ -1,10 +1,6 @@
 import type { Coord } from "./interactive2/types";
 import type { Interval, vec } from "mafs";
 export type Range = Interval;
-export type Domain = {
-    min?: number;
-    max?: number;
-};
 export type Size = [number, number];
 export type CollinearTuple = [vec.Vector2, vec.Vector2];
 export type ShowSolutions = "all" | "selected" | "none";
@@ -76,8 +72,6 @@ export type PerseusWidgetsMap = {
     [key in `sorter ${number}`]: SorterWidget;
 } & {
     [key in `table ${number}`]: TableWidget;
-} & {
-    [key in `unit-input ${number}`]: UnitInputWidget;
 } & {
     [key in `video ${number}`]: VideoWidget;
 };
@@ -152,10 +146,9 @@ export type InputNumberWidget = Widget<'input-number', PerseusInputNumberWidgetO
 export type MoleculeRendererWidget = Widget<'molecule-renderer', PerseusMoleculeRendererWidgetOptions>;
 export type RefTargetWidget = Widget<'passage-ref-target', PerseusPassageRefTargetWidgetOptions>;
 export type SimpleMarkdownTesterWidget = Widget<'simple-markdown-tester', PerseusSimpleMarkdownTesterWidgetOptions>;
-export type UnitInputWidget = Widget<'unit-input', PerseusUnitInputWidgetOptions>;
 export type VideoWidget = Widget<'video', PerseusVideoWidgetOptions>;
 export type AutoCorrectWidget = Widget<'deprecated-standin', PerseusWidgetOptions>;
-export type PerseusWidget = CategorizerWidget | CSProgramWidget | DefinitionWidget | DropdownWidget | ExampleGraphieWidget | ExampleWidget | ExplanationWidget | ExpressionWidget | GradedGroupSetWidget | GradedGroupWidget | GrapherWidget | GroupWidget | IFrameWidget | ImageWidget | InputNumberWidget | InteractionWidget | InteractiveGraphWidget | LabelImageWidget | MatcherWidget | MatrixWidget | MeasurerWidget | MoleculeRendererWidget | NumberLineWidget | NumericInputWidget | OrdererWidget | PassageRefWidget | PassageWidget | PlotterWidget | PythonProgramWidget | RadioWidget | RefTargetWidget | SimpleMarkdownTesterWidget | SorterWidget | TableWidget | UnitInputWidget | VideoWidget | AutoCorrectWidget;
+export type PerseusWidget = CategorizerWidget | CSProgramWidget | DefinitionWidget | DropdownWidget | ExampleGraphieWidget | ExampleWidget | ExplanationWidget | ExpressionWidget | GradedGroupSetWidget | GradedGroupWidget | GrapherWidget | GroupWidget | IFrameWidget | ImageWidget | InputNumberWidget | InteractionWidget | InteractiveGraphWidget | LabelImageWidget | MatcherWidget | MatrixWidget | MeasurerWidget | MoleculeRendererWidget | NumberLineWidget | NumericInputWidget | OrdererWidget | PassageRefWidget | PassageWidget | PlotterWidget | PythonProgramWidget | RadioWidget | RefTargetWidget | SimpleMarkdownTesterWidget | SorterWidget | TableWidget | VideoWidget | AutoCorrectWidget;
 export type PerseusImageBackground = {
     url: string | null | undefined;
     width?: number;
@@ -341,10 +334,30 @@ export type PerseusInteractiveGraphWidgetOptions = {
     markings: "graph" | "grid" | "none";
     labels: ReadonlyArray<string>;
     showProtractor: boolean;
-    showRuler: boolean;
+    /**
+     * Whether to show the Ruler tool overlayed 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;
     showTooltips?: boolean;
-    rulerLabel: string;
-    rulerTicks: number;
+    /**
+     * 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;
     range: GraphRange;
     graph: PerseusGraphType;
     correct: PerseusGraphType;
@@ -403,7 +416,7 @@ export type LockedFunctionType = {
         [k: string]: any;
     };
     directionalAxis: "x" | "y";
-    domain?: Domain;
+    domain?: Interval;
 };
 export type PerseusGraphType = PerseusGraphTypeAngle | PerseusGraphTypeCircle | PerseusGraphTypeLinear | PerseusGraphTypeLinearSystem | PerseusGraphTypePoint | PerseusGraphTypePolygon | PerseusGraphTypeQuadratic | PerseusGraphTypeRay | PerseusGraphTypeSegment | PerseusGraphTypeSinusoid;
 export type PerseusGraphTypeCommon = {

package/dist/widgets/explanation.d.ts

@@ -25,6 +25,9 @@ declare class Explanation extends React.Component<Props, State> {
     static defaultProps: DefaultProps;
     static validate(userInput: UserInput, rubric: Rubric): PerseusScore;
     state: State;
+    _mounted: boolean;
+    componentDidMount(): void;
+    componentWillUnmount(): void;
     change: (arg1: any, arg2: any, arg3: any) => any;
     _onClick: () => void;
     render(): React.ReactNode;

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

@@ -21,9 +21,6 @@ type DefaultProps = {
     markings: Props["markings"];
     showTooltips: Props["showTooltips"];
     showProtractor: Props["showProtractor"];
-    showRuler: Props["showRuler"];
-    rulerLabel: Props["rulerLabel"];
-    rulerTicks: Props["rulerTicks"];
     graph: Props["graph"];
 };
 declare class LegacyInteractiveGraph extends React.Component<Props, State> {

package/dist/widgets/interactive-graphs/interactive-graph-question-builder.d.ts

@@ -16,6 +16,7 @@ declare class InteractiveGraphQuestionBuilder {
     private showProtractor;
     private interactiveFigureConfig;
     private lockedFigures;
+    private snapTo;
     build(): PerseusRenderer;
     withContent(content: string): InteractiveGraphQuestionBuilder;
     withBackgroundImage(url: string, height: number, width: number, options?: {
@@ -63,7 +64,7 @@ declare class InteractiveGraphQuestionBuilder {
         coords?: [Coord, Coord];
         startCoords?: [Coord, Coord];
     }): InteractiveGraphQuestionBuilder;
-    withPolygon(snapTo: "grid" | "angles" | "sides", options?: {
+    withPolygon(snapTo?: "grid" | "angles" | "sides", options?: {
         match?: "similar" | "congruent" | "approx";
         numSides?: number | "unlimited";
         showAngles?: boolean;

package/dist/widgets/interactive-graphs/reducer/initialize-graph-state.d.ts

@@ -1,4 +1,4 @@
-import type { PerseusGraphType, PerseusGraphTypeLinear, PerseusGraphTypeRay } from "../../../perseus-types";
+import type { PerseusGraphType, PerseusGraphTypeLinear, PerseusGraphTypeLinearSystem, PerseusGraphTypeRay, PerseusGraphTypeSegment } from "../../../perseus-types";
 import type { InteractiveGraphState, PairOfPoints } from "../types";
 import type { Interval } from "mafs";
 export type InitializeGraphStateParams = {
@@ -8,4 +8,6 @@ export type InitializeGraphStateParams = {
     graph: PerseusGraphType;
 };
 export declare function initializeGraphState(params: InitializeGraphStateParams): InteractiveGraphState;
+export declare function getSegmentCoords(graph: PerseusGraphTypeSegment, range: [x: Interval, y: Interval], step: [x: number, y: number]): PairOfPoints[];
 export declare function getLineCoords(graph: PerseusGraphTypeRay | PerseusGraphTypeLinear, range: [x: Interval, y: Interval], step: [x: number, y: number]): PairOfPoints;
+export declare function getLinearSystemCoords(graph: PerseusGraphTypeLinearSystem, range: [x: Interval, y: Interval], step: [x: number, y: number]): PairOfPoints[];

package/dist/widgets/interactive-graphs/reducer/use-graph-config.d.ts

@@ -11,6 +11,7 @@ export type GraphConfig = {
     width: number;
     height: number;
     labels: readonly string[];
+    hintMode?: boolean;
 };
 export declare const GraphConfigContext: React.Context<GraphConfig>;
 export default function useGraphConfig(): GraphConfig;

package/dist/widgets/label-image/marker.d.ts

@@ -28,9 +28,12 @@ export default class Marker extends React.Component<Props> {
     }>;
     context: React.ContextType<typeof PerseusI18nContext>;
     _icon: HTMLElement | null | undefined;
+    _mounted: boolean;
     static defaultProps: {
         selected: ReadonlyArray<any>;
     };
+    componentDidMount(): void;
+    componentWillUnmount(): void;
     renderIcon(): React.JSX.Element;
     render(): React.ReactNode;
 }

package/dist/widgets/label-image.d.ts

@@ -59,6 +59,7 @@ export declare class LabelImage extends React.Component<LabelImageProps, LabelIm
     }>;
     context: React.ContextType<typeof PerseusI18nContext>;
     _markers: Array<Marker | null | undefined>;
+    _mounted: boolean;
     static gradeMarker(marker: InteractiveMarkerType): InteractiveMarkerScore;
     static validate(state: MarkersState, rubric?: LabelImageProps): PerseusScore;
     /**
@@ -79,6 +80,8 @@ export declare class LabelImage extends React.Component<LabelImageProps, LabelIm
      */
     static navigateToMarkerIndex(navigateDirection: Direction, markers: ReadonlyArray<InteractiveMarkerType>, thisIndex: number): number;
     constructor(props: LabelImageProps);
+    componentDidMount(): void;
+    componentWillUnmount(): void;
     simpleValidate(rubric: LabelImageProps): PerseusScore;
     getUserInput(): MarkersState;
     showRationalesForCurrentlySelectedChoices(rubric: LabelImageProps): void;

package/package.json

@@ -3,7 +3,7 @@
     "description": "Core Perseus API (includes renderers and widgets)",
     "author": "Khan Academy",
     "license": "MIT",
-    "version": "26.1.0",
+    "version": "27.0.1",
     "publishConfig": {
         "access": "public"
     },
@@ -39,15 +39,15 @@
         "test": "bash -c 'yarn --silent --cwd \"../..\" test ${@:0} $($([[ ${@: -1} = -* ]] || [[ ${@: -1} = bash ]]) && echo $PWD)'"
     },
     "dependencies": {
-        "@khanacademy/kas": "^0.3.10",
+        "@khanacademy/kas": "^0.3.11",
         "@khanacademy/kmath": "^0.1.13",
-        "@khanacademy/math-input": "^20.0.1",
+        "@khanacademy/math-input": "^20.0.2",
         "@khanacademy/perseus-core": "1.5.0",
         "@khanacademy/perseus-linter": "^1.0.0",
         "@khanacademy/pure-markdown": "^0.3.7",
         "@khanacademy/simple-markdown": "^0.13.0",
         "@use-gesture/react": "^10.2.27",
-        "mafs": "0.18.7"
+        "mafs": "0.19.0"
     },
     "devDependencies": {
         "@khanacademy/wonder-blocks-banner": "3.0.42",

package/dist/widgets/unit.d.ts

@@ -1,85 +0,0 @@
-import * as React from "react";
-import { PerseusI18nContext } from "../components/i18n-context";
-import type { PerseusUnitInputWidgetOptions } from "../perseus-types";
-import type { PerseusStrings } from "../strings";
-import type { APIOptions, ChangeHandler, FocusPath } from "../types";
-export declare const countSigfigs: (value: string) => number;
-export declare const sigfigPrint: (num: number, sigfigs: number) => string;
-type Rubric = {
-    value: string;
-    sigfigs: number;
-    accepting: "all";
-} | {
-    value: string;
-    sigfigs: number;
-    accepting: "some";
-    acceptingUnits: ReadonlyArray<string>;
-};
-type ValidationResult = {
-    type: "points";
-    earned: 1 | 0;
-    message: string | null | undefined;
-    total: number;
-} | {
-    type: "invalid";
-    message: string | null | undefined;
-};
-type Props = {
-    apiOptions: APIOptions;
-    onChange: ChangeHandler;
-    value: PerseusUnitInputWidgetOptions["value"];
-    onBlur: (arg1: FocusPath) => unknown;
-    onFocus: (arg1: FocusPath) => unknown;
-};
-type DefaultProps = {
-    apiOptions: Props["apiOptions"];
-    value: Props["value"];
-};
-export declare class OldUnitInput extends React.Component<Props> {
-    static contextType: React.Context<{
-        strings: PerseusStrings;
-        locale: string;
-    }>;
-    context: React.ContextType<typeof PerseusI18nContext>;
-    _errorTimeout: number | null | undefined;
-    static defaultProps: DefaultProps;
-    static validate(userInput: string, rubric: Rubric, strings: PerseusStrings): ValidationResult;
-    componentDidUpdate(): void;
-    componentWillUnmount(): void;
-    _showError: () => void;
-    _hideError: () => void;
-    change: (...args: ReadonlyArray<any>) => any | null | undefined;
-    handleBlur: () => void;
-    handleChange: (event: React.ChangeEvent<HTMLInputElement>) => void;
-    simpleValidate: (rubric: Rubric, onInputError?: () => unknown) => ValidationResult;
-    getUserInput: () => string;
-    getInputPaths: () => ReadonlyArray<ReadonlyArray<any>>;
-    focusInputPath: (inputPath: FocusPath) => void;
-    handleFocus: () => void;
-    blurInputPath: (inputPath: FocusPath) => void;
-    setInputValue: (path: FocusPath, newValue: string, cb: () => unknown) => void;
-    getDOMNodeForPath: () => null | Element | Text;
-    getGrammarTypeForPath: (inputPath: FocusPath) => string;
-    render(): React.ReactNode;
-}
-declare const _default: Readonly<{
-    name: string;
-    displayName: string;
-    getWidget?: (() => typeof OldUnitInput) | undefined;
-    widget: typeof OldUnitInput;
-    accessible?: boolean | ((props: any) => boolean) | undefined;
-    hidden?: boolean | undefined;
-    version?: import("../types").Version | undefined;
-    supportedAlignments?: readonly import("../types").Alignment[] | undefined;
-    defaultAlignment?: import("../types").Alignment | undefined;
-    getDefaultAlignment?: (() => import("../types").Alignment) | undefined;
-    isLintable?: boolean | undefined;
-    tracking?: import("../types").Tracking | undefined;
-    traverseChildWidgets?: any;
-    transform?: import("../types").WidgetTransform | undefined;
-    staticTransform?: import("../types").WidgetTransform | undefined;
-    propUpgrades?: {
-        [key: string]: (arg1: any) => any;
-    } | undefined;
-}>;
-export default _default;