feat: export chart props types (#810)

#720

Author: dangreen

README.md

@@ -55,6 +55,12 @@ See [these examples](example) for more information
   getElementsAtEvent?: (elements: Chart.InteractionItem[], event: React.MouseEvent<HTMLCanvasElement>) => void;
 ```
 
+In TypeScript, you can import chart props types like this:
+
+```ts
+import type { ChartProps } from 'react-chartjs-2';
+```
+
 #### id
 
 Type `string`

src/chart.tsx

@@ -3,7 +3,7 @@ import type { ForwardedRef, MouseEvent } from 'react';
 import ChartJS from 'chart.js/auto';
 import type { ChartData, ChartType, DefaultDataPoint } from 'chart.js';
 
-import type { Props, TypedChartComponent } from './types';
+import type { ChartProps, TypedChartComponent } from './types';
 import {
   reforwardRef,
   cloneData,
@@ -35,7 +35,7 @@ function ChartComponent<
     fallbackContent,
     onClick: onClickProp,
     ...props
-  }: Props<TType, TData, TLabel>,
+  }: ChartProps<TType, TData, TLabel>,
   ref: ForwardedRef<ChartJS<TType, TData, TLabel>>
 ) {
   type TypedChartJS = ChartJS<TType, TData, TLabel>;

src/index.tsx

@@ -4,4 +4,5 @@ export { defaults } from 'chart.js';
 
 // @todo Make named export instead of default
 export { Chart as default } from './chart';
+export type { ChartProps } from './types';
 export * from './typedCharts';

src/typedCharts.tsx

@@ -1,11 +1,11 @@
 import React, { forwardRef } from 'react';
 import { ChartType } from 'chart.js';
 
-import { Props, ChartJSOrUndefined, TypedChartComponent } from './types';
+import { ChartProps, ChartJSOrUndefined, TypedChartComponent } from './types';
 import { Chart } from './chart';
 
 function createTypedChart<T extends ChartType>(type: T) {
-  return forwardRef<ChartJSOrUndefined<T>, Omit<Props<T>, 'type'>>(
+  return forwardRef<ChartJSOrUndefined<T>, Omit<ChartProps<T>, 'type'>>(
     (props, ref) => <Chart {...props} ref={ref} type={type} />
   ) as TypedChartComponent<T, true>;
 }

src/types.ts

@@ -14,7 +14,7 @@ import type {
   InteractionItem,
 } from 'chart.js';
 
-export interface Props<
+export interface ChartProps<
   TType extends ChartType = ChartType,
   TData = DefaultDataPoint<TType>,
   TLabel = unknown
@@ -61,7 +61,7 @@ export type TypedChartComponent<
   TOmitType = false
 > = TOmitType extends true
   ? <TData = DefaultDataPoint<TDefaultType>, TLabel = unknown>(
-      props: Omit<Props<TDefaultType, TData, TLabel>, 'type'> & {
+      props: Omit<ChartProps<TDefaultType, TData, TLabel>, 'type'> & {
         ref?: ForwardedRef<ChartJSOrUndefined<TDefaultType, TData, TLabel>>;
       }
     ) => JSX.Element
@@ -70,7 +70,7 @@ export type TypedChartComponent<
       TData = DefaultDataPoint<TType>,
       TLabel = unknown
     >(
-      props: Props<TType, TData, TLabel> & {
+      props: ChartProps<TType, TData, TLabel> & {
         ref?: ForwardedRef<ChartJSOrUndefined<TType, TData, TLabel>>;
       }
     ) => JSX.Element;