@khanacademy/perseus-editor 30.2.1 → 30.4.1

package/dist/preview/message-types.d.ts

@@ -5,6 +5,26 @@
 import type { APIOptions, DeviceType } from "@khanacademy/perseus";
 import type { Hint, PerseusArticle, PerseusItem } from "@khanacademy/perseus-core";
 import type { LinterContextProps } from "@khanacademy/perseus-linter";
+/**
+ * Constant identifier for all Perseus preview messages
+ */
+export declare const PREVIEW_MESSAGE_SOURCE: "perseus-preview";
+/**
+ * Base type for all preview messages
+ */
+interface PreviewMessageBase {
+    source: typeof PREVIEW_MESSAGE_SOURCE;
+}
+/**
+ * Base type for messages with iframe ID
+ *
+ * Note: The ID is primarily used for debugging/logging purposes.
+ * Message routing is handled by event.source filtering in the hooks,
+ * not by comparing ID strings.
+ */
+interface PreviewMessageWithId extends PreviewMessageBase {
+    id: string;
+}
 /**
  * Data for question preview (full item with question, answer area, and hints)
  */
@@ -52,3 +72,39 @@ export type PreviewContent = {
     type: "article-all";
     data: ArticlePreviewData[];
 };
+/**
+ * Message from parent sending content data to iframe
+ */
+type PreviewDataMessage = PreviewMessageWithId & {
+    type: "content-data";
+    content: PreviewContent;
+};
+/**
+ * Union of all messages sent from parent to iframe
+ */
+export type ParentToIframeMessage = PreviewDataMessage;
+/**
+ * Message from iframe requesting data from parent
+ */
+type PreviewDataRequestMessage = PreviewMessageWithId & {
+    type: "request-data";
+};
+/**
+ * Message from iframe reporting its content height
+ */
+type PreviewHeightUpdateMessage = PreviewMessageWithId & {
+    type: "height-update";
+    height: number;
+};
+/**
+ * Message from iframe reporting lint warnings
+ */
+type PreviewLintReportMessage = PreviewMessageWithId & {
+    type: "lint-report";
+    lintWarnings: ReadonlyArray<any>;
+};
+/**
+ * Union of all messages sent from iframe to parent
+ */
+export type IframeToParentMessage = PreviewDataRequestMessage | PreviewHeightUpdateMessage | PreviewLintReportMessage;
+export {};

package/dist/preview/message-validators.d.ts

@@ -0,0 +1,21 @@
+import type { IframeToParentMessage, ParentToIframeMessage } from "./message-types";
+/**
+ * Type guard to check if an object is an {@link IframeToParentMessage} type.
+ *
+ * This validates that the message has the correct structure and source
+ * identifier to be from a Perseus preview iframe.
+ *
+ * @param message - Unknown message to validate
+ * @returns True if message is a valid {@link IframeToParentMessage}
+ */
+export declare function isIframeToParentMessage(message: unknown): message is IframeToParentMessage;
+/**
+ * Type guard to check if a message is from the Perseus preview system parent.
+ *
+ * This validates that the message has the correct structure and source
+ * identifier to be from a Perseus preview host.
+ *
+ * @param message - Unknown message to validate
+ * @returns True if message is a valid {@link ParentToIframeMessage}
+ */
+export declare function isParentToIframeMessage(message: unknown): message is ParentToIframeMessage;

package/dist/preview/preview-data-sanitizer.d.ts

@@ -0,0 +1,13 @@
+import type { PreviewContent } from "./message-types";
+/**
+ * Sanitizes preview content by removing non-serializable functions and React
+ * components from apiOptions before sending via postMessage.
+ *
+ * NOTE: The article-all case currently sanitizes apiOptions on each section
+ * individually because the current type is ArticlePreviewData[] (each section
+ * carries its own apiOptions). This will be simplified to a single apiOptions
+ * when we restructure the preview data types.
+ */
+export declare function sanitizePreviewData(
+/** Preview content to sanitize */
+content: PreviewContent): PreviewContent;

package/dist/preview/sanitize-api-options.d.ts

@@ -0,0 +1,11 @@
+import type { APIOptions } from "@khanacademy/perseus";
+/**
+ * Removes non-serializable functions and React components from APIOptions
+ * before sending via postMessage.
+ *
+ * All function callbacks and React components are removed as they cannot be
+ * cloned by the structured clone algorithm used by postMessage.
+ *
+ * Serializable options (booleans, strings, numbers) are preserved.
+ */
+export declare function sanitizeApiOptions(apiOptions: APIOptions): Partial<APIOptions> | null;

package/dist/widgets/interactive-graph-editor/components/vector-answer-options.d.ts

@@ -0,0 +1,9 @@
+import * as React from "react";
+import type { Props as EditorProps } from "../interactive-graph-editor";
+import type { PerseusGraphTypeVector } from "@khanacademy/perseus-core";
+interface Props {
+    correct: PerseusGraphTypeVector;
+    onChange: (props: Partial<EditorProps>) => void;
+}
+export default function VectorAnswerOptions({ correct, onChange }: Props): React.JSX.Element;
+export {};

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

@@ -5009,6 +5009,90 @@ declare const InteractiveGraph: {
         linterContext: import("@khanacademy/perseus-linter").LinterContextProps;
         containerSizeClass: import("../../../../perseus/src/util/sizing-utils").SizeClass;
     }): string;
+    getVectorEquationString(props: {
+        step: [number, number];
+        gridStep?: [x: number, y: number];
+        snapStep?: [x: number, y: number];
+        backgroundImage?: PerseusImageBackground;
+        markings: MarkingsType;
+        labels: string[];
+        labelLocation: AxisLabelLocation;
+        showProtractor: boolean;
+        showRuler?: boolean;
+        showTooltips?: boolean;
+        rulerLabel?: string;
+        rulerTicks?: number;
+        range: import("@khanacademy/perseus-core").GraphRange;
+        showAxisArrows: ShowAxisArrows;
+        graph: PerseusGraphType;
+        correct?: PerseusGraphType;
+        lockedFigures: LockedFigure[];
+        fullGraphAriaLabel?: string;
+        fullGraphAriaDescription?: string;
+    } & {
+        trackInteraction: (extraData?: Empty | undefined) => void;
+        widgetId: string;
+        widgetIndex: number;
+        alignment: string | null | undefined;
+        static: boolean | null | undefined;
+        problemNum: number | null | undefined;
+        apiOptions: Readonly<Readonly<{
+            isArticle?: boolean;
+            onFocusChange?: (newFocusPath: import("@khanacademy/perseus").FocusPath, oldFocusPath: import("@khanacademy/perseus").FocusPath, keypadHeight?: number, focusedElement?: HTMLElement) => unknown;
+            showAlignmentOptions?: boolean;
+            readOnly?: boolean;
+            editingDisabled?: boolean;
+            answerableCallback?: (arg1: boolean) => unknown;
+            getAnotherHint?: () => unknown;
+            interactionCallback?: (widgetData: {
+                [widgetId: string]: any;
+            }) => void;
+            imagePlaceholder?: React.ReactNode;
+            widgetPlaceholder?: React.ReactNode;
+            baseElements?: {
+                Link: React.ComponentType<any>;
+            };
+            imagePreloader?: (dimensions: import("../../../../perseus/src/types").Dimensions) => React.ReactNode;
+            trackInteraction?: (args: {
+                type: string;
+                id: string;
+                correct?: boolean;
+            } & Partial<import("../../../../perseus/src/types").TrackingGradedGroupExtraArguments> & Partial<{
+                visible: number;
+            }>) => void;
+            customKeypad?: boolean;
+            nativeKeypadProxy?: (blur: () => void) => import("@khanacademy/math-input").KeypadAPI;
+            isMobile?: boolean;
+            isMobileApp?: boolean;
+            setDrawingAreaAvailable?: (arg1: boolean) => unknown;
+            hintProgressColor?: string;
+            canScrollPage?: boolean;
+            editorChangeDelay?: number;
+            flags?: Record<"new-radio-widget" | "image-widget-upgrade-gif-controls" | "image-widget-upgrade-scale" | "interactive-graph-absolute-value" | "interactive-graph-tangent" | "interactive-graph-logarithm" | "interactive-graph-exponent" | "interactive-graph-vector", boolean>;
+        }> & {
+            baseElements: NonNullable<import("@khanacademy/perseus").APIOptions["baseElements"]>;
+            canScrollPage: NonNullable<import("@khanacademy/perseus").APIOptions["canScrollPage"]>;
+            editorChangeDelay: NonNullable<import("@khanacademy/perseus").APIOptions["editorChangeDelay"]>;
+            isArticle: NonNullable<import("@khanacademy/perseus").APIOptions["isArticle"]>;
+            isMobile: NonNullable<import("@khanacademy/perseus").APIOptions["isMobile"]>;
+            isMobileApp: NonNullable<import("@khanacademy/perseus").APIOptions["isMobileApp"]>;
+            editingDisabled: NonNullable<import("@khanacademy/perseus").APIOptions["editingDisabled"]>;
+            onFocusChange: NonNullable<import("@khanacademy/perseus").APIOptions["onFocusChange"]>;
+            readOnly: NonNullable<import("@khanacademy/perseus").APIOptions["readOnly"]>;
+            setDrawingAreaAvailable: NonNullable<import("@khanacademy/perseus").APIOptions["setDrawingAreaAvailable"]>;
+            showAlignmentOptions: NonNullable<import("@khanacademy/perseus").APIOptions["showAlignmentOptions"]>;
+        }>;
+        keypadElement?: any;
+        onFocus: (blurPath: import("@khanacademy/perseus").FocusPath) => void;
+        onBlur: (blurPath: import("@khanacademy/perseus").FocusPath) => void;
+        findWidgets: import("../../../../perseus/src/types").FindWidgetsFunction;
+        reviewMode: boolean;
+        showSolutions?: import("@khanacademy/perseus-core").ShowSolutions;
+        handleUserInput: (newUserInput: PerseusGraphType, cb?: () => void, silent?: boolean) => void;
+        userInput: PerseusGraphType;
+        linterContext: import("@khanacademy/perseus-linter").LinterContextProps;
+        containerSizeClass: import("../../../../perseus/src/util/sizing-utils").SizeClass;
+    }): string;
     contextType?: React.Context<any> | undefined;
 };
 type InteractiveGraphProps = PropsFor<typeof InteractiveGraph>;

package/dist/widgets/interactive-graph-editor/locked-figures/util.d.ts

@@ -14,8 +14,3 @@ export declare function generateSpokenMathDetails(mathString: string): Promise<s
  * spoken math using the SpeechRuleEngine.
  */
 export declare function joinLabelsAsSpokenMath(labels: LockedLabelType[]): Promise<string>;
-/**
- * Non-async mocked version of joinLabelsAsSpokenMath for tests.
- */
-export declare function mockedJoinLabelsAsSpokenMathForTests(labels: LockedLabelType[]): Promise<string>;
-export declare function mockedGenerateSpokenMathDetailsForTests(mathString: string): Promise<string>;

package/dist/widgets/interactive-graph-editor/start-coords/start-coords-absolute-value.d.ts

@@ -0,0 +1,9 @@
+import * as React from "react";
+import type { Coord } from "@khanacademy/perseus";
+type AbsoluteValueCoords = [Coord, Coord];
+type Props = {
+    startCoords: AbsoluteValueCoords;
+    onChange: (startCoords: AbsoluteValueCoords) => void;
+};
+declare const StartCoordsAbsoluteValue: (props: Props) => React.JSX.Element;
+export default StartCoordsAbsoluteValue;

package/dist/widgets/interactive-graph-editor/start-coords/types.d.ts

