@khanacademy/perseus 23.0.0 → 23.3.0

package/dist/perseus-api.d.ts

@@ -97,11 +97,12 @@ export declare const ApiOptions: {
                 polygon?: boolean | undefined;
                 linear?: boolean | undefined;
                 quadratic?: boolean | undefined;
+                sinusoid?: boolean | undefined;
                 segment?: boolean | undefined;
                 "linear-system"?: boolean | undefined;
                 ray?: boolean | undefined;
             } & {
-                "interactive-graph-locked-features-m1"?: boolean | undefined;
+                "interactive-graph-locked-features-m2"?: boolean | undefined;
             }) | undefined;
         } | undefined;
         onWidgetStartProps?: ((widgets: import("./perseus-types").PerseusWidgetsMap) => void) | undefined;

package/dist/perseus-types.d.ts

@@ -2,7 +2,7 @@ import type { Coord } from "./interactive2/types";
 import type { Interval, vec } from "mafs";
 export type Range = Interval;
 export type Size = [number, number];
-export type CollinearTuple = readonly [vec.Vector2, vec.Vector2];
+export type CollinearTuple = [vec.Vector2, vec.Vector2];
 export type ShowSolutions = "all" | "selected" | "none";
 export type PerseusWidgetsMap = {
     [key in `categorizer ${number}`]: CategorizerWidget;
@@ -349,7 +349,7 @@ export type PerseusInteractiveGraphWidgetOptions = {
 declare const lockedFigureColorNames: readonly ["green", "grayH", "purple", "pink", "red"];
 export type LockedFigureColor = (typeof lockedFigureColorNames)[number];
 export declare const lockedFigureColors: Record<LockedFigureColor, string>;
-export type LockedFigure = LockedPointType | LockedLineType;
+export type LockedFigure = LockedPointType | LockedLineType | LockedEllipseType | LockedVectorType;
 export type LockedFigureType = LockedFigure["type"];
 export type LockedPointType = {
     type: "point";
@@ -366,6 +366,22 @@ export type LockedLineType = {
     showPoint1: boolean;
     showPoint2: boolean;
 };
+export type LockedEllipseFillType = "none" | "solid" | "translucent";
+export declare const lockedEllipseFillStyles: Record<LockedEllipseFillType, number>;
+export type LockedEllipseType = {
+    type: "ellipse";
+    center: Coord;
+    radius: [x: number, y: number];
+    angle: number;
+    color: LockedFigureColor;
+    fillStyle: LockedEllipseFillType;
+    strokeStyle: "solid" | "dashed";
+};
+export type LockedVectorType = {
+    type: "vector";
+    points: [tail: Coord, tip: Coord];
+    color: LockedFigureColor;
+};
 export type PerseusGraphType = PerseusGraphTypeAngle | PerseusGraphTypeCircle | PerseusGraphTypeLinear | PerseusGraphTypeLinearSystem | PerseusGraphTypePoint | PerseusGraphTypePolygon | PerseusGraphTypeQuadratic | PerseusGraphTypeRay | PerseusGraphTypeSegment | PerseusGraphTypeSinusoid;
 export type PerseusGraphTypeCommon = {
     coord?: Coord;
@@ -390,7 +406,7 @@ export type PerseusGraphTypeLinear = {
 } & PerseusGraphTypeCommon;
 export type PerseusGraphTypeLinearSystem = {
     type: "linear-system";
-    coords?: ReadonlyArray<CollinearTuple>;
+    coords?: CollinearTuple[];
 } & PerseusGraphTypeCommon;
 export type PerseusGraphTypePoint = {
     type: "point";
@@ -413,7 +429,7 @@ export type PerseusGraphTypeQuadratic = {
 export type PerseusGraphTypeSegment = {
     type: "segment";
     numSegments?: number;
-    coords?: ReadonlyArray<CollinearTuple>;
+    coords?: CollinearTuple[];
 } & PerseusGraphTypeCommon;
 export type PerseusGraphTypeSinusoid = {
     type: "sinusoid";

package/dist/server-item-renderer.d.ts

@@ -144,11 +144,12 @@ declare const ref: React.ForwardRefExoticComponent<Omit<Pick<OwnProps & HOCProps
                 polygon?: boolean | undefined;
                 linear?: boolean | undefined;
                 quadratic?: boolean | undefined;
+                sinusoid?: boolean | undefined;
                 segment?: boolean | undefined;
                 "linear-system"?: boolean | undefined;
                 ray?: boolean | undefined;
             } & {
-                "interactive-graph-locked-features-m1"?: boolean | undefined;
+                "interactive-graph-locked-features-m2"?: boolean | undefined;
             }) | undefined;
         } | undefined;
         onWidgetStartProps?: ((widgets: import("./perseus-types").PerseusWidgetsMap) => void) | undefined;

package/dist/types.d.ts

@@ -77,8 +77,8 @@ type TrackInteractionArgs = {
     id: string;
     correct?: boolean;
 } & Partial<TrackingGradedGroupExtraArguments> & Partial<TrackingSequenceExtraArguments>;
-export declare const MafsGraphTypeFlags: readonly ["segment", "linear", "linear-system", "ray", "polygon", "circle", "quadratic"];
-export declare const InteractiveGraphLockedFeaturesFlags: readonly ["interactive-graph-locked-features-m1"];
+export declare const MafsGraphTypeFlags: readonly ["segment", "linear", "linear-system", "ray", "polygon", "circle", "quadratic", "sinusoid"];
+export declare const InteractiveGraphLockedFeaturesFlags: readonly ["interactive-graph-locked-features-m2"];
 /**
  * APIOptions provides different ways to customize the behaviour of Perseus.
  *

package/dist/util/geometry.d.ts

@@ -14,6 +14,7 @@ export declare function sign(val: number): 0 | 1 | -1;
 export declare function ccw(a: Coord, b: Coord, c: Coord): number;
 export declare function collinear(a: Coord, b: Coord, c: Coord): boolean;
 export declare function intersects(ab: Line, cd: Line): boolean;
+export declare function polygonSidesIntersect(vertices: Coord[]): boolean;
 export declare function vector(a: any, b: any): number[];
 export declare function reverseVector(vector: Coord): Coord;
 export declare function clockwise(points: Coord[]): boolean;

package/dist/widgets/expression.d.ts

@@ -138,11 +138,12 @@ declare const _default: Readonly<{
                     polygon?: boolean | undefined;
                     linear?: boolean | undefined;
                     quadratic?: boolean | undefined;
+                    sinusoid?: boolean | undefined;
                     segment?: boolean | undefined;
                     "linear-system"?: boolean | undefined;
                     ray?: boolean | undefined;
                 } & {
-                    "interactive-graph-locked-features-m1"?: boolean | undefined;
+                    "interactive-graph-locked-features-m2"?: boolean | undefined;
                 }) | undefined;
             } | undefined;
             onWidgetStartProps?: ((widgets: import("../perseus-types").PerseusWidgetsMap) => void) | undefined;
@@ -213,11 +214,12 @@ declare const _default: Readonly<{
                     polygon?: boolean | undefined;
                     linear?: boolean | undefined;
                     quadratic?: boolean | undefined;
+                    sinusoid?: boolean | undefined;
                     segment?: boolean | undefined;
                     "linear-system"?: boolean | undefined;
                     ray?: boolean | undefined;
                 } & {
-                    "interactive-graph-locked-features-m1"?: boolean | undefined;
+                    "interactive-graph-locked-features-m2"?: boolean | undefined;
                 }) | undefined;
             } | undefined;
             onWidgetStartProps?: ((widgets: import("../perseus-types").PerseusWidgetsMap) => void) | undefined;
@@ -288,11 +290,12 @@ declare const _default: Readonly<{
                     polygon?: boolean | undefined;
                     linear?: boolean | undefined;
                     quadratic?: boolean | undefined;
+                    sinusoid?: boolean | undefined;
                     segment?: boolean | undefined;
                     "linear-system"?: boolean | undefined;
                     ray?: boolean | undefined;
                 } & {
-                    "interactive-graph-locked-features-m1"?: boolean | undefined;
+                    "interactive-graph-locked-features-m2"?: boolean | undefined;
                 }) | undefined;
             } | undefined;
             onWidgetStartProps?: ((widgets: import("../perseus-types").PerseusWidgetsMap) => void) | undefined;
@@ -360,11 +363,12 @@ declare const _default: Readonly<{
                     polygon?: boolean | undefined;
                     linear?: boolean | undefined;
                     quadratic?: boolean | undefined;
+                    sinusoid?: boolean | undefined;
                     segment?: boolean | undefined;
                     "linear-system"?: boolean | undefined;
                     ray?: boolean | undefined;
                 } & {
-                    "interactive-graph-locked-features-m1"?: boolean | undefined;
+                    "interactive-graph-locked-features-m2"?: boolean | undefined;
                 }) | undefined;
             } | undefined;
             onWidgetStartProps?: ((widgets: import("../perseus-types").PerseusWidgetsMap) => void) | undefined;
@@ -435,11 +439,12 @@ declare const _default: Readonly<{
                     polygon?: boolean | undefined;
                     linear?: boolean | undefined;
                     quadratic?: boolean | undefined;
+                    sinusoid?: boolean | undefined;
                     segment?: boolean | undefined;
                     "linear-system"?: boolean | undefined;
                     ray?: boolean | undefined;
                 } & {
-                    "interactive-graph-locked-features-m1"?: boolean | undefined;
+                    "interactive-graph-locked-features-m2"?: boolean | undefined;
                 }) | undefined;
             } | undefined;
             onWidgetStartProps?: ((widgets: import("../perseus-types").PerseusWidgetsMap) => void) | undefined;
@@ -510,11 +515,12 @@ declare const _default: Readonly<{
                     polygon?: boolean | undefined;
                     linear?: boolean | undefined;
                     quadratic?: boolean | undefined;
+                    sinusoid?: boolean | undefined;
                     segment?: boolean | undefined;
                     "linear-system"?: boolean | undefined;
                     ray?: boolean | undefined;
                 } & {
-                    "interactive-graph-locked-features-m1"?: boolean | undefined;
+                    "interactive-graph-locked-features-m2"?: boolean | undefined;
                 }) | undefined;
             } | undefined;
             onWidgetStartProps?: ((widgets: import("../perseus-types").PerseusWidgetsMap) => void) | undefined;

package/dist/widgets/interactive-graphs/graphs/components/css-cursor.d.ts

@@ -0,0 +1 @@
+export type CSSCursor = "move" | "ew-resize";

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

@@ -1,10 +1,12 @@
 import * as React from "react";
+import type { CSSCursor } from "./css-cursor";
 import type { vec } from "mafs";
 type Props = {
     point: vec.Vector2;
     color?: string | undefined;
     dragging: boolean;
     focusBehavior: FocusBehaviorConfig;
+    cursor?: CSSCursor | undefined;
 };
 type FocusBehaviorConfig = {
     type: "uncontrolled";

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

@@ -1,9 +1,11 @@
 /// <reference types="react" />
+import type { CSSCursor } from "./css-cursor";
 import type { vec } from "mafs";
 type Props = {
     point: vec.Vector2;
     onMove: (newPoint: vec.Vector2) => unknown;
     color?: string;
+    cursor?: CSSCursor | undefined;
 };
 export declare const StyledMovablePoint: (props: Props) => JSX.Element;
 export {};

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

@@ -1,6 +1,8 @@
 export { SegmentGraph } from "./segment";
 export { LinearGraph } from "./linear";
+export { LinearSystemGraph } from "./linear-system";
 export { RayGraph } from "./ray";
 export { PolygonGraph } from "./polygon";
 export { CircleGraph } from "./circle";
 export { QuadraticGraph } from "./quadratic";
+export { SinusoidGraph } from "./sinusoid";

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

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

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

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

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

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+import type { Coord } from "../../../interactive2/types";
+import type { SinusoidGraphState, MafsGraphProps } from "../types";
+type SinusoidGraphProps = MafsGraphProps<SinusoidGraphState>;
+export type SineCoefficient = {
+    amplitude: number;
+    angularFrequency: number;
+    phase: number;
+    verticalOffset: number;
+};
+export declare function SinusoidGraph(props: SinusoidGraphProps): JSX.Element;
+export declare const computeSine: (x: number, sinusoidCoefficients: SineCoefficient) => number;
+export declare const getSinusoidCoefficients: (coords: ReadonlyArray<Coord>) => SineCoefficient;
+export {};

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

@@ -1,4 +1,4 @@
-import type { PerseusRenderer } from "../../perseus-types";
+import type { LockedEllipseFillType, LockedFigureColor, PerseusRenderer } from "../../perseus-types";
 import type { vec } from "mafs";
 export declare function interactiveGraphQuestionBuilder(): InteractiveGraphQuestionBuilder;
 declare class InteractiveGraphQuestionBuilder {
@@ -23,6 +23,13 @@ declare class InteractiveGraphQuestionBuilder {
     withCircle(): InteractiveGraphQuestionBuilder;
     addLockedPointAt(x: number, y: number): InteractiveGraphQuestionBuilder;
     addLockedLine(point1: vec.Vector2, point2: vec.Vector2): InteractiveGraphQuestionBuilder;
+    addLockedEllipse(center: vec.Vector2, radius: [x: number, y: number], options?: {
+        angle?: number;
+        color?: LockedFigureColor;
+        fillStyle?: LockedEllipseFillType;
+        strokeStyle?: "solid" | "dashed";
+    }): InteractiveGraphQuestionBuilder;
+    addLockedVector(tail: vec.Vector2, tip: vec.Vector2, color?: LockedFigureColor): InteractiveGraphQuestionBuilder;
     private createLockedPoint;
     private addLockedFigure;
 }

package/dist/widgets/interactive-graphs/locked-ellipse.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { type LockedEllipseType } from "../../perseus-types";
+declare const LockedEllipse: (props: LockedEllipseType) => JSX.Element;
+export default LockedEllipse;

package/dist/widgets/interactive-graphs/locked-vector.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import type { LockedVectorType } from "../../perseus-types";
+declare const LockedVector: (props: LockedVectorType) => JSX.Element;
+export default LockedVector;

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

@@ -1,3 +1,3 @@
-export declare const mafsSupportedGraphTypes: readonly ["segment", "linear", "linear-system", "ray", "polygon", "point", "circle", "quadratic"];
+export declare const mafsSupportedGraphTypes: readonly ["segment", "linear", "linear-system", "ray", "polygon", "point", "circle", "quadratic", "sinusoid"];
 export type MafsSupportedGraphType = (typeof mafsSupportedGraphTypes)[number];
 export declare const trueForAllMafsSupportedGraphTypes: Record<MafsSupportedGraphType, true>;

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

@@ -4,7 +4,7 @@ export type InitializeGraphStateParam = {
     range: InteractiveGraphProps["range"];
     step: InteractiveGraphProps["step"];
     snapStep: InteractiveGraphProps["snapStep"];
-    graph: InteractiveGraphProps["graph"];
+    graph: PerseusGraphType;
 };
 export declare function initializeGraphState(params: InitializeGraphStateParam): InteractiveGraphState;
 export declare function getGradableGraph(state: InteractiveGraphState, initialGraph: PerseusGraphType): PerseusGraphType;

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

@@ -1,5 +1,5 @@
 import type { InteractiveGraphAction } from "./reducer/interactive-graph-action";
-import type { PerseusGraphType, PerseusInteractiveGraphWidgetOptions } from "../../perseus-types";
+import type { PerseusInteractiveGraphWidgetOptions } from "../../perseus-types";
 import type { WidgetProps } from "../../types";
 import type { Coord } from "@khanacademy/perseus";
 import type { Interval, vec } from "mafs";
@@ -8,12 +8,7 @@ export type MafsGraphProps<T extends InteractiveGraphState> = {
     graphState: T;
     dispatch: (action: InteractiveGraphAction) => unknown;
 };
-export interface InitializeGraphStateParams<T extends PerseusGraphType> {
-    graph: T;
-    range: [Interval, Interval];
-    step: vec.Vector2;
-}
-export type InteractiveGraphState = SegmentGraphState | LinearGraphState | RayGraphState | PolygonGraphState | PointGraphState | CircleGraphState | QuadraticGraphState;
+export type InteractiveGraphState = SegmentGraphState | LinearSystemGraphState | LinearGraphState | RayGraphState | PolygonGraphState | PointGraphState | CircleGraphState | QuadraticGraphState | SinusoidGraphState;
 export interface InteractiveGraphStateCommon {
     hasBeenInteractedWith: boolean;
     range: [xRange: Interval, yRange: Interval];
@@ -24,7 +19,11 @@ export interface SegmentGraphState extends InteractiveGraphStateCommon {
     coords: PairOfPoints[];
 }
 export interface LinearGraphState extends InteractiveGraphStateCommon {
-    type: "linear" | "linear-system";
+    type: "linear";
+    coords: PairOfPoints;
+}
+export interface LinearSystemGraphState extends InteractiveGraphStateCommon {
+    type: "linear-system";
     coords: PairOfPoints[];
 }
 export interface PointGraphState extends InteractiveGraphStateCommon {
@@ -33,7 +32,7 @@ export interface PointGraphState extends InteractiveGraphStateCommon {
 }
 export interface RayGraphState extends InteractiveGraphStateCommon {
     type: "ray";
-    coords: PairOfPoints[];
+    coords: PairOfPoints;
 }
 export interface PolygonGraphState extends InteractiveGraphStateCommon {
     type: "polygon";
@@ -50,6 +49,10 @@ export interface QuadraticGraphState extends InteractiveGraphStateCommon {
     type: "quadratic";
     coords: [Coord, Coord, Coord];
 }
+export interface SinusoidGraphState extends InteractiveGraphStateCommon {
+    type: "sinusoid";
+    coords: [vec.Vector2, vec.Vector2];
+}
 export type PairOfPoints = [Coord, Coord];
 export type GraphDimensions = {
     range: [Interval, Interval];

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

@@ -132,11 +132,12 @@ declare const _default: Readonly<{
                     polygon?: boolean | undefined;
                     linear?: boolean | undefined;
                     quadratic?: boolean | undefined;
+                    sinusoid?: boolean | undefined;
                     segment?: boolean | undefined;
                     "linear-system"?: boolean | undefined;
                     ray?: boolean | undefined;
                 } & {
-                    "interactive-graph-locked-features-m1"?: boolean | undefined;
+                    "interactive-graph-locked-features-m2"?: boolean | undefined;
                 }) | undefined;
             } | undefined;
             onWidgetStartProps?: ((widgets: import("..").PerseusWidgetsMap) => void) | undefined;
@@ -191,11 +192,12 @@ declare const _default: Readonly<{
                     polygon?: boolean | undefined;
                     linear?: boolean | undefined;
                     quadratic?: boolean | undefined;
+                    sinusoid?: boolean | undefined;
                     segment?: boolean | undefined;
                     "linear-system"?: boolean | undefined;
                     ray?: boolean | undefined;
                 } & {
-                    "interactive-graph-locked-features-m1"?: boolean | undefined;
+                    "interactive-graph-locked-features-m2"?: boolean | undefined;
                 }) | undefined;
             } | undefined;
             onWidgetStartProps?: ((widgets: import("..").PerseusWidgetsMap) => void) | undefined;

package/package.json

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