From 56d93fa5411d9e6b2f4bce1fa5018f3a58d777af Mon Sep 17 00:00:00 2001
From: Kacper Madej <kacper@blacklabel.pl>
Date: Sat, 22 Dec 2018 05:05:48 +0100
Subject: [PATCH] feat: Added TS definitions from Highcharts into the wrapper
 for types reference.

---
 .../src/lib/highcharts-chart.component.ts        | 16 ++++++++--------
 src/app/app.component.ts                         |  7 +++----
 2 files changed, 11 insertions(+), 12 deletions(-)

diff --git a/highcharts-angular/src/lib/highcharts-chart.component.ts b/highcharts-angular/src/lib/highcharts-chart.component.ts
index 2c85b9c..f864b8d 100644
--- a/highcharts-angular/src/lib/highcharts-chart.component.ts
+++ b/highcharts-angular/src/lib/highcharts-chart.component.ts
@@ -1,17 +1,18 @@
 import { Component, ElementRef, EventEmitter, Input, OnDestroy, Output, NgZone } from '@angular/core';
+import * as Highcharts from 'highcharts';
 
 @Component({
   selector: 'highcharts-chart',
   template: ''
 })
 export class HighchartsChartComponent implements OnDestroy {
-  @Input() Highcharts: any;
+  @Input() Highcharts: typeof Highcharts;
   @Input() constructorType: string;
-  @Input() callbackFunction: any;
+  @Input() callbackFunction: Highcharts.ChartCallbackFunction;
   @Input() oneToOne: boolean; // #20
   @Input() runOutsideAngular: boolean; // #75
 
-  @Input() set options(val: any) {
+  @Input() set options(val: Highcharts.Options) {
     this.optionsValue = val;
     this.wrappedUpdateOrCreateChart();
   }
@@ -23,10 +24,10 @@ export class HighchartsChartComponent implements OnDestroy {
   }
 
   @Output() updateChange = new EventEmitter<boolean>(true);
-  @Output() chartInstance = new EventEmitter<any>(); // #26
+  @Output() chartInstance = new EventEmitter<Highcharts.Chart>(); // #26
 
-  private chart: any;
-  private optionsValue: any;
+  private chart: Highcharts.Chart;
+  private optionsValue: Highcharts.Options;
 
   constructor(
     private el: ElementRef,
@@ -47,12 +48,11 @@ export class HighchartsChartComponent implements OnDestroy {
     if (this.chart && this.chart.update) {
       this.chart.update(this.optionsValue, true, this.oneToOne || false);
     } else {
-      this.chart = this.Highcharts[this.constructorType || 'chart'](
+      this.chart = (this.Highcharts as any)[this.constructorType || 'chart'](
         this.el.nativeElement,
         this.optionsValue,
         this.callbackFunction || null
       );
-      this.optionsValue.series = this.chart.userOptions.series;
 
       // emit chart instance on init
       this.chartInstance.emit(this.chart);
diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index 6abca72..ac66dba 100644
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -2,7 +2,7 @@ declare var require: any;
 
 import { Component } from '@angular/core';
 
-import * as Highcharts from 'highcharts/highcharts';
+import * as Highcharts from 'highcharts';
 
 import StockModule from 'highcharts/modules/stock';
 import MapModule from 'highcharts/modules/map';
@@ -41,7 +41,6 @@ export class AppComponent {
   {
     "title": { "text": "Highcharts chart" },
     "series": [{
-      "type": "line",
       "data": [11,2,3]
     }, {
       "data": [5,6,7]
@@ -68,9 +67,9 @@ export class AppComponent {
     spline: 'line'
   };
 
-  toggleSeriesType(index = 0) {
+  toggleSeriesType(index: number = 0) {
     this.optFromInput.series[index].type =
-      this.seriesTypes[this.optFromInput.series[index].type] as
+      this.seriesTypes[this.optFromInput.series[index].type || 'line'] as
         "column" | "scatter" | "spline" | "line";
     // nested change - must trigger update
     this.updateFromInput = true;