@rralian/automattic-charts-bundled

Browser-ready IIFE bundle of @automattic/charts, with React and all transitive dependencies inlined. Designed for loading into Claude Cowork artifacts (or any HTML page) via a single <script> tag.

This is a personal-scope experiment wrapper (publicly published, but not officially maintained by Automattic). The upstream library is maintained by Automattic; this package just re-ships a pre-built browser bundle so Cowork's CSP-restricted artifact sandbox can load it from cdn.jsdelivr.net/npm/*.

Usage

<!-- CSS (10KB) -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@rralian/[email protected]/dist/automattic-charts.css" />

<!-- Bundle - exposes window.React, window.ReactDOMClient, window.AutomatticCharts -->
<script src="https://cdn.jsdelivr.net/npm/@rralian/[email protected]/dist/automattic-charts.iife.js"></script>

<div id="root"></div>
<script>
  const { createElement: h } = window.React;
  const { createRoot } = window.ReactDOMClient;
  const { LineChart } = window.AutomatticCharts;

  const data = [{ label: 'Pageviews', data: [
    { date: new Date(2026, 4, 1), value: 42000 },
    { date: new Date(2026, 4, 2), value: 48000 },
  ]}];

  createRoot(document.getElementById('root')).render(
    h(LineChart, { data, width: 600, height: 300, withTooltips: true })
  );
</script>

Build & publish

From the parent directory (exploration/charts/):

npm run build:publish   # builds wrapper, copies dist into publish/
cd publish
npm publish

Version bumps go in publish/package.json. Update the URLs above accordingly.