@khanacademy/perseus 23.4.0 → 23.6.0

package/dist/perseus-api.d.ts

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

package/dist/perseus-types.d.ts

@@ -346,10 +346,10 @@ export type PerseusInteractiveGraphWidgetOptions = {
     correct: PerseusGraphType;
     lockedFigures?: ReadonlyArray<LockedFigure>;
 };
-declare const lockedFigureColorNames: readonly ["green", "grayH", "purple", "pink", "red"];
+declare const lockedFigureColorNames: readonly ["blue", "green", "grayH", "purple", "pink", "orange", "red"];
 export type LockedFigureColor = (typeof lockedFigureColorNames)[number];
 export declare const lockedFigureColors: Record<LockedFigureColor, string>;
-export type LockedFigure = LockedPointType | LockedLineType | LockedEllipseType | LockedVectorType;
+export type LockedFigure = LockedPointType | LockedLineType | LockedVectorType | LockedEllipseType | LockedPolygonType;
 export type LockedFigureType = LockedFigure["type"];
 export type LockedPointType = {
     type: "point";
@@ -366,21 +366,29 @@ export type LockedLineType = {
     showPoint1: boolean;
     showPoint2: boolean;
 };
-export type LockedEllipseFillType = "none" | "solid" | "translucent";
-export declare const lockedEllipseFillStyles: Record<LockedEllipseFillType, number>;
+export type LockedVectorType = {
+    type: "vector";
+    points: [tail: Coord, tip: Coord];
+    color: LockedFigureColor;
+};
+export type LockedFigureFillType = "none" | "solid" | "translucent";
+export declare const lockedFigureFillStyles: Record<LockedFigureFillType, number>;
 export type LockedEllipseType = {
     type: "ellipse";
     center: Coord;
     radius: [x: number, y: number];
     angle: number;
     color: LockedFigureColor;
-    fillStyle: LockedEllipseFillType;
+    fillStyle: LockedFigureFillType;
     strokeStyle: "solid" | "dashed";
 };
-export type LockedVectorType = {
-    type: "vector";
-    points: [tail: Coord, tip: Coord];
+export type LockedPolygonType = {
+    type: "polygon";
+    points: ReadonlyArray<Coord>;
     color: LockedFigureColor;
+    showVertices: boolean;
+    fillStyle: LockedFigureFillType;
+    strokeStyle: "solid" | "dashed";
 };
 export type PerseusGraphType = PerseusGraphTypeAngle | PerseusGraphTypeCircle | PerseusGraphTypeLinear | PerseusGraphTypeLinearSystem | PerseusGraphTypePoint | PerseusGraphTypePolygon | PerseusGraphTypeQuadratic | PerseusGraphTypeRay | PerseusGraphTypeSegment | PerseusGraphTypeSinusoid;
 export type PerseusGraphTypeCommon = {

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

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

package/dist/types.d.ts

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

package/dist/widgets/expression.d.ts

@@ -139,11 +139,12 @@ declare const _default: Readonly<{
                     linear?: boolean | undefined;
                     quadratic?: boolean | undefined;
                     sinusoid?: boolean | undefined;
-                    segment?: boolean | undefined;
                     "linear-system"?: boolean | undefined;
                     ray?: boolean | undefined;
+                    segment?: boolean | undefined;
                 } & {
                     "interactive-graph-locked-features-m2"?: boolean | undefined;
+                    "interactive-graph-locked-features-m2b"?: boolean | undefined;
                 }) | undefined;
             } | undefined;
             onWidgetStartProps?: ((widgets: import("../perseus-types").PerseusWidgetsMap) => void) | undefined;
@@ -215,11 +216,12 @@ declare const _default: Readonly<{
                     linear?: boolean | undefined;
                     quadratic?: boolean | undefined;
                     sinusoid?: boolean | undefined;
-                    segment?: boolean | undefined;
                     "linear-system"?: boolean | undefined;
                     ray?: boolean | undefined;
+                    segment?: boolean | undefined;
                 } & {
                     "interactive-graph-locked-features-m2"?: boolean | undefined;
+                    "interactive-graph-locked-features-m2b"?: boolean | undefined;
                 }) | undefined;
             } | undefined;
             onWidgetStartProps?: ((widgets: import("../perseus-types").PerseusWidgetsMap) => void) | undefined;
@@ -291,11 +293,12 @@ declare const _default: Readonly<{
                     linear?: boolean | undefined;
                     quadratic?: boolean | undefined;
                     sinusoid?: boolean | undefined;
-                    segment?: boolean | undefined;
                     "linear-system"?: boolean | undefined;
                     ray?: boolean | undefined;
+                    segment?: boolean | undefined;
                 } & {
                     "interactive-graph-locked-features-m2"?: boolean | undefined;
+                    "interactive-graph-locked-features-m2b"?: boolean | undefined;
                 }) | undefined;
             } | undefined;
             onWidgetStartProps?: ((widgets: import("../perseus-types").PerseusWidgetsMap) => void) | undefined;
