From 49e7edae49467fd74a52b3cc934b33ad0219554e Mon Sep 17 00:00:00 2001
From: Evert Timberg <evert.timberg+github@gmail.com>
Date: Sat, 1 May 2021 13:30:14 -0400
Subject: [PATCH] Enable scriptable element chart options (#9012)

---
 types/index.esm.d.ts                          | 23 ++++-----
 .../elements/scriptable_element_options.ts    | 49 +++++++++++++++++++
 2 files changed, 61 insertions(+), 11 deletions(-)
 create mode 100644 types/tests/elements/scriptable_element_options.ts

diff --git a/types/index.esm.d.ts b/types/index.esm.d.ts
index dbb34fefb..3066472c0 100644
--- a/types/index.esm.d.ts
+++ b/types/index.esm.d.ts
@@ -604,7 +604,7 @@ export interface DatasetControllerChartComponent extends ChartComponent {
   };
 }
 
-export interface Defaults extends CoreChartOptions<ChartType>, ElementChartOptions, PluginChartOptions<ChartType> {
+export interface Defaults extends CoreChartOptions<ChartType>, ElementChartOptions<ChartType>, PluginChartOptions<ChartType> {
 
   scale: ScaleOptionsByType;
   scales: {
@@ -641,7 +641,7 @@ export interface Defaults extends CoreChartOptions<ChartType>, ElementChartOptio
 export type Overrides = {
   [key in ChartType]:
     CoreChartOptions<key> &
-    ElementChartOptions &
+    ElementChartOptions<key> &
     PluginChartOptions<key> &
     DatasetChartOptions<ChartType> &
     ScaleChartOptions<key> &
@@ -1887,16 +1887,17 @@ export const BarElement: ChartComponent & {
   new (cfg: AnyObject): BarElement;
 };
 
-export interface ElementOptionsByType {
-  arc: ArcOptions & ArcHoverOptions;
-  bar: BarOptions & BarHoverOptions;
-  line: LineOptions & LineHoverOptions;
-  point: PointOptions & PointHoverOptions;
-}
-export interface ElementChartOptions {
-  elements: Partial<ElementOptionsByType>;
+export interface ElementOptionsByType<TType extends ChartType> {
+  arc: ScriptableAndArrayOptions<ArcOptions & ArcHoverOptions, ScriptableContext<TType>>;
+  bar: ScriptableAndArrayOptions<BarOptions & BarHoverOptions, ScriptableContext<TType>>;
+  line: ScriptableAndArrayOptions<LineOptions & LineHoverOptions, ScriptableContext<TType>>;
+  point: ScriptableAndArrayOptions<PointOptions & PointHoverOptions, ScriptableContext<TType>>;
 }
 
+export type ElementChartOptions<TType extends ChartType = ChartType> = {
+  elements: ElementOptionsByType<TType>
+};
+
 export class BasePlatform {
   /**
    * Called at chart construction time, returns a context2d instance implementing
@@ -3321,7 +3322,7 @@ export type ScaleChartOptions<TType extends ChartType = ChartType> = {
 
 export type ChartOptions<TType extends ChartType = ChartType> = DeepPartial<
   CoreChartOptions<TType> &
-  ElementChartOptions &
+  ElementChartOptions<TType> &
   PluginChartOptions<TType> &
   DatasetChartOptions<TType> &
   ScaleChartOptions<TType> &
diff --git a/types/tests/elements/scriptable_element_options.ts b/types/tests/elements/scriptable_element_options.ts
new file mode 100644
index 000000000..0776ec0a0
--- /dev/null
+++ b/types/tests/elements/scriptable_element_options.ts
@@ -0,0 +1,49 @@
+import { Chart } from '../../index.esm';
+
+const chart = new Chart('id', {
+  type: 'line',
+  data: {
+    labels: [],
+    datasets: []
+  },
+  options: {
+    elements: {
+      line: {
+        borderWidth: () => 2,
+      },
+      point: {
+        pointStyle: (ctx) => 'star',
+      }
+    }
+  }
+});
+
+const chart2 = new Chart('id', {
+  type: 'bar',
+  data: {
+    labels: [],
+    datasets: []
+  },
+  options: {
+    elements: {
+      bar: {
+        borderWidth: (ctx) => 2,
+      }
+    }
+  }
+});
+
+const chart3 = new Chart('id', {
+  type: 'doughnut',
+  data: {
+    labels: [],
+    datasets: []
+  },
+  options: {
+    elements: {
+      arc: {
+        borderWidth: (ctx) => 3,
+      }
+    }
+  }
+});
-- 
2.47.2