@khanacademy/perseus 20.3.1 → 20.4.1

package/dist/perseus-types.d.ts

@@ -1,6 +1,8 @@
 import type { Coord } from "./interactive2/types";
-export type Range = [number, number];
+import type { Interval, vec } from "mafs";
+export type Range = Interval;
 export type Size = [number, number];
+export type CollinearTuple = readonly [vec.Vector2, vec.Vector2];
 type StyleParams = {
     fill?: string;
     stroke?: string;
@@ -313,7 +315,7 @@ export type PerseusImageWidgetOptions = {
     backgroundImage: PerseusImageBackground;
     static?: boolean;
     labels?: ReadonlyArray<PerseusImageLabel>;
-    range?: [Range, Range];
+    range?: [Interval, Interval];
     box?: Size;
 };
 export type PerseusImageLabel = {
@@ -371,11 +373,11 @@ export type PerseusGraphTypeCircle = {
 } & PerseusGraphTypeCommon;
 export type PerseusGraphTypeLinear = {
     type: "linear";
-    coords?: ReadonlyArray<Coord>;
+    coords?: CollinearTuple;
 } & PerseusGraphTypeCommon;
 export type PerseusGraphTypeLinearSystem = {
     type: "linear-system";
-    coords?: ReadonlyArray<ReadonlyArray<Coord>>;
+    coords?: ReadonlyArray<CollinearTuple>;
 } & PerseusGraphTypeCommon;
 export type PerseusGraphTypePoint = {
     type: "point";
@@ -398,7 +400,7 @@ export type PerseusGraphTypeQuadratic = {
 export type PerseusGraphTypeSegment = {
     type: "segment";
     numSegments?: number;
-    coords?: ReadonlyArray<ReadonlyArray<Coord>>;
+    coords?: ReadonlyArray<CollinearTuple>;
 } & PerseusGraphTypeCommon;
 export type PerseusGraphTypeSinusoid = {
     type: "sinusoid";
@@ -406,7 +408,7 @@ export type PerseusGraphTypeSinusoid = {
 } & PerseusGraphTypeCommon;
 export type PerseusGraphTypeRay = {
     type: "ray";
-    coords?: ReadonlyArray<Coord>;
+    coords?: CollinearTuple;
 } & PerseusGraphTypeCommon;
 export type PerseusLabelImageWidgetOptions = {
     choices: ReadonlyArray<string>;
@@ -609,7 +611,7 @@ export type PerseusInteractionGraph = {
     editableSettings?: ReadonlyArray<"canvas" | "graph">;
     box: Size;
     labels: ReadonlyArray<string>;
-    range: [Range, Range];
+    range: [Interval, Interval];
     gridStep: [number, number];
     /**
      * The type of markings to display on the graph.

package/dist/widgets/interactive-graphs/graphs/components/movable-line.d.ts

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+import { vec } from "mafs";
+import type { Interval } from "mafs";
+export declare const MovableLine: (props: {
+    start: vec.Vector2;
+    end: vec.Vector2;
+    onMove: (delta: vec.Vector2) => unknown;
+    stroke?: string | undefined;
+    extend?: {
+        start: boolean;
+        end: boolean;
+        range: [Interval, Interval];
+    } | undefined;
+}) => JSX.Element;

package/dist/widgets/interactive-graphs/{movable-point.d.ts → graphs/components/movable-point.d.ts}

@@ -3,6 +3,7 @@ import { vec } from "mafs";
 type Props = {
     point: vec.Vector2;
     onMove: (newPoint: vec.Vector2) => unknown;
+    color?: string;
 };
-export declare const MovablePoint: (props: Props) => JSX.Element;
+export declare const StyledMovablePoint: (props: Props) => JSX.Element;
 export {};

package/dist/widgets/interactive-graphs/graphs/index.d.ts

@@ -1 +1,3 @@
 export { SegmentGraph } from "./segment";
+export { LinearGraph } from "./linear";
+export { RayGraph } from "./ray";

package/dist/widgets/interactive-graphs/graphs/linear.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import type { MafsGraphProps, LinearGraphState } from "../types";
+type LinearGraphProps = MafsGraphProps<LinearGraphState>;
+export declare const LinearGraph: (props: LinearGraphProps) => JSX.Element;
+export {};

package/dist/widgets/interactive-graphs/graphs/ray.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import type { MafsGraphProps, RayGraphState } from "../types";
+type Props = MafsGraphProps<RayGraphState>;
+export declare const RayGraph: (props: Props) => JSX.Element;
+export {};

package/dist/widgets/interactive-graphs/graphs/segment.d.ts

@@ -1,6 +1,5 @@
 /// <reference types="react" />
-import type { SegmentGraphState } from "../interactive-graph-state";
-import type { MafsGraphProps } from "../types";
+import type { MafsGraphProps, SegmentGraphState } from "../types";
 type SegmentProps = MafsGraphProps<SegmentGraphState>;
 export declare const SegmentGraph: (props: SegmentProps) => JSX.Element;
 export {};

package/dist/widgets/interactive-graphs/graphs/types.d.ts

@@ -0,0 +1,9 @@
+import type { CollinearTuple } from "../../../perseus-types";
+import type { Interval, vec } from "mafs";
+export interface InteractiveLineProps {
+    collinearPair: Readonly<CollinearTuple>;
+    snaps: [number, number];
+    range: [x: Interval, y: Interval];
+    onMovePoint: (endpointIndex: number, destination: vec.Vector2) => unknown;
+    onMoveLine: (delta: vec.Vector2) => unknown;
+}

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

@@ -8,10 +8,10 @@ export interface MoveControlPoint {
     destination: vec.Vector2;
 }
 export declare function moveControlPoint(objectIndex: number, pointIndex: number, destination: vec.Vector2): MoveControlPoint;
-export declare const MOVE_SEGMENT = "move-segment";
+export declare const MOVE_LINE = "move-line";
 export interface MoveSegment {
-    type: typeof MOVE_SEGMENT;
-    segmentIndex: number;
+    type: typeof MOVE_LINE;
+    lineIndex: number;
     delta: vec.Vector2;
 }
-export declare function moveSegment(segmentIndex: number, delta: vec.Vector2): MoveSegment;
+export declare function moveSegment(lineIndex: number, delta: vec.Vector2): MoveSegment;

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

@@ -1,3 +1,3 @@
-import type { InteractiveGraphAction } from "./interactive-graph-action";
-import type { InteractiveGraphState } from "./interactive-graph-state";
+import { type InteractiveGraphAction } from "./interactive-graph-action";
+import type { InteractiveGraphState } from "./types";
 export declare function interactiveGraphReducer(state: Readonly<InteractiveGraphState>, action: InteractiveGraphAction): InteractiveGraphState;

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

@@ -1,19 +1,10 @@
+import type { InteractiveGraphState } from "./types";
 import type { PerseusGraphType } from "../../perseus-types";
 import type { Interval, vec } from "mafs";
-export type InteractiveGraphState = SegmentGraphState;
-export interface SegmentGraphState extends InteractiveGraphStateCommon {
-    type: "segment";
-    segments: Segment[];
-}
-export interface InteractiveGraphStateCommon {
-    hasBeenInteractedWith: boolean;
-    range: [Interval, Interval];
-    snapStep: vec.Vector2;
-}
-export type Segment = [vec.Vector2, vec.Vector2];
 export declare function initializeGraphState(params: {
     range: [Interval, Interval];
     step: vec.Vector2;
     snapStep: vec.Vector2;
     graph: PerseusGraphType;
 }): InteractiveGraphState;
+export declare function getGradableGraph<GraphType extends PerseusGraphType>(state: InteractiveGraphState, initialGraph: GraphType): GraphType;

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

@@ -2,7 +2,7 @@ import * as React from "react";
 import type { Widget } from "../../renderer";
 import "mafs/core.css";
 import "./mafs-styles.css";
-export declare const MafsGraph: React.ForwardRefExoticComponent<import("../../perseus-types").PerseusInteractiveGraphWidgetOptions & {
+export declare const MafsGraph: React.ForwardRefExoticComponent<import("../..").PerseusInteractiveGraphWidgetOptions & {
     widgetId: string;
     alignment: string | null | undefined;
     static: boolean | null | undefined;
@@ -42,7 +42,7 @@ export declare const MafsGraph: React.ForwardRefExoticComponent<import("../../pe
         crossOutEnabled?: boolean | undefined;
         editorChangeDelay?: number | undefined;
         flags?: Record<string, boolean | Record<string, boolean>> | undefined;
-        onWidgetStartProps?: ((widgets: import("../../perseus-types").PerseusWidgetsMap) => import("../../perseus-types").PerseusWidgetsMap) | undefined;
+        onWidgetStartProps?: ((widgets: import("../..").PerseusWidgetsMap) => import("../..").PerseusWidgetsMap) | undefined;
     }> & {
         GroupMetadataEditor: NonNullable<React.ComponentType<any> | undefined>;
         baseElements: {
@@ -67,7 +67,7 @@ export declare const MafsGraph: React.ForwardRefExoticComponent<import("../../pe
     onFocus: (blurPath: import("../..").FocusPath) => void;
     onBlur: (blurPath: import("../..").FocusPath) => void;
     findWidgets: (arg1: import("../../types").FilterCriterion) => readonly any[];
-    reviewModeRubric: import("../../perseus-types").PerseusInteractiveGraphWidgetOptions;
+    reviewModeRubric: import("../..").PerseusInteractiveGraphWidgetOptions;
     onChange: import("../..").ChangeHandler;
     trackInteraction: (extraData?: {} | undefined) => void;
     isLastUsedWidget: boolean;

package/dist/widgets/interactive-graphs/types.d.ts

@@ -1,9 +1,22 @@
 import type { InteractiveGraphAction } from "./interactive-graph-action";
-import type { InteractiveGraphState } from "./interactive-graph-state";
-import type { PerseusInteractiveGraphWidgetOptions } from "../../perseus-types";
+import type { CollinearTuple, PerseusGraphTypeLinearSystem, PerseusGraphTypeRay, PerseusGraphTypeSegment, PerseusInteractiveGraphWidgetOptions } from "../../perseus-types";
 import type { WidgetProps } from "../../types";
+import type { Interval, vec } from "mafs";
 export type InteractiveGraphProps = WidgetProps<PerseusInteractiveGraphWidgetOptions, PerseusInteractiveGraphWidgetOptions>;
 export type MafsGraphProps<T extends InteractiveGraphState> = {
     graphState: T;
     dispatch: (action: InteractiveGraphAction) => unknown;
 };
+export type InteractiveGraphState = SegmentGraphState | LinearGraphState | RayGraphState;
+export interface InteractiveGraphStateCommon {
+    hasBeenInteractedWith: boolean;
+    range: [Interval, Interval];
+    snapStep: vec.Vector2;
+}
+export type SegmentGraphState = InteractiveGraphStateCommon & Pick<PerseusGraphTypeSegment, "type" | "coords">;
+export type LinearGraphState = InteractiveGraphStateCommon & Pick<PerseusGraphTypeLinearSystem, "coords"> & {
+    type: "linear" | "linear-system";
+};
+export type RayGraphState = InteractiveGraphStateCommon & Pick<PerseusGraphTypeRay, "type"> & {
+    coords: readonly CollinearTuple[];
+};

package/package.json

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