[Interactive Graph] Add logarithm graph option in the Interactive Graph Editor by ivyolamit · Pull Request #3425 · Khan/perseus

ivyolamit · 2026-03-27T19:25:58Z

Summary:

PR series to add logarithm graph support to the Interactive Graph widget:

Add logarithm graph option in the Interactive Graph Editor

Add StartCoordsLogarithm component for configuring logarithm start coordinates in the editor
Gate the "Logarithm function" option behind the interactive-graph-logarithm feature flag
Export getLogarithmCoords for use by the editor
Add start asymptote validation

Details

This PR enables content creators to configure logarithm exercises in the Interactive Graph editor, following the exponential editor pattern.

StartCoordsLogarithm component:

Two coordinate pair inputs (Point 1 and Point 2)
A single number input for the asymptote x-position (labeled "Asymptote x =")
Equation display showing y = a * ln(b*x + c) with computed coefficient values
CSS module styling (not Aphrodite), following start-coords-exponential.module.css

Feature flag: "Logarithm function" appears in the graph type selector only when interactive-graph-logarithm is enabled, preventing content creators from selecting it until it's ready for launch.

Editor validation: The start asymptote x-value is validated — it cannot fall between or on the x-coordinates of the curve's start points (mirrors exponential's y-axis validation but for x-axis).

Exports: getLogarithmCoords() is now exported from initialize-graph-state.ts and re-exported from @khanacademy/perseus for use by the editor's start-coords UI.

Co-Authored by Claude Code (Opus)

Issue: LEMS-3969

Test plan:

pnpm tsc passes
pnpm knip passes
pnpm lint passes
pnpm prettier . --check passes
Editor tests pass (422 total across 15 suites)
Verify in Storybook: "Logarithm function" appears in graph type selector when feature flag is on
Verify start coords UI renders correctly with asymptote input and equation display

github-actions · 2026-03-27T19:26:49Z

🗄️ Schema Change: No Changes ✅

github-actions · 2026-03-27T19:27:14Z

🛠️ Item Splitting: No Changes ✅

github-actions · 2026-03-27T19:27:15Z

Size Change: +540 B (+0.11%)

Total Size: 497 kB

Filename	Size	Change
`packages/perseus-editor/dist/es/index.js`	102 kB	+532 B (+0.52%)
`packages/perseus/dist/es/index.js`	194 kB	+8 B (0%)

ℹ️ View Unchanged

Filename	Size
`packages/kas/dist/es/index.js`	20.5 kB
`packages/keypad-context/dist/es/index.js`	1 kB
`packages/kmath/dist/es/index.js`	6.35 kB
`packages/math-input/dist/es/index.js`	98.5 kB
`packages/math-input/dist/es/strings.js`	1.61 kB
`packages/perseus-core/dist/es/index.item-splitting.js`	12 kB
`packages/perseus-core/dist/es/index.js`	25.2 kB
`packages/perseus-linter/dist/es/index.js`	9.3 kB
`packages/perseus-score/dist/es/index.js`	9.7 kB
`packages/perseus-utils/dist/es/index.js`	403 B
`packages/perseus/dist/es/strings.js`	8.27 kB
`packages/pure-markdown/dist/es/index.js`	1.39 kB
`packages/simple-markdown/dist/es/index.js`	6.71 kB

_{compressed-size-action}

github-actions · 2026-03-27T19:27:59Z

npm Snapshot: Published

Good news!! We've packaged up the latest commit from this PR (53155ac) and published it to npm. You
can install it using the tag PR3425.

Example:

pnpm add @khanacademy/perseus@PR3425

If you are working in Khan Academy's frontend, you can run the below command.

./dev/tools/bump_perseus_version.ts -t PR3425

If you are working in Khan Academy's webapp, you can run the below command.

./dev/tools/bump_perseus_version.js -t PR3425

claude

Claude Code Review

This repository is configured for manual code reviews. Comment @claude review to trigger a review and subscribe this PR to future pushes, or @claude review once for a one-time review.

_{Tip: disable this comment in your organization's Code Review settings.}

ivyolamit · 2026-03-27T19:42:43Z

@claude review once

.../perseus-editor/src/widgets/interactive-graph-editor/start-coords/start-coords-logarithm.tsx

…: Add logarithm graph option in the Interactive Graph Editor

…aph] Add logarithm graph option in the Interactive Graph Editor

…ew comment

SonicScrewdriver

A couple of small suggestions, mostly about the project at large, but nothing blocking imo.

However, I'm not able to test the editor for this PR's chromatic storybook snapshot. I could have sworn I got Exponential working, but I don't see that available either. It'd be great to be able to test the full widget editors in storybook for additional confidence. Given that we're doing a couple rounds of play testing, I'm still alright to approve anyway.

SonicScrewdriver · 2026-03-30T20:28:34Z

...s-editor/src/widgets/interactive-graph-editor/start-coords/start-coords-logarithm.module.css

