---
id: "packages/active-charts/all-exports/chart-context-menu"
title: "Chart context menu"
description: "ChartContextMenuBuilder, ChartContextMenuContext, ChartContextMenuExportFeatures, ChartContextMenuFeatures and 3 more: generated from the source of active-charts."
url: "/packages/active-charts/all-exports/chart-context-menu"
locale: "en"
revision: "g0mvjxwj5c-88bdbe1c:chart-context-menu"
---

# Chart context menu

Exported by `@workspace/active-charts`. Generated from the package source; part of [the index of every export](/packages/active-charts/all-exports).

## Types

**ChartContextMenuBuilder**

```ts
type ChartContextMenuBuilder<TElement = unknown> = (
  context: ChartContextMenuContext<TElement>,
) => ChartContextMenuItem<TElement>[];
```

Builds the host's items for one opening. Called once per opening, with the
frozen context; the items come first in the menu, above the chart's own
groups.

**ChartContextMenuContext**

```ts
interface ChartContextMenuContext<TElement = unknown> {
  readonly target: ChartContextMenuTarget<TElement>;
  readonly source: ChartInteractionSource;
  readonly selectedItemCount: number;
  readonly isZoomed: boolean;
}
```

What one opening of a chart menu is about. Built once when the menu opens
and frozen for as long as it stays open: the builder and every action see
the same object.

**ChartContextMenuExportFeatures**

```ts
type ChartContextMenuExportFeatures =
  | boolean
  | {
      png?: boolean;
      svg?: boolean;
      csv?: boolean;
      pdf?: boolean;
    };
```

Which formats the `Export` submenu offers. `true` (the default) offers
every format the chart can write; `false` leaves the submenu out. An
object chooses per format: a format left out of it, or `true`, is offered
where the chart can write it, and `false` hides it. A format the chart
cannot write (CSV on a chart without rows) is never offered, whatever this
says, and a submenu left with no format is not shown. The order stays PNG,
SVG, CSV, PDF.

**ChartContextMenuFeatures**

```ts
interface ChartContextMenuFeatures {
  copy?: boolean;
  zoom?: boolean;
  series?: boolean;
  export?: ChartContextMenuExportFeatures;
  replay?: boolean;
}
```

The chart's own groups, each on by default where the chart supports it.

**ChartContextMenuItem**

```ts
type ChartContextMenuItem<TElement = unknown> =
  | 'separator'
  | {
      label: string;
      action?: (context: ChartContextMenuContext<TElement>) => void;
      icon?: React.ElementType;
      variant?: 'default' | 'destructive';
      disabled?: boolean;
      disabledReason?: string;
      shortcut?: string;
      keepOpen?: boolean;
      visible?: (context: ChartContextMenuContext<TElement>) => boolean;
      separatorBefore?: boolean;
      children?: ChartContextMenuItem<TElement>[];
    };
```

One entry of a chart menu: an action, a submenu (with `children`), or the
`'separator'` line.

**ChartContextMenuOptions**

```ts
interface ChartContextMenuOptions<
  TElement = unknown,
  TFeature extends keyof ChartContextMenuFeatures =
    keyof ChartContextMenuFeatures,
> {
  enabled?: boolean;
  items?: ChartContextMenuBuilder<TElement>;
  features?: Pick<ChartContextMenuFeatures, TFeature>;
  pngScale?: number;
  trigger?: 'none' | 'button';
  onCopyError?: (error: ChartCopyError) => void;
}
```

The `contextMenu` option of a chart. `TFeature` names the groups the
family has, so a family's type takes only the switches that act on it: `zoom` where there is a data range, `series` where there is an
interactive legend, `export` on a scalar and `replay` too on a gauge.

**ChartContextMenuTarget**

```ts
type ChartContextMenuTarget<TElement = unknown> =
  | {kind: 'element'; element: TElement}
  | {kind: 'legendItem'; entry: ChartLegendEntry}
  | {kind: 'chart'};
```

What a chart menu was opened on. `element` carries the family's element
shape (`CartesianPoint`, `CategoricalSlice`, `RadarPoint`, `HeatmapCell`,
`HierarchyElement`, `SankeyElement`, `TimelineElement`); `legendItem` a
legend entry, exactly as `useChartLegend()` reports it (identity, target,
label, key, visibility, available actions) at the moment the menu opened;
`chart` the chart with no element under the pointer or focus.
