Skip to content

fix(ui): kind-less reactive-chart export uses the canonical palette (OB-380)#110

Merged
eliotlim merged 1 commit into
mainfrom
feat/ob-380-plot-export-palette
Jul 6, 2026
Merged

fix(ui): kind-less reactive-chart export uses the canonical palette (OB-380)#110
eliotlim merged 1 commit into
mainfrom
feat/ob-380-plot-export-palette

Conversation

@eliotlim

@eliotlim eliotlim commented Jul 6, 2026

Copy link
Copy Markdown
Owner

Problem

Kind-less reactive charts (a chart cell with no fixed kind) exported via Observable Plot with no colour range set, so they fell back to Plot's default categorical scheme — not the canonical data palette. An exported reactive chart didn't colour-match the app or the other chart types. Board: OB-380 (follow-up to OB-378, flagged by Devon).

Solution

Set the Plot color scale's range to the canonical palette for the active scheme, in both export sites:

  • toHtml.ts (client runtime): color:{range:KIT_PALETTE,legend:…}KIT_PALETTE is already prepended by kitChartRuntime(scheme), so it's inlined + self-contained + honours the exporting user's Pastel/Vivid/Muted scheme.
  • chartSvg.ts (server SVG): color:{range:paletteFor(scheme),…} + a scheme param.
    One palette source shared with the kit/db charts; no re-literal. New deps: none.

Before / After

Exported kind-less reactive chart Before (Plot default) After (canonical palette)
multi-series line before
saturated, mismatched
after
soft pastel, matches in-app

Test procedure

  • pnpm verify green: sdk 171 · ui 939 · server 586. exportReactive.test.ts extended (2 tests): server SVG emits stroke="#a9ccdf"/#debea6/#9fdf9f (pastel lead trio) + #3b82f6 (vivid); runtime contains color:{range:KIT_PALETTE…} + the inlined const KIT_PALETTE=["#a9ccdf"….
  • Web e2e left to CI (multi-minute/flaky); the change is covered by the export unit tests + a real-Plot-under-happy-dom SVG assertion.

Operational notes

  • Honours the OB-379 Data-colours scheme; self-contained (values inlined, no live CSS vars at runtime).
  • buildChartSvg has no in-repo callers (residual exported API from the pre-block-native PDF path) — fixed anyway for consistency.
  • Captures on chore/artifacts.

Footer: verify green (sdk 171 · ui 939 · server 586); design gate → Devon.

🤖 Generated with Claude Code

https://claude.ai/code/session_01X78XTAemKrFw1uJpDpCEaG

…ette (OB-380)

Kind-less reactive charts (a chart cell with no fixed `kind`) export via
Observable Plot with no colour range set, so they picked Plot's default
categorical scheme instead of the canonical data palette the kit/db charts use.
Set the Plot `color.range` to the active scheme's `SERIES_ORDER` fills at both
export sites:

- toHtml.ts client runtime: `color:{range:KIT_PALETTE,...}` — reuses the
  `KIT_PALETTE` const already prepended by `kitChartRuntime(scheme)`, so the
  scheme's fills are inlined (self-contained; no live CSS vars or app modules).
- chartSvg.ts server SVG: `color:{range:paletteFor(scheme),...}` via a new
  `scheme` param, reusing the canonical `paletteFor` (no re-literal).

An exported kind-less chart now colour-matches in-app and honours the selected
Pastel/Vivid/Muted scheme. Extends exportReactive tests to assert the Plot range
resolves to the canonical fills (pastel lead #a9ccdf, vivid #3b82f6).

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01X78XTAemKrFw1uJpDpCEaG
@vercel

vercel Bot commented Jul 6, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
app.book.pub Ready Ready Preview, Comment Jul 6, 2026 12:47am

Request Review

@eliotlim eliotlim merged commit 545fe1f into main Jul 6, 2026
7 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant