From 4f7179a626a5e89382a21757f8d7a2682c3fe180 Mon Sep 17 00:00:00 2001 From: Ben McCann <322311+benmccann@users.noreply.github.com> Date: Fri, 1 Jan 2021 22:46:49 -0800 Subject: [PATCH] Standardize type declaration indentation with tabs (#8263) --- types/geometric.d.ts | 12 +- types/helpers/helpers.canvas.d.ts | 122 +- types/helpers/helpers.collection.d.ts | 10 +- types/helpers/helpers.color.d.ts | 44 +- types/helpers/helpers.core.d.ts | 36 +- types/helpers/helpers.curve.d.ts | 26 +- types/helpers/helpers.dom.d.ts | 20 +- types/helpers/helpers.math.d.ts | 4 +- types/helpers/helpers.options.d.ts | 12 +- types/helpers/helpers.rtl.d.ts | 10 +- types/index.esm.d.ts | 3406 ++++++++++++------------- types/layout.d.ts | 26 +- 12 files changed, 1864 insertions(+), 1864 deletions(-) diff --git a/types/geometric.d.ts b/types/geometric.d.ts index 77e0a6847..3758c7e7b 100644 --- a/types/geometric.d.ts +++ b/types/geometric.d.ts @@ -1,11 +1,11 @@ export interface ChartArea { - top: number; - left: number; - right: number; - bottom: number; + top: number; + left: number; + right: number; + bottom: number; } export interface Point { - x: number; - y: number; + x: number; + y: number; } diff --git a/types/helpers/helpers.canvas.d.ts b/types/helpers/helpers.canvas.d.ts index 13a9772c0..2d889df9f 100644 --- a/types/helpers/helpers.canvas.d.ts +++ b/types/helpers/helpers.canvas.d.ts @@ -10,10 +10,10 @@ export function clipArea(ctx: CanvasRenderingContext2D, area: ChartArea): void; export function unclipArea(ctx: CanvasRenderingContext2D): void; export interface DrawPointOptions { - pointStyle: PointStyle; - rotation?: number; - radius: number; - borderWidth: number; + pointStyle: PointStyle; + rotation?: number; + radius: number; + borderWidth: number; } export function drawPoint(ctx: CanvasRenderingContext2D, options: DrawPointOptions, x: number, y: number): void; @@ -26,74 +26,74 @@ export function drawPoint(ctx: CanvasRenderingContext2D, options: DrawPointOptio export function toFontString(font: { size: number; family: string; style?: string; weight?: string }): string | null; export interface RenderTextOpts { - /** - * The fill color of the text. If unset, the existing - * fillStyle property of the canvas is unchanged. - */ - color?: Color; + /** + * The fill color of the text. If unset, the existing + * fillStyle property of the canvas is unchanged. + */ + color?: Color; - /** - * The width of the strikethrough / underline - * @default 2 - */ - decorationWidth?: number; + /** + * The width of the strikethrough / underline + * @default 2 + */ + decorationWidth?: number; - /** - * The max width of the text in pixels - */ - maxWidth?: number; + /** + * The max width of the text in pixels + */ + maxWidth?: number; - /** - * A rotation to be applied to the canvas - * This is applied after the translation is applied - */ - rotation?: number; + /** + * A rotation to be applied to the canvas + * This is applied after the translation is applied + */ + rotation?: number; - /** - * Apply a strikethrough effect to the text - */ - strikethrough?: boolean; + /** + * Apply a strikethrough effect to the text + */ + strikethrough?: boolean; - /** - * The color of the text stroke. If unset, the existing - * strokeStyle property of the context is unchanged - */ - strokeColor?: Color; + /** + * The color of the text stroke. If unset, the existing + * strokeStyle property of the context is unchanged + */ + strokeColor?: Color; - /** - * The text stroke width. If unset, the existing - * lineWidth property of the context is unchanged - */ - strokeWidth?: number; + /** + * The text stroke width. If unset, the existing + * lineWidth property of the context is unchanged + */ + strokeWidth?: number; - /** - * The text alignment to use. If unset, the existing - * textAlign property of the context is unchanged - */ - textAlign: CanvasTextAlign; + /** + * The text alignment to use. If unset, the existing + * textAlign property of the context is unchanged + */ + textAlign: CanvasTextAlign; - /** - * The text baseline to use. If unset, the existing - * textBaseline property of the context is unchanged - */ - textBaseline: CanvasTextBaseline; + /** + * The text baseline to use. If unset, the existing + * textBaseline property of the context is unchanged + */ + textBaseline: CanvasTextBaseline; - /** - * If specified, a translation to apply to the context - */ - translation?: [number, number]; + /** + * If specified, a translation to apply to the context + */ + translation?: [number, number]; - /** - * Underline the text - */ - underline?: boolean; + /** + * Underline the text + */ + underline?: boolean; } export function renderText( - ctx: CanvasRenderingContext2D, - text: string | string[], - x: number, - y: number, - font: CanvasFontSpec, - opts?: RenderTextOpts + ctx: CanvasRenderingContext2D, + text: string | string[], + x: number, + y: number, + font: CanvasFontSpec, + opts?: RenderTextOpts ): void; diff --git a/types/helpers/helpers.collection.d.ts b/types/helpers/helpers.collection.d.ts index 6a51597c9..a617a2b48 100644 --- a/types/helpers/helpers.collection.d.ts +++ b/types/helpers/helpers.collection.d.ts @@ -1,9 +1,9 @@ export interface ArrayListener { - _onDataPush?(...item: T[]): void; - _onDataPop?(): void; - _onDataShift?(): void; - _onDataSplice?(index: number, deleteCount: number, ...items: T[]): void; - _onDataUnshift?(...item: T[]): void; + _onDataPush?(...item: T[]): void; + _onDataPop?(): void; + _onDataShift?(): void; + _onDataSplice?(index: number, deleteCount: number, ...items: T[]): void; + _onDataUnshift?(...item: T[]): void; } /** diff --git a/types/helpers/helpers.color.d.ts b/types/helpers/helpers.color.d.ts index 89c928613..1f6282e52 100644 --- a/types/helpers/helpers.color.d.ts +++ b/types/helpers/helpers.color.d.ts @@ -2,30 +2,30 @@ export function color(value: CanvasGradient): CanvasGradient; export function color(value: CanvasPattern): CanvasPattern; export interface ColorModel { - rgbString(): string; - hexString(): string; - hslString(): string; - rgb: { r: number; g: number; b: number; a: number }; - valid: boolean; - mix(color: ColorModel, weight: number): this; - clone(): ColorModel; - alpha(a: number): ColorModel; - clearer(ration: number): ColorModel; - greyscale(): ColorModel; - opaquer(ratio: number): ColorModel; - negate(): ColorModel; - lighten(ratio: number): ColorModel; - darken(ratio: number): ColorModel; - saturate(ratio: number): ColorModel; - desaturate(ratio: number): ColorModel; - rotate(deg: number): this; + rgbString(): string; + hexString(): string; + hslString(): string; + rgb: { r: number; g: number; b: number; a: number }; + valid: boolean; + mix(color: ColorModel, weight: number): this; + clone(): ColorModel; + alpha(a: number): ColorModel; + clearer(ration: number): ColorModel; + greyscale(): ColorModel; + opaquer(ratio: number): ColorModel; + negate(): ColorModel; + lighten(ratio: number): ColorModel; + darken(ratio: number): ColorModel; + saturate(ratio: number): ColorModel; + desaturate(ratio: number): ColorModel; + rotate(deg: number): this; } export function color( - value: - | string - | { r: number; g: number; b: number; a: number } - | [number, number, number] - | [number, number, number, number] + value: + | string + | { r: number; g: number; b: number; a: number } + | [number, number, number] + | [number, number, number, number] ): ColorModel; export function getHoverColor(value: CanvasGradient): CanvasGradient; diff --git a/types/helpers/helpers.core.d.ts b/types/helpers/helpers.core.d.ts index 01852f63c..d96f84b75 100644 --- a/types/helpers/helpers.core.d.ts +++ b/types/helpers/helpers.core.d.ts @@ -32,7 +32,7 @@ export function isArray(value: any): value is ArrayLike; export function isObject(value: any): value is object; /** * Returns true if `value` is a finite number, else returns false - * @param {*} value - The value to test. + * @param {*} value - The value to test. * @returns {boolean} */ export function isFinite(value: any): value is number; @@ -52,9 +52,9 @@ export function valueOrDefault(value: T | undefined, defaultValue: T): T; * @returns {*} */ export function callback R, TA, R>( - fn: T | undefined, - args: any[], - thisArg?: TA + fn: T | undefined, + args: any[], + thisArg?: TA ): R | undefined; /** @@ -62,30 +62,30 @@ export function callback R, TA, R>( * is unknown or in none intensive code (not called often and small loopable). Else * it's preferable to use a regular for() loop and save extra function calls. * @param loopable - The object or array to be iterated. - * @param fn - The function to call for each item. + * @param fn - The function to call for each item. * @param [thisArg] - The value of `this` provided for the call to `fn`. * @param [reverse] - If true, iterates backward on the loopable. */ export function each( - loopable: T[], - fn: (this: TA, v: T, i: number) => void, - thisArg?: TA, - reverse?: boolean + loopable: T[], + fn: (this: TA, v: T, i: number) => void, + thisArg?: TA, + reverse?: boolean ): void; /** * Note(SB) for performance sake, this method should only be used when loopable type * is unknown or in none intensive code (not called often and small loopable). Else * it's preferable to use a regular for() loop and save extra function calls. * @param loopable - The object or array to be iterated. - * @param fn - The function to call for each item. + * @param fn - The function to call for each item. * @param [thisArg] - The value of `this` provided for the call to `fn`. * @param [reverse] - If true, iterates backward on the loopable. */ export function each( - loopable: { [key: string]: T }, - fn: (this: TA, v: T, k: string) => void, - thisArg?: TA, - reverse?: boolean + loopable: { [key: string]: T }, + fn: (this: TA, v: T, k: string) => void, + thisArg?: TA, + reverse?: boolean ): void; /** @@ -95,7 +95,7 @@ export function each( export function clone(source: T): T; export interface MergeOptions { - merger?: (key: string, target: any, source: any, options: any) => any; + merger?: (key: string, target: any, source: any, options: any) => any; } /** * Recursively deep copies `source` properties into `target` with the given `options`. @@ -112,9 +112,9 @@ export function merge(target: T, source: [S1], options?: MergeOptions): T export function merge(target: T, source: [S1, S2], options?: MergeOptions): T & S1 & S2; export function merge(target: T, source: [S1, S2, S3], options?: MergeOptions): T & S1 & S2 & S3; export function merge( - target: T, - source: [S1, S2, S3, S4], - options?: MergeOptions + target: T, + source: [S1, S2, S3, S4], + options?: MergeOptions ): T & S1 & S2 & S3 & S4; export function merge(target: T, source: any[], options?: MergeOptions): any; diff --git a/types/helpers/helpers.curve.d.ts b/types/helpers/helpers.curve.d.ts index 0e86e24ec..55a5efa21 100644 --- a/types/helpers/helpers.curve.d.ts +++ b/types/helpers/helpers.curve.d.ts @@ -1,6 +1,6 @@ export interface SplinePoint { - x: number; - y: number; + x: number; + y: number; } /** @@ -8,21 +8,21 @@ export interface SplinePoint { * http://scaledinnovation.com/analytics/splines/aboutSplines.html */ export function splineCurve( - firstPoint: SplinePoint & { skip?: boolean }, - middlePoint: SplinePoint, - afterPoint: SplinePoint, - t: number + firstPoint: SplinePoint & { skip?: boolean }, + middlePoint: SplinePoint, + afterPoint: SplinePoint, + t: number ): { - previous: SplinePoint; - next: SplinePoint; + previous: SplinePoint; + next: SplinePoint; }; export interface MonotoneSplinePoint extends SplinePoint { - skip: boolean; - controlPointPreviousX?: number; - controlPointPreviousY?: number; - controlPointNextX?: number; - controlPointNextY?: number; + skip: boolean; + controlPointPreviousX?: number; + controlPointPreviousY?: number; + controlPointNextX?: number; + controlPointNextY?: number; } /** diff --git a/types/helpers/helpers.dom.d.ts b/types/helpers/helpers.dom.d.ts index 32ad47783..98482ab6a 100644 --- a/types/helpers/helpers.dom.d.ts +++ b/types/helpers/helpers.dom.d.ts @@ -1,16 +1,16 @@ export function getMaximumSize(node: HTMLElement, width?: number, height?: number, aspectRatio?: number): { width: number, height: number }; export function getRelativePosition( - evt: MouseEvent, - chart: { readonly canvas: HTMLCanvasElement } + evt: MouseEvent, + chart: { readonly canvas: HTMLCanvasElement } ): { x: number; y: number }; export function getStyle(el: HTMLElement, property: string): string; export function retinaScale( - chart: { - currentDevicePixelRatio: number; - readonly canvas: HTMLCanvasElement; - readonly width: number; - readonly height: number; - readonly ctx: CanvasRenderingContext2D; - }, - forceRatio: number + chart: { + currentDevicePixelRatio: number; + readonly canvas: HTMLCanvasElement; + readonly width: number; + readonly height: number; + readonly ctx: CanvasRenderingContext2D; + }, + forceRatio: number ): void; diff --git a/types/helpers/helpers.math.d.ts b/types/helpers/helpers.math.d.ts index 784f00735..35cb65328 100644 --- a/types/helpers/helpers.math.d.ts +++ b/types/helpers/helpers.math.d.ts @@ -9,8 +9,8 @@ export function toDegrees(radians: number): number; * Gets the angle from vertical upright to the point about a centre. */ export function getAngleFromPoint( - centrePoint: { x: number; y: number }, - anglePoint: { x: number; y: number } + centrePoint: { x: number; y: number }, + anglePoint: { x: number; y: number } ): { angle: number; distance: number }; export function distanceBetweenPoints(pt1: { x: number; y: number }, pt2: { x: number; y: number }): number; diff --git a/types/helpers/helpers.options.d.ts b/types/helpers/helpers.options.d.ts index dc1b34bc1..72a5fb2fe 100644 --- a/types/helpers/helpers.options.d.ts +++ b/types/helpers/helpers.options.d.ts @@ -1,7 +1,7 @@ import { FontSpec } from '../index.esm'; export interface CanvasFontSpec extends FontSpec { - string: string; + string: string; } /** * Parses font options and returns the font object. @@ -28,7 +28,7 @@ export function toLineHeight(value: string, size: number): number; * @since 2.7.0 */ export function toPadding( - value?: number | { top?: number; left?: number; right?: number; bottom?: number } + value?: number | { top?: number; left?: number; right?: number; bottom?: number } ): { top: number; left: number; right: number; bottom: number; width: number; height: number }; /** @@ -43,8 +43,8 @@ export function toPadding( * @since 2.7.0 */ export function resolve( - inputs: undefined | T | ((c: C) => T) | readonly T[], - context?: C, - index?: number, - info?: { cacheable?: boolean } + inputs: undefined | T | ((c: C) => T) | readonly T[], + context?: C, + index?: number, + info?: { cacheable?: boolean } ): T | undefined; diff --git a/types/helpers/helpers.rtl.d.ts b/types/helpers/helpers.rtl.d.ts index ed0b9248f..f366105bb 100644 --- a/types/helpers/helpers.rtl.d.ts +++ b/types/helpers/helpers.rtl.d.ts @@ -1,9 +1,9 @@ export interface RTLAdapter { - x(x: number): number; - setWidth(w: number): void; - textAlign(align: 'center' | 'left' | 'right'): 'center' | 'left' | 'right'; - xPlus(x: number, value: number): number; - leftForLtr(x: number, itemWidth: number): number; + x(x: number): number; + setWidth(w: number): void; + textAlign(align: 'center' | 'left' | 'right'): 'center' | 'left' | 'right'; + xPlus(x: number, value: number): number; + leftForLtr(x: number, itemWidth: number): number; } export function getRtlAdapter(rtl: boolean, rectX: number, width: number): RTLAdapter; diff --git a/types/index.esm.d.ts b/types/index.esm.d.ts index 081040395..0cfc455bf 100644 --- a/types/index.esm.d.ts +++ b/types/index.esm.d.ts @@ -1,5 +1,5 @@ /** - * Top-level type definitions. These are processed by Rollup and rollup-plugin-dts + * Top-level type definitions. These are processed by Rollup and rollup-plugin-dts * to make a combined .d.ts file under dist; that way, all of the type definitions * appear directly within the "chart.js" module; that matches the layout of the * distributed chart.esm.js bundle and means that users of Chart.js can easily use @@ -8,7 +8,7 @@ * * @example * declare module "chart.js" { - * // Add types here + * // Add types here * } */ @@ -19,9 +19,9 @@ import { Element }from './element'; import { ChartArea, Point } from './geometric'; import { LayoutItem, LayoutPosition } from './layout'; import { - Scriptable, - ScriptableOptions, - ScriptableAndArrayOptions + Scriptable, + ScriptableOptions, + ScriptableAndArrayOptions } from './scriptable'; export { DateAdapterBase, DateAdapter, TimeUnit, _adapters } from './adapters'; @@ -31,277 +31,277 @@ export { Element } from './element'; export { ChartArea, Point } from './geometric'; export { LayoutItem, LayoutPosition } from './layout'; export { - Scriptable, - ScriptableOptions, - ScriptableAndArray, - ScriptableAndArrayOptions + Scriptable, + ScriptableOptions, + ScriptableAndArray, + ScriptableAndArrayOptions } from './scriptable'; export interface ScriptableContext { - chart: Chart; - dataPoint: any; - dataIndex: number; - dataset: ChartDataset; - datasetIndex: number; - active: boolean; + chart: Chart; + dataPoint: any; + dataIndex: number; + dataset: ChartDataset; + datasetIndex: number; + active: boolean; } export interface ParsingOptions { - /** - * How to parse the dataset. The parsing can be disabled by specifying parsing: false at chart options or dataset. If parsing is disabled, data must be sorted and in the formats the associated chart type and scales use internally. - */ - parsing: - { - [key: string]: string; - } - | false; + /** + * How to parse the dataset. The parsing can be disabled by specifying parsing: false at chart options or dataset. If parsing is disabled, data must be sorted and in the formats the associated chart type and scales use internally. + */ + parsing: + { + [key: string]: string; + } + | false; - /** - * Chart.js is fastest if you provide data with indices that are unique, sorted, and consistent across datasets and provide the normalized: true option to let Chart.js know that you have done so. - */ - normalized: boolean; + /** + * Chart.js is fastest if you provide data with indices that are unique, sorted, and consistent across datasets and provide the normalized: true option to let Chart.js know that you have done so. + */ + normalized: boolean; } export interface ControllerDatasetOptions extends ParsingOptions { - /** - * How to clip relative to chartArea. Positive value allows overflow, negative value clips that many pixels inside chartArea. 0 = clip at chartArea. Clipping can also be configured per side: clip: {left: 5, top: false, right: -2, bottom: 0} - */ - clip: number | ChartArea; - /** - * The label for the dataset which appears in the legend and tooltips. - */ - label: string; - /** - * The drawing order of dataset. Also affects order for stacking, tooltip and legend. - */ - order: number; + /** + * How to clip relative to chartArea. Positive value allows overflow, negative value clips that many pixels inside chartArea. 0 = clip at chartArea. Clipping can also be configured per side: clip: {left: 5, top: false, right: -2, bottom: 0} + */ + clip: number | ChartArea; + /** + * The label for the dataset which appears in the legend and tooltips. + */ + label: string; + /** + * The drawing order of dataset. Also affects order for stacking, tooltip and legend. + */ + order: number; - /** - * The ID of the group to which this dataset belongs to (when stacked, each group will be a separate stack). - */ - stack: string; + /** + * The ID of the group to which this dataset belongs to (when stacked, each group will be a separate stack). + */ + stack: string; } export interface BarControllerDatasetOptions - extends ControllerDatasetOptions, - ScriptableAndArrayOptions, - ScriptableAndArrayOptions { - /** - * The base axis of the dataset. 'x' for vertical bars and 'y' for horizontal bars. - * @default 'x' - */ - indexAxis: 'x' | 'y'; - /** - * The ID of the x axis to plot this dataset on. - */ - xAxisID: string; - /** - * The ID of the y axis to plot this dataset on. - */ - yAxisID: string; + extends ControllerDatasetOptions, + ScriptableAndArrayOptions, + ScriptableAndArrayOptions { + /** + * The base axis of the dataset. 'x' for vertical bars and 'y' for horizontal bars. + * @default 'x' + */ + indexAxis: 'x' | 'y'; + /** + * The ID of the x axis to plot this dataset on. + */ + xAxisID: string; + /** + * The ID of the y axis to plot this dataset on. + */ + yAxisID: string; - /** - * Percent (0-1) of the available width each bar should be within the category width. 1.0 will take the whole category width and put the bars right next to each other. - * @default 0.9 - */ - barPercentage: number; - /** - * Percent (0-1) of the available width each category should be within the sample width. - * @default 0.8 - */ - categoryPercentage: number; + /** + * Percent (0-1) of the available width each bar should be within the category width. 1.0 will take the whole category width and put the bars right next to each other. + * @default 0.9 + */ + barPercentage: number; + /** + * Percent (0-1) of the available width each category should be within the sample width. + * @default 0.8 + */ + categoryPercentage: number; - /** - * Manually set width of each bar in pixels. If set to 'flex', it computes "optimal" sample widths that globally arrange bars side by side. If not set (default), bars are equally sized based on the smallest interval. - */ - barThickness: number | 'flex'; + /** + * Manually set width of each bar in pixels. If set to 'flex', it computes "optimal" sample widths that globally arrange bars side by side. If not set (default), bars are equally sized based on the smallest interval. + */ + barThickness: number | 'flex'; - /** - * Set this to ensure that bars are not sized thicker than this. - */ - maxBarThickness: number; + /** + * Set this to ensure that bars are not sized thicker than this. + */ + maxBarThickness: number; - /** - * Set this to ensure that bars have a minimum length in pixels. - */ - minBarLength: number; + /** + * Set this to ensure that bars have a minimum length in pixels. + */ + minBarLength: number; } export interface BarControllerChartOptions { - /** - * Should null or undefined values be omitted from drawing - */ - skipNull?: boolean; + /** + * Should null or undefined values be omitted from drawing + */ + skipNull?: boolean; } export interface BarController extends DatasetController {} export const BarController: ChartComponent & { - prototype: BarController; - new (chart: Chart, datasetIndex: number): BarController; + prototype: BarController; + new (chart: Chart, datasetIndex: number): BarController; }; export interface BubbleControllerDatasetOptions - extends ControllerDatasetOptions, - ScriptableAndArrayOptions, - ScriptableAndArrayOptions {} + extends ControllerDatasetOptions, + ScriptableAndArrayOptions, + ScriptableAndArrayOptions {} export interface BubbleDataPoint { - /** - * X Value - */ - x: number; + /** + * X Value + */ + x: number; - /** - * Y Value - */ - y: number; + /** + * Y Value + */ + y: number; - /** - * Bubble radius in pixels (not scaled). - */ - r: number; + /** + * Bubble radius in pixels (not scaled). + */ + r: number; } export interface BubbleController extends DatasetController {} export const BubbleController: ChartComponent & { - prototype: BubbleController; - new (chart: Chart, datasetIndex: number): BubbleController; + prototype: BubbleController; + new (chart: Chart, datasetIndex: number): BubbleController; }; export interface LineControllerDatasetOptions - extends ControllerDatasetOptions, - ScriptableAndArrayOptions, - ScriptableAndArrayOptions, - ScriptableOptions, - ScriptableOptions { - /** - * The ID of the x axis to plot this dataset on. - */ - xAxisID: string; - /** - * The ID of the y axis to plot this dataset on. - */ - yAxisID: string; + extends ControllerDatasetOptions, + ScriptableAndArrayOptions, + ScriptableAndArrayOptions, + ScriptableOptions, + ScriptableOptions { + /** + * The ID of the x axis to plot this dataset on. + */ + xAxisID: string; + /** + * The ID of the y axis to plot this dataset on. + */ + yAxisID: string; - /** - * If true, lines will be drawn between points with no or null data. If false, points with NaN data will create a break in the line. Can also be a number specifying the maximum gap length to span. The unit of the value depends on the scale used. - * @default false - */ - spanGaps: boolean | number; + /** + * If true, lines will be drawn between points with no or null data. If false, points with NaN data will create a break in the line. Can also be a number specifying the maximum gap length to span. The unit of the value depends on the scale used. + * @default false + */ + spanGaps: boolean | number; - showLine: boolean; + showLine: boolean; } export interface LineControllerChartOptions { - /** - * If true, lines will be drawn between points with no or null data. If false, points with NaN data will create a break in the line. Can also be a number specifying the maximum gap length to span. The unit of the value depends on the scale used. - * @default false - */ - spanGaps: boolean | number; - /** - * If false, the lines between points are not drawn. - * @default true - */ - showLine: boolean; + /** + * If true, lines will be drawn between points with no or null data. If false, points with NaN data will create a break in the line. Can also be a number specifying the maximum gap length to span. The unit of the value depends on the scale used. + * @default false + */ + spanGaps: boolean | number; + /** + * If false, the lines between points are not drawn. + * @default true + */ + showLine: boolean; } export interface LineController extends DatasetController {} export const LineController: ChartComponent & { - prototype: LineController; - new (chart: Chart, datasetIndex: number): LineController; + prototype: LineController; + new (chart: Chart, datasetIndex: number): LineController; }; export type ScatterControllerDatasetOptions = LineControllerDatasetOptions; export interface ScatterDataPoint { - x: number; - y: number; + x: number; + y: number; } export type ScatterControllerChartOptions = LineControllerChartOptions; export interface ScatterController extends LineController {} export const ScatterController: ChartComponent & { - prototype: ScatterController; - new (chart: Chart, datasetIndex: number): ScatterController; + prototype: ScatterController; + new (chart: Chart, datasetIndex: number): ScatterController; }; export interface DoughnutControllerDatasetOptions - extends ControllerDatasetOptions, - ScriptableAndArrayOptions, - ScriptableAndArrayOptions { + extends ControllerDatasetOptions, + ScriptableAndArrayOptions, + ScriptableAndArrayOptions { - /** - * Sweep to allow arcs to cover. - * @default 2 * Math.PI - */ - circumference: number; + /** + * Sweep to allow arcs to cover. + * @default 2 * Math.PI + */ + circumference: number; - /** - * Starting angle to draw this dataset from. - * @default -0.5 * Math.PI - */ - rotation: number; + /** + * Starting angle to draw this dataset from. + * @default -0.5 * Math.PI + */ + rotation: number; - /** - * The relative thickness of the dataset. Providing a value for weight will cause the pie or doughnut dataset to be drawn with a thickness relative to the sum of all the dataset weight values. - * @default 1 - */ - weight: number; + /** + * The relative thickness of the dataset. Providing a value for weight will cause the pie or doughnut dataset to be drawn with a thickness relative to the sum of all the dataset weight values. + * @default 1 + */ + weight: number; } export interface DoughnutAnimationOptions { - /** - * If true, the chart will animate in with a rotation animation. This property is in the options.animation object. - * @default true - */ - animateRotate: boolean; + /** + * If true, the chart will animate in with a rotation animation. This property is in the options.animation object. + * @default true + */ + animateRotate: boolean; - /** - * If true, will animate scaling the chart from the center outwards. - * @default false - */ - animateScale: boolean; + /** + * If true, will animate scaling the chart from the center outwards. + * @default false + */ + animateScale: boolean; } export interface DoughnutControllerChartOptions { - /** - * The percentage of the chart that is cut out of the middle. (50 - for doughnut, 0 - for pie) - * @default 50 - */ - cutoutPercentage: number; + /** + * The percentage of the chart that is cut out of the middle. (50 - for doughnut, 0 - for pie) + * @default 50 + */ + cutoutPercentage: number; - /** - * Starting angle to draw arcs from. - * @default -0.5 * Math.PI - */ - rotation: number; + /** + * Starting angle to draw arcs from. + * @default -0.5 * Math.PI + */ + rotation: number; - /** - * Sweep to allow arcs to cover. - * @default 2 * Math.PI - */ - circumference: number; + /** + * Sweep to allow arcs to cover. + * @default 2 * Math.PI + */ + circumference: number; - animation: DoughnutAnimationOptions; + animation: DoughnutAnimationOptions; } export type DoughnutDataPoint = number; export interface DoughnutController extends DatasetController { - readonly innerRadius: number; - readonly outerRadius: number; - readonly offsetX: number; - readonly offsetY: number; + readonly innerRadius: number; + readonly outerRadius: number; + readonly offsetX: number; + readonly offsetY: number; - getRingIndex(datasetIndex: number): number; - calculateTotal(): number; - calculateCircumference(value: number): number; + getRingIndex(datasetIndex: number): number; + calculateTotal(): number; + calculateCircumference(value: number): number; } export const DoughnutController: ChartComponent & { - prototype: DoughnutController; - new (chart: Chart, datasetIndex: number): DoughnutController; + prototype: DoughnutController; + new (chart: Chart, datasetIndex: number): DoughnutController; }; export type PieControllerDatasetOptions = DoughnutControllerDatasetOptions; @@ -312,70 +312,70 @@ export type PieDataPoint = DoughnutDataPoint; export interface PieController extends DoughnutController {} export const PieController: ChartComponent & { - prototype: PieController; - new (chart: Chart, datasetIndex: number): PieController; + prototype: PieController; + new (chart: Chart, datasetIndex: number): PieController; }; export interface PolarAreaControllerDatasetOptions extends DoughnutControllerDatasetOptions { - /** - * Arc angle to cover. - for polar only - * @default circumference / (arc count) - */ - angle: number; + /** + * Arc angle to cover. - for polar only + * @default circumference / (arc count) + */ + angle: number; } export type PolarAreaAnimationOptions = DoughnutAnimationOptions; export interface PolarAreaControllerChartOptions { - /** - * Starting angle to draw arcs for the first item in a dataset. In degrees, 0 is at top. - * @default 0 - */ - startAngle: number; + /** + * Starting angle to draw arcs for the first item in a dataset. In degrees, 0 is at top. + * @default 0 + */ + startAngle: number; - animation: PolarAreaAnimationOptions; + animation: PolarAreaAnimationOptions; } export interface PolarAreaController extends DoughnutController { - countVisibleElements(): number; + countVisibleElements(): number; } export const PolarAreaController: ChartComponent & { - prototype: PolarAreaController; - new (chart: Chart, datasetIndex: number): PolarAreaController; + prototype: PolarAreaController; + new (chart: Chart, datasetIndex: number): PolarAreaController; }; export interface RadarControllerDatasetOptions - extends ControllerDatasetOptions, - ScriptableOptions, - ScriptableOptions, - ScriptableOptions, - ScriptableOptions { - /** - * The ID of the x axis to plot this dataset on. - */ - xAxisID: string; - /** - * The ID of the y axis to plot this dataset on. - */ - yAxisID: string; + extends ControllerDatasetOptions, + ScriptableOptions, + ScriptableOptions, + ScriptableOptions, + ScriptableOptions { + /** + * The ID of the x axis to plot this dataset on. + */ + xAxisID: string; + /** + * The ID of the y axis to plot this dataset on. + */ + yAxisID: string; - /** - * If true, lines will be drawn between points with no or null data. If false, points with NaN data will create a break in the line. Can also be a number specifying the maximum gap length to span. The unit of the value depends on the scale used. - */ - spanGaps: boolean | number; + /** + * If true, lines will be drawn between points with no or null data. If false, points with NaN data will create a break in the line. Can also be a number specifying the maximum gap length to span. The unit of the value depends on the scale used. + */ + spanGaps: boolean | number; - /** - * If false, the line is not drawn for this dataset. - */ - showLine: boolean; + /** + * If false, the line is not drawn for this dataset. + */ + showLine: boolean; } export type RadarControllerChartOptions = LineControllerChartOptions; export interface RadarController extends DatasetController {} export const RadarController: ChartComponent & { - prototype: RadarController; - new (chart: Chart, datasetIndex: number): RadarController; + prototype: RadarController; + new (chart: Chart, datasetIndex: number): RadarController; }; export interface ChartMeta { type: string; @@ -619,7 +619,7 @@ export interface Defaults extends CoreChartOptions, ElementChartOptions { * Example: * * defaults.route('elements.arc', 'backgroundColor', '', 'color') - * - reads the backgroundColor from defaults.color when undefined locally + * - reads the backgroundColor from defaults.color when undefined locally * * @param scope Scope this route applies to. * @param name Property name that should be routed to different namespace when not defined here. @@ -1268,179 +1268,179 @@ export interface TypedRegistry { } export interface ChartEvent { - type: - | 'contextmenu' - | 'mouseenter' - | 'mousedown' - | 'mousemove' - | 'mouseup' - | 'mouseout' - | 'click' - | 'dblclick' - | 'keydown' - | 'keypress' - | 'keyup' - | 'resize'; - native: Event | null; - x: number | null; - y: number | null; + type: + | 'contextmenu' + | 'mouseenter' + | 'mousedown' + | 'mousemove' + | 'mouseup' + | 'mouseout' + | 'click' + | 'dblclick' + | 'keydown' + | 'keypress' + | 'keyup' + | 'resize'; + native: Event | null; + x: number | null; + y: number | null; } export interface ChartComponent { - id: string; - defaults?: any; - defaultRoutes?: { [property: string]: string }; + id: string; + defaults?: any; + defaultRoutes?: { [property: string]: string }; - beforeRegister?(): void; - afterRegister?(): void; - beforeUnregister?(): void; - afterUnregister?(): void; + beforeRegister?(): void; + afterRegister?(): void; + beforeUnregister?(): void; + afterUnregister?(): void; } export interface CoreInteractionOptions { - /** - * Sets which elements appear in the tooltip. See Interaction Modes for details. - * @default 'nearest' - */ - mode: InteractionMode; - /** - * if true, the hover mode only applies when the mouse position intersects an item on the chart. - * @default true - */ - intersect: boolean; + /** + * Sets which elements appear in the tooltip. See Interaction Modes for details. + * @default 'nearest' + */ + mode: InteractionMode; + /** + * if true, the hover mode only applies when the mouse position intersects an item on the chart. + * @default true + */ + intersect: boolean; - /** - * Can be set to 'x', 'y', or 'xy' to define which directions are used in calculating distances. Defaults to 'x' for 'index' mode and 'xy' in dataset and 'nearest' modes. - */ - axis: 'x' | 'y' | 'xy'; + /** + * Can be set to 'x', 'y', or 'xy' to define which directions are used in calculating distances. Defaults to 'x' for 'index' mode and 'xy' in dataset and 'nearest' modes. + */ + axis: 'x' | 'y' | 'xy'; } export interface HoverInteractionOptions extends CoreInteractionOptions { - /** - * Called when any of the events fire. Passed the event, an array of active elements (bars, points, etc), and the chart. - */ - onHover(event: ChartEvent, elements: ActiveElement[], chart: Chart): void; + /** + * Called when any of the events fire. Passed the event, an array of active elements (bars, points, etc), and the chart. + */ + onHover(event: ChartEvent, elements: ActiveElement[], chart: Chart): void; } export interface CoreChartOptions extends ParsingOptions { - animation: Scriptable; + animation: Scriptable; - datasets: { - animation: Scriptable; - }; + datasets: { + animation: Scriptable; + }; - /** - * base color - * @see Defaults.color - */ - color: Color; - /** - * base background color - * @see Defaults.backgroundColor - */ - backgroundColor: Color; - /** - * base border color - * @see Defaults.borderColor - */ - borderColor: Color; - /** - * base font - * @see Defaults.font - */ - font: FontSpec; - /** - * Resizes the chart canvas when its container does (important note...). - * @default true - */ - responsive: boolean; - /** - * Maintain the original canvas aspect ratio (width / height) when resizing. - * @default true - */ - maintainAspectRatio: boolean; + /** + * base color + * @see Defaults.color + */ + color: Color; + /** + * base background color + * @see Defaults.backgroundColor + */ + backgroundColor: Color; + /** + * base border color + * @see Defaults.borderColor + */ + borderColor: Color; + /** + * base font + * @see Defaults.font + */ + font: FontSpec; + /** + * Resizes the chart canvas when its container does (important note...). + * @default true + */ + responsive: boolean; + /** + * Maintain the original canvas aspect ratio (width / height) when resizing. + * @default true + */ + maintainAspectRatio: boolean; - /** - * Canvas aspect ratio (i.e. width / height, a value of 1 representing a square canvas). Note that this option is ignored if the height is explicitly defined either as attribute or via the style. - * @default 2 - */ - aspectRatio: number; + /** + * Canvas aspect ratio (i.e. width / height, a value of 1 representing a square canvas). Note that this option is ignored if the height is explicitly defined either as attribute or via the style. + * @default 2 + */ + aspectRatio: number; - /** - * Locale used for number formatting (using `Intl.NumberFormat`). - * @default user's browser setting - */ - locale: string; + /** + * Locale used for number formatting (using `Intl.NumberFormat`). + * @default user's browser setting + */ + locale: string; - /** - * Called when a resize occurs. Gets passed two arguments: the chart instance and the new size. - */ - onResize(chart: Chart, size: { width: number; height: number }): void; + /** + * Called when a resize occurs. Gets passed two arguments: the chart instance and the new size. + */ + onResize(chart: Chart, size: { width: number; height: number }): void; - /** - * Override the window's default devicePixelRatio. - * @default window.devicePixelRatio - */ - devicePixelRatio: number; + /** + * Override the window's default devicePixelRatio. + * @default window.devicePixelRatio + */ + devicePixelRatio: number; - interaction: CoreInteractionOptions; + interaction: CoreInteractionOptions; - hover: HoverInteractionOptions; + hover: HoverInteractionOptions; - /** - * The events option defines the browser events that the chart should listen to for tooltips and hovering. - * @default ['mousemove', 'mouseout', 'click', 'touchstart', 'touchmove'] - */ - events: ('mousemove' | 'mouseout' | 'click' | 'touchstart' | 'touchmove')[]; + /** + * The events option defines the browser events that the chart should listen to for tooltips and hovering. + * @default ['mousemove', 'mouseout', 'click', 'touchstart', 'touchmove'] + */ + events: ('mousemove' | 'mouseout' | 'click' | 'touchstart' | 'touchmove')[]; - /** - * Called when any of the events fire. Passed the event, an array of active elements (bars, points, etc), and the chart. - */ - onHover(event: ChartEvent, elements: ActiveElement[], chart: Chart): void; + /** + * Called when any of the events fire. Passed the event, an array of active elements (bars, points, etc), and the chart. + */ + onHover(event: ChartEvent, elements: ActiveElement[], chart: Chart): void; - /** - * Called if the event is of type 'mouseup' or 'click'. Passed the event, an array of active elements, and the chart. - */ - onClick(event: ChartEvent, elements: ActiveElement[], chart: Chart): void; + /** + * Called if the event is of type 'mouseup' or 'click'. Passed the event, an array of active elements, and the chart. + */ + onClick(event: ChartEvent, elements: ActiveElement[], chart: Chart): void; - layout: { - padding: Scriptable; - }; + layout: { + padding: Scriptable; + }; - plugins: PluginOptions; + plugins: PluginOptions; } export type EasingFunction = - | 'linear' - | 'easeInQuad' - | 'easeOutQuad' - | 'easeInOutQuad' - | 'easeInCubic' - | 'easeOutCubic' - | 'easeInOutCubic' - | 'easeInQuart' - | 'easeOutQuart' - | 'easeInOutQuart' - | 'easeInQuint' - | 'easeOutQuint' - | 'easeInOutQuint' - | 'easeInSine' - | 'easeOutSine' - | 'easeInOutSine' - | 'easeInExpo' - | 'easeOutExpo' - | 'easeInOutExpo' - | 'easeInCirc' - | 'easeOutCirc' - | 'easeInOutCirc' - | 'easeInElastic' - | 'easeOutElastic' - | 'easeInOutElastic' - | 'easeInBack' - | 'easeOutBack' - | 'easeInOutBack' - | 'easeInBounce' - | 'easeOutBounce' - | 'easeInOutBounce'; + | 'linear' + | 'easeInQuad' + | 'easeOutQuad' + | 'easeInOutQuad' + | 'easeInCubic' + | 'easeOutCubic' + | 'easeInOutCubic' + | 'easeInQuart' + | 'easeOutQuart' + | 'easeInOutQuart' + | 'easeInQuint' + | 'easeOutQuint' + | 'easeInOutQuint' + | 'easeInSine' + | 'easeOutSine' + | 'easeInOutSine' + | 'easeInExpo' + | 'easeOutExpo' + | 'easeInOutExpo' + | 'easeInCirc' + | 'easeOutCirc' + | 'easeInOutCirc' + | 'easeInElastic' + | 'easeOutElastic' + | 'easeInOutElastic' + | 'easeInBack' + | 'easeOutBack' + | 'easeInOutBack' + | 'easeInBounce' + | 'easeOutBounce' + | 'easeInOutBounce'; export interface AnimationCommonSpec { /** @@ -1515,383 +1515,383 @@ export type AnimationOptions = AnimationSpecContainer & { }; export interface FontSpec { - /** - * Default font family for all text, follows CSS font-family options. - * @default "'Helvetica Neue', 'Helvetica', 'Arial', sans-serif" - */ - family: string; - /** - * Default font size (in px) for text. Does not apply to radialLinear scale point labels. - * @default 12 - */ - size: number; - /** - * Default font style. Does not apply to tooltip title or footer. Does not apply to chart title. Follows CSS font-style options (i.e. normal, italic, oblique, initial, inherit) - * @default 'normal' - */ - style: 'normal' | 'italic' | 'oblique' | 'initial' | 'inherit'; - /** - * Default font weight (boldness). (see MDN). - */ - weight: string | null; - /** - * Height of an individual line of text (see MDN). - * @default 1.2 - */ - lineHeight: number | string; + /** + * Default font family for all text, follows CSS font-family options. + * @default "'Helvetica Neue', 'Helvetica', 'Arial', sans-serif" + */ + family: string; + /** + * Default font size (in px) for text. Does not apply to radialLinear scale point labels. + * @default 12 + */ + size: number; + /** + * Default font style. Does not apply to tooltip title or footer. Does not apply to chart title. Follows CSS font-style options (i.e. normal, italic, oblique, initial, inherit) + * @default 'normal' + */ + style: 'normal' | 'italic' | 'oblique' | 'initial' | 'inherit'; + /** + * Default font weight (boldness). (see MDN). + */ + weight: string | null; + /** + * Height of an individual line of text (see MDN). + * @default 1.2 + */ + lineHeight: number | string; } export type TextAlign = 'left' | 'center' | 'right'; export interface VisualElement { - draw(ctx: CanvasRenderingContext2D): void; - inRange(mouseX: number, mouseY: number, useFinalPosition?: boolean): boolean; - inXRange(mouseX: number, useFinalPosition?: boolean): boolean; - inYRange(mouseY: number, useFinalPosition?: boolean): boolean; - getCenterPoint(useFinalPosition?: boolean): { x: number; y: number }; - getRange?(axis: 'x' | 'y'): number; + draw(ctx: CanvasRenderingContext2D): void; + inRange(mouseX: number, mouseY: number, useFinalPosition?: boolean): boolean; + inXRange(mouseX: number, useFinalPosition?: boolean): boolean; + inYRange(mouseY: number, useFinalPosition?: boolean): boolean; + getCenterPoint(useFinalPosition?: boolean): { x: number; y: number }; + getRange?(axis: 'x' | 'y'): number; } export interface CommonOptions { - borderWidth: number; - borderColor: Color; - backgroundColor: Color; + borderWidth: number; + borderColor: Color; + backgroundColor: Color; } export interface CommonHoverOptions { - hoverBorderWidth: number; - hoverBorderColor: Color; - hoverBackgroundColor: Color; + hoverBorderWidth: number; + hoverBorderColor: Color; + hoverBackgroundColor: Color; } export interface Segment { - start: number; - end: number; - loop: boolean; + start: number; + end: number; + loop: boolean; } export interface ArcProps { - x: number; - y: number; - startAngle: number; - endAngle: number; - innerRadius: number; - outerRadius: number; - circumference: number; + x: number; + y: number; + startAngle: number; + endAngle: number; + innerRadius: number; + outerRadius: number; + circumference: number; } export interface ArcOptions extends CommonOptions { - /** - * Arc stroke alignment. - */ - borderAlign: 'center' | 'inner'; - /** - * Arc offset (in pixels). - */ - offset: number; + /** + * Arc stroke alignment. + */ + borderAlign: 'center' | 'inner'; + /** + * Arc offset (in pixels). + */ + offset: number; } export interface ArcHoverOptions extends CommonHoverOptions { - hoverOffset: number; + hoverOffset: number; } export interface ArcElement - extends Element, - VisualElement {} + extends Element, + VisualElement {} export const ArcElement: ChartComponent & { - prototype: ArcElement; - new (cfg: any): ArcElement; + prototype: ArcElement; + new (cfg: any): ArcElement; }; export interface LineProps {} export interface LineOptions extends CommonOptions { - /** - * Line cap style. See MDN. - * @default 'butt' - */ - borderCapStyle: CanvasLineCap; - /** - * Line dash. See MDN. - * @default [] - */ - borderDash: number[]; - /** - * Line dash offset. See MDN. - * @default 0.0 - */ - borderDashOffset: number; - /** - * Line join style. See MDN. - * @default 'miter' - */ - borderJoinStyle: CanvasLineJoin; - /** - * true to keep Bézier control inside the chart, false for no restriction. - * @default true - */ - capBezierPoints: boolean; - /** - * Interpolation mode to apply. - * @default 'default' - */ - cubicInterpolationMode: 'default' | 'monotone'; - /** - * Bézier curve tension (0 for no Bézier curves). - * @default 0 - */ - tension: number; - /** - * true to show the line as a stepped line (tension will be ignored). - * @default false - */ - stepped: 'before' | 'after' | 'middle' | boolean; + /** + * Line cap style. See MDN. + * @default 'butt' + */ + borderCapStyle: CanvasLineCap; + /** + * Line dash. See MDN. + * @default [] + */ + borderDash: number[]; + /** + * Line dash offset. See MDN. + * @default 0.0 + */ + borderDashOffset: number; + /** + * Line join style. See MDN. + * @default 'miter' + */ + borderJoinStyle: CanvasLineJoin; + /** + * true to keep Bézier control inside the chart, false for no restriction. + * @default true + */ + capBezierPoints: boolean; + /** + * Interpolation mode to apply. + * @default 'default' + */ + cubicInterpolationMode: 'default' | 'monotone'; + /** + * Bézier curve tension (0 for no Bézier curves). + * @default 0 + */ + tension: number; + /** + * true to show the line as a stepped line (tension will be ignored). + * @default false + */ + stepped: 'before' | 'after' | 'middle' | boolean; } export interface LineHoverOptions extends CommonHoverOptions { - hoverBorderCapStyle: CanvasLineCap; - hoverBorderDash: number[]; - hoverBorderDashOffset: number; - hoverBorderJoinStyle: CanvasLineJoin; + hoverBorderCapStyle: CanvasLineCap; + hoverBorderDash: number[]; + hoverBorderDashOffset: number; + hoverBorderJoinStyle: CanvasLineJoin; } export interface LineElement - extends Element, - VisualElement { - updateControlPoints(chartArea: ChartArea): void; - points: Point[]; - readonly segments: Segment[]; - first(): Point | false; - last(): Point | false; - interpolate(point: Point, property: 'x' | 'y'): undefined | Point | Point[]; - pathSegment(ctx: CanvasRenderingContext2D, segment: Segment, params: any): undefined | boolean; - path(ctx: CanvasRenderingContext2D): boolean; + extends Element, + VisualElement { + updateControlPoints(chartArea: ChartArea): void; + points: Point[]; + readonly segments: Segment[]; + first(): Point | false; + last(): Point | false; + interpolate(point: Point, property: 'x' | 'y'): undefined | Point | Point[]; + pathSegment(ctx: CanvasRenderingContext2D, segment: Segment, params: any): undefined | boolean; + path(ctx: CanvasRenderingContext2D): boolean; } export const LineElement: ChartComponent & { - prototype: LineElement; - new (cfg: any): LineElement; + prototype: LineElement; + new (cfg: any): LineElement; }; export interface PointProps { - x: number; - y: number; + x: number; + y: number; } export type PointStyle = - | 'circle' - | 'cross' - | 'crossRot' - | 'dash' - | 'line' - | 'rect' - | 'rectRounded' - | 'rectRot' - | 'star' - | 'triangle' - | HTMLImageElement - | HTMLCanvasElement; + | 'circle' + | 'cross' + | 'crossRot' + | 'dash' + | 'line' + | 'rect' + | 'rectRounded' + | 'rectRot' + | 'star' + | 'triangle' + | HTMLImageElement + | HTMLCanvasElement; export interface PointOptions extends CommonOptions { - /** - * Point radius - * @default 3 - */ - radius: number; - /** - * Extra radius added to point radius for hit detection. - * @default 1 - */ - hitRadius: number; - /** - * Point style - * @default 'circle; - */ - pointStyle: PointStyle; - /** - * Point rotation (in degrees). - * @default 0 - */ - rotation: number; + /** + * Point radius + * @default 3 + */ + radius: number; + /** + * Extra radius added to point radius for hit detection. + * @default 1 + */ + hitRadius: number; + /** + * Point style + * @default 'circle; + */ + pointStyle: PointStyle; + /** + * Point rotation (in degrees). + * @default 0 + */ + rotation: number; } export interface PointHoverOptions extends CommonHoverOptions { - /** - * Point radius when hovered. - * @default 4 - */ - hoverRadius: number; + /** + * Point radius when hovered. + * @default 4 + */ + hoverRadius: number; } export interface PointPrefixedOptions { - /** - * The fill color for points. - */ - pointBackgroundColor: Color; - /** - * The border color for points. - */ - pointBorderColor: Color; - /** - * The width of the point border in pixels. - */ - pointBorderWidth: number; - /** - * The pixel size of the non-displayed point that reacts to mouse events. - */ - pointHitRadius: number; - /** - * The radius of the point shape. If set to 0, the point is not rendered. - */ - pointRadius: number; - /** - * The rotation of the point in degrees. - */ - pointRotation: number; - /** - * Style of the point. - */ - pointStyle: PointStyle; + /** + * The fill color for points. + */ + pointBackgroundColor: Color; + /** + * The border color for points. + */ + pointBorderColor: Color; + /** + * The width of the point border in pixels. + */ + pointBorderWidth: number; + /** + * The pixel size of the non-displayed point that reacts to mouse events. + */ + pointHitRadius: number; + /** + * The radius of the point shape. If set to 0, the point is not rendered. + */ + pointRadius: number; + /** + * The rotation of the point in degrees. + */ + pointRotation: number; + /** + * Style of the point. + */ + pointStyle: PointStyle; } export interface PointPrefixedHoverOptions { - /** - * Point background color when hovered. - */ - pointHoverBackgroundColor: Color; - /** - * Point border color when hovered. - */ - pointHoverBorderColor: Color; - /** - * Border width of point when hovered. - */ - pointHoverBorderWidth: number; - /** - * The radius of the point when hovered. - */ - pointHoverRadius: number; + /** + * Point background color when hovered. + */ + pointHoverBackgroundColor: Color; + /** + * Point border color when hovered. + */ + pointHoverBorderColor: Color; + /** + * Border width of point when hovered. + */ + pointHoverBorderWidth: number; + /** + * The radius of the point when hovered. + */ + pointHoverRadius: number; } export interface PointElement - extends Element, - VisualElement { - readonly skip: boolean; + extends Element, + VisualElement { + readonly skip: boolean; } export const PointElement: ChartComponent & { - prototype: PointElement; - new (cfg: any): PointElement; + prototype: PointElement; + new (cfg: any): PointElement; }; export interface BarProps { - x: number; - y: number; - base: number; - horizontal: boolean; - width: number; - height: number; + x: number; + y: number; + base: number; + horizontal: boolean; + width: number; + height: number; } export interface BarOptions extends CommonOptions { - /** - * The base value for the bar in data units along the value axis. - */ - base: number; + /** + * The base value for the bar in data units along the value axis. + */ + base: number; - /** - * Skipped (excluded) border: 'start', 'end', 'bottom', 'left', 'top' or 'right'. - * @default 'start' - */ - borderSkipped: 'start' | 'end' | 'left' | 'right' | 'bottom' | 'top'; + /** + * Skipped (excluded) border: 'start', 'end', 'bottom', 'left', 'top' or 'right'. + * @default 'start' + */ + borderSkipped: 'start' | 'end' | 'left' | 'right' | 'bottom' | 'top'; - /** - * Border radius - * @default 0 - */ - borderRadius: number | BorderRadius; + /** + * Border radius + * @default 0 + */ + borderRadius: number | BorderRadius; } export interface BorderRadius { - topLeft: number; - topRight: number; - bottomLeft: number; - bottomRight: number; + topLeft: number; + topRight: number; + bottomLeft: number; + bottomRight: number; } export interface BarHoverOptions extends CommonHoverOptions { - hoverBorderRadius: number | BorderRadius; + hoverBorderRadius: number | BorderRadius; } export interface BarElement< - T extends BarProps = BarProps, - O extends BarOptions = BarOptions + T extends BarProps = BarProps, + O extends BarOptions = BarOptions > extends Element, VisualElement {} export const BarElement: ChartComponent & { - prototype: BarElement; - new (cfg: any): BarElement; + prototype: BarElement; + new (cfg: any): BarElement; }; export interface ElementChartOptions { - elements: { - arc: ArcOptions & ArcHoverOptions; - bar: BarOptions & BarHoverOptions; - line: LineOptions & LineHoverOptions; - point: PointOptions & PointHoverOptions; - }; + elements: { + arc: ArcOptions & ArcHoverOptions; + bar: BarOptions & BarHoverOptions; + line: LineOptions & LineHoverOptions; + point: PointOptions & PointHoverOptions; + }; } export class BasePlatform { - /** - * Called at chart construction time, returns a context2d instance implementing - * the [W3C Canvas 2D Context API standard]{@link https://www.w3.org/TR/2dcontext/}. - * @param {HTMLCanvasElement} canvas - The canvas from which to acquire context (platform specific) - * @param options - The chart options - */ - acquireContext( - canvas: HTMLCanvasElement, - options?: CanvasRenderingContext2DSettings - ): CanvasRenderingContext2D | null; - /** - * Called at chart destruction time, releases any resources associated to the context - * previously returned by the acquireContext() method. - * @param {CanvasRenderingContext2D} context - The context2d instance - * @returns {boolean} true if the method succeeded, else false - */ - releaseContext(context: CanvasRenderingContext2D): boolean; - /** - * Registers the specified listener on the given chart. - * @param {Chart} chart - Chart from which to listen for event - * @param {string} type - The ({@link ChartEvent}) type to listen for - * @param listener - Receives a notification (an object that implements - * the {@link ChartEvent} interface) when an event of the specified type occurs. - */ - addEventListener(chart: Chart, type: string, listener: (e: ChartEvent) => void): void; - /** - * Removes the specified listener previously registered with addEventListener. - * @param {Chart} chart - Chart from which to remove the listener - * @param {string} type - The ({@link ChartEvent}) type to remove - * @param listener - The listener function to remove from the event target. - */ - removeEventListener(chart: Chart, type: string, listener: (e: ChartEvent) => void): void; - /** - * @returns {number} the current devicePixelRatio of the device this platform is connected to. - */ - getDevicePixelRatio(): number; - /** - * @param {HTMLCanvasElement} canvas - The canvas for which to calculate the maximum size - * @param {number} [width] - Parent element's content width - * @param {number} [height] - Parent element's content height - * @param {number} [aspectRatio] - The aspect ratio to maintain - * @returns { width: number, height: number } the maximum size available. - */ - getMaximumSize(canvas: HTMLCanvasElement, width?: number, height?: number, aspectRatio?: number): { width: number, height: number }; - /** - * @param {HTMLCanvasElement} canvas - * @returns {boolean} true if the canvas is attached to the platform, false if not. - */ - isAttached(canvas: HTMLCanvasElement): boolean; + /** + * Called at chart construction time, returns a context2d instance implementing + * the [W3C Canvas 2D Context API standard]{@link https://www.w3.org/TR/2dcontext/}. + * @param {HTMLCanvasElement} canvas - The canvas from which to acquire context (platform specific) + * @param options - The chart options + */ + acquireContext( + canvas: HTMLCanvasElement, + options?: CanvasRenderingContext2DSettings + ): CanvasRenderingContext2D | null; + /** + * Called at chart destruction time, releases any resources associated to the context + * previously returned by the acquireContext() method. + * @param {CanvasRenderingContext2D} context - The context2d instance + * @returns {boolean} true if the method succeeded, else false + */ + releaseContext(context: CanvasRenderingContext2D): boolean; + /** + * Registers the specified listener on the given chart. + * @param {Chart} chart - Chart from which to listen for event + * @param {string} type - The ({@link ChartEvent}) type to listen for + * @param listener - Receives a notification (an object that implements + * the {@link ChartEvent} interface) when an event of the specified type occurs. + */ + addEventListener(chart: Chart, type: string, listener: (e: ChartEvent) => void): void; + /** + * Removes the specified listener previously registered with addEventListener. + * @param {Chart} chart - Chart from which to remove the listener + * @param {string} type - The ({@link ChartEvent}) type to remove + * @param listener - The listener function to remove from the event target. + */ + removeEventListener(chart: Chart, type: string, listener: (e: ChartEvent) => void): void; + /** + * @returns {number} the current devicePixelRatio of the device this platform is connected to. + */ + getDevicePixelRatio(): number; + /** + * @param {HTMLCanvasElement} canvas - The canvas for which to calculate the maximum size + * @param {number} [width] - Parent element's content width + * @param {number} [height] - Parent element's content height + * @param {number} [aspectRatio] - The aspect ratio to maintain + * @returns { width: number, height: number } the maximum size available. + */ + getMaximumSize(canvas: HTMLCanvasElement, width?: number, height?: number, aspectRatio?: number): { width: number, height: number }; + /** + * @param {HTMLCanvasElement} canvas + * @returns {boolean} true if the canvas is attached to the platform, false if not. + */ + isAttached(canvas: HTMLCanvasElement): boolean; } export class BasicPlatform extends BasePlatform {} @@ -1900,1160 +1900,1160 @@ export class DomPlatform extends BasePlatform {} export const Filler: Plugin; export interface FillerOptions { - propagate: boolean; + propagate: boolean; } export type FillTarget = number | string | { value: number } | 'start' | 'end' | 'origin' | 'stack' | false; export interface ComplexFillTarget { - /** - * The accepted values are the same as the filling mode values, so you may use absolute and relative dataset indexes and/or boundaries. - */ - target: FillTarget; - /** - * If no color is set, the default color will be the background color of the chart. - */ - above: Color; - /** - * Same as the above. - */ - below: Color; + /** + * The accepted values are the same as the filling mode values, so you may use absolute and relative dataset indexes and/or boundaries. + */ + target: FillTarget; + /** + * If no color is set, the default color will be the background color of the chart. + */ + above: Color; + /** + * Same as the above. + */ + below: Color; } export interface FillerControllerDatasetOptions { - /** - * Both line and radar charts support a fill option on the dataset object which can be used to create area between two datasets or a dataset and a boundary, i.e. the scale origin, start or end - */ - fill: FillTarget | ComplexFillTarget; + /** + * Both line and radar charts support a fill option on the dataset object which can be used to create area between two datasets or a dataset and a boundary, i.e. the scale origin, start or end + */ + fill: FillTarget | ComplexFillTarget; } export const Legend: Plugin; export interface LegendItem { - /** - * Label that will be displayed - */ - text: string; + /** + * Label that will be displayed + */ + text: string; - /** - * Index of the associated dataset - */ - datasetIndex: number; + /** + * Index of the associated dataset + */ + datasetIndex: number; - /** - * Fill style of the legend box - */ - fillStyle?: Color; + /** + * Fill style of the legend box + */ + fillStyle?: Color; - /** - * If true, this item represents a hidden dataset. Label will be rendered with a strike-through effect - */ - hidden?: boolean; + /** + * If true, this item represents a hidden dataset. Label will be rendered with a strike-through effect + */ + hidden?: boolean; - /** - * For box border. - * @see https://developer.mozilla.org/en/docs/Web/API/CanvasRenderingContext2D/lineCap - */ - lineCap?: CanvasLineCap; + /** + * For box border. + * @see https://developer.mozilla.org/en/docs/Web/API/CanvasRenderingContext2D/lineCap + */ + lineCap?: CanvasLineCap; - /** - * For box border. - * @see https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/setLineDash - */ - lineDash?: number[]; + /** + * For box border. + * @see https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/setLineDash + */ + lineDash?: number[]; - /** - * For box border. - * @see https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/lineDashOffset - */ - lineDashOffset?: number; + /** + * For box border. + * @see https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/lineDashOffset + */ + lineDashOffset?: number; - /** - * For box border. - * @see https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/lineJoin - */ - lineJoin?: CanvasLineJoin; + /** + * For box border. + * @see https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/lineJoin + */ + lineJoin?: CanvasLineJoin; - /** - * Width of box border - */ - lineWidth?: number; + /** + * Width of box border + */ + lineWidth?: number; - /** - * Stroke style of the legend box - */ - strokeStyle?: Color; + /** + * Stroke style of the legend box + */ + strokeStyle?: Color; - /** - * Point style of the legend box (only used if usePointStyle is true) - */ - pointStyle?: PointStyle; + /** + * Point style of the legend box (only used if usePointStyle is true) + */ + pointStyle?: PointStyle; - /** - * Rotation of the point in degrees (only used if usePointStyle is true) - */ - rotation?: number; + /** + * Rotation of the point in degrees (only used if usePointStyle is true) + */ + rotation?: number; } export interface LegendElement extends Element, LayoutItem {} export interface LegendOptions { - /** - * Is the legend shown? - * @default true - */ - display: boolean; - /** - * Position of the legend. - * @default 'top' - */ - position: LayoutPosition; - /** - * Alignment of the legend. - * @default 'center' - */ - align: TextAlign; - /** - * Marks that this box should take the full width of the canvas (pushing down other boxes). This is unlikely to need to be changed in day-to-day use. - * @default true - */ - fullWidth: boolean; - /** - * Legend will show datasets in reverse order. - * @default false - */ - reverse: boolean; - /** - * A callback that is called when a click event is registered on a label item. - */ - onClick(this: LegendElement, e: ChartEvent, legendItem: LegendItem, legend: LegendElement): void; - /** - * A callback that is called when a 'mousemove' event is registered on top of a label item - */ - onHover(this: LegendElement, e: ChartEvent, legendItem: LegendItem, legend: LegendElement): void; - /** - * A callback that is called when a 'mousemove' event is registered outside of a previously hovered label item. - */ - onLeave(this: LegendElement, e: ChartEvent, legendItem: LegendItem, legend: LegendElement): void; + /** + * Is the legend shown? + * @default true + */ + display: boolean; + /** + * Position of the legend. + * @default 'top' + */ + position: LayoutPosition; + /** + * Alignment of the legend. + * @default 'center' + */ + align: TextAlign; + /** + * Marks that this box should take the full width of the canvas (pushing down other boxes). This is unlikely to need to be changed in day-to-day use. + * @default true + */ + fullWidth: boolean; + /** + * Legend will show datasets in reverse order. + * @default false + */ + reverse: boolean; + /** + * A callback that is called when a click event is registered on a label item. + */ + onClick(this: LegendElement, e: ChartEvent, legendItem: LegendItem, legend: LegendElement): void; + /** + * A callback that is called when a 'mousemove' event is registered on top of a label item + */ + onHover(this: LegendElement, e: ChartEvent, legendItem: LegendItem, legend: LegendElement): void; + /** + * A callback that is called when a 'mousemove' event is registered outside of a previously hovered label item. + */ + onLeave(this: LegendElement, e: ChartEvent, legendItem: LegendItem, legend: LegendElement): void; - labels: { - /** - * Width of colored box. - * @default 40 - */ - boxWidth: number; - /** - * Height of the coloured box. - * @default fontSize - */ - boxHeight: number; - /** - * Color of label - * @see Defaults.color - */ - color: Color; - /** - * Font of label - * @see Defaults.font - */ - font: FontSpec; - /** - * Padding between rows of colored boxes. - * @default 10 - */ - padding: number; - /** - * Generates legend items for each thing in the legend. Default implementation returns the text + styling for the color box. See Legend Item for details. - */ - generateLabels(chart: Chart): LegendItem[]; + labels: { + /** + * Width of colored box. + * @default 40 + */ + boxWidth: number; + /** + * Height of the coloured box. + * @default fontSize + */ + boxHeight: number; + /** + * Color of label + * @see Defaults.color + */ + color: Color; + /** + * Font of label + * @see Defaults.font + */ + font: FontSpec; + /** + * Padding between rows of colored boxes. + * @default 10 + */ + padding: number; + /** + * Generates legend items for each thing in the legend. Default implementation returns the text + styling for the color box. See Legend Item for details. + */ + generateLabels(chart: Chart): LegendItem[]; - /** - * Filters legend items out of the legend. Receives 2 parameters, a Legend Item and the chart data - */ - filter(item: LegendItem, data: ChartData): boolean; + /** + * Filters legend items out of the legend. Receives 2 parameters, a Legend Item and the chart data + */ + filter(item: LegendItem, data: ChartData): boolean; - /** - * Sorts the legend items - */ - sort(a: LegendItem, b: LegendItem, data: ChartData): number; + /** + * Sorts the legend items + */ + sort(a: LegendItem, b: LegendItem, data: ChartData): number; - /** - * Override point style for the legend. Only applies if usePointStyle is true - */ - pointStyle: PointStyle; + /** + * Override point style for the legend. Only applies if usePointStyle is true + */ + pointStyle: PointStyle; - /** - * Label style will match corresponding point style (size is based on the minimum value between boxWidth and font.size). - * @default false - */ - usePointStyle: boolean; - }; + /** + * Label style will match corresponding point style (size is based on the minimum value between boxWidth and font.size). + * @default false + */ + usePointStyle: boolean; + }; - title: { - /** - * Is the legend title displayed. - * @default false - */ - display: boolean; - /** - * Color of title - * @see Defaults.color - */ - color: Color; - /** - * see Fonts - */ - font: FontSpec; - position: 'center' | 'start' | 'end'; - padding?: number | ChartArea; - /** - * The string title. - */ - text: string; - }; + title: { + /** + * Is the legend title displayed. + * @default false + */ + display: boolean; + /** + * Color of title + * @see Defaults.color + */ + color: Color; + /** + * see Fonts + */ + font: FontSpec; + position: 'center' | 'start' | 'end'; + padding?: number | ChartArea; + /** + * The string title. + */ + text: string; + }; } export const Title: Plugin; export interface TitleOptions { - /** - * Alignment of the title. - * @default 'center' - */ - align: 'start' | 'center' | 'end'; - /** - * Is the title shown? - * @default false - */ - display: boolean; - /** - * Position of title - * @default 'top' - */ - position: 'top' | 'left' | 'bottom' | 'right'; - /** - * Color of text - * @see Defaults.color - */ - color: Color; - font: FontSpec; - // fullWidth: boolean; - /** - * Adds padding above and below the title text if a single number is specified. It is also possible to change top and bottom padding separately. - */ - padding: number | { top: number; bottom: number }; - /** - * Title text to display. If specified as an array, text is rendered on multiple lines. - */ - text: string | string[]; + /** + * Alignment of the title. + * @default 'center' + */ + align: 'start' | 'center' | 'end'; + /** + * Is the title shown? + * @default false + */ + display: boolean; + /** + * Position of title + * @default 'top' + */ + position: 'top' | 'left' | 'bottom' | 'right'; + /** + * Color of text + * @see Defaults.color + */ + color: Color; + font: FontSpec; + // fullWidth: boolean; + /** + * Adds padding above and below the title text if a single number is specified. It is also possible to change top and bottom padding separately. + */ + padding: number | { top: number; bottom: number }; + /** + * Title text to display. If specified as an array, text is rendered on multiple lines. + */ + text: string | string[]; } export type TooltipAlignment = 'start' | 'center' | 'end'; export interface TooltipModel { - // The items that we are rendering in the tooltip. See Tooltip Item Interface section - dataPoints: TooltipItem[]; + // The items that we are rendering in the tooltip. See Tooltip Item Interface section + dataPoints: TooltipItem[]; - // Positioning - xAlign: TooltipAlignment; - yAlign: TooltipAlignment; + // Positioning + xAlign: TooltipAlignment; + yAlign: TooltipAlignment; - // X and Y properties are the top left of the tooltip - x: number; - y: number; - width: number; - height: number; - // Where the tooltip points to - caretX: number; - caretY: number; + // X and Y properties are the top left of the tooltip + x: number; + y: number; + width: number; + height: number; + // Where the tooltip points to + caretX: number; + caretY: number; - // Body - // The body lines that need to be rendered - // Each object contains 3 parameters - // before: string[] // lines of text before the line with the color square - // lines: string[]; // lines of text to render as the main item with color square - // after: string[]; // lines of text to render after the main lines - body: { before: string[]; lines: string[]; after: string[] }[]; - // lines of text that appear after the title but before the body - beforeBody: string[]; - // line of text that appear after the body and before the footer - afterBody: string[]; + // Body + // The body lines that need to be rendered + // Each object contains 3 parameters + // before: string[] // lines of text before the line with the color square + // lines: string[]; // lines of text to render as the main item with color square + // after: string[]; // lines of text to render after the main lines + body: { before: string[]; lines: string[]; after: string[] }[]; + // lines of text that appear after the title but before the body + beforeBody: string[]; + // line of text that appear after the body and before the footer + afterBody: string[]; - // Title - // lines of text that form the title - title: string[]; + // Title + // lines of text that form the title + title: string[]; - // Footer - // lines of text that form the footer - footer: string[]; + // Footer + // lines of text that form the footer + footer: string[]; - // colors to render for each item in body[]. This is the color of the squares in the tooltip - labelColors: Color[]; - labelTextColors: Color[]; - labelPointStyles: { pointStyle: PointStyle; rotation: number }[]; + // colors to render for each item in body[]. This is the color of the squares in the tooltip + labelColors: Color[]; + labelTextColors: Color[]; + labelPointStyles: { pointStyle: PointStyle; rotation: number }[]; - // 0 opacity is a hidden tooltip - opacity: number; + // 0 opacity is a hidden tooltip + opacity: number; - // tooltip options - options: TooltipOptions; + // tooltip options + options: TooltipOptions; } export const Tooltip: Plugin & { - readonly positioners: { - [key: string]: (items: readonly Element[], eventPosition: { x: number; y: number }) => { x: number; y: number }; - }; + readonly positioners: { + [key: string]: (items: readonly Element[], eventPosition: { x: number; y: number }) => { x: number; y: number }; + }; - getActiveElements(): ActiveElement[]; - setActiveElements(active: ActiveDataPoint[], eventPosition: { x: number, y: number }): void; + getActiveElements(): ActiveElement[]; + setActiveElements(active: ActiveDataPoint[], eventPosition: { x: number, y: number }): void; }; export interface TooltipCallbacks { - beforeTitle(this: TooltipModel, tooltipItems: TooltipItem[]): string | string[]; - title(this: TooltipModel, tooltipItems: TooltipItem[]): string | string[]; - afterTitle(this: TooltipModel, tooltipItems: TooltipItem[]): string | string[]; + beforeTitle(this: TooltipModel, tooltipItems: TooltipItem[]): string | string[]; + title(this: TooltipModel, tooltipItems: TooltipItem[]): string | string[]; + afterTitle(this: TooltipModel, tooltipItems: TooltipItem[]): string | string[]; - beforeBody(this: TooltipModel, tooltipItems: TooltipItem[]): string | string[]; - afterBody(this: TooltipModel, tooltipItems: TooltipItem[]): string | string[]; + beforeBody(this: TooltipModel, tooltipItems: TooltipItem[]): string | string[]; + afterBody(this: TooltipModel, tooltipItems: TooltipItem[]): string | string[]; - beforeLabel(this: TooltipModel, tooltipItem: TooltipItem): string | string[]; - label(this: TooltipModel, tooltipItem: TooltipItem): string | string[]; - afterLabel(this: TooltipModel, tooltipItem: TooltipItem): string | string[]; + beforeLabel(this: TooltipModel, tooltipItem: TooltipItem): string | string[]; + label(this: TooltipModel, tooltipItem: TooltipItem): string | string[]; + afterLabel(this: TooltipModel, tooltipItem: TooltipItem): string | string[]; - labelColor(this: TooltipModel, tooltipItem: TooltipItem): { borderColor: Color; backgroundColor: Color }; - labelTextColor(this: TooltipModel, tooltipItem: TooltipItem): Color; - labelPointStyle(this: TooltipModel, tooltipItem: TooltipItem): { pointStyle: PointStyle; rotation: number }; + labelColor(this: TooltipModel, tooltipItem: TooltipItem): { borderColor: Color; backgroundColor: Color }; + labelTextColor(this: TooltipModel, tooltipItem: TooltipItem): Color; + labelPointStyle(this: TooltipModel, tooltipItem: TooltipItem): { pointStyle: PointStyle; rotation: number }; - beforeFooter(this: TooltipModel, tooltipItems: TooltipItem[]): string | string[]; - footer(this: TooltipModel, tooltipItems: TooltipItem[]): string | string[]; - afterFooter(this: TooltipModel, tooltipItems: TooltipItem[]): string | string[]; + beforeFooter(this: TooltipModel, tooltipItems: TooltipItem[]): string | string[]; + footer(this: TooltipModel, tooltipItems: TooltipItem[]): string | string[]; + afterFooter(this: TooltipModel, tooltipItems: TooltipItem[]): string | string[]; } export interface ExtendedPlugin { - /** - * @desc Called before drawing the `tooltip`. If any plugin returns `false`, - * the tooltip drawing is cancelled until another `render` is triggered. - * @param {Chart} chart - The chart instance. - * @param {object} args - The call arguments. - * @param {Tooltip} args.tooltip - The tooltip. - * @param {object} options - The plugin options. - * @returns {boolean} `false` to cancel the chart tooltip drawing. - */ - beforeTooltipDraw?(chart: Chart, args: { tooltip: TooltipModel }, options: O): boolean | void; - /** - * @desc Called after drawing the `tooltip`. Note that this hook will not - * be called if the tooltip drawing has been previously cancelled. - * @param {Chart} chart - The chart instance. - * @param {object} args - The call arguments. - * @param {Tooltip} args.tooltip - The tooltip. - * @param {object} options - The plugin options. - */ - afterTooltipDraw?(chart: Chart, args: { tooltip: TooltipModel }, options: O): void; + /** + * @desc Called before drawing the `tooltip`. If any plugin returns `false`, + * the tooltip drawing is cancelled until another `render` is triggered. + * @param {Chart} chart - The chart instance. + * @param {object} args - The call arguments. + * @param {Tooltip} args.tooltip - The tooltip. + * @param {object} options - The plugin options. + * @returns {boolean} `false` to cancel the chart tooltip drawing. + */ + beforeTooltipDraw?(chart: Chart, args: { tooltip: TooltipModel }, options: O): boolean | void; + /** + * @desc Called after drawing the `tooltip`. Note that this hook will not + * be called if the tooltip drawing has been previously cancelled. + * @param {Chart} chart - The chart instance. + * @param {object} args - The call arguments. + * @param {Tooltip} args.tooltip - The tooltip. + * @param {object} options - The plugin options. + */ + afterTooltipDraw?(chart: Chart, args: { tooltip: TooltipModel }, options: O): void; } export interface TooltipOptions extends CoreInteractionOptions { - /** - * Are on-canvas tooltips enabled? - * @default true - */ - enabled: boolean; - /** - * See custom tooltip section. - */ - custom(this: TooltipModel, args: { chart: Chart; tooltip: TooltipModel }): void; - /** - * The mode for positioning the tooltip - */ - position: 'average' | 'nearest'; + /** + * Are on-canvas tooltips enabled? + * @default true + */ + enabled: boolean; + /** + * See custom tooltip section. + */ + custom(this: TooltipModel, args: { chart: Chart; tooltip: TooltipModel }): void; + /** + * The mode for positioning the tooltip + */ + position: 'average' | 'nearest'; - /** - * Override the tooltip alignment calculations - */ - xAlign: TooltipAlignment; - yAlign: TooltipAlignment; + /** + * Override the tooltip alignment calculations + */ + xAlign: TooltipAlignment; + yAlign: TooltipAlignment; - /** - * Sort tooltip items. - */ - itemSort: (a: TooltipItem, b: TooltipItem) => number; + /** + * Sort tooltip items. + */ + itemSort: (a: TooltipItem, b: TooltipItem) => number; - filter: (e: TooltipItem) => boolean; + filter: (e: TooltipItem) => boolean; - /** - * Background color of the tooltip. - * @default 'rgba(0, 0, 0, 0.8)' - */ - backgroundColor: Color; - /** - * Color of title - * @default '#fff' - */ - titleColor: Color; - /** - * See Fonts - * @default {style: 'bold'} - */ - titleFont: FontSpec; - /** - * Spacing to add to top and bottom of each title line. - * @default 2 - */ - titleSpacing: number; - /** - * Margin to add on bottom of title section. - * @default 6 - */ - titleMarginBottom: number; - /** - * Horizontal alignment of the title text lines. - * @default 'left' - */ - titleAlign: TextAlign; - /** - * Spacing to add to top and bottom of each tooltip item. - * @default 2 - */ - bodySpacing: number; - /** - * Color of body - * @default '#fff' - */ - bodyColor: Color; - /** - * See Fonts. - * @default {} - */ - bodyFont: FontSpec; - /** - * Horizontal alignment of the body text lines. - * @default 'left' - */ - bodyAlign: TextAlign; - /** - * Spacing to add to top and bottom of each footer line. - * @default 2 - */ - footerSpacing: number; - /** - * Margin to add before drawing the footer. - * @default 6 - */ - footerMarginTop: number; - /** - * Color of footer - * @default '#fff' - */ - footerColor: Color; - /** - * See Fonts - * @default {style: 'bold'} - */ - footerFont: FontSpec; - /** - * Horizontal alignment of the footer text lines. - * @default 'left' - */ - footerAlign: TextAlign; - /** - * Padding to add on left and right of tooltip. - * @default 6 - */ - xPadding: number; - /** - * Padding to add on top and bottom of tooltip. - * @default 6 - */ - yPadding: number; - /** - * Extra distance to move the end of the tooltip arrow away from the tooltip point. - * @default 2 - */ - caretPadding: number; - /** - * Size, in px, of the tooltip arrow. - * @default 5 - */ - caretSize: number; - /** - * Radius of tooltip corner curves. - * @default 6 - */ - cornerRadius: number; - /** - * Color to draw behind the colored boxes when multiple items are in the tooltip. - * @default '#fff' - */ - multiKeyBackground: Color; - /** - * If true, color boxes are shown in the tooltip. - * @default true - */ - displayColors: boolean; - /** - * Width of the color box if displayColors is true. - * @default bodyFont.size - */ - boxWidth: number; - /** - * Height of the color box if displayColors is true. - * @default bodyFont.size - */ - boxHeight: number; - /** - * Use the corresponding point style (from dataset options) instead of color boxes, ex: star, triangle etc. (size is based on the minimum value between boxWidth and boxHeight) - * @default false - */ - usePointStyle: boolean; - /** - * Color of the border. - * @default 'rgba(0, 0, 0, 0)' - */ - borderColor: Color; - /** - * Size of the border. - * @default 0 - */ - borderWidth: number; - /** - * true for rendering the legends from right to left. - */ - rtl: boolean; + /** + * Background color of the tooltip. + * @default 'rgba(0, 0, 0, 0.8)' + */ + backgroundColor: Color; + /** + * Color of title + * @default '#fff' + */ + titleColor: Color; + /** + * See Fonts + * @default {style: 'bold'} + */ + titleFont: FontSpec; + /** + * Spacing to add to top and bottom of each title line. + * @default 2 + */ + titleSpacing: number; + /** + * Margin to add on bottom of title section. + * @default 6 + */ + titleMarginBottom: number; + /** + * Horizontal alignment of the title text lines. + * @default 'left' + */ + titleAlign: TextAlign; + /** + * Spacing to add to top and bottom of each tooltip item. + * @default 2 + */ + bodySpacing: number; + /** + * Color of body + * @default '#fff' + */ + bodyColor: Color; + /** + * See Fonts. + * @default {} + */ + bodyFont: FontSpec; + /** + * Horizontal alignment of the body text lines. + * @default 'left' + */ + bodyAlign: TextAlign; + /** + * Spacing to add to top and bottom of each footer line. + * @default 2 + */ + footerSpacing: number; + /** + * Margin to add before drawing the footer. + * @default 6 + */ + footerMarginTop: number; + /** + * Color of footer + * @default '#fff' + */ + footerColor: Color; + /** + * See Fonts + * @default {style: 'bold'} + */ + footerFont: FontSpec; + /** + * Horizontal alignment of the footer text lines. + * @default 'left' + */ + footerAlign: TextAlign; + /** + * Padding to add on left and right of tooltip. + * @default 6 + */ + xPadding: number; + /** + * Padding to add on top and bottom of tooltip. + * @default 6 + */ + yPadding: number; + /** + * Extra distance to move the end of the tooltip arrow away from the tooltip point. + * @default 2 + */ + caretPadding: number; + /** + * Size, in px, of the tooltip arrow. + * @default 5 + */ + caretSize: number; + /** + * Radius of tooltip corner curves. + * @default 6 + */ + cornerRadius: number; + /** + * Color to draw behind the colored boxes when multiple items are in the tooltip. + * @default '#fff' + */ + multiKeyBackground: Color; + /** + * If true, color boxes are shown in the tooltip. + * @default true + */ + displayColors: boolean; + /** + * Width of the color box if displayColors is true. + * @default bodyFont.size + */ + boxWidth: number; + /** + * Height of the color box if displayColors is true. + * @default bodyFont.size + */ + boxHeight: number; + /** + * Use the corresponding point style (from dataset options) instead of color boxes, ex: star, triangle etc. (size is based on the minimum value between boxWidth and boxHeight) + * @default false + */ + usePointStyle: boolean; + /** + * Color of the border. + * @default 'rgba(0, 0, 0, 0)' + */ + borderColor: Color; + /** + * Size of the border. + * @default 0 + */ + borderWidth: number; + /** + * true for rendering the legends from right to left. + */ + rtl: boolean; - /** - * This will force the text direction 'rtl' or 'ltr on the canvas for rendering the tooltips, regardless of the css specified on the canvas - * @default canvas's default - */ - textDirection: string; + /** + * This will force the text direction 'rtl' or 'ltr on the canvas for rendering the tooltips, regardless of the css specified on the canvas + * @default canvas's default + */ + textDirection: string; - animation: Scriptable; + animation: Scriptable; - callbacks: TooltipCallbacks; + callbacks: TooltipCallbacks; } export interface TooltipItem { - /** - * The chart the tooltip is being shown on - */ - chart: Chart; + /** + * The chart the tooltip is being shown on + */ + chart: Chart; - /** - * Label for the tooltip - */ - label: string; + /** + * Label for the tooltip + */ + label: string; - /** - * Parsed data values for the given `dataIndex` and `datasetIndex` - */ - dataPoint: any; + /** + * Parsed data values for the given `dataIndex` and `datasetIndex` + */ + dataPoint: any; - /** - * Formatted value for the tooltip - */ - formattedValue: string; + /** + * Formatted value for the tooltip + */ + formattedValue: string; - /** - * The dataset the item comes from - */ - dataset: ChartDataset; + /** + * The dataset the item comes from + */ + dataset: ChartDataset; - /** - * Index of the dataset the item comes from - */ - datasetIndex: number; + /** + * Index of the dataset the item comes from + */ + datasetIndex: number; - /** - * Index of this data item in the dataset - */ - dataIndex: number; + /** + * Index of this data item in the dataset + */ + dataIndex: number; - /** - * The chart element (point, arc, bar, etc.) for this tooltip item - */ - element: Element; + /** + * The chart element (point, arc, bar, etc.) for this tooltip item + */ + element: Element; } export interface PluginOptions { - filler: FillerOptions; - legend: LegendOptions; - title: TitleOptions; - tooltip: TooltipOptions; + filler: FillerOptions; + legend: LegendOptions; + title: TitleOptions; + tooltip: TooltipOptions; } export interface GridLineOptions { - /** - * @default true - */ - display: boolean; - borderColor: Color; - borderWidth: number; - /** - * @default false - */ - circular: boolean; - /** - * @default 'rgba(0, 0, 0, 0.1)' - */ - color: Scriptable | readonly Color[]; - /** - * @default [] - */ - borderDash: number[]; - /** - * @default 0 - */ - borderDashOffset: Scriptable; - /** - * @default 1 - */ - lineWidth: Scriptable | readonly number[]; + /** + * @default true + */ + display: boolean; + borderColor: Color; + borderWidth: number; + /** + * @default false + */ + circular: boolean; + /** + * @default 'rgba(0, 0, 0, 0.1)' + */ + color: Scriptable | readonly Color[]; + /** + * @default [] + */ + borderDash: number[]; + /** + * @default 0 + */ + borderDashOffset: Scriptable; + /** + * @default 1 + */ + lineWidth: Scriptable | readonly number[]; - /** - * @default true - */ - drawBorder: boolean; - /** - * @default true - */ - drawOnChartArea: boolean; - /** - * @default true - */ - drawTicks: boolean; - /** - * @default [] - */ - tickBorderDash: number[]; - /** - * @default 0 - */ - tickBorderDashOffset: Scriptable; - /** - * @default 'rgba(0, 0, 0, 0.1)' - */ - tickColor: Scriptable | readonly Color[]; - /** - * @default 10 - */ - tickLength: number; - /** - * @default 1 - */ - tickWidth: number; - /** - * @default false - */ - offsetGridLines: boolean; + /** + * @default true + */ + drawBorder: boolean; + /** + * @default true + */ + drawOnChartArea: boolean; + /** + * @default true + */ + drawTicks: boolean; + /** + * @default [] + */ + tickBorderDash: number[]; + /** + * @default 0 + */ + tickBorderDashOffset: Scriptable; + /** + * @default 'rgba(0, 0, 0, 0.1)' + */ + tickColor: Scriptable | readonly Color[]; + /** + * @default 10 + */ + tickLength: number; + /** + * @default 1 + */ + tickWidth: number; + /** + * @default false + */ + offsetGridLines: boolean; } export interface TickOptions { - /** - * Returns the string representation of the tick value as it should be displayed on the chart. See callback. - */ - callback: (tickValue: any, index: number, ticks: Tick[]) => string; - /** - * If true, show tick labels. - * @default true - */ - display: boolean; - /** - * Color of tick - * @see Defaults.color - */ - color: Scriptable; - /** - * see Fonts - */ - font: Scriptable; - /** - * Sets the offset of the tick labels from the axis - */ - padding: number; - /** - * The color of the stroke around the text. - * @default undefined - */ - textStrokeColor: Scriptable; - /** - * Stroke width around the text. - * @default 0 - */ - textStrokeWidth: Scriptable; - /** - * z-index of tick layer. Useful when ticks are drawn on chart area. Values <= 0 are drawn under datasets, > 0 on top. - * @default 0 - */ - z: number; + /** + * Returns the string representation of the tick value as it should be displayed on the chart. See callback. + */ + callback: (tickValue: any, index: number, ticks: Tick[]) => string; + /** + * If true, show tick labels. + * @default true + */ + display: boolean; + /** + * Color of tick + * @see Defaults.color + */ + color: Scriptable; + /** + * see Fonts + */ + font: Scriptable; + /** + * Sets the offset of the tick labels from the axis + */ + padding: number; + /** + * The color of the stroke around the text. + * @default undefined + */ + textStrokeColor: Scriptable; + /** + * Stroke width around the text. + * @default 0 + */ + textStrokeWidth: Scriptable; + /** + * z-index of tick layer. Useful when ticks are drawn on chart area. Values <= 0 are drawn under datasets, > 0 on top. + * @default 0 + */ + z: number; - major: { - /** - * If true, major ticks are generated. A major tick will affect autoskipping and major will be defined on ticks in the scriptable options context. - * @default false - */ - enabled: boolean; - }; + major: { + /** + * If true, major ticks are generated. A major tick will affect autoskipping and major will be defined on ticks in the scriptable options context. + * @default false + */ + enabled: boolean; + }; } export interface CartesianScaleOptions extends CoreScaleOptions { - /** - * Position of the axis. - */ - position: 'left' | 'top' | 'right' | 'bottom' | 'center' | { [scale: string]: number }; - /** - * Which type of axis this is. Possible values are: 'x', 'y'. If not set, this is inferred from the first character of the ID which should be 'x' or 'y'. - */ - axis: 'x' | 'y'; + /** + * Position of the axis. + */ + position: 'left' | 'top' | 'right' | 'bottom' | 'center' | { [scale: string]: number }; + /** + * Which type of axis this is. Possible values are: 'x', 'y'. If not set, this is inferred from the first character of the ID which should be 'x' or 'y'. + */ + axis: 'x' | 'y'; - /** - * User defined minimum value for the scale, overrides minimum value from data. - */ - min: number; + /** + * User defined minimum value for the scale, overrides minimum value from data. + */ + min: number; - /** - * User defined maximum value for the scale, overrides maximum value from data. - */ - max: number; + /** + * User defined maximum value for the scale, overrides maximum value from data. + */ + max: number; - /** - * If true, extra space is added to the both edges and the axis is scaled to fit into the chart area. This is set to true for a bar chart by default. - * @default false - */ - offset: boolean; + /** + * If true, extra space is added to the both edges and the axis is scaled to fit into the chart area. This is set to true for a bar chart by default. + * @default false + */ + offset: boolean; - gridLines: GridLineOptions; + gridLines: GridLineOptions; - scaleLabel: { - display: boolean; - labelString: string; - color: Color; - font: FontSpec; - padding: { - top: number; - bottom: number; - }; - }; + scaleLabel: { + display: boolean; + labelString: string; + color: Color; + font: FontSpec; + padding: { + top: number; + bottom: number; + }; + }; /** * If true, data will be comprised between datasets of data * @default false */ - stacked?: boolean; + stacked?: boolean; - ticks: TickOptions & { - /** - * The number of ticks to examine when deciding how many labels will fit. Setting a smaller value will be faster, but may be less accurate when there is large variability in label length. - * @default ticks.length - */ - sampleSize: number; - /** - * The label alignment - * @default 'center' - */ - align: 'start' | 'center' | 'end'; - /** - * If true, automatically calculates how many labels can be shown and hides labels accordingly. Labels will be rotated up to maxRotation before skipping any. Turn autoSkip off to show all labels no matter what. - * @default true - */ - autoSkip: boolean; - /** - * Padding between the ticks on the horizontal axis when autoSkip is enabled. - * @default 0 - */ - autoSkipPadding: number; + ticks: TickOptions & { + /** + * The number of ticks to examine when deciding how many labels will fit. Setting a smaller value will be faster, but may be less accurate when there is large variability in label length. + * @default ticks.length + */ + sampleSize: number; + /** + * The label alignment + * @default 'center' + */ + align: 'start' | 'center' | 'end'; + /** + * If true, automatically calculates how many labels can be shown and hides labels accordingly. Labels will be rotated up to maxRotation before skipping any. Turn autoSkip off to show all labels no matter what. + * @default true + */ + autoSkip: boolean; + /** + * Padding between the ticks on the horizontal axis when autoSkip is enabled. + * @default 0 + */ + autoSkipPadding: number; - /** - * How is the label positioned perpendicular to the axis direction. - * This only applies when the rotation is 0 and the axis position is one of "top", "left", "right", or "bottom" - * @default 'near' - */ - crossAlign: 'near' | 'center' | 'far'; + /** + * How is the label positioned perpendicular to the axis direction. + * This only applies when the rotation is 0 and the axis position is one of "top", "left", "right", or "bottom" + * @default 'near' + */ + crossAlign: 'near' | 'center' | 'far'; - /** - * Distance in pixels to offset the label from the centre point of the tick (in the x direction for the x axis, and the y direction for the y axis). Note: this can cause labels at the edges to be cropped by the edge of the canvas - * @default 0 - */ - labelOffset: number; + /** + * Distance in pixels to offset the label from the centre point of the tick (in the x direction for the x axis, and the y direction for the y axis). Note: this can cause labels at the edges to be cropped by the edge of the canvas + * @default 0 + */ + labelOffset: number; - /** - * Minimum rotation for tick labels. Note: Only applicable to horizontal scales. - * @default 0 - */ - minRotation: number; - /** - * Maximum rotation for tick labels when rotating to condense labels. Note: Rotation doesn't occur until necessary. Note: Only applicable to horizontal scales. - * @default 50 - */ - maxRotation: number; - /** - * Flips tick labels around axis, displaying the labels inside the chart instead of outside. Note: Only applicable to vertical scales. - * @default false - */ - mirror: boolean; - /** - * Padding between the tick label and the axis. When set on a vertical axis, this applies in the horizontal (X) direction. When set on a horizontal axis, this applies in the vertical (Y) direction. - * @default 0 - */ - padding: number; - }; + /** + * Minimum rotation for tick labels. Note: Only applicable to horizontal scales. + * @default 0 + */ + minRotation: number; + /** + * Maximum rotation for tick labels when rotating to condense labels. Note: Rotation doesn't occur until necessary. Note: Only applicable to horizontal scales. + * @default 50 + */ + maxRotation: number; + /** + * Flips tick labels around axis, displaying the labels inside the chart instead of outside. Note: Only applicable to vertical scales. + * @default false + */ + mirror: boolean; + /** + * Padding between the tick label and the axis. When set on a vertical axis, this applies in the horizontal (X) direction. When set on a horizontal axis, this applies in the vertical (Y) direction. + * @default 0 + */ + padding: number; + }; } export type CategoryScaleOptions = CartesianScaleOptions & { - min: string | number; - max: string | number; - labels: string[] | string[][]; + min: string | number; + max: string | number; + labels: string[] | string[][]; }; export interface CategoryScale extends Scale {} export const CategoryScale: ChartComponent & { - prototype: CategoryScale; - new (cfg: any): CategoryScale; + prototype: CategoryScale; + new (cfg: any): CategoryScale; }; export type LinearScaleOptions = CartesianScaleOptions & { - /** - * if true, scale will include 0 if it is not already included. - * @default true - */ - beginAtZero: boolean; + /** + * if true, scale will include 0 if it is not already included. + * @default true + */ + beginAtZero: boolean; - /** - * Adjustment used when calculating the maximum data value. - * @see https://www.chartjs.org/docs/next/axes/cartesian/linear#axis-range-settings - */ - suggestedMin?: number; - /** - * Adjustment used when calculating the minimum data value. - * @see https://www.chartjs.org/docs/next/axes/cartesian/linear#axis-range-settings - */ - suggestedMax?: number; + /** + * Adjustment used when calculating the maximum data value. + * @see https://www.chartjs.org/docs/next/axes/cartesian/linear#axis-range-settings + */ + suggestedMin?: number; + /** + * Adjustment used when calculating the minimum data value. + * @see https://www.chartjs.org/docs/next/axes/cartesian/linear#axis-range-settings + */ + suggestedMax?: number; - ticks: { - /** - * The Intl.NumberFormat options used by the default label formatter - */ - format: Intl.NumberFormatOptions; + ticks: { + /** + * The Intl.NumberFormat options used by the default label formatter + */ + format: Intl.NumberFormatOptions; - /** - * Maximum number of ticks and gridlines to show. - * @default 11 - */ - maxTicksLimit: number; - /** - * if defined and stepSize is not specified, the step size will be rounded to this many decimal places. - */ - precision: number; + /** + * Maximum number of ticks and gridlines to show. + * @default 11 + */ + maxTicksLimit: number; + /** + * if defined and stepSize is not specified, the step size will be rounded to this many decimal places. + */ + precision: number; - /** - * User defined fixed step size for the scale - * @see https://www.chartjs.org/docs/next/axes/cartesian/linear#step-size - */ - stepSize: number; - }; + /** + * User defined fixed step size for the scale + * @see https://www.chartjs.org/docs/next/axes/cartesian/linear#step-size + */ + stepSize: number; + }; }; export interface LinearScale extends Scale {} export const LinearScale: ChartComponent & { - prototype: LinearScale; - new (cfg: any): LinearScale; + prototype: LinearScale; + new (cfg: any): LinearScale; }; export type LogarithmicScaleOptions = CartesianScaleOptions & { - /** - * Adjustment used when calculating the maximum data value. - * @see https://www.chartjs.org/docs/next/axes/cartesian/linear#axis-range-settings - */ - suggestedMin?: number; - /** - * Adjustment used when calculating the minimum data value. - * @see https://www.chartjs.org/docs/next/axes/cartesian/linear#axis-range-settings - */ - suggestedMax?: number; + /** + * Adjustment used when calculating the maximum data value. + * @see https://www.chartjs.org/docs/next/axes/cartesian/linear#axis-range-settings + */ + suggestedMin?: number; + /** + * Adjustment used when calculating the minimum data value. + * @see https://www.chartjs.org/docs/next/axes/cartesian/linear#axis-range-settings + */ + suggestedMax?: number; - ticks: { - /** - * The Intl.NumberFormat options used by the default label formatter - */ - format: Intl.NumberFormatOptions; - }; + ticks: { + /** + * The Intl.NumberFormat options used by the default label formatter + */ + format: Intl.NumberFormatOptions; + }; }; export interface LogarithmicScale extends Scale {} export const LogarithmicScale: ChartComponent & { - prototype: LogarithmicScale; - new (cfg: any): LogarithmicScale; + prototype: LogarithmicScale; + new (cfg: any): LogarithmicScale; }; export type TimeScaleOptions = CartesianScaleOptions & { - /** - * Scale boundary strategy (bypassed by min/max time options) - * - `data`: make sure data are fully visible, ticks outside are removed - * - `ticks`: make sure ticks are fully visible, data outside are truncated - * @see https://www.chartjs.org/docs/next/axes/cartesian/time#scale-bounds - * @since 2.7.0 - * @default 'data' - */ - bounds: 'ticks' | 'data'; + /** + * Scale boundary strategy (bypassed by min/max time options) + * - `data`: make sure data are fully visible, ticks outside are removed + * - `ticks`: make sure ticks are fully visible, data outside are truncated + * @see https://www.chartjs.org/docs/next/axes/cartesian/time#scale-bounds + * @since 2.7.0 + * @default 'data' + */ + bounds: 'ticks' | 'data'; - /** - * options for creating a new adapter instance - */ - adapters: { - date: any; - }; + /** + * options for creating a new adapter instance + */ + adapters: { + date: any; + }; - time: { - /** - * Custom parser for dates. - * @see https://www.chartjs.org/docs/next/axes/cartesian/time#parser - */ - parser: string | ((v: any) => number); - /** - * If defined, dates will be rounded to the start of this unit. See Time Units below for the allowed units. - */ - round: false | TimeUnit; - /** - * If boolean and true and the unit is set to 'week', then the first day of the week will be Monday. Otherwise, it will be Sunday. - * If `number`, the index of the first day of the week (0 - Sunday, 6 - Saturday). - * @default false - */ - isoWeekday: false | number; - /** - * Sets how different time units are displayed. - * @see https://www.chartjs.org/docs/next/axes/cartesian/time#display-formats - */ - displayFormats: { - [key: string]: string; - }; - /** - * The format string to use for the tooltip. - */ - tooltipFormat: string; - /** - * If defined, will force the unit to be a certain type. See Time Units section below for details. - * @default false - */ - unit: false | TimeUnit; + time: { + /** + * Custom parser for dates. + * @see https://www.chartjs.org/docs/next/axes/cartesian/time#parser + */ + parser: string | ((v: any) => number); + /** + * If defined, dates will be rounded to the start of this unit. See Time Units below for the allowed units. + */ + round: false | TimeUnit; + /** + * If boolean and true and the unit is set to 'week', then the first day of the week will be Monday. Otherwise, it will be Sunday. + * If `number`, the index of the first day of the week (0 - Sunday, 6 - Saturday). + * @default false + */ + isoWeekday: false | number; + /** + * Sets how different time units are displayed. + * @see https://www.chartjs.org/docs/next/axes/cartesian/time#display-formats + */ + displayFormats: { + [key: string]: string; + }; + /** + * The format string to use for the tooltip. + */ + tooltipFormat: string; + /** + * If defined, will force the unit to be a certain type. See Time Units section below for details. + * @default false + */ + unit: false | TimeUnit; - /** - * The number of units between grid lines. - * @default 1 - */ - stepSize: number; - /** - * The minimum display format to be used for a time unit. - * @default 'millisecond' - */ - minUnit: TimeUnit; - }; + /** + * The number of units between grid lines. + * @default 1 + */ + stepSize: number; + /** + * The minimum display format to be used for a time unit. + * @default 'millisecond' + */ + minUnit: TimeUnit; + }; - ticks: { - /** - * Ticks generation input values: - * - 'auto': generates "optimal" ticks based on scale size and time options. - * - 'data': generates ticks from data (including labels from data {t|x|y} objects). - * - 'labels': generates ticks from user given `data.labels` values ONLY. - * @see https://github.com/chartjs/Chart.js/pull/4507 - * @since 2.7.0 - * @default 'auto' - * @see https://www.chartjs.org/docs/next/axes/cartesian/time#ticks-source - */ - source: 'labels' | 'auto' | 'data'; - }; + ticks: { + /** + * Ticks generation input values: + * - 'auto': generates "optimal" ticks based on scale size and time options. + * - 'data': generates ticks from data (including labels from data {t|x|y} objects). + * - 'labels': generates ticks from user given `data.labels` values ONLY. + * @see https://github.com/chartjs/Chart.js/pull/4507 + * @since 2.7.0 + * @default 'auto' + * @see https://www.chartjs.org/docs/next/axes/cartesian/time#ticks-source + */ + source: 'labels' | 'auto' | 'data'; + }; }; export interface TimeScale extends Scale { - getDataTimestamps(): number[]; - getLabelTimestamps(): string[]; - normalize(values: number[]): number[]; + getDataTimestamps(): number[]; + getLabelTimestamps(): string[]; + normalize(values: number[]): number[]; } export const TimeScale: ChartComponent & { - prototype: TimeScale; - new (cfg: any): TimeScale; + prototype: TimeScale; + new (cfg: any): TimeScale; }; export interface TimeSeriesScale extends TimeScale {} export const TimeSeriesScale: ChartComponent & { - prototype: TimeSeriesScale; - new (cfg: any): TimeSeriesScale; + prototype: TimeSeriesScale; + new (cfg: any): TimeSeriesScale; }; export type RadialLinearScaleOptions = CoreScaleOptions & { - animate: boolean; + animate: boolean; - angleLines: { - /** - * if true, angle lines are shown. - * @default true - */ - display: boolean; - /** - * Color of angled lines. - * @default 'rgba(0, 0, 0, 0.1)' - */ - color: Scriptable; - /** - * Width of angled lines. - * @default 1 - */ - lineWidth: Scriptable; - /** - * Length and spacing of dashes on angled lines. See MDN. - * @default [] - */ - borderDash: Scriptable; - /** - * Offset for line dashes. See MDN. - * @default 0 - */ - borderDashOffset: Scriptable; - }; + angleLines: { + /** + * if true, angle lines are shown. + * @default true + */ + display: boolean; + /** + * Color of angled lines. + * @default 'rgba(0, 0, 0, 0.1)' + */ + color: Scriptable; + /** + * Width of angled lines. + * @default 1 + */ + lineWidth: Scriptable; + /** + * Length and spacing of dashes on angled lines. See MDN. + * @default [] + */ + borderDash: Scriptable; + /** + * Offset for line dashes. See MDN. + * @default 0 + */ + borderDashOffset: Scriptable; + }; - /** - * if true, scale will include 0 if it is not already included. - * @default false - */ - beginAtZero: boolean; + /** + * if true, scale will include 0 if it is not already included. + * @default false + */ + beginAtZero: boolean; - gridLines: GridLineOptions; + gridLines: GridLineOptions; - /** - * User defined minimum number for the scale, overrides minimum value from data. - */ - min: number; - /** - * User defined maximum number for the scale, overrides maximum value from data. - */ - max: number; + /** + * User defined minimum number for the scale, overrides minimum value from data. + */ + min: number; + /** + * User defined maximum number for the scale, overrides maximum value from data. + */ + max: number; - pointLabels: { - /** - * if true, point labels are shown. - * @default true - */ - display: boolean; - /** - * Color of label - * @see Defaults.color - */ - color: Scriptable; - /** - * @see https://www.chartjs.org/docs/next/axes/general/fonts.md - */ - font: Scriptable; + pointLabels: { + /** + * if true, point labels are shown. + * @default true + */ + display: boolean; + /** + * Color of label + * @see Defaults.color + */ + color: Scriptable; + /** + * @see https://www.chartjs.org/docs/next/axes/general/fonts.md + */ + font: Scriptable; - /** - * Callback function to transform data labels to point labels. The default implementation simply returns the current string. - * @default true - */ - callback: (label: string) => string; - }; + /** + * Callback function to transform data labels to point labels. The default implementation simply returns the current string. + * @default true + */ + callback: (label: string) => string; + }; - /** - * Adjustment used when calculating the maximum data value. - */ - suggestedMax: number; - /** - * Adjustment used when calculating the minimum data value. - */ - suggestedMin: number; + /** + * Adjustment used when calculating the maximum data value. + */ + suggestedMax: number; + /** + * Adjustment used when calculating the minimum data value. + */ + suggestedMin: number; - ticks: TickOptions & { - /** - * Color of label backdrops. - * @default 'rgba(255, 255, 255, 0.75)' - */ - backdropColor: Scriptable; - /** - * Horizontal padding of label backdrop. - * @default 2 - */ - backdropPaddingX: number; - /** - * Vertical padding of label backdrop. - * @default 2 - */ - backdropPaddingY: number; + ticks: TickOptions & { + /** + * Color of label backdrops. + * @default 'rgba(255, 255, 255, 0.75)' + */ + backdropColor: Scriptable; + /** + * Horizontal padding of label backdrop. + * @default 2 + */ + backdropPaddingX: number; + /** + * Vertical padding of label backdrop. + * @default 2 + */ + backdropPaddingY: number; - /** - * The Intl.NumberFormat options used by the default label formatter - */ - format: Intl.NumberFormatOptions; + /** + * The Intl.NumberFormat options used by the default label formatter + */ + format: Intl.NumberFormatOptions; - /** - * Maximum number of ticks and gridlines to show. - * @default 11 - */ - maxTicksLimit: number; + /** + * Maximum number of ticks and gridlines to show. + * @default 11 + */ + maxTicksLimit: number; - /** - * if defined and stepSize is not specified, the step size will be rounded to this many decimal places. - */ - precision: number; + /** + * if defined and stepSize is not specified, the step size will be rounded to this many decimal places. + */ + precision: number; - /** - * User defined fixed step size for the scale. - */ - stepSize: number; + /** + * User defined fixed step size for the scale. + */ + stepSize: number; - /** - * If true, draw a background behind the tick labels. - * @default true - */ - showLabelBackdrop: Scriptable; - }; + /** + * If true, draw a background behind the tick labels. + * @default true + */ + showLabelBackdrop: Scriptable; + }; }; export interface RadialLinearScale extends Scale { - setCenterPoint(leftMovement: number, rightMovement: number, topMovement: number, bottomMovement: number): void; - getIndexAngle(index: number): number; - getDistanceFromCenterForValue(value: number): number; - getValueForDistanceFromCenter(distance: number): number; - getPointPosition(index: number, distanceFromCenter: number): { x: number; y: number; angle: number }; - getPointPositionForValue(index: number, value: number): { x: number; y: number; angle: number }; - getBasePosition(index: number): { x: number; y: number; angle: number }; + setCenterPoint(leftMovement: number, rightMovement: number, topMovement: number, bottomMovement: number): void; + getIndexAngle(index: number): number; + getDistanceFromCenterForValue(value: number): number; + getValueForDistanceFromCenter(distance: number): number; + getPointPosition(index: number, distanceFromCenter: number): { x: number; y: number; angle: number }; + getPointPositionForValue(index: number, value: number): { x: number; y: number; angle: number }; + getBasePosition(index: number): { x: number; y: number; angle: number }; } export const RadialLinearScale: ChartComponent & { - prototype: RadialLinearScale; - new (cfg: any): RadialLinearScale; + prototype: RadialLinearScale; + new (cfg: any): RadialLinearScale; }; // DeepPartial implementation taken from the utility-types NPM package, which is // Copyright (c) 2016 Piotr Witek (http://piotrwitek.github.io) // and used under the terms of the MIT license export type DeepPartial = T extends Function - ? T - : T extends Array - ? _DeepPartialArray - : T extends object - ? _DeepPartialObject - : T | undefined; - interface _DeepPartialArray extends Array> {} - type _DeepPartialObject = { [P in keyof T]?: DeepPartial }; + ? T + : T extends Array + ? _DeepPartialArray + : T extends object + ? _DeepPartialObject + : T | undefined; + interface _DeepPartialArray extends Array> {} + type _DeepPartialObject = { [P in keyof T]?: DeepPartial }; export type DistributiveArray = T extends unknown ? T[] : never export interface CartesianScaleTypeRegistry { - linear: { - options: LinearScaleOptions; - }; - logarithmic: { - options: LogarithmicScaleOptions; - }; - category: { - options: CategoryScaleOptions; - }; - time: { - options: TimeScaleOptions; - }; - timeseries: { - options: TimeScaleOptions; - }; + linear: { + options: LinearScaleOptions; + }; + logarithmic: { + options: LogarithmicScaleOptions; + }; + category: { + options: CategoryScaleOptions; + }; + time: { + options: TimeScaleOptions; + }; + timeseries: { + options: TimeScaleOptions; + }; } export interface RadialScaleTypeRegistry { - radialLinear: { - options: RadialLinearScaleOptions; - }; + radialLinear: { + options: RadialLinearScaleOptions; + }; } export interface ScaleTypeRegistry extends CartesianScaleTypeRegistry, RadialScaleTypeRegistry { @@ -3062,114 +3062,114 @@ export interface ScaleTypeRegistry extends CartesianScaleTypeRegistry, RadialSca export type ScaleType = keyof ScaleTypeRegistry; export interface ChartTypeRegistry { - bar: { - chartOptions: BarControllerChartOptions; - datasetOptions: BarControllerDatasetOptions; - defaultDataPoint: number; - scales: keyof CartesianScaleTypeRegistry; - }; - line: { - chartOptions: LineControllerChartOptions; - datasetOptions: LineControllerDatasetOptions & FillerControllerDatasetOptions; - defaultDataPoint: ScatterDataPoint; - scales: keyof CartesianScaleTypeRegistry; - }; - scatter: { - chartOptions: ScatterControllerChartOptions; - datasetOptions: ScatterControllerDatasetOptions; - defaultDataPoint: ScatterDataPoint; - scales: keyof CartesianScaleTypeRegistry; - }; - bubble: { - chartOptions: {}; - datasetOptions: BubbleControllerDatasetOptions; - defaultDataPoint: BubbleDataPoint; - scales: keyof CartesianScaleTypeRegistry; - }; - pie: { - chartOptions: PieControllerChartOptions; - datasetOptions: PieControllerDatasetOptions; - defaultDataPoint: PieDataPoint; - scales: keyof CartesianScaleTypeRegistry; - }; - doughnut: { - chartOptions: DoughnutControllerChartOptions; - datasetOptions: DoughnutControllerDatasetOptions; - defaultDataPoint: DoughnutDataPoint; - scales: keyof CartesianScaleTypeRegistry; - }; - polarArea: { - chartOptions: PolarAreaControllerChartOptions; - datasetOptions: PolarAreaControllerDatasetOptions; - defaultDataPoint: number; - scales: keyof RadialScaleTypeRegistry; - }; - radar: { - chartOptions: RadarControllerChartOptions; - datasetOptions: RadarControllerDatasetOptions; - defaultDataPoint: number; - scales: keyof RadialScaleTypeRegistry; - }; + bar: { + chartOptions: BarControllerChartOptions; + datasetOptions: BarControllerDatasetOptions; + defaultDataPoint: number; + scales: keyof CartesianScaleTypeRegistry; + }; + line: { + chartOptions: LineControllerChartOptions; + datasetOptions: LineControllerDatasetOptions & FillerControllerDatasetOptions; + defaultDataPoint: ScatterDataPoint; + scales: keyof CartesianScaleTypeRegistry; + }; + scatter: { + chartOptions: ScatterControllerChartOptions; + datasetOptions: ScatterControllerDatasetOptions; + defaultDataPoint: ScatterDataPoint; + scales: keyof CartesianScaleTypeRegistry; + }; + bubble: { + chartOptions: {}; + datasetOptions: BubbleControllerDatasetOptions; + defaultDataPoint: BubbleDataPoint; + scales: keyof CartesianScaleTypeRegistry; + }; + pie: { + chartOptions: PieControllerChartOptions; + datasetOptions: PieControllerDatasetOptions; + defaultDataPoint: PieDataPoint; + scales: keyof CartesianScaleTypeRegistry; + }; + doughnut: { + chartOptions: DoughnutControllerChartOptions; + datasetOptions: DoughnutControllerDatasetOptions; + defaultDataPoint: DoughnutDataPoint; + scales: keyof CartesianScaleTypeRegistry; + }; + polarArea: { + chartOptions: PolarAreaControllerChartOptions; + datasetOptions: PolarAreaControllerDatasetOptions; + defaultDataPoint: number; + scales: keyof RadialScaleTypeRegistry; + }; + radar: { + chartOptions: RadarControllerChartOptions; + datasetOptions: RadarControllerDatasetOptions; + defaultDataPoint: number; + scales: keyof RadialScaleTypeRegistry; + }; } export type ChartType = keyof ChartTypeRegistry; export type ScaleOptions = DeepPartial< - { [key in ScaleType]: { type: key } & ScaleTypeRegistry[key]['options'] }[TScale] + { [key in ScaleType]: { type: key } & ScaleTypeRegistry[key]['options'] }[TScale] >; export type DatasetChartOptions = { - [key in TType]: { - datasets: ChartTypeRegistry[key]['datasetOptions']; - }; + [key in TType]: { + datasets: ChartTypeRegistry[key]['datasetOptions']; + }; }; export type ScaleChartOptions = { - scales: { - [key: string]: ScaleOptions; - }; + scales: { + [key: string]: ScaleOptions; + }; }; export type ChartOptions = DeepPartial< - CoreChartOptions & - ElementChartOptions & - DatasetChartOptions & - ScaleChartOptions & - ChartTypeRegistry[TType]['chartOptions'] + CoreChartOptions & + ElementChartOptions & + DatasetChartOptions & + ScaleChartOptions & + ChartTypeRegistry[TType]['chartOptions'] >; export type DefaultDataPoint = ChartType extends TType ? unknown[] : DistributiveArray< - ChartTypeRegistry[TType]['defaultDataPoint'] + ChartTypeRegistry[TType]['defaultDataPoint'] >; export interface ChartDatasetProperties { - type?: TType; - data: TData; + type?: TType; + data: TData; } export type ChartDataset< - TType extends ChartType = ChartType, - TData extends unknown[] = DefaultDataPoint + TType extends ChartType = ChartType, + TData extends unknown[] = DefaultDataPoint > = DeepPartial< - { [key in ChartType]: { type: key } & ChartTypeRegistry[key]['datasetOptions'] }[TType] + { [key in ChartType]: { type: key } & ChartTypeRegistry[key]['datasetOptions'] }[TType] > & ChartDatasetProperties; export interface ChartData< - TType extends ChartType = ChartType, - TData extends unknown[] = DefaultDataPoint, - TLabel = unknown + TType extends ChartType = ChartType, + TData extends unknown[] = DefaultDataPoint, + TLabel = unknown > { - labels: TLabel[]; - datasets: ChartDataset[]; + labels: TLabel[]; + datasets: ChartDataset[]; } export interface ChartConfiguration< - TType extends ChartType = ChartType, - TData extends unknown[] = DefaultDataPoint, - TLabel = unknown + TType extends ChartType = ChartType, + TData extends unknown[] = DefaultDataPoint, + TLabel = unknown > { - type: TType; - data: ChartData; - options?: ChartOptions; - plugins?: Plugin[]; + type: TType; + data: ChartData; + options?: ChartOptions; + plugins?: Plugin[]; } diff --git a/types/layout.d.ts b/types/layout.d.ts index 41ee5affa..bb3f1dbba 100644 --- a/types/layout.d.ts +++ b/types/layout.d.ts @@ -14,9 +14,9 @@ export interface LayoutItem { /** * if true, and the item is horizontal, then push vertical boxes down */ - fullWidth: boolean; - /** - * Width of item. Must be valid after update() + fullWidth: boolean; + /** + * Width of item. Must be valid after update() */ width: number; /** @@ -36,22 +36,22 @@ export interface LayoutItem { */ right: number; /** - * Bottom edge of the item. Set by layout system and cannot be used in update + * Bottom edge of the item. Set by layout system and cannot be used in update */ - bottom: number; + bottom: number; - /** - * Called before the layout process starts - */ - beforeLayout?(): void; - /** + /** + * Called before the layout process starts + */ + beforeLayout?(): void; + /** * Draws the element */ - draw(ChartArea): void; - /** + draw(ChartArea): void; + /** * Returns an object with padding on the edges */ - getPadding?(): ChartArea; + getPadding?(): ChartArea; /** * returns true if the layout item is horizontal (ie. top or bottom) */