Skip to content

Commit

Permalink
Allow non generic plugin type options
Browse files Browse the repository at this point in the history
  • Loading branch information
Jacco van den Berg committed Aug 21, 2024
1 parent dd554e0 commit 02c4684
Show file tree
Hide file tree
Showing 2 changed files with 19 additions and 5 deletions.
14 changes: 12 additions & 2 deletions docs/developers/plugins.md
Original file line number Diff line number Diff line change
Expand Up @@ -186,12 +186,22 @@ The `destroy` hook has been deprecated since Chart.js version 3.7.0, use the `af

If you want your plugin to be statically typed, you must provide a `.d.ts` TypeScript declaration file. Chart.js provides a way to augment built-in types with user-defined ones, by using the concept of "declaration merging".

When adding a plugin, `PluginOptionsByType` must contain the declarations for the plugin.
When adding a plugin, `PluginOptions` must contain the declarations for the plugin, in case you need extra information about the chart type you can use the `PluginOptionsByType` interface.

For example, to provide typings for the [`canvas backgroundColor plugin`](../configuration/canvas-background.md), you would add a `.d.ts` containing:

```ts
import {ChartType, Plugin} from 'chart.js';
declare module 'chart.js' {
interface PluginOptions {
customCanvasBackgroundColor?: {
color?: string
}
}
}
```

```ts
import {ChartType} from 'chart.js';

declare module 'chart.js' {
interface PluginOptionsByType<TType extends ChartType> {
Expand Down
10 changes: 7 additions & 3 deletions src/types/index.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2934,16 +2934,20 @@ export interface TooltipItem<TType extends ChartType> {
}

export interface PluginOptionsByType<TType extends ChartType> {
legend: LegendOptions<TType>;
tooltip: TooltipOptions<TType>;
}

export interface PluginOptions {
colors: ColorsPluginOptions;
decimation: DecimationOptions;
filler: FillerOptions;
legend: LegendOptions<TType>;
subtitle: TitleOptions;
title: TitleOptions;
tooltip: TooltipOptions<TType>;
}

export interface PluginChartOptions<TType extends ChartType> {
plugins: PluginOptionsByType<TType>;
plugins: PluginOptionsByType<TType> | PluginOptions;
}

export interface BorderOptions {
Expand Down

0 comments on commit 02c4684

Please sign in to comment.