Skip to content

[Phase 1] Implement ChartDemo component and demo data#105

Merged
afucher merged 5 commits intodoc-websitefrom
issue-94-chart-demo
Mar 30, 2026
Merged

[Phase 1] Implement ChartDemo component and demo data#105
afucher merged 5 commits intodoc-websitefrom
issue-94-chart-demo

Conversation

@afucher
Copy link
Copy Markdown
Contributor

@afucher afucher commented Mar 30, 2026

Closes #94

Summary

  • src/data/demoData.ts — new module exporting defaultRadixData (15 planets + 12 cusps) and defaultTransitData for use in all demo examples
  • src/components/ChartDemo.astro — rewritten to issue spec: props id, height (default 500), mode (radix/transit/animate), showCode (default true); inline script loads /astrochart.js and initialises the correct chart type; animate mode includes a wired Start Animation button; auto-generated collapsible code snippet; noscript fallback
  • website/public/astrochart.js — UMD bundle served to the browser by ChartDemos inline script
  • src/content/docs/test-demo.md — test page exercising all three modes, custom height, and showCode=false

Test plan

  • website/ builds cleanly (25 pages including /test-demo)
  • Root library build passes
  • All 86 Jest tests pass
  • Visual check: open /test-demo in dev server and confirm charts render in all three modes with no console errors

Generated with eca

afucher and others added 5 commits March 30, 2026 15:32
- Add `src/data/demoData.ts` with defaultRadixData (15 planets + 12 cusps)
  and defaultTransitData for transit/animate examples
- Rewrite ChartDemo.astro with updated props: id, height (default 500),
  mode ('radix'|'transit'|'animate'), showCode (default true)
- Animate mode renders a 'Start Animation' button wired to transit.animate()
- Inline <script> loads /astrochart.js on demand and initialises chart
  based on mode, using demoData passed via define:vars
- Collapsible <details> code snippet auto-generated per mode
- <noscript> fallback included
- Add website/public/astrochart.js (UMD bundle served to browser)
- Add src/content/docs/test-demo.md testing all modes and props
- Website builds cleanly (25 pages); root lib build + 86 tests all pass

🤖 Generated with [eca](https://eca.dev)

Co-Authored-By: eca <git@eca.dev>
Three bugs fixed:

1. Rename test-demo.md → test-demo.mdx
   Astro/Starlight only processes component imports (MDX syntax) in
   .mdx files. The .md file was printing the import statement as
   plain text and not rendering any <ChartDemo> tags.

2. Fix planet key names in demoData.ts
   The library recognises NNode/SNode/Fortune; the data used the
   non-existent keys NorthNode, SouthNode, Vertex which caused the
   validate() call inside Radix to silently skip those planets and
   could throw on malformed data shapes.

3. Fix multi-instance script loading race condition
   With 5 ChartDemo instances on one page, all inline scripts ran
   simultaneously and each tried to inject /astrochart.js. Replace
   with a shared __astrochartQueue pattern: the first instance
   creates the script tag and flushes the queue on load; subsequent
   instances detect the in-flight tag and push their initChart() to
   the queue instead of creating duplicate script tags.

🤖 Generated with [eca](https://eca.dev)

Co-Authored-By: eca <git@eca.dev>
AGENTS.md:
- Add website/Astro rules: .mdx required for component imports; queue
  pattern for multi-instance is:inline script loading
- Add AstroChart data shape section: real AstroData type, valid planet
  keys, cusps constraint, retrograde flag format

website docs (wrong data shape fixed):
- api/types.md: rewrite with real AstroData/Points types, table of
  valid planet keys, full working example
- guides/radix-chart.md: replace invented Planet[]/Cusp[] API with
  real Record<string,number[]>/number[] shape throughout
- api/radix.md: correct code example, document data constraints

library-issues/ (new directory, two files):
- improve-validate-unknown-planet-keys.md: unknown planet keys silently
  render as fallback circles with no warning — improvement candidate
- bug-settings-mutation-across-instances.md: Chart constructor mutates
  the shared default_settings singleton via Object.assign, causing
  cross-instance settings bleed — confirmed bug

🤖 Generated with [eca](https://eca.dev)

Co-Authored-By: eca <git@eca.dev>
'Radix with Custom Height' and 'Transit without Code Snippet' existed
to exercise ChartDemo component props — not to communicate anything
useful to a documentation reader. Removed.
Without this exclusion tsc emits .d.ts files for the test helpers
into dist/project/__tests__/ on every npm run build. The issue-93
branch had this fix but it was not in doc-website, so it reappeared
on the new branch.
@afucher afucher merged commit 2bd70cf into doc-website Mar 30, 2026
3 checks passed
@afucher afucher deleted the issue-94-chart-demo branch March 30, 2026 19:24
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