<!-- Generated by scripts/gen-docs.mts from the JSDoc in registry/. Do not edit; run `pnpm run docs`. -->

# ChartTooltip

The tooltip for a recharts chart inside `Chart`: the category, then each series' marker, label and value from the chart's `config`, in the theme's popover colors. It follows the pointer, and the arrow keys when the plot has focus. `Chart` adds it for you with `type`.

```tsx
import { ChartTooltip } from "@/components/ouro/chart/chart";
```

## Example

```tsx
<Chart title="Recipes cooked" data={months} categoryKey="month" config={config}>
  <LineChart>
    <Line dataKey="cooked" stroke="var(--color-cooked)" />
    <ChartTooltip />
  </LineChart>
</Chart>
```

## Usage

Use it only inside a recharts chart passed to `Chart` as children.

## Use instead when

- Use `Chart` with `type` instead when bars, lines or areas are enough: it adds the tooltip itself.

## Props

Type: `ChartTooltipProps`.

## Don't use

These are not props. Passing one fails the type check with the fix in the error, and in development a console message names the fix.

- `content`: Not a prop. ChartTooltip draws its own content from the chart's config: `<ChartTooltip />`.
