From df11773d9fde38723c904d3b884248ed829b0feb Mon Sep 17 00:00:00 2001
From: Evert Timberg <evert.timberg@gmail.com>
Date: Sat, 5 Feb 2022 19:59:43 -0500
Subject: [PATCH] Allow spanGaps to be specified on LineOptions

---
 docs/charts/line.md                       |  2 +-
 docs/charts/radar.md                      |  2 +-
 types/index.esm.d.ts                      |  4 +++
 types/tests/controllers/line_span_gaps.ts | 32 +++++++++++++++++++++++
 4 files changed, 38 insertions(+), 2 deletions(-)
 create mode 100644 types/tests/controllers/line_span_gaps.ts

diff --git a/docs/charts/line.md b/docs/charts/line.md
index 22a7a349d74..f4331f97069 100644
--- a/docs/charts/line.md
+++ b/docs/charts/line.md
@@ -135,7 +135,7 @@ The style of the line can be controlled with the following properties:
 | `showLine` | If false, the line is not drawn for this dataset.
 | `spanGaps` | If true, lines will be drawn between points with no or null data. If false, points with `null` 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.
 
-If the value is `undefined`, `showLine` and `spanGaps` fallback to the associated [chart configuration options](#configuration-options). The rest of the values fallback to the associated [`elements.line.*`](../configuration/elements.md#line-configuration) options.
+If the value is `undefined`, the values fallback to the associated [`elements.line.*`](../configuration/elements.md#line-configuration) options.
 
 ### Interactions
 
diff --git a/docs/charts/radar.md b/docs/charts/radar.md
index 5508b2abf6b..5a5890ca7ad 100644
--- a/docs/charts/radar.md
+++ b/docs/charts/radar.md
@@ -150,7 +150,7 @@ The style of the line can be controlled with the following properties:
 | `tension` | Bezier curve tension of the line. Set to 0 to draw straight lines.
 | `spanGaps` | If true, lines will be drawn between points with no or null data. If false, points with `null` data will create a break in the line.
 
-If the value is `undefined`, `spanGaps` fallback to the associated [chart configuration options](#configuration-options). The rest of the values fallback to the associated [`elements.line.*`](../configuration/elements.md#line-configuration) options.
+If the value is `undefined`, the values fallback to the associated [`elements.line.*`](../configuration/elements.md#line-configuration) options.
 
 ### Interactions
 
diff --git a/types/index.esm.d.ts b/types/index.esm.d.ts
index 10ac49f4ef5..ffeaaa1268d 100644
--- a/types/index.esm.d.ts
+++ b/types/index.esm.d.ts
@@ -1787,6 +1787,10 @@ export interface LineOptions extends CommonElementOptions {
    * 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;
+  /**
+   * 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;
 
   segment: {
     backgroundColor: Scriptable<Color|undefined, ScriptableLineSegmentContext>,
diff --git a/types/tests/controllers/line_span_gaps.ts b/types/tests/controllers/line_span_gaps.ts
new file mode 100644
index 00000000000..040c9a99c03
--- /dev/null
+++ b/types/tests/controllers/line_span_gaps.ts
@@ -0,0 +1,32 @@
+import { Chart } from '../../index.esm';
+
+const chart = new Chart('id', {
+  type: 'line',
+  data: {
+    datasets: [
+      {
+        label: 'Cats',
+        data: [],
+      }
+    ]
+  },
+  options: {
+    elements: {
+      line: {
+        spanGaps: true
+      }
+    },
+    scales: {
+      x: {
+        type: 'linear',
+        min: 1,
+        max: 10
+      },
+      y: {
+        type: 'linear',
+        min: 0,
+        max: 50
+      }
+    }
+  }
+});