@@ -364,11 +367,12 @@ declare const _default: Readonly<{
                     linear?: boolean | undefined;
                     quadratic?: boolean | undefined;
                     sinusoid?: boolean | undefined;
-                    segment?: boolean | undefined;
                     "linear-system"?: boolean | undefined;
                     ray?: boolean | undefined;
+                    segment?: boolean | undefined;
                 } & {
                     "interactive-graph-locked-features-m2"?: boolean | undefined;
+                    "interactive-graph-locked-features-m2b"?: boolean | undefined;
                 }) | undefined;
             } | undefined;
             onWidgetStartProps?: ((widgets: import("../perseus-types").PerseusWidgetsMap) => void) | undefined;
@@ -440,11 +444,12 @@ declare const _default: Readonly<{
                     linear?: boolean | undefined;
                     quadratic?: boolean | undefined;
                     sinusoid?: boolean | undefined;
-                    segment?: boolean | undefined;
                     "linear-system"?: boolean | undefined;
                     ray?: boolean | undefined;
+                    segment?: boolean | undefined;
                 } & {
                     "interactive-graph-locked-features-m2"?: boolean | undefined;
+                    "interactive-graph-locked-features-m2b"?: boolean | undefined;
                 }) | undefined;
             } | undefined;
             onWidgetStartProps?: ((widgets: import("../perseus-types").PerseusWidgetsMap) => void) | undefined;
@@ -516,11 +521,12 @@ declare const _default: Readonly<{
                     linear?: boolean | undefined;
                     quadratic?: boolean | undefined;
                     sinusoid?: boolean | undefined;
-                    segment?: boolean | undefined;
                     "linear-system"?: boolean | undefined;
                     ray?: boolean | undefined;
+                    segment?: boolean | undefined;
                 } & {
                     "interactive-graph-locked-features-m2"?: boolean | undefined;
+                    "interactive-graph-locked-features-m2b"?: boolean | undefined;
                 }) | undefined;
             } | undefined;
             onWidgetStartProps?: ((widgets: import("../perseus-types").PerseusWidgetsMap) => void) | undefined;

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

@@ -10,5 +10,5 @@ export type SineCoefficient = {
 };
 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 declare const getSinusoidCoefficients: (coords: ReadonlyArray<Coord>) => SineCoefficient | undefined;
 export {};

package/dist/widgets/interactive-graphs/graphs/use-draggable.d.ts

@@ -0,0 +1,13 @@
+import type { vec } from "mafs";
+import type { RefObject } from "react";
+type Params = {
+    gestureTarget: RefObject<Element>;
+    onMove: (point: vec.Vector2) => unknown;
+    point: vec.Vector2;
+    constrain: (point: vec.Vector2) => vec.Vector2;
+};
+type DragState = {
+    dragging: boolean;
+};
+export declare function useDraggable(params: Params): DragState;
+export {};

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

