React ApexCharts v2.0.0

Major Release: Server-Side Rendering (SSR) Support

This release introduces first-class support for Server-Side Rendering, making React ApexCharts fully compatible with Next.js App Router, React Server Components, and other modern SSR frameworks.

---

New Features

Server-Side Rendering (SSR) Support

React ApexCharts now provides dedicated components and exports for seamless SSR integration:

New Export: react-apexcharts/server

Server-side component for rendering static chart markup without client-side JavaScript:

// app/page.tsx (Server Component)
import Chart from 'react-apexcharts/server'

export default function Page() {
  return <Chart type="line" series={...} options={...} />
}

New Export: react-apexcharts/hydrate

Client-side component for hydrating server-rendered charts with interactivity:

'use client'
import Chart from 'react-apexcharts/hydrate'

export default function ClientWrapper() {
  return <Chart clientOptions={{ chart: { animations: { enabled: true } } }} />
}

Modern Package Exports

Enhanced exports field in package.json for better module resolution:

• ESM and CJS dual format support
• Proper TypeScript types for each export
• Optimized for Vite, Next.js, and other modern bundlers

{
  ".": { "import": "./dist/react-apexcharts.esm.js", "require": "./dist/react-apexcharts.cjs.js" },
  "./server": { "import": "./dist/react-apexcharts-server.esm.js" },
  "./hydrate": { "import": "./dist/react-apexcharts-hydrate.esm.js" }
}