From b5435fb79dd403488189fc52e0b8d9665eee742e Mon Sep 17 00:00:00 2001 From: Jacco van den Berg Date: Thu, 19 May 2022 19:20:15 +0200 Subject: [PATCH 1/8] allow font scriptable to return partial object and be scriptable --- types/index.esm.d.ts | 36 +++++++++++++++++++++++------------- 1 file changed, 23 insertions(+), 13 deletions(-) diff --git a/types/index.esm.d.ts b/types/index.esm.d.ts index e19439e687b..0fc8d4110fa 100644 --- a/types/index.esm.d.ts +++ b/types/index.esm.d.ts @@ -1467,7 +1467,7 @@ export interface CoreChartOptions extends ParsingOption * base font * @see Defaults.font */ - font: Partial; + font: Partial>; /** * Resizes the chart canvas when its container does (important note...). * @default true @@ -1637,17 +1637,17 @@ export type AnimationOptions = { transitions: TransitionsSpec; }; -export interface FontSpec { +export interface FontSpec { /** * Default font family for all text, follows CSS font-family options. * @default "'Helvetica Neue', 'Helvetica', 'Arial', sans-serif" */ - family: string; + family: Scriptable; /** * Default font size (in px) for text. Does not apply to radialLinear scale point labels. * @default 12 */ - size: number; + size: Scriptable; /** * 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' @@ -2303,7 +2303,7 @@ export interface LegendOptions { * Font of label * @see Defaults.font */ - font: FontSpec; + font: Partial>; /** * Padding between rows of colored boxes. * @default 10 @@ -2364,7 +2364,7 @@ export interface LegendOptions { /** * see Fonts */ - font: FontSpec; + font: Partial>; position: 'center' | 'start' | 'end'; padding?: number | ChartArea; /** @@ -2398,7 +2398,7 @@ export interface TitleOptions { * @see Defaults.color */ color: Color; - font: FontSpec; + font: Partial>; /** * Marks that this box should take the full width/height of the canvas (moving other boxes). If set to `false`, places the box above/beside the @@ -2629,7 +2629,7 @@ export interface TooltipOptions extends Cor * See Fonts * @default {weight: 'bold'} */ - titleFont: Scriptable>; + titleFont: Scriptable>>, ScriptableTooltipContext>; /** * Spacing to add to top and bottom of each title line. * @default 2 @@ -2659,7 +2659,7 @@ export interface TooltipOptions extends Cor * See Fonts. * @default {} */ - bodyFont: Scriptable>; + bodyFont: Scriptable>>, ScriptableTooltipContext>; /** * Horizontal alignment of the body text lines. * @default 'left' @@ -2684,7 +2684,7 @@ export interface TooltipOptions extends Cor * See Fonts * @default {weight: 'bold'} */ - footerFont: Scriptable>; + footerFont: Scriptable>>, ScriptableTooltipContext>; /** * Horizontal alignment of the footer text lines. * @default 'left' @@ -2919,7 +2919,7 @@ export interface TickOptions { /** * see Fonts */ - font: Scriptable; + font: Scriptable>, ScriptableScaleContext>; /** * Sets the offset of the tick labels from the axis */ @@ -3022,6 +3022,16 @@ export type CartesianTickOptions = TickOptions & { maxTicksLimit: number; } +export interface ScriptableCartesianScaleContext { + scale: keyof CartesianScaleTypeRegistry; + type: string; +} + +export interface ScriptableChartContext { + chart: Chart; + type: string; +} + export interface CartesianScaleOptions extends CoreScaleOptions { /** * Scale boundary strategy (bypassed by min/max time options) @@ -3082,7 +3092,7 @@ export interface CartesianScaleOptions extends CoreScaleOptions { /** Color of the axis label. */ color: Color; /** Information about the axis title font. */ - font: FontSpec; + font: Partial>; /** Padding to apply around scale labels. */ padding: number | { /** Padding on the (relative) top side of this axis label. */ @@ -3399,7 +3409,7 @@ export type RadialLinearScaleOptions = CoreScaleOptions & { color: Scriptable; /** */ - font: Scriptable; + font: Scriptable>, ScriptableScalePointLabelContext>; /** * Callback function to transform data labels to point labels. The default implementation simply returns the current string. From 19ea12fa73ebdb405e6233099fa34f5a6c2416b1 Mon Sep 17 00:00:00 2001 From: Jacco van den Berg Date: Thu, 19 May 2022 19:21:22 +0200 Subject: [PATCH 2/8] add other elements as scriptable --- types/index.esm.d.ts | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/types/index.esm.d.ts b/types/index.esm.d.ts index 0fc8d4110fa..8dd36713ec5 100644 --- a/types/index.esm.d.ts +++ b/types/index.esm.d.ts @@ -1652,16 +1652,16 @@ export interface FontSpec { * 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'; + style: Scriptable<'normal' | 'italic' | 'oblique' | 'initial' | 'inherit', ScriptableContext>; /** * Default font weight (boldness). (see MDN). */ - weight: string | null; + weight: Scriptable; /** * Height of an individual line of text (see MDN). * @default 1.2 */ - lineHeight: number | string; + lineHeight: Scriptable; } export type TextAlign = 'left' | 'center' | 'right'; From 34ace8e82c54fe7aaa5f14c2ba1782930f96be63 Mon Sep 17 00:00:00 2001 From: Jacco van den Berg Date: Thu, 19 May 2022 19:29:41 +0200 Subject: [PATCH 3/8] rename variable for context to resolve lint issue --- types/index.esm.d.ts | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/types/index.esm.d.ts b/types/index.esm.d.ts index 8dd36713ec5..951b922ab20 100644 --- a/types/index.esm.d.ts +++ b/types/index.esm.d.ts @@ -1637,31 +1637,31 @@ export type AnimationOptions = { transitions: TransitionsSpec; }; -export interface FontSpec { +export interface FontSpec { /** * Default font family for all text, follows CSS font-family options. * @default "'Helvetica Neue', 'Helvetica', 'Arial', sans-serif" */ - family: Scriptable; + family: Scriptable; /** * Default font size (in px) for text. Does not apply to radialLinear scale point labels. * @default 12 */ - size: Scriptable; + size: Scriptable; /** * 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: Scriptable<'normal' | 'italic' | 'oblique' | 'initial' | 'inherit', ScriptableContext>; + style: Scriptable<'normal' | 'italic' | 'oblique' | 'initial' | 'inherit', ScriptableFontContext>; /** * Default font weight (boldness). (see MDN). */ - weight: Scriptable; + weight: Scriptable; /** * Height of an individual line of text (see MDN). * @default 1.2 */ - lineHeight: Scriptable; + lineHeight: Scriptable; } export type TextAlign = 'left' | 'center' | 'right'; From be379308582de8117421b664ff26dd67315ef531 Mon Sep 17 00:00:00 2001 From: Jacco van den Berg Date: Thu, 19 May 2022 19:58:14 +0200 Subject: [PATCH 4/8] add duplicate font for non scriptable --- types/helpers/helpers.options.d.ts | 15 ++++++++++++--- 1 file changed, 12 insertions(+), 3 deletions(-) diff --git a/types/helpers/helpers.options.d.ts b/types/helpers/helpers.options.d.ts index 0bd783fa970..1b760161c57 100644 --- a/types/helpers/helpers.options.d.ts +++ b/types/helpers/helpers.options.d.ts @@ -1,7 +1,16 @@ import { TRBL, TRBLCorners } from '../geometric'; -import { FontSpec } from '../index.esm'; -export interface CanvasFontSpec extends FontSpec { +// Should be the same as FontSpec from the index.esm.ts +// Duplicate because the default one is scriptable and this one is not +interface NonScriptableFontSpec { + family: string; + size: number; + style: 'normal' | 'italic' | 'oblique' | 'initial' | 'inherit'; + weight: string | null; + lineHeight: number | string; +} + +export interface CanvasFontSpec extends NonScriptableFontSpec { string: string; } /** @@ -9,7 +18,7 @@ export interface CanvasFontSpec extends FontSpec { * @param {object} options - A object that contains font options to be parsed. * @return {object} The font object. */ -export function toFont(options: Partial): CanvasFontSpec; +export function toFont(options: Partial): CanvasFontSpec; /** * Converts the given line height `value` in pixels for a specific font `size`. From e0901efbd65ee1e60a486d9989f86fe9b629ca7b Mon Sep 17 00:00:00 2001 From: Jacco van den Berg Date: Tue, 24 May 2022 22:17:45 +0200 Subject: [PATCH 5/8] change to scriptableOptions --- types/helpers/helpers.options.d.ts | 15 +++----------- types/index.esm.d.ts | 33 +++++++++++++++--------------- 2 files changed, 20 insertions(+), 28 deletions(-) diff --git a/types/helpers/helpers.options.d.ts b/types/helpers/helpers.options.d.ts index 1b760161c57..65a00faa9cf 100644 --- a/types/helpers/helpers.options.d.ts +++ b/types/helpers/helpers.options.d.ts @@ -1,16 +1,7 @@ import { TRBL, TRBLCorners } from '../geometric'; +import { FontSpec } from '../index.esm'; -// Should be the same as FontSpec from the index.esm.ts -// Duplicate because the default one is scriptable and this one is not -interface NonScriptableFontSpec { - family: string; - size: number; - style: 'normal' | 'italic' | 'oblique' | 'initial' | 'inherit'; - weight: string | null; - lineHeight: number | string; -} - -export interface CanvasFontSpec extends NonScriptableFontSpec { +export interface CanvasFontSpec extends FontSpec { string: string; } /** @@ -18,7 +9,7 @@ export interface CanvasFontSpec extends NonScriptableFontSpec { * @param {object} options - A object that contains font options to be parsed. * @return {object} The font object. */ -export function toFont(options: Partial): CanvasFontSpec; +export function toFont(options: Partial): CanvasFontSpec; /** * Converts the given line height `value` in pixels for a specific font `size`. diff --git a/types/index.esm.d.ts b/types/index.esm.d.ts index 951b922ab20..8878cfc20b6 100644 --- a/types/index.esm.d.ts +++ b/types/index.esm.d.ts @@ -38,6 +38,7 @@ export interface ScriptableLineSegmentContext { export type Scriptable = T | ((ctx: TContext, options: AnyObject) => T | undefined); export type ScriptableOptions = { [P in keyof T]: Scriptable }; +export type ScriptableOrScriptableOptions = Scriptable | ScriptableOptions; export type ScriptableAndArray = readonly T[] | Scriptable; export type ScriptableAndArrayOptions = { [P in keyof T]: ScriptableAndArray }; @@ -1467,7 +1468,7 @@ export interface CoreChartOptions extends ParsingOption * base font * @see Defaults.font */ - font: Partial>; + font: Partial; /** * Resizes the chart canvas when its container does (important note...). * @default true @@ -1637,31 +1638,31 @@ export type AnimationOptions = { transitions: TransitionsSpec; }; -export interface FontSpec { +export interface FontSpec{ /** * Default font family for all text, follows CSS font-family options. * @default "'Helvetica Neue', 'Helvetica', 'Arial', sans-serif" */ - family: Scriptable; + family: string; /** * Default font size (in px) for text. Does not apply to radialLinear scale point labels. * @default 12 */ - size: Scriptable; + 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: Scriptable<'normal' | 'italic' | 'oblique' | 'initial' | 'inherit', ScriptableFontContext>; + style: 'normal' | 'italic' | 'oblique' | 'initial' | 'inherit'; /** * Default font weight (boldness). (see MDN). */ - weight: Scriptable; + weight: string | null; /** * Height of an individual line of text (see MDN). * @default 1.2 */ - lineHeight: Scriptable; + lineHeight: number | string; } export type TextAlign = 'left' | 'center' | 'right'; @@ -2303,7 +2304,7 @@ export interface LegendOptions { * Font of label * @see Defaults.font */ - font: Partial>; + font: ScriptableOrScriptableOptions, ScriptableChartContext>; /** * Padding between rows of colored boxes. * @default 10 @@ -2364,7 +2365,7 @@ export interface LegendOptions { /** * see Fonts */ - font: Partial>; + font: ScriptableOrScriptableOptions, ScriptableChartContext>; position: 'center' | 'start' | 'end'; padding?: number | ChartArea; /** @@ -2398,7 +2399,7 @@ export interface TitleOptions { * @see Defaults.color */ color: Color; - font: Partial>; + font: ScriptableOrScriptableOptions, ScriptableChartContext>; /** * Marks that this box should take the full width/height of the canvas (moving other boxes). If set to `false`, places the box above/beside the @@ -2629,7 +2630,7 @@ export interface TooltipOptions extends Cor * See Fonts * @default {weight: 'bold'} */ - titleFont: Scriptable>>, ScriptableTooltipContext>; + titleFont: ScriptableOrScriptableOptions, ScriptableTooltipContext>; /** * Spacing to add to top and bottom of each title line. * @default 2 @@ -2659,7 +2660,7 @@ export interface TooltipOptions extends Cor * See Fonts. * @default {} */ - bodyFont: Scriptable>>, ScriptableTooltipContext>; + bodyFont: ScriptableOrScriptableOptions, ScriptableTooltipContext>; /** * Horizontal alignment of the body text lines. * @default 'left' @@ -2684,7 +2685,7 @@ export interface TooltipOptions extends Cor * See Fonts * @default {weight: 'bold'} */ - footerFont: Scriptable>>, ScriptableTooltipContext>; + footerFont: ScriptableOrScriptableOptions, ScriptableTooltipContext>; /** * Horizontal alignment of the footer text lines. * @default 'left' @@ -2919,7 +2920,7 @@ export interface TickOptions { /** * see Fonts */ - font: Scriptable>, ScriptableScaleContext>; + font: ScriptableOrScriptableOptions, ScriptableScaleContext>; /** * Sets the offset of the tick labels from the axis */ @@ -3092,7 +3093,7 @@ export interface CartesianScaleOptions extends CoreScaleOptions { /** Color of the axis label. */ color: Color; /** Information about the axis title font. */ - font: Partial>; + font: ScriptableOrScriptableOptions, ScriptableCartesianScaleContext>; /** Padding to apply around scale labels. */ padding: number | { /** Padding on the (relative) top side of this axis label. */ @@ -3409,7 +3410,7 @@ export type RadialLinearScaleOptions = CoreScaleOptions & { color: Scriptable; /** */ - font: Scriptable>, ScriptableScalePointLabelContext>; + font: ScriptableOrScriptableOptions, ScriptableScalePointLabelContext>; /** * Callback function to transform data labels to point labels. The default implementation simply returns the current string. From a4e08c96f0f97eba0d68c2574fb39963425863c9 Mon Sep 17 00:00:00 2001 From: Jacco van den Berg Date: Tue, 24 May 2022 22:18:46 +0200 Subject: [PATCH 6/8] fix parameter --- types/helpers/helpers.options.d.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/types/helpers/helpers.options.d.ts b/types/helpers/helpers.options.d.ts index 65a00faa9cf..0bd783fa970 100644 --- a/types/helpers/helpers.options.d.ts +++ b/types/helpers/helpers.options.d.ts @@ -9,7 +9,7 @@ export interface CanvasFontSpec extends FontSpec { * @param {object} options - A object that contains font options to be parsed. * @return {object} The font object. */ -export function toFont(options: Partial): CanvasFontSpec; +export function toFont(options: Partial): CanvasFontSpec; /** * Converts the given line height `value` in pixels for a specific font `size`. From 41afd7d7ffd76bcbc86141ed3085240e53fb4270 Mon Sep 17 00:00:00 2001 From: Jacco van den Berg Date: Tue, 24 May 2022 22:19:52 +0200 Subject: [PATCH 7/8] missing space --- types/index.esm.d.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/types/index.esm.d.ts b/types/index.esm.d.ts index 8878cfc20b6..1c0c5229a81 100644 --- a/types/index.esm.d.ts +++ b/types/index.esm.d.ts @@ -1638,7 +1638,7 @@ export type AnimationOptions = { transitions: TransitionsSpec; }; -export interface FontSpec{ +export interface FontSpec { /** * Default font family for all text, follows CSS font-family options. * @default "'Helvetica Neue', 'Helvetica', 'Arial', sans-serif" From 6e01ee9c5cce1f11ed1d11b3a0433fee8ba83d46 Mon Sep 17 00:00:00 2001 From: Jacco van den Berg <39033624+LeeLenaleee@users.noreply.github.com> Date: Wed, 25 May 2022 12:10:39 +0200 Subject: [PATCH 8/8] Change name of helper function to match other helper function --- types/index.esm.d.ts | 20 ++++++++++---------- 1 file changed, 10 insertions(+), 10 deletions(-) diff --git a/types/index.esm.d.ts b/types/index.esm.d.ts index 1c0c5229a81..44aea500bf1 100644 --- a/types/index.esm.d.ts +++ b/types/index.esm.d.ts @@ -38,7 +38,7 @@ export interface ScriptableLineSegmentContext { export type Scriptable = T | ((ctx: TContext, options: AnyObject) => T | undefined); export type ScriptableOptions = { [P in keyof T]: Scriptable }; -export type ScriptableOrScriptableOptions = Scriptable | ScriptableOptions; +export type ScriptableAndScriptableOptions = Scriptable | ScriptableOptions; export type ScriptableAndArray = readonly T[] | Scriptable; export type ScriptableAndArrayOptions = { [P in keyof T]: ScriptableAndArray }; @@ -2304,7 +2304,7 @@ export interface LegendOptions { * Font of label * @see Defaults.font */ - font: ScriptableOrScriptableOptions, ScriptableChartContext>; + font: ScriptableAndScriptableOptions, ScriptableChartContext>; /** * Padding between rows of colored boxes. * @default 10 @@ -2365,7 +2365,7 @@ export interface LegendOptions { /** * see Fonts */ - font: ScriptableOrScriptableOptions, ScriptableChartContext>; + font: ScriptableAndScriptableOptions, ScriptableChartContext>; position: 'center' | 'start' | 'end'; padding?: number | ChartArea; /** @@ -2399,7 +2399,7 @@ export interface TitleOptions { * @see Defaults.color */ color: Color; - font: ScriptableOrScriptableOptions, ScriptableChartContext>; + font: ScriptableAndScriptableOptions, ScriptableChartContext>; /** * Marks that this box should take the full width/height of the canvas (moving other boxes). If set to `false`, places the box above/beside the @@ -2630,7 +2630,7 @@ export interface TooltipOptions extends Cor * See Fonts * @default {weight: 'bold'} */ - titleFont: ScriptableOrScriptableOptions, ScriptableTooltipContext>; + titleFont: ScriptableAndScriptableOptions, ScriptableTooltipContext>; /** * Spacing to add to top and bottom of each title line. * @default 2 @@ -2660,7 +2660,7 @@ export interface TooltipOptions extends Cor * See Fonts. * @default {} */ - bodyFont: ScriptableOrScriptableOptions, ScriptableTooltipContext>; + bodyFont: ScriptableAndScriptableOptions, ScriptableTooltipContext>; /** * Horizontal alignment of the body text lines. * @default 'left' @@ -2685,7 +2685,7 @@ export interface TooltipOptions extends Cor * See Fonts * @default {weight: 'bold'} */ - footerFont: ScriptableOrScriptableOptions, ScriptableTooltipContext>; + footerFont: ScriptableAndScriptableOptions, ScriptableTooltipContext>; /** * Horizontal alignment of the footer text lines. * @default 'left' @@ -2920,7 +2920,7 @@ export interface TickOptions { /** * see Fonts */ - font: ScriptableOrScriptableOptions, ScriptableScaleContext>; + font: ScriptableAndScriptableOptions, ScriptableScaleContext>; /** * Sets the offset of the tick labels from the axis */ @@ -3093,7 +3093,7 @@ export interface CartesianScaleOptions extends CoreScaleOptions { /** Color of the axis label. */ color: Color; /** Information about the axis title font. */ - font: ScriptableOrScriptableOptions, ScriptableCartesianScaleContext>; + font: ScriptableAndScriptableOptions, ScriptableCartesianScaleContext>; /** Padding to apply around scale labels. */ padding: number | { /** Padding on the (relative) top side of this axis label. */ @@ -3410,7 +3410,7 @@ export type RadialLinearScaleOptions = CoreScaleOptions & { color: Scriptable; /** */ - font: ScriptableOrScriptableOptions, ScriptableScalePointLabelContext>; + font: ScriptableAndScriptableOptions, ScriptableScalePointLabelContext>; /** * Callback function to transform data labels to point labels. The default implementation simply returns the current string.