import React , { forwardRef } from 'react' ; import { Chart as ChartJS , LineController , BarController , RadarController , DoughnutController , PolarAreaController , BubbleController , PieController , ScatterController , } from 'chart.js' ; import type { ChartType , ChartComponentLike } from 'chart.js' ; import type { ChartProps , ChartJSOrUndefined , TypedChartComponent , } from './types' ; import { Chart } from './chart' ; function createTypedChart < T extends ChartType > ( type , registerables ) { ChartJS . register ( registerables ) ; return forwardRef < ChartJSOrUndefined < T > , Omit < ChartProps < T > , 'type' > > ( ( props , ref ) => < Chart { ... props } ref = { ref } type = { type } / > ) as TypedChartComponent < T , true > ; } export const Line = createTypedChart ( 'line' , LineController ) ; export const Bar = createTypedChart ( 'bar' , BarController ) ; export const Radar = createTypedChart ( 'radar' , RadarController ) ; export const Doughnut = createTypedChart ( 'doughnut' , DoughnutController ) ; export const PolarArea = createTypedChart ( 'polarArea' , PolarAreaController ) ; export const Bubble = createTypedChart ( 'bubble' , BubbleController ) ; export const Pie = createTypedChart ( 'pie' , PieController ) ; export const Scatter = createTypedChart ( 'scatter' , ScatterController ) ;