useChartLegend

useChartLegend: generated from the source of active-charts.

Exported by @workspace/active-charts. Generated from the package source; part of the index of every export.

Functions, hooks and constants#

Type: () => ChartLegend

The headless legend of one chart (AF-B, ADR-105): the chart's resolved discrete legend (identity, label, key, visibility, available actions) and the chart's own legend actions, for a legend the host renders itself. Give link to exactly one chart as legendLink; until that chart has mounted (and on the server) entries is empty and connected false.

The chart keeps its semantics on every route: the action is announced in the chart's live region, reported once through onLegendChange (source: 'api'), and guarded as the built-in legend is. The host owns the markup, roles, names and focus of its own legend.

``tsx const legend = useChartLegend(); <PieChart legend={false} legendLink={legend.link} … /> {legend.entries.map((entry) => ( <button key={entry.id} aria-pressed={entry.visible} disabled={!entry.available.toggle} onClick={() => legend.activate(entry.id)}>{entry.label}</button> ))} ``

Returns

An object with these fields.

entriesrequired

Type: readonly ChartLegendEntry[]

The legend's entries in reading order; empty until a chart is connected.

connectedrequired

Type: boolean

A chart has received link and published its legend.

activaterequired

Type: (entryId, action?) => boolean

The chart's own legend action on one entry (default 'toggle'). Returns whether anything changed: an unknown id, a disconnected link, legend.interactive: false, isolation with legend.isolate: false and hiding the last visible target change nothing.

showAllrequired

Type: () => boolean

"Show all". Returns whether anything changed.

linkrequired

Type: ChartLegendLink

Give it to exactly one chart as legendLink.