@@ -0,0 +1,36 @@
+/* We have to use !important until wonder blocks is in the shared layer. */


I honestly wonder how many of these !importants are necessary. I would love it if we made a task to clean up as many of these as possible as part of our project (aka before LEMS-3686, which might be a while).

SonicScrewdriver · 2026-03-30T20:33:11Z

.../perseus-editor/src/widgets/interactive-graph-editor/start-coords/start-coords-logarithm.tsx

+    const {coords, asymptote} = startCoords;
+
+    // Local state for the asymptote x-value text field so the user can type
+    // freely without the field resetting mid-keystroke. Pattern from StartCoordsCircle.


The AI really likes to say where it stole things from, but I'm not sure "Pattern from StartCoordsCircle." is particularly helpful

ivyolamit self-assigned this Mar 27, 2026

ivyolamit added the olc-5.0.c4fcb label Mar 27, 2026

ivyolamit marked this pull request as ready for review March 27, 2026 19:42

claude bot reviewed Mar 27, 2026

View reviewed changes

.../perseus-editor/src/widgets/interactive-graph-editor/start-coords/start-coords-logarithm.tsx Outdated Show resolved Hide resolved

ivyolamit requested review from SonicScrewdriver March 27, 2026 22:40

ivyolamit force-pushed the LEMS-3953/pr5-logarithm-scoring branch from 7c67738 to 8976066 Compare March 27, 2026 23:07

ivyolamit force-pushed the LEMS-3953/pr6-logarithm-in-interactive-graph-editor branch from fd16188 to ada2fad Compare March 27, 2026 23:08

ivyolamit force-pushed the LEMS-3953/pr5-logarithm-scoring branch from 8976066 to 680fbf2 Compare March 28, 2026 00:42

ivyolamit added 3 commits March 27, 2026 17:43

[LEMS-3953/pr6-logarithm-in-interactive-graph-editor] docs(changeset)…

d7eb0de

…: Add logarithm graph option in the Interactive Graph Editor

[LEMS-3953/pr6-logarithm-in-interactive-graph-editor] [Interactive Gr…

4fa3c9b

…aph] Add logarithm graph option in the Interactive Graph Editor

[LEMS-3953/pr6-logarithm-in-interactive-graph-editor] fix claude revi…

53155ac

…ew comment

ivyolamit force-pushed the LEMS-3953/pr6-logarithm-in-interactive-graph-editor branch from 63f729e to 53155ac Compare March 28, 2026 00:43

SonicScrewdriver approved these changes Mar 30, 2026

View reviewed changes

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[Interactive Graph] Add logarithm graph option in the Interactive Graph Editor#3425

[Interactive Graph] Add logarithm graph option in the Interactive Graph Editor#3425
ivyolamit wants to merge 3 commits intoLEMS-3953/pr5-logarithm-scoringfrom
LEMS-3953/pr6-logarithm-in-interactive-graph-editor

ivyolamit commented Mar 27, 2026 •

edited

Loading

Uh oh!

github-actions bot commented Mar 27, 2026 •

edited

Loading

Uh oh!

github-actions bot commented Mar 27, 2026 •

edited

Loading

Uh oh!

github-actions bot commented Mar 27, 2026 •

edited

Loading

Uh oh!

github-actions bot commented Mar 27, 2026 •

edited

Loading

Uh oh!

claude bot left a comment

Uh oh!

ivyolamit commented Mar 27, 2026

Uh oh!

Uh oh!

SonicScrewdriver left a comment

Uh oh!

SonicScrewdriver Mar 30, 2026

Uh oh!

SonicScrewdriver Mar 30, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

		@@ -0,0 +1,36 @@
		/* We have to use !important until wonder blocks is in the shared layer. */

Conversation

ivyolamit commented Mar 27, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary:

Details

Test plan:

Uh oh!

github-actions bot commented Mar 27, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

🗄️ Schema Change: No Changes ✅

Uh oh!

github-actions bot commented Mar 27, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

🛠️ Item Splitting: No Changes ✅

Uh oh!

github-actions bot commented Mar 27, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

github-actions bot commented Mar 27, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

npm Snapshot: Published

Uh oh!

claude bot left a comment

Choose a reason for hiding this comment

Claude Code Review

Uh oh!

ivyolamit commented Mar 27, 2026

Uh oh!

Uh oh!

SonicScrewdriver left a comment

Choose a reason for hiding this comment

Uh oh!

SonicScrewdriver Mar 30, 2026

Choose a reason for hiding this comment

Uh oh!

SonicScrewdriver Mar 30, 2026

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

ivyolamit commented Mar 27, 2026 •

edited

Loading

github-actions bot commented Mar 27, 2026 •

edited

Loading

github-actions bot commented Mar 27, 2026 •

edited

Loading

github-actions bot commented Mar 27, 2026 •

edited

Loading

github-actions bot commented Mar 27, 2026 •

edited

Loading