Fix BarItemProps types [ Issue plouc#1155 ]

- Change data prop type to BarExtendedDatum - Remove color field in data prop's type - it doesn't exist in data prop - Create BarTooltipDatum to pass color type to tooltip props along with BarExtendedDatum - Add SVGRectElement to BarMouseEventHandler generic type - Update deprecated React.StatelessComponent to React.FC
eggei · Oct 17, 2020 · 30528dc · 30528dc
1 parent e370ea8
commit 30528dc
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 12 deletions.
diff --git a/packages/bar/index.d.ts b/packages/bar/index.d.ts
@@ -39,7 +39,6 @@ declare module '@nivo/bar' {
         value: number
         index: number
         indexValue: Value
-        color: string
         data: BarDatum
     }
 
@@ -51,19 +50,18 @@ declare module '@nivo/bar' {
 
     export type ValueFormatter = (value: number) => string | number
 
-    export type BarMouseEventHandler<T = HTMLCanvasElement> = (
+    type GraphicsContainer = HTMLCanvasElement | SVGRectElement
+
+    export type BarMouseEventHandler<T = GraphicsContainer> = (
         datum: BarExtendedDatum,
         event: React.MouseEvent<T>
     ) => void
 
-    export type TooltipProp = React.StatelessComponent<BarExtendedDatum>
+    export type BarTooltipDatum = BarExtendedDatum & { color: string }
+    export type TooltipProp = React.FC<BarTooltipDatum>
 
     export interface BarItemProps {
-        data: {
-            id: string | number
-            value: number
-            indexValue: string | number
-        }
+        data: BarExtendedDatum
         x: number
         y: number
         width: number
@@ -80,7 +78,7 @@ declare module '@nivo/bar' {
         onMouseLeave: BarMouseEventHandler
         tooltipFormat: string | ValueFormatter
         tooltip: TooltipProp
-        showTooltip: (tooltip: React.ReactNode, event: React.MouseEvent<HTMLCanvasElement>) => void
+        showTooltip: (tooltip: React.ReactNode, event: React.MouseEvent<GraphicsContainer>) => void
         hideTooltip: () => void
         theme: Theme
     }
@@ -109,7 +107,7 @@ declare module '@nivo/bar' {
         enableGridY: boolean
         gridYValues: GridValues<Value>
 
-        barComponent: React.StatelessComponent<BarItemProps>
+        barComponent: React.FC<BarItemProps>
 
         enableLabel: boolean
         label: string | AccessorFunc
@@ -153,7 +151,6 @@ declare module '@nivo/bar' {
             onClick: BarMouseEventHandler<SVGRectElement>
             onMouseEnter: BarMouseEventHandler<SVGRectElement>
             onMouseLeave: BarMouseEventHandler<SVGRectElement>
-            role: string
         }>
 
     export class Bar extends React.Component<BarSvgProps & Dimensions> {}

diff --git a/packages/swarmplot/index.d.ts b/packages/swarmplot/index.d.ts
@@ -47,7 +47,7 @@ declare module '@nivo/swarmplot' {
         Axes = 'axes',
         Nodes = 'nodes',
         Mesh = 'mesh',
-        Annotations = 'annotations'
+        Annotations = 'annotations',
     }
 
     type DatumAccessor<Datum, T> = (datum: Datum) => T