@tanstack/alpine-charts

This compatibility package remains supported for existing applications. New applications use the Alpine directive adapter from @tanstack/charts/alpine.

pnpm add @tanstack/charts alpinejs

import Alpine from 'alpinejs'
import { charts } from '@tanstack/charts/alpine'

Alpine.plugin(charts)
Alpine.start()

<div x-data="{ chartOptions }" x-chart="chartOptions"></div>

The x-chart element owns its chart contents. Reactive option changes update the shared host without rebuilding the SVG.

Read the published Alpine adapter guide and x-chart reference.