Storybook catalog — phase 1: scaffold + five anchor stories - #5
Conversation
New apps/storybook workspace (Storybook 10.5.10, react-vite, exact-pinned): - .storybook config: docs addon, autodocs, dark/light theme toolbar, section-ordered sidebar, telemetry off - fixtures copied from the demo (seeded generator, themes, scale descriptors, crossfilter dims, sunflower positions) plus a concrete DemoGraph alias and FakeEngine holder for later component stories - stories: Graph/Minimal, Graph/Styling (scale switching), Graph/Themes, Graph/Layout: force (live sim sliders), Interaction/Selection (lasso + actions) — all on CosmosEngine, framed per-story - Introduction MDX: What is orbit, Data shapes, Testing without WebGL Root wiring: storybook:dev/storybook:build scripts, changesets ignore, eslint + gitignore entries for storybook-static. CI untouched. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_018SeFxK217ZrHSERqK6kjcb
![greptile-apps[bot]](https://avatars.githubusercontent.com/in/867647?s=60&v=4){kind=small}
|
|
||
| const config: StorybookConfig = { | ||
| stories: ['../src/**/*.mdx', '../src/**/*.stories.@(ts|tsx)'], | ||
| addons: ['@storybook/addon-docs'], |
There was a problem hiding this comment.
When users perform the selection interactions documented by the new story, the callbacks execute but this configuration registers only the docs addon, so Storybook provides no Actions panel in which to inspect the promised onSelectionChange events.
Note: If this suggestion doesn't match your team's coding style, reply to this and let me know. I'll remember it for next time!
There was a problem hiding this comment.
Not applicable on Storybook 10: controls and actions moved into core (addon-essentials no longer exists), so the Actions panel is present with only the docs addon registered — fn() spies from storybook/test log there. Verified in the running catalog: the Selection story shows Controls/Actions/Interactions tabs and onSelectionChange events stream into the Actions panel.
Addressing 'shallow, one dataset shape, no size control': - fixtures/topologies.ts: six deterministic force topologies (clustered, tree, scale-free, bipartite, ring, islands) all emitting the same typed attrs so every scale/dimension/search fixture composes with every shape, plus three fixed-layout topologies with exact declared positions (circle, tidy radial tree partitioned by subtree share, lattice) - global size toolbar (S 300 / M 1,500 / L 8,000 / XL 40,000) read by all stories through a per-size snapshot cache; theme toolbar unchanged - catalog deepened reagraph-style, one story per prop value: Graph: Minimal, Topologies (radio), Nodes (function/categorical/ sequential color, degree/uniform size), Edges (per-edge color/width, arrows, hidden), Labels (zoom threshold, pinned ids, custom JSX pills), Themes (base swap + custom tokens) Layouts: Force (preset radio + full tunables), Fixed (circular/radial tree/grid), Fixed-to-force handoff (declared positions double as simulation seeds — one prop flips designed geometry into organic motion) Interaction: Selection, Hover & emphasis, Context menu (find-path flow) - DemoGraph now forwards refs (handle access in stories) Verified live: 12 story files register, tree/radial/sequential/preset stories render framed at natural node scale via the new clamp. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_018SeFxK217ZrHSERqK6kjcb
|
Restructured per the catalog-depth review: topology fixture library (six force shapes + three exact fixed layouts), global S/M/L/XL size toolbar, and the Graph section split into per-prop-value stories (Nodes/Edges/Labels/Themes), Layouts (Force presets + Fixed gallery + fixed→force handoff), and three Interaction pages. Rides the settle-camera and fit-clamp merges from main. Next phases: Components (13, FakeEngine), Exploration, Analytics, Persistence, Scale, Use Cases. |
Review finding: a simulation-only update deliberately preserves positions and carries no restart (core contract), so once the calm preset settled, preset/slider changes showed nothing. The force stories now resume the simulation on config change through the shipped reheat API — verified live: settled graph visibly rearranges on a slider move.
1 participant
What
New
apps/storybookworkspace: a Storybook 10 catalog over the live workspace packages, so stories can never drift from the source API.@storybook/react-vite+ docs addon (exact-pinned trio), port 5399, telemetry off, dark/light theme toolbar, ordered sidebar.src/fixtures/): seeded deterministic generator + themes + scale descriptors + crossfilter dims + sunflower position seeding, copied from the demo (apps do not import across apps); concreteDemoGraphalias tames theGraph<N, E>generic for story typing;FakeEngineholder ready for the component stories.storybook:dev/storybook:build, changesets ignore, eslint + gitignore forstorybook-static. CI deliberately untouched.Verification
pnpm run checkexit 0 (boundaries, anchors, pin gate, lint, typecheck, 1,785 tests, perf gate)pnpm storybook:buildexit 0; static output serves and lists all 13 entries; output is git- and eslint-ignoredNext phases per the approved structure: the 13 FakeEngine component stories, then Exploration / Analytics / Persistence / Scale.
🤖 Generated with Claude Code
https://claude.ai/code/session_018SeFxK217ZrHSERqK6kjcb
Greptile Summary
The PR adds a Storybook 10 workspace that catalogs Orbit’s live React and Cosmos APIs through deterministic fixtures, WebGL-backed graph stories, interaction examples, and introductory documentation.
Confidence Score: 5/5
The PR appears safe to merge.
No blocking failure remains.
Important Files Changed
Reviews (3): Last reviewed commit: "Storybook: force stories reheat on simul..." | Re-trigger Greptile
Context used: