@khanacademy/perseus 20.6.0 → 20.7.0

package/dist/util/snowman-utils.d.ts

@@ -0,0 +1,90 @@
+export declare enum WidgetType {
+    Categorizer = "categorizer",
+    CSProgram = "cs-program",
+    Definition = "definition",
+    Dropdown = "dropdown",
+    Explanation = "explanation",
+    Expression = "expression",
+    GradedGroup = "graded-group",
+    GradedGroupAnswerBar = "graded-group-answer-bar",
+    GradedGroupSet = "graded-group-set",
+    Grapher = "grapher",
+    Group = "group",
+    Iframe = "iframe",
+    Image = "image",
+    InputNumber = "input-number",
+    Interaction = "interaction",
+    InteractiveGraph = "interactive-graph",
+    InteractiveNumberLine = "interactive-number-line",
+    LabelImage = "label-image",
+    Matcher = "matcher",
+    Matrix = "matrix",
+    Measurer = "measurer",
+    Molecule = "molecule",
+    NumberLine = "number-line",
+    NumericInput = "numeric-input",
+    Orderer = "orderer",
+    Passage = "passage",
+    PassageRef = "passage-ref",
+    PassageRefTarget = "passage-ref-target",
+    Plotter = "plotter",
+    Protractor = "protractor",
+    PythonProgram = "python-program",
+    Radio = "radio",
+    Sorter = "sorter",
+    Table = "table",
+    Unit = "unit",
+    Video = "video",
+    VideoTranscriptLink = "video-transcript-link"
+}
+export type WidgetId = `${WidgetType} ${number}`;
+export declare const QUESTION_WIDGETS: ReadonlyArray<string>;
+/**
+ * Regex for widget placeholders in a string.
+ *
+ * First capture group is the widget ID (ex. 'radio 1')
+ * Second capture group is the widget type (ex. "radio)
+ * exec return will look like: ['[[☃ radio 1]]', 'radio 1', 'radio']
+ */
+export declare function getWidgetRegex(): RegExp;
+/**
+ * Add a widget placeholder using the provided widget type and instance number.
+ * ex. addWidget(WidgetType.Radio, 1) => "[[☃ radio 1]]"
+ *
+ * @param {WidgetType} widgetType
+ * @param {number} instance
+ * @returns {string}
+ */
+export declare function addWidget(widgetType: WidgetType, instance: number): string;
+/**
+ * Extract all widget IDs, which includes the widget type and instance number.
+ * example output: ['radio 1', 'categorizer 1', 'categorizor 2']
+ *
+ * Content should contain Perseus widget placeholders,
+ * which look like: '[[☃ radio 1]]'.
+ *
+ * @param {string} content
+ * @returns {Array<WidgetId>} widgets
+ */
+export declare function getAllWidgetIds(content: string): Array<WidgetId>;
+/**
+ * Extract all widget types from a Perseus JSON content string.
+ * This does not include the instance number and prevents duplicates.
+ * example output: ['radio', 'categorizer']
+ *
+ * @param {string} content
+ * @returns {Array<WidgetId>}
+ */
+export declare function getAllWidgetTypes(content: string): Array<WidgetId>;
+/**
+ * Extract the widget IDs of all widgets considered question widgets. Widget IDs
+ * include widget type and instance number.
+ * example output: ['radio 1', 'categorizer 1']
+ *
+ * Content should contain Perseus widget placeholders,
+ * which look like: '[[☃ radio 1]]'.
+ *
+ * @param {string} content
+ * @returns Array<WidgetId>
+ */
+export declare function getQuestionWidgetIds(content: string): Array<WidgetId>;

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

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

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

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

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

@@ -0,0 +1,27 @@
+import type { vec } from "mafs";
+export type InteractiveGraphAction = MoveControlPoint | MoveLine | MoveAll;
+export declare const MOVE_CONTROL_POINT = "move-control-point";
+export interface MoveControlPoint {
+    type: typeof MOVE_CONTROL_POINT;
+    itemIndex?: number;
+    pointIndex: number;
+    destination: vec.Vector2;
+}
+export declare function moveControlPoint(pointIndex: number, destination: vec.Vector2, itemIndex?: number): MoveControlPoint;
+export declare const MOVE_ALL = "move-all";
+export declare const MOVE_LINE = "move-line";
+interface MoveItem {
+    delta: vec.Vector2;
+    itemIndex?: number;
+}
+export interface MoveLine extends MoveItem {
+    type: typeof MOVE_LINE;
+}
+export interface MoveAll extends MoveItem {
+    type: typeof MOVE_ALL;
+}
+/** This action assumes the state.coords holds an array of collinear tuples that define lines */
+export declare function moveLine(itemIndex: number, delta: vec.Vector2): MoveLine;
+/** This action assumes a flat array of vectors */
+export declare const moveAll: (delta: vec.Vector2) => MoveAll;
+export {};

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

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

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

@@ -1,5 +1,5 @@
-import type { InteractiveGraphState } from "./types";
-import type { PerseusGraphType } from "../../perseus-types";
+import type { PerseusGraphType } from "../../../perseus-types";
+import type { InteractiveGraphState } from "../types";
 import type { Interval, vec } from "mafs";
 export declare function initializeGraphState(params: {
     range: [Interval, Interval];

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

@@ -1,5 +1,5 @@
-import type { InteractiveGraphAction } from "./interactive-graph-action";
-import type { CollinearTuple, PerseusGraphTypeLinearSystem, PerseusGraphTypeRay, PerseusGraphTypeSegment, PerseusInteractiveGraphWidgetOptions } from "../../perseus-types";
+import type { InteractiveGraphAction } from "./reducer/interactive-graph-action";
+import type { CollinearTuple, PerseusGraphType, PerseusGraphTypeLinearSystem, PerseusGraphTypePolygon, PerseusGraphTypeRay, PerseusGraphTypeSegment, PerseusInteractiveGraphWidgetOptions } from "../../perseus-types";
 import type { WidgetProps } from "../../types";
 import type { Interval, vec } from "mafs";
 export type InteractiveGraphProps = WidgetProps<PerseusInteractiveGraphWidgetOptions, PerseusInteractiveGraphWidgetOptions>;
@@ -7,16 +7,22 @@ export type MafsGraphProps<T extends InteractiveGraphState> = {
     graphState: T;
     dispatch: (action: InteractiveGraphAction) => unknown;
 };
-export type InteractiveGraphState = SegmentGraphState | LinearGraphState | RayGraphState;
+export interface InitializeGraphStateParams<T extends PerseusGraphType> {
+    graph: T;
+    range: [Interval, Interval];
+    step: vec.Vector2;
+}
+export type InteractiveGraphState = SegmentGraphState | LinearGraphState | RayGraphState | PolygonGraphState;
 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"> & {
+export type SegmentGraphState = InteractiveGraphStateCommon & Omit<PerseusGraphTypeSegment, "numSegments">;
+export type LinearGraphState = InteractiveGraphStateCommon & Omit<PerseusGraphTypeLinearSystem, "type"> & {
     type: "linear" | "linear-system";
 };
-export type RayGraphState = InteractiveGraphStateCommon & Pick<PerseusGraphTypeRay, "type"> & {
+export type RayGraphState = InteractiveGraphStateCommon & Omit<PerseusGraphTypeRay, "coords"> & {
     coords: readonly CollinearTuple[];
 };
+export type PolygonGraphState = InteractiveGraphStateCommon & PerseusGraphTypePolygon;

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

@@ -1,4 +1,9 @@
 import type { Coord } from "../../interactive2/types";
 import type { PerseusInteractiveGraphWidgetOptions } from "../../perseus-types";
+/**
+ * 44 is touch best practice and AAA compliant for WCAG
+ * https://www.w3.org/WAI/WCAG21/Understanding/target-size.html
+ */
+export declare const TARGET_SIZE = 44;
 export declare const normalizePoints: <A extends readonly Coord[]>(range: PerseusInteractiveGraphWidgetOptions["range"], step: PerseusInteractiveGraphWidgetOptions["step"], coordsList: A, noSnap?: boolean) => A;
 export declare const normalizeCoords: <A extends readonly Coord[]>(coordsList: A, ranges: PerseusInteractiveGraphWidgetOptions["range"]) => A;

package/package.json

@@ -3,7 +3,7 @@
     "description": "Core Perseus API (includes renderers and widgets)",
     "author": "Khan Academy",
     "license": "MIT",
-    "version": "20.6.0",
+    "version": "20.7.0",
     "publishConfig": {
         "access": "public"
     },
@@ -25,7 +25,7 @@
         "test": "bash -c 'yarn --silent --cwd \"../..\" test ${@:0} $($([[ ${@: -1} = -* ]] || [[ ${@: -1} = bash ]]) && echo $PWD)'"
     },
     "dependencies": {
-        "@khanacademy/kas": "^0.3.8",
+        "@khanacademy/kas": "^0.3.9",
         "@khanacademy/kmath": "^0.1.12",
         "@khanacademy/math-input": "^17.3.0",
         "@khanacademy/perseus-core": "1.4.2",
@@ -62,8 +62,6 @@
         "aphrodite": "^1.2.5",
         "classnames": "^1.1.4",
         "create-react-class": "^15.6.3",
-        "eslint-import-resolver-alias": "^1.1.2",
-        "eslint-plugin-import": "^2.26.0",
         "intersection-observer": "^0.12.0",
         "jquery": "^2.1.1",
         "katex": "^0.11.1",

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

@@ -1,17 +0,0 @@
-import type { vec } from "mafs";
-export type InteractiveGraphAction = MoveControlPoint | MoveSegment;
-export declare const MOVE_CONTROL_POINT = "move-control-point";
-export interface MoveControlPoint {
-    type: typeof MOVE_CONTROL_POINT;
-    objectIndex: number;
-    pointIndex: number;
-    destination: vec.Vector2;
-}
-export declare function moveControlPoint(objectIndex: number, pointIndex: number, destination: vec.Vector2): MoveControlPoint;
-export declare const MOVE_LINE = "move-line";
-export interface MoveSegment {
-    type: typeof MOVE_LINE;
-    lineIndex: number;
-    delta: vec.Vector2;
-}
-export declare function moveSegment(lineIndex: number, delta: vec.Vector2): MoveSegment;

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

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