@@ -1,4 +1,4 @@
-import type { LockedEllipseFillType, LockedFigureColor, PerseusRenderer } from "../../perseus-types";
+import type { LockedFigureFillType, LockedFigureColor, PerseusRenderer } from "../../perseus-types";
 import type { vec } from "mafs";
 export declare function interactiveGraphQuestionBuilder(): InteractiveGraphQuestionBuilder;
 declare class InteractiveGraphQuestionBuilder {
@@ -24,13 +24,19 @@ declare class InteractiveGraphQuestionBuilder {
     withPolygon(snapTo: "grid" | "angles" | "sides"): InteractiveGraphQuestionBuilder;
     addLockedPointAt(x: number, y: number): InteractiveGraphQuestionBuilder;
     addLockedLine(point1: vec.Vector2, point2: vec.Vector2): InteractiveGraphQuestionBuilder;
+    addLockedVector(tail: vec.Vector2, tip: vec.Vector2, color?: LockedFigureColor): InteractiveGraphQuestionBuilder;
     addLockedEllipse(center: vec.Vector2, radius: [x: number, y: number], options?: {
         angle?: number;
         color?: LockedFigureColor;
-        fillStyle?: LockedEllipseFillType;
+        fillStyle?: LockedFigureFillType;
+        strokeStyle?: "solid" | "dashed";
+    }): InteractiveGraphQuestionBuilder;
+    addLockedPolygon(points: vec.Vector2[], options?: {
+        color?: LockedFigureColor;
+        showVertices?: boolean;
+        fillStyle?: LockedFigureFillType;
         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 → locked-figures/locked-ellipse.d.ts}

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

package/dist/widgets/interactive-graphs/{locked-line.d.ts → locked-figures/locked-line.d.ts}

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import type { LockedLineType } from "../../perseus-types";
+import type { LockedLineType } from "../../../perseus-types";
 import type { Interval } from "mafs";
 type Props = LockedLineType & {
     range: [Interval, Interval];

package/dist/widgets/interactive-graphs/{locked-point.d.ts → locked-figures/locked-point.d.ts}

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

package/dist/widgets/interactive-graphs/locked-figures/locked-polygon.d.ts

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

package/dist/widgets/interactive-graphs/{locked-vector.d.ts → locked-figures/locked-vector.d.ts}

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

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

@@ -1,13 +1,14 @@
 import * as React from "react";
 import { type InteractiveGraphAction } from "./reducer/interactive-graph-action";
 import type { InteractiveGraphState, InteractiveGraphProps } from "./types";
+import type { PerseusGraphType } from "../../perseus-types";
 import type { Widget } from "../../renderer";
 import "mafs/core.css";
 import "./mafs-styles.css";
 export type StatefulMafsGraphProps = {
     box: [number, number];
     backgroundImage?: InteractiveGraphProps["backgroundImage"];
-    graph: InteractiveGraphProps["graph"];
+    graph: PerseusGraphType;
     lockedFigures?: InteractiveGraphProps["lockedFigures"];
     range: InteractiveGraphProps["range"];
     snapStep: InteractiveGraphProps["snapStep"];

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

@@ -1,9 +1,10 @@
 import type { PerseusGraphType } from "../../../perseus-types";
 import type { InteractiveGraphState } from "../types";
 import type { Interval } from "mafs";
-export declare function initializeGraphState(params: {
+export type InitializeGraphStateParams = {
     range: [x: Interval, y: Interval];
     step: [x: number, y: number];
     snapStep: [x: number, y: number];
     graph: PerseusGraphType;
-}): InteractiveGraphState;
+};
+export declare function initializeGraphState(params: InitializeGraphStateParams): InteractiveGraphState;

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

@@ -1,5 +1,12 @@
+import type { InitializeGraphStateParams } from "./initialize-graph-state";
 import type { Interval, vec } from "mafs";
-export type InteractiveGraphAction = MoveControlPoint | MoveLine | MoveAll | MovePoint | MoveCenter | MoveRadiusPoint | ChangeSnapStep | ChangeRange;
+export type InteractiveGraphAction = Reinitialize | MoveControlPoint | MoveLine | MoveAll | MovePoint | MoveCenter | MoveRadiusPoint | ChangeSnapStep | ChangeRange;
+export declare const REINITIALIZE = "reinitialize";
+export interface Reinitialize {
+    type: typeof REINITIALIZE;
+    params: InitializeGraphStateParams;
+}
+export declare function reinitialize(params: InitializeGraphStateParams): Reinitialize;
 export declare const MOVE_CONTROL_POINT = "move-control-point";
 export interface MoveControlPoint {
     type: typeof MOVE_CONTROL_POINT;

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

@@ -133,11 +133,12 @@ declare const _default: Readonly<{
                     linear?: boolean | undefined;
                     quadratic?: boolean | undefined;
                     sinusoid?: boolean | undefined;
-                    segment?: boolean | undefined;
                     "linear-system"?: boolean | undefined;
                     ray?: boolean | undefined;
+                    segment?: boolean | undefined;
                 } & {
                     "interactive-graph-locked-features-m2"?: boolean | undefined;
+                    "interactive-graph-locked-features-m2b"?: boolean | undefined;
                 }) | undefined;
             } | undefined;
             onWidgetStartProps?: ((widgets: import("..").PerseusWidgetsMap) => void) | undefined;
@@ -193,11 +194,12 @@ declare const _default: Readonly<{
                     linear?: boolean | undefined;
                     quadratic?: boolean | undefined;
                     sinusoid?: boolean | undefined;
-                    segment?: boolean | undefined;
                     "linear-system"?: boolean | undefined;
                     ray?: boolean | undefined;
+                    segment?: boolean | undefined;
                 } & {
                     "interactive-graph-locked-features-m2"?: boolean | undefined;
+                    "interactive-graph-locked-features-m2b"?: 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.4.0",
+    "version": "23.6.0",
     "publishConfig": {
         "access": "public"
     },

package/dist/components/math-output.d.ts

@@ -1,27 +0,0 @@
-import * as React from "react";
-type Props = {
-    value: string | number;
-    className?: string;
-    labelText?: string;
-    onFocus: () => void;
-    onBlur: () => void;
-};
-type DefaultProps = Pick<Props, "value" | "onFocus" | "onBlur">;
-type State = {
-    focused: boolean;
-    selectorNamespace: string;
-};
-declare class MathOutput extends React.Component<Props, State> {
-    static defaultProps: DefaultProps;
-    state: State;
-    _getInputClassName: () => string;
-    _getDisplayValue: (arg1: string | number) => string;
-    render(): React.ReactNode;
-    getValue: () => string | number;
-    focus: () => void;
-    blur: () => void;
-    _bindBlurHandler: () => void;
-    _unbindBlurHandler: () => void;
-    componentWillUnmount(): void;
-}
-export default MathOutput;