Connect AI

Use ChartBuddy Embed (@chartbuddy.io/embed) from AI clients: HTML pages, artifacts, dashboards, and slide decks. Agents mount charts with new Insight() – there is no remote Embed API or MCP server for the npm package itself.

Agent-readable references

Give your client these stable URLs:

• llms.txt – compact package guide (start here)
• Embed docs – full documentation (this site)
• Visual QA – mount, observe, fix layout and config

Need desktop Hub editing over MCP (open charts in Chartbuddy Hub, list_charts, …)? See Chartbuddy Hub – Connect MCP.

How Embed fits AI workflows

1. Read llms.txt and/or fetch docs (Installation → Quick start → host sizing).
2. Write HTML/JS that imports @chartbuddy.io/embed and passes chartData.
3. Size the host – definite width/height (aspect-ratio or fixed px). See Canvas & sizing.
4. Verify with Visual QA – layout first, then annotations.

Pick your client

Client	Guide
Cursor	Connect Cursor
Claude Code	Connect Claude Code
OpenCode	Connect OpenCode
ChatGPT / Codex	Connect ChatGPT / Codex
ChatGPT	Connect ChatGPT
Claude	Connect Claude

Shared handoff

Paste into a new agent chat when starting an Embed task:

Build ChartBuddy Embed charts with @chartbuddy.io/embed (new Insight()).
Read https://unpkg.com/@chartbuddy.io/embed/llms.txt and https://chartbuddy.io/embed/docs/getting-started/quick-start
Host sizing: mount element needs definite width/height (prefer width + aspect-ratio, not height:100% in flex/slide layouts).
Use validateChartData / Visual QA loop before declaring done.

Troubleshooting

Symptom	Check
Charts render tiny or letterboxed	Host sizing – aspect-ratio or fixed px
format changes do nothing	Set numberFormat: { mode: 'custom', customFormat } – see Number formats
Agent invents wrong API	new Insight() only – not Chart.js / createChart
Slide deck charts wrong size	Mount when slide is visible; remount or update after layout
Need Hub window tools	Use Hub Connect MCP instead of Embed docs alone