@khanacademy/perseus 65.6.0 → 65.7.0

package/dist/widgets/interactive-graphs/graphs/components/angle-indicators.d.ts

@@ -6,12 +6,11 @@ import type { Interval } from "mafs";
 interface PolygonAngleProps {
     centerPoint: vec.Vector2;
     endPoints: [vec.Vector2, vec.Vector2];
-    polygonLines: readonly CollinearTuple[];
-    range: [Interval, Interval];
+    areEndPointsClockwise: boolean;
     showAngles: boolean;
     snapTo: SnapTo;
 }
-export declare const PolygonAngle: ({ centerPoint, endPoints, range, polygonLines, showAngles, snapTo, }: PolygonAngleProps) => React.JSX.Element | null;
+export declare const PolygonAngle: ({ centerPoint, endPoints, showAngles, snapTo, areEndPointsClockwise, }: PolygonAngleProps) => React.JSX.Element | null;
 interface AngleProps {
     vertex: vec.Vector2;
     coords: [vec.Vector2, vec.Vector2];
@@ -30,4 +29,13 @@ export declare const Angle: ({ vertex, coords, showAngles, allowReflexAngles, ra
  * https://stackoverflow.com/questions/217578/how-can-i-determine-whether-a-2d-point-is-within-a-polygon
  */
 export declare const shouldDrawArcOutside: (midpoint: vec.Vector2, vertex: vec.Vector2, range: [Interval, Interval], polygonLines: readonly CollinearTuple[]) => boolean;
+/**
+ * Determines if an angle is an convex (false) or concave (true) angle.
+ * Uses the cross product to determine if the angle is outside the polygon.
+ * If the cross product is positive for a clockwise angle, the angle is concave.
+ * NOTE: This always has to take in clockwise endpoints. It cannot determine
+ * if the endpoints are clockwise itself - this has to be checked by the
+ * caller. This is because of edge cases involving concave polygons.
+ */
+export declare function shouldDrawArcOutsidePolygon(centerPoint: vec.Vector2, clockwiseEndpoints: [vec.Vector2, vec.Vector2]): boolean;
 export {};

package/dist/widgets/python-program/python-program.d.ts

@@ -1,5 +1,5 @@
 import * as React from "react";
-import type { FocusPath, Widget } from "../../types";
+import type { Widget } from "../../types";
 import type { UnsupportedWidgetPromptJSON } from "../../widget-ai-utils/unsupported-widget";
 type Props = {
     programID: string;
@@ -13,7 +13,6 @@ type DefaultProps = {
  */
 declare class PythonProgram extends React.Component<Props> implements Widget {
     static defaultProps: DefaultProps;
-    getDOMNodeForPath(path: FocusPath): null;
     getPromptJSON(): UnsupportedWidgetPromptJSON;
     render(): React.ReactNode;
 }

package/dist/widgets/radio/multiple-choice-component.new.d.ts

@@ -0,0 +1,48 @@
+import { type PerseusRadioWidgetOptions } from "@khanacademy/perseus-core";
+import * as React from "react";
+import type { APIOptions } from "../../types";
+/**
+ * Represents a single choice in the MultipleChoiceComponent
+ */
+export interface ChoiceType {
+    checked: boolean;
+    content: React.ReactNode;
+    rationale: React.ReactNode;
+    hasRationale: boolean;
+    showRationale: boolean;
+    showCorrectness: boolean;
+    correct: boolean;
+    isNoneOfTheAbove: boolean;
+    previouslyAnswered: boolean;
+    revealNoneOfTheAbove: boolean;
+    disabled: boolean;
+}
+/**
+ * Props for the MultipleChoiceComponent
+ */
+interface MultipleChoiceComponentProps {
+    apiOptions: APIOptions;
+    choices: ReadonlyArray<ChoiceType>;
+    countChoices: boolean | null | undefined;
+    editMode?: boolean;
+    isLastUsedWidget?: boolean;
+    labelWrap: boolean;
+    multipleSelect?: boolean;
+    numCorrect: number;
+    onChoiceChange: (choiceIndex: number, newCheckedState: boolean) => void;
+    reviewMode: boolean;
+    reviewModeRubric?: PerseusRadioWidgetOptions | null;
+}
+/**
+ * The MultipleChoiceComponent renders the UI for multiple choice questions.
+ *
+ * This component handles the presentation of choices, user interactions,
+ * and accessibility features, while the MultipleChoiceWidget manages the
+ * underlying logic and state.
+ *
+ * Supports both radio button (single select) and checkbox (multiple select) modes.
+ *
+ * Created as part of the Radio Revitalization Project (LEMS-2933).
+ */
+declare const MultipleChoiceComponent: ({ apiOptions, reviewModeRubric, reviewMode, editMode, multipleSelect, labelWrap, countChoices, numCorrect, isLastUsedWidget, choices, onChoiceChange, }: MultipleChoiceComponentProps) => React.ReactElement;
+export default MultipleChoiceComponent;

package/dist/widgets/radio/multiple-choice-widget.new.d.ts

@@ -0,0 +1,117 @@
+import * as React from "react";
+import type { ChoiceType } from "./multiple-choice-component.new";
+import type { PerseusStrings } from "../../strings";
+import type { WidgetProps, ChoiceState, Widget } from "../../types";
+import type { RadioPromptJSON } from "../../widget-ai-utils/radio/radio-ai-utils";
+import type { PerseusRadioChoice, PerseusRadioRubric, PerseusRadioUserInput } from "@khanacademy/perseus-core";
+export type RenderProps = {
+    numCorrect: number;
+    hasNoneOfTheAbove?: boolean;
+    multipleSelect?: boolean;
+    countChoices?: boolean;
+    deselectEnabled?: boolean;
+    choices: ReadonlyArray<RadioChoiceWithMetadata>;
+    selectedChoices: ReadonlyArray<PerseusRadioChoice["correct"]>;
+    choiceStates?: ReadonlyArray<ChoiceState>;
+    values?: ReadonlyArray<boolean>;
+    strings?: PerseusStrings;
+    editMode?: boolean;
+    labelWrap?: boolean;
+};
+/**
+ * RadioChoiceWithMetadata is used for server-side scoring
+ */
+export interface RadioChoiceWithMetadata extends PerseusRadioChoice {
+    originalIndex: number;
+    correct?: boolean;
+}
+type Props = WidgetProps<RenderProps, PerseusRadioUserInput, PerseusRadioRubric>;
+type DefaultProps = Required<Pick<Props, "choices" | "multipleSelect" | "countChoices" | "deselectEnabled" | "linterContext" | "showSolutions">>;
+/**
+ * MultipleChoiceWidget implements the Widget interface for multiple choice questions.
+ *
+ * It handles Perseus-specific logic and state management while delegating
+ * UI rendering to the MultipleChoiceComponent.
+ *
+ * This class is exported as "Radio" for backwards compatibility with existing content,
+ * though it supports both radio-button (single select) and checkbox (multiple select) modes.
+ * Eventually, when Content Backfills are set up, we will officially rename the Radio Widget to MultipleChoiceWidget.
+ *
+ * Created as part of the Radio Revitalization Project (LEMS-2933).
+ */
+declare class MultipleChoiceWidget extends React.Component<Props> implements Widget {
+    static defaultProps: DefaultProps;
+    /**
+     * DEPRECATED: Gets the current user input from this widget.
+     *
+     * Implements the required Widget interface method that Perseus uses
+     * to retrieve the user's current selections.
+     *
+     * @returns The user's selections as {choicesSelected: [boolean]}
+     *
+     * TODO: remove this when everything is pulling from Renderer state
+     * @deprecated get user input from Renderer state
+     */
+    getUserInput(): PerseusRadioUserInput;
+    /**
+     * Gets the JSON representation of the User Input for AI assistance.
+     *
+     * This method is used to provide structured data about the widget's state
+     * to AI systems that can help users with answering questions.
+     *
+     * @returns A structured JSON object representing the widget's prompt
+     */
+    getPromptJSON(): RadioPromptJSON;
+    /**
+     * Renders content that may contain nested widgets (currently only passage-refs).
+     * Parses the content, extracts any widgets, and returns a Renderer component
+     * configured with the appropriate context.
+     *
+     * @param content - The content to render (defaults to empty string)
+     * @returns A React element with the rendered content
+     */
+    renderContent: (content?: string) => React.ReactNode;
+    /**
+     * Handles a user's selection of a choice.
+     *
+     * Updates choice states based on the selection, handles single/multiple
+     * selection logic, and notifies Perseus of the interaction.
+     *
+     * @param choiceIndex - The index of the choice that changed
+     * @param newCheckedState - Whether the choice is now selected
+     */
+    handleChoiceChange: (choiceIndex: number, newCheckedState: boolean) => void;
+    /**
+     * Transforms choice states into component-ready props for the MultipleChoiceComponent.
+     *
+     * This method:
+     * 1. Processes each choice's content
+     * 2. Maps state properties (selected, rationaleShown, etc.) to component props
+     * 3. Renders content and rationales with nested widget support
+     * 4. Determines correctness display based on choice data or review rubric
+     *
+     * @param choiceStates - The current state of each choice
+     * @returns An array of formatted choice props ready for the MultipleChoiceComponent
+     */
+    buildChoiceProps: (choiceStates: ReadonlyArray<ChoiceState>) => ReadonlyArray<ChoiceType>;
+    /**
+     * Prepares the choice props for rendering in the MultipleChoiceComponent.
+     *
+     * This method:
+     * 1. Uses getChoiceStates() to determine the appropriate state for each choice
+     *    based on widget mode (review/static) and user selections
+     * 2. Transforms these states into component props via buildChoiceProps(),
+     *    including rendered content, correctness indicators, and rationales
+     *
+     * @returns An array of choice props ready for the component
+     */
+    prepareChoicesProps: () => readonly ChoiceType[];
+    /**
+     * Renders the MultipleChoiceComponent with the current props.
+     *
+     * @returns The rendered React component
+     */
+    render(): React.ReactNode;
+}
+declare const Radio: typeof MultipleChoiceWidget;
+export default Radio;

package/dist/widgets/radio/utils/general-utils.d.ts

@@ -1,6 +1,6 @@
-import { type ShowSolutions } from "@khanacademy/perseus-core";
 import type { ChoiceState } from "../../../types";
-import type { RadioChoiceWithMetadata } from "../radio.new";
+import type { RadioChoiceWithMetadata } from "../multiple-choice-widget.new";
+import type { ShowSolutions } from "@khanacademy/perseus-core";
 interface GetChoiceStatesProps {
     choices: ReadonlyArray<RadioChoiceWithMetadata>;
     isStatic?: boolean | null;

package/package.json

@@ -3,7 +3,7 @@
   "description": "Core Perseus API (includes renderers and widgets)",
   "author": "Khan Academy",
   "license": "MIT",
-  "version": "65.6.0",
+  "version": "65.7.0",
   "publishConfig": {
     "access": "public"
   },
@@ -42,12 +42,12 @@
     "tiny-invariant": "1.3.1",
     "uuid": "^10.0.0",
     "@khanacademy/kas": "2.0.9",
-    "@khanacademy/keypad-context": "3.0.25",
-    "@khanacademy/kmath": "2.0.25",
-    "@khanacademy/math-input": "26.0.14",
-    "@khanacademy/perseus-core": "18.0.0",
-    "@khanacademy/perseus-linter": "4.0.12",
-    "@khanacademy/perseus-score": "7.1.12",
+    "@khanacademy/keypad-context": "3.0.26",
+    "@khanacademy/kmath": "2.0.26",
+    "@khanacademy/math-input": "26.0.15",
+    "@khanacademy/perseus-core": "18.1.0",
+    "@khanacademy/perseus-linter": "4.0.13",
+    "@khanacademy/perseus-score": "7.1.13",
     "@khanacademy/perseus-utils": "2.0.5",
     "@khanacademy/pure-markdown": "2.0.10",
     "@khanacademy/simple-markdown": "2.0.10"

package/dist/widgets/radio/base-radio.new.d.ts

@@ -1,45 +0,0 @@
-import { type PerseusRadioWidgetOptions } from "@khanacademy/perseus-core";
-import * as React from "react";
-import type { APIOptions } from "../../types";
-export interface ChoiceType {
-    checked: boolean;
-    content: React.ReactNode;
-    rationale: React.ReactNode;
-    hasRationale: boolean;
-    showRationale: boolean;
-    showCorrectness: boolean;
-    correct: boolean;
-    isNoneOfTheAbove: boolean;
-    highlighted: boolean;
-    previouslyAnswered: boolean;
-    revealNoneOfTheAbove: boolean;
-    disabled: boolean;
-}
-interface BaseRadioProps {
-    apiOptions: APIOptions;
-    choices: ReadonlyArray<ChoiceType>;
-    deselectEnabled?: boolean;
-    editMode?: boolean;
-    labelWrap: boolean;
-    countChoices: boolean | null | undefined;
-    numCorrect: number;
-    multipleSelect?: boolean;
-    reviewModeRubric?: PerseusRadioWidgetOptions | null;
-    reviewMode: boolean;
-    onChange: (newValues: {
-        checked: ReadonlyArray<boolean>;
-    }) => void;
-    isLastUsedWidget?: boolean;
-}
-/**
- * The BaseRadio component is the core component for the radio widget.
- * It is responsible for rendering the radio choices and handling user interactions.
- *
- * This component is a duplicate of the BaseRadio component in base-radio.tsx for the
- * Radio Revitalization Project. (LEMS-2933) This component will eventually replace
- * base-radio.tsx when the feature flag is no longer needed.
- *
- * TODO(LEMS-2994): Clean up this file.
- */
-declare const BaseRadio: ({ apiOptions, reviewModeRubric, reviewMode, choices, editMode, multipleSelect, labelWrap, countChoices, numCorrect, isLastUsedWidget, onChange, }: BaseRadioProps) => React.ReactElement;
-export default BaseRadio;

package/dist/widgets/radio/radio.class.new.d.ts

@@ -1,40 +0,0 @@
-import * as React from "react";
-import type { WidgetProps, ChoiceState, Widget } from "../../types";
-import type { RadioPromptJSON } from "../../widget-ai-utils/radio/radio-ai-utils";
-import type { PerseusRadioChoice, PerseusRadioRubric, PerseusRadioUserInput } from "@khanacademy/perseus-core";
-export type RenderProps = {
-    numCorrect: number;
-    hasNoneOfTheAbove?: boolean;
-    multipleSelect?: boolean;
-    countChoices?: boolean;
-    deselectEnabled?: boolean;
-    choices: ReadonlyArray<RadioChoiceWithMetadata>;
-    selectedChoices: ReadonlyArray<PerseusRadioChoice["correct"]>;
-    choiceStates?: ReadonlyArray<ChoiceState>;
-    values?: ReadonlyArray<boolean>;
-};
-type Props = WidgetProps<RenderProps, PerseusRadioUserInput, PerseusRadioRubric>;
-type DefaultProps = Required<Pick<Props, "choices" | "multipleSelect" | "countChoices" | "deselectEnabled" | "linterContext" | "showSolutions">>;
-export interface RadioChoiceWithMetadata extends PerseusRadioChoice {
-    originalIndex: number;
-    correct?: boolean;
-}
-/**
- * This component is holds the class methods for the radio widget, that were split
- * out of radio-component.new.tsx for the Radio Revitalization Project. (LEMS-2933)
- * This component will be the main entry point for the radio widget when the feature
- * flag is no longer needed.
- *
- * TODO(LEMS-2994): Clean up this file.
- */
-declare class Radio extends React.Component<Props> implements Widget {
-    static defaultProps: DefaultProps;
-    /**
-     * TODO: remove this when everything is pulling from Renderer state
-     * @deprecated get user input from Renderer state
-     */
-    getUserInput(): PerseusRadioUserInput;
-    getPromptJSON(): RadioPromptJSON;
-    render(): React.ReactNode;
-}
-export default Radio;

package/dist/widgets/radio/radio.new.d.ts

@@ -1,30 +0,0 @@
-import * as React from "react";
-import type { WidgetProps, ChoiceState } from "../../types";
-import type { PerseusRadioChoice, ShowSolutions, PerseusRadioRubric, PerseusRadioUserInput } from "@khanacademy/perseus-core";
-export interface RadioChoiceWithMetadata extends PerseusRadioChoice {
-    originalIndex: number;
-    correct?: boolean;
-}
-export interface RenderProps {
-    numCorrect: number;
-    hasNoneOfTheAbove?: boolean;
-    multipleSelect?: boolean;
-    countChoices?: boolean;
-    deselectEnabled?: boolean;
-    choices: ReadonlyArray<RadioChoiceWithMetadata>;
-    selectedChoices: ReadonlyArray<PerseusRadioChoice["correct"]>;
-    showSolutions?: ShowSolutions;
-    choiceStates?: ReadonlyArray<ChoiceState>;
-    values?: ReadonlyArray<boolean>;
-}
-type RadioComponentProps = WidgetProps<RenderProps, PerseusRadioUserInput, PerseusRadioRubric>;
-/**
- * This component is a duplicate of the Radio component in radio.tsx
- * for the Radio Revitalization Project. (LEMS-2933)
- * This component has been split up to move the rendering logic to a new functional component.
- * The class methods are now in radio.class.new.tsx.
- *
- * TODO(LEMS-2994): Clean up this file.
- */
-declare const RadioComponent: ({ choices, multipleSelect, countChoices, deselectEnabled, linterContext, showSolutions, static: isStatic, reviewModeRubric, reviewMode, apiOptions, isLastUsedWidget, questionCompleted, findWidgets, onChange, trackInteraction, numCorrect, choiceStates, values, }: RadioComponentProps) => React.ReactElement;
-export default RadioComponent;