ChartTooltip
The panel that appears when hovering a chart, listing each series' value at that point.
Sep 12
PR review
42Whitebox scan
8Blackbox scan
13<template> <ChartTooltip heading="Sep 12" :rows="[{ color: 'var(--color-chart-chart-1)', label: 'PR review', value: '42' }]" /></template>Props
| Name | Type | Default |
|---|---|---|
| heading | string | - |
| rows | TrendChartTooltipRow[] | - |
Guidelines
Do
- Use only through TrendChart's own hover/crosshair wiring - it isn't meant to be dropped in standalone.
Don't
- Don't reach for this outside a chart hover context; for a static color-coded list (a legend, a summary) use ChartLegend or a plain flex column instead.
- Don't put the date on every row - it goes in
headingonce; rows carry the series name and value.