|
3 | 3 | import * as React from "react"; |
4 | 4 | import * as RechartsPrimitive from "recharts"; |
5 | 5 | import { type Payload } from "recharts/types/component/DefaultTooltipContent"; |
6 | | -import type { TooltipProps } from "recharts/types/component/Tooltip"; |
7 | 6 |
|
8 | 7 | import { cn } from "@/lib/utils"; |
9 | 8 |
|
@@ -103,14 +102,21 @@ ${colorConfig |
103 | 102 | ); |
104 | 103 | }; |
105 | 104 |
|
| 105 | +// Define a more specific type for the payload within the item |
| 106 | +interface ChartTooltipItemPayload { |
| 107 | + fill?: string; |
| 108 | + // Add other potential properties based on your data structure if needed |
| 109 | + [key: string]: unknown; |
| 110 | +} |
| 111 | + |
106 | 112 | // Define explicit prop types using Recharts types |
107 | 113 | interface ChartTooltipProps extends RechartsPrimitive.TooltipProps<number | string, string> { |
108 | 114 | indicator?: 'dot' | 'line' | 'dashed'; |
109 | 115 | hideLabel?: boolean; |
110 | 116 | hideIndicator?: boolean; |
111 | 117 | labelKey?: string; |
112 | 118 | labelFormatter?: (label: string, payload: Payload<number | string, string>[]) => React.ReactNode; |
113 | | - formatter?: (value: number | string | Array<number | string>, name: string, item: Payload<number | string, string>, index: number, payload: Payload<number | string, string>["payload"] | undefined) => React.ReactNode; |
| 119 | + formatter?: (value: number | string | Array<number | string>, name: string, item: Payload<number | string, string>, index: number, payload: ChartTooltipItemPayload | undefined) => React.ReactNode; |
114 | 120 | color?: string; |
115 | 121 | className?: string; |
116 | 122 | } |
@@ -173,15 +179,13 @@ const ChartTooltip = ({ active, payload, label, className, indicator = "dot", hi |
173 | 179 | const itemColor = typeof item.color === 'string' ? item.color : undefined; |
174 | 180 | const indicatorColor: string = color || itemColor || payloadFill || "hsl(var(--primary))"; |
175 | 181 |
|
176 | | - let formatterPayload: Payload<number | string, string>["payload"] | undefined = undefined; |
| 182 | + let formatterPayload: ChartTooltipItemPayload | undefined = undefined; |
177 | 183 | if ( |
178 | 184 | typeof item.payload === 'object' && |
179 | 185 | item.payload !== null && |
180 | 186 | !(item.payload instanceof Error) |
181 | 187 | ) { |
182 | | - // Disable persistent error for this assignment after checks |
183 | | - // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment |
184 | | - formatterPayload = item.payload; |
| 188 | + formatterPayload = item.payload as ChartTooltipItemPayload; |
185 | 189 | } |
186 | 190 |
|
187 | 191 | const safeValue = (typeof item.value === 'number' || typeof item.value === 'string') ? item.value : 0; |
|
0 commit comments