@@ -27,6 +27,8 @@ type GraphTypesThatHaveStartCoords = {
     type: "logarithm";
 } | {
     type: "tangent";
+} | {
+    type: "vector";
 };
 export type StartCoords = Extract<PerseusGraphType, GraphTypesThatHaveStartCoords>["startCoords"];
 export {};

package/package.json

@@ -3,7 +3,7 @@
   "description": "Perseus editors",
   "author": "Khan Academy",
   "license": "MIT",
-  "version": "30.2.1",
+  "version": "30.4.1",
   "publishConfig": {
     "access": "public"
   },
@@ -35,36 +35,36 @@
     "katex": "0.11.1",
     "mafs": "^0.19.0",
     "tiny-invariant": "1.3.1",
-    "@khanacademy/kas": "2.2.1",
-    "@khanacademy/keypad-context": "3.2.42",
-    "@khanacademy/kmath": "2.4.0",
-    "@khanacademy/math-input": "26.4.13",
-    "@khanacademy/perseus": "77.2.1",
-    "@khanacademy/perseus-score": "8.6.0",
-    "@khanacademy/perseus-core": "24.1.0",
-    "@khanacademy/perseus-linter": "4.9.3",
+    "@khanacademy/kas": "2.2.2",
+    "@khanacademy/keypad-context": "3.2.44",
+    "@khanacademy/kmath": "2.4.2",
+    "@khanacademy/math-input": "26.4.16",
+    "@khanacademy/perseus": "77.3.1",
+    "@khanacademy/perseus-core": "25.0.0",
+    "@khanacademy/perseus-linter": "4.9.5",
+    "@khanacademy/perseus-score": "8.7.0",
     "@khanacademy/perseus-utils": "2.1.5"
   },
   "devDependencies": {
     "@khanacademy/mathjax-renderer": "3.0.0",
-    "@khanacademy/wonder-blocks-accordion": "3.1.53",
-    "@khanacademy/wonder-blocks-banner": "5.0.18",
-    "@khanacademy/wonder-blocks-button": "11.4.2",
-    "@khanacademy/wonder-blocks-clickable": "8.1.5",
+    "@khanacademy/wonder-blocks-accordion": "3.1.54",
+    "@khanacademy/wonder-blocks-banner": "5.0.20",
+    "@khanacademy/wonder-blocks-button": "11.5.1",
+    "@khanacademy/wonder-blocks-clickable": "8.1.6",
     "@khanacademy/wonder-blocks-core": "12.4.3",
-    "@khanacademy/wonder-blocks-dropdown": "10.8.3",
-    "@khanacademy/wonder-blocks-form": "7.5.6",
-    "@khanacademy/wonder-blocks-icon": "5.3.9",
-    "@khanacademy/wonder-blocks-icon-button": "11.1.6",
-    "@khanacademy/wonder-blocks-labeled-field": "4.0.16",
-    "@khanacademy/wonder-blocks-layout": "3.1.46",
-    "@khanacademy/wonder-blocks-link": "10.1.7",
-    "@khanacademy/wonder-blocks-pill": "3.1.57",
-    "@khanacademy/wonder-blocks-switch": "3.3.30",
+    "@khanacademy/wonder-blocks-dropdown": "10.8.5",
+    "@khanacademy/wonder-blocks-form": "7.5.7",
+    "@khanacademy/wonder-blocks-icon": "5.3.10",
+    "@khanacademy/wonder-blocks-icon-button": "11.2.1",
+    "@khanacademy/wonder-blocks-labeled-field": "4.0.17",
+    "@khanacademy/wonder-blocks-layout": "3.1.47",
+    "@khanacademy/wonder-blocks-link": "10.1.8",
+    "@khanacademy/wonder-blocks-pill": "3.1.58",
+    "@khanacademy/wonder-blocks-switch": "3.3.31",
     "@khanacademy/wonder-blocks-timing": "7.0.4",
-    "@khanacademy/wonder-blocks-tokens": "16.1.0",
-    "@khanacademy/wonder-blocks-tooltip": "4.1.69",
-    "@khanacademy/wonder-blocks-typography": "4.2.31",
+    "@khanacademy/wonder-blocks-tokens": "16.2.0",
+    "@khanacademy/wonder-blocks-tooltip": "4.1.71",
+    "@khanacademy/wonder-blocks-typography": "4.3.0",
     "@khanacademy/wonder-stuff-core": "3.0.0",
     "@phosphor-icons/core": "2.0.2",
     "aphrodite": "1.2.5",
@@ -74,29 +74,29 @@
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "underscore": "1.4.4",
-    "perseus-build-settings": "0.9.0",
-    "jsdiff": "1.0.2"
+    "jsdiff": "1.0.2",
+    "perseus-build-settings": "0.9.0"
   },
   "peerDependencies": {
     "@khanacademy/mathjax-renderer": "^3.0.0",
-    "@khanacademy/wonder-blocks-accordion": "^3.1.53",
-    "@khanacademy/wonder-blocks-banner": "^5.0.18",
-    "@khanacademy/wonder-blocks-button": "^11.4.2",
-    "@khanacademy/wonder-blocks-clickable": "^8.1.5",
+    "@khanacademy/wonder-blocks-accordion": "^3.1.54",
+    "@khanacademy/wonder-blocks-banner": "^5.0.20",
+    "@khanacademy/wonder-blocks-button": "^11.5.1",
+    "@khanacademy/wonder-blocks-clickable": "^8.1.6",
     "@khanacademy/wonder-blocks-core": "^12.4.3",
-    "@khanacademy/wonder-blocks-dropdown": "^10.8.3",
-    "@khanacademy/wonder-blocks-form": "^7.5.6",
-    "@khanacademy/wonder-blocks-icon": "^5.3.9",
-    "@khanacademy/wonder-blocks-icon-button": "^11.1.6",
-    "@khanacademy/wonder-blocks-labeled-field": "^4.0.16",
-    "@khanacademy/wonder-blocks-layout": "^3.1.46",
-    "@khanacademy/wonder-blocks-link": "^10.1.7",
-    "@khanacademy/wonder-blocks-pill": "^3.1.57",
-    "@khanacademy/wonder-blocks-switch": "^3.3.30",
+    "@khanacademy/wonder-blocks-dropdown": "^10.8.5",
+    "@khanacademy/wonder-blocks-form": "^7.5.7",
+    "@khanacademy/wonder-blocks-icon": "^5.3.10",
+    "@khanacademy/wonder-blocks-icon-button": "^11.2.1",
+    "@khanacademy/wonder-blocks-labeled-field": "^4.0.17",
+    "@khanacademy/wonder-blocks-layout": "^3.1.47",
+    "@khanacademy/wonder-blocks-link": "^10.1.8",
+    "@khanacademy/wonder-blocks-pill": "^3.1.58",
+    "@khanacademy/wonder-blocks-switch": "^3.3.31",
     "@khanacademy/wonder-blocks-timing": "^7.0.4",
-    "@khanacademy/wonder-blocks-tokens": "^16.1.0",
-    "@khanacademy/wonder-blocks-tooltip": "^4.1.69",
-    "@khanacademy/wonder-blocks-typography": "^4.2.31",
+    "@khanacademy/wonder-blocks-tokens": "^16.2.0",
+    "@khanacademy/wonder-blocks-tooltip": "^4.1.71",
+    "@khanacademy/wonder-blocks-typography": "^4.3.0",
     "@khanacademy/wonder-stuff-core": "^3.0.0",
     "@phosphor-icons/core": "^2.0.2",
     "aphrodite": "^1.2.5",
@@ -109,7 +109,7 @@
   },
   "keywords": [],
   "khan": {
-    "catalogHash": "338e5b89e11de2aa"
+    "catalogHash": "522e5ac78ae83dd8"
   },
   "scripts": {}
 }