({
active,
// @ts-ignore
payload,
className,
indicator = "dot",
hideLabel = false,
hideIndicator = false,
// @ts-ignore
label,
labelFormatter,
labelClassName,
formatter,
valueFormatter = value => value.toLocaleString(),
color,
nameKey,
labelKey,
}: React.ComponentProps<typeof RechartsPrimitive.Tooltip> &
React.ComponentProps<"div"> & {
hideLabel?: boolean
hideIndicator?: boolean
indicator?: "line" | "dot" | "dashed"
nameKey?: string
labelKey?: string
valueFormatter?: (value: number, item?: any) => string
})
| 105 | const ChartTooltip = RechartsPrimitive.Tooltip |
| 106 | |
| 107 | function ChartTooltipContent({ |
| 108 | active, |
| 109 | // @ts-ignore |
| 110 | payload, |
| 111 | className, |
| 112 | indicator = "dot", |
| 113 | hideLabel = false, |
| 114 | hideIndicator = false, |
| 115 | // @ts-ignore |
| 116 | label, |
| 117 | labelFormatter, |
| 118 | labelClassName, |
| 119 | formatter, |
| 120 | valueFormatter = value => value.toLocaleString(), |
| 121 | color, |
| 122 | nameKey, |
| 123 | labelKey, |
| 124 | }: React.ComponentProps<typeof RechartsPrimitive.Tooltip> & |
| 125 | React.ComponentProps<"div"> & { |
| 126 | hideLabel?: boolean |
| 127 | hideIndicator?: boolean |
| 128 | indicator?: "line" | "dot" | "dashed" |
| 129 | nameKey?: string |
| 130 | labelKey?: string |
| 131 | valueFormatter?: (value: number, item?: any) => string |
| 132 | }) { |
| 133 | const { config } = useChart() |
| 134 | |
| 135 | const tooltipLabel = React.useMemo(() => { |
| 136 | if (hideLabel || !payload?.length) { |
| 137 | return null |
| 138 | } |
| 139 | |
| 140 | const [item] = payload |
| 141 | const key = `${labelKey || item?.dataKey || item?.name || "value"}` |
| 142 | const itemConfig = getPayloadConfigFromPayload(config, item, key) |
| 143 | const value = |
| 144 | !labelKey && typeof label === "string" |
| 145 | ? config[label as keyof typeof config]?.label || label |
| 146 | : itemConfig?.label |
| 147 | |
| 148 | if (labelFormatter) { |
| 149 | return ( |
| 150 | <div className={cn("font-medium", labelClassName)}> |
| 151 | {labelFormatter(value, payload)} |
| 152 | </div> |
| 153 | ) |
| 154 | } |
| 155 | |
| 156 | if (!value) { |
| 157 | return null |
| 158 | } |
| 159 | |
| 160 | return <div className={cn("font-medium", labelClassName)}>{value}</div> |
| 161 | }, [ |
| 162 | label, |
| 163 | labelFormatter, |
| 164 | payload, |
nothing calls this directly
no test coverage detected