Skip to content

feat: client-side export — toSvgString / toPng / downloadChart / copyToClipboard (#123)#131

Merged
Ben Severn (benzsevern) merged 1 commit into
mainfrom
feat/123-client-export
May 28, 2026
Merged

feat: client-side export — toSvgString / toPng / downloadChart / copyToClipboard (#123)#131
Ben Severn (benzsevern) merged 1 commit into
mainfrom
feat/123-client-export

Conversation

@benzsevern
Copy link
Copy Markdown
Collaborator

Summary

  • New src/render/clientExport.ts with browser-side helpers: toSvgString, toPng, downloadChart, copyToClipboard, plus chartSvgFrom (find the inner <svg> from a container ref) and svgPixelSize / extensionFor / mimeFor utilities.
  • <Surface> accepts an svgRef?: Ref<SVGSVGElement> prop and threads it to the inner <svg> — gives consumers a clean handle without restructuring chart APIs.
  • Exported from the main goldenchart entry. Tree-shakeable: no canvas/clipboard work unless the relevant helper is imported.
  • No font embedding on this path (the browser is already painting the chart, so any font the consumer has loaded via CSS will be in the output). For standalone SVGs that must render without a font installed, the existing goldenchart/server renderToSVGString path embeds @font-face.
  • Pure helpers unit-tested (project convention is no-jsdom; see src/interactive/InteractiveChart.test.ts). The DOM-dependent paths (toPng, downloadChart, copyToClipboard) are integration-only.

Verification

  • npm run typecheck clean
  • npm test — 412 existing tests pass + 10 new
  • npm run build && npm run check:bundle — browser entry 50 KB gzipped (budget 75 KB, up 2 KB from clientExport)

Test plan

  • Typecheck clean
  • Full test suite green (412 + 10)
  • Bundle guard green
  • CI green
  • Wire a "Download PNG" button into the playground (follow-up)

Closes #123.

…ToClipboard (#123)

Browser-side rasterisation and download helpers, plus an `svgRef` prop
on `<Surface>` so consumers can grab the inner `<svg>` cleanly.

- new src/render/clientExport.ts: toSvgString, toPng, downloadChart,
  copyToClipboard, chartSvgFrom (container helper), svgPixelSize
- Surface accepts `svgRef?: Ref<SVGSVGElement>` and threads it to the
  inner <svg>
- exported from goldenchart main entry; no new deps; tree-shakeable
- no font embedding (matches what the user sees; for fully standalone
  SVGs use goldenchart/server's renderToSVGString)
- pure helpers unit-tested (project convention: no jsdom — see
  InteractiveChart.test.ts)

Bundle 50 KB gzipped (budget 75 KB). All 412 existing tests pass plus 10 new.
@benzsevern Ben Severn (benzsevern) merged commit 2c29efe into main May 28, 2026
5 checks passed
@benzsevern Ben Severn (benzsevern) deleted the feat/123-client-export branch May 28, 2026 16:53
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.

Client-side export: downloadChart() / toPng() / toSvg()

1 participant