React ApexCharts v2.0.1

Patch Release: SSR Example & Minor Fixes

This patch release adds a comprehensive SSR example project to help developers integrate React ApexCharts with Next.js and other SSR frameworks.

---

New SSR Example Project

Added a complete Next.js App Router example demonstrating SSR capabilities:

• Location: example-ssr/
• Framework: Next.js 15+ with TypeScript
• Features:
  • Server-side chart rendering with react-apexcharts/server
  • Client-side hydration with react-apexcharts/hydrate
  • Server data fetching examples
  • Multiple chart types and configurations
  • Best practices for SSR integration

🐛 Bug Fixes

• Improved type definitions consistency

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" }
}