ng2-charts - npm Package Compare versions

Comparing version 1.1.0 to 1.2.0

bundles/ng2-charts.js

@@ -1,257 +0,266 @@
-System.registerDynamic("ng2-charts/components/charts/charts", ["@angular/core", "@angular/common"], true, function($__require, exports, module) {
-  "use strict";
-  ;
-  var define,
-      global = this,
-      GLOBAL = this;
-  var __decorate = (this && this.__decorate) || function(decorators, target, key, desc) {
-    var c = arguments.length,
-        r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc,
-        d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
-      r = Reflect.decorate(decorators, target, key, desc);
-    else
-      for (var i = decorators.length - 1; i >= 0; i--)
-        if (d = decorators[i])
-          r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-  };
-  var __metadata = (this && this.__metadata) || function(k, v) {
-    if (typeof Reflect === "object" && typeof Reflect.metadata === "function")
-      return Reflect.metadata(k, v);
-  };
-  var core_1 = $__require('@angular/core');
-  var common_1 = $__require('@angular/common');
-  var BaseChartComponent = (function() {
-    function BaseChartComponent(element) {
-      this.labels = [];
-      this.options = {responsive: true};
-      this.chartClick = new core_1.EventEmitter();
-      this.chartHover = new core_1.EventEmitter();
-      this.initFlag = false;
-      this.element = element;
-    }
-    BaseChartComponent.prototype.ngOnInit = function() {
-      this.ctx = this.element.nativeElement.children[0].getContext('2d');
-      this.cvs = this.element.nativeElement.children[0];
-      this.parent = this.element.nativeElement;
-      this.initFlag = true;
-      if (this.data || this.datasets) {
-        this.refresh();
-      }
+System.registerDynamic("ng2-charts/components/charts/charts", ["@angular/core"], true, function ($__require, exports, module) {
+    "use strict";
+
+    var define,
+        global = this || self,
+        GLOBAL = global;
+    var __decorate = this && this.__decorate || function (decorators, target, key, desc) {
+        var c = arguments.length,
+            r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc,
+            d;
+        if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+        return c > 3 && r && Object.defineProperty(target, key, r), r;
     };
-    BaseChartComponent.prototype.ngOnChanges = function() {
-      if (this.initFlag) {
-        this.refresh();
-      }
+    var __metadata = this && this.__metadata || function (k, v) {
+        if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
     };
-    BaseChartComponent.prototype.ngOnDestroy = function() {
-      if (this.chart) {
-        this.chart.destroy();
-        this.chart = void 0;
-      }
-    };
-    BaseChartComponent.prototype.getChartBuilder = function(ctx) {
-      var _this = this;
-      var datasets = void 0;
-      if (!this.datasets || !this.datasets.length && (this.data && this.data.length)) {
-        if (Array.isArray(this.data[0])) {
-          datasets = this.data.map(function(data, index) {
-            return {
-              data: data,
-              label: _this.labels[index] || "Label " + index
-            };
-          });
-        } else {
-          datasets = [{
-            data: this.data,
-            label: "Label 0"
-          }];
+    var core_1 = $__require("@angular/core");
+    var BaseChartComponent = function () {
+        function BaseChartComponent(element) {
+            this.labels = [];
+            this.options = { responsive: true };
+            this.chartClick = new core_1.EventEmitter();
+            this.chartHover = new core_1.EventEmitter();
+            this.initFlag = false;
+            this.element = element;
         }
-      }
-      if (this.datasets && this.datasets.length || (datasets && datasets.length)) {
-        datasets = (this.datasets || datasets).map(function(elm, index) {
-          var newElm = Object.assign({}, elm);
-          if (_this.colors && _this.colors.length) {
-            Object.assign(newElm, _this.colors[index]);
-          } else {
-            Object.assign(newElm, getColors(_this.chartType, index, newElm.data.length));
-          }
-          return newElm;
-        });
-      }
-      if (!datasets) {
-        throw new Error("ng-charts configuration error, \n      data or datasets field are required to render char " + this.chartType);
-      }
-      var options = Object.assign({}, this.options);
-      options.hover = options.hover || {};
-      if (!options.hover.onHover) {
-        options.hover.onHover = function(active) {
-          if (active && !active.length) {
-            return;
-          }
-          _this.chartHover.emit({active: active});
+        BaseChartComponent.prototype.ngOnInit = function () {
+            this.ctx = this.element.nativeElement.children[0].getContext('2d');
+            this.cvs = this.element.nativeElement.children[0];
+            this.parent = this.element.nativeElement;
+            this.initFlag = true;
+            if (this.data || this.datasets) {
+                this.refresh();
+            }
         };
-      }
-      if (!options.onClick) {
-        options.onClick = function(event, active) {
-          _this.chartClick.emit({
-            event: event,
-            active: active
-          });
+        BaseChartComponent.prototype.ngOnChanges = function () {
+            if (this.initFlag) {
+                this.refresh();
+            }
         };
-      }
-      var opts = {
-        type: this.chartType,
-        data: {
-          labels: this.labels,
-          datasets: datasets
-        },
-        options: options
-      };
-      if (typeof Chart === 'undefined') {
-        throw new Error('ng2-charts configuration issue: Embedding Chart.js lib is mandatory');
-      }
-      return new Chart(ctx, opts);
-    };
-    BaseChartComponent.prototype.refresh = function() {
-      var _this = this;
-      if (this.options && this.options.responsive && this.parent.clientHeight === 0) {
-        return setTimeout(function() {
-          return _this.refresh();
-        }, 50);
-      }
-      this.ngOnDestroy();
-      this.chart = this.getChartBuilder(this.ctx);
-    };
-    BaseChartComponent.defaultColors = [[255, 99, 132], [54, 162, 235], [255, 206, 86], [231, 233, 237], [75, 192, 192], [151, 187, 205], [220, 220, 220], [247, 70, 74], [70, 191, 189], [253, 180, 92], [148, 159, 177], [77, 83, 96]];
-    __decorate([core_1.Input(), __metadata('design:type', Object)], BaseChartComponent.prototype, "data", void 0);
-    __decorate([core_1.Input(), __metadata('design:type', Array)], BaseChartComponent.prototype, "datasets", void 0);
-    __decorate([core_1.Input(), __metadata('design:type', Array)], BaseChartComponent.prototype, "labels", void 0);
-    __decorate([core_1.Input(), __metadata('design:type', Object)], BaseChartComponent.prototype, "options", void 0);
-    __decorate([core_1.Input(), __metadata('design:type', String)], BaseChartComponent.prototype, "chartType", void 0);
-    __decorate([core_1.Input(), __metadata('design:type', Array)], BaseChartComponent.prototype, "colors", void 0);
-    __decorate([core_1.Input(), __metadata('design:type', Boolean)], BaseChartComponent.prototype, "legend", void 0);
-    __decorate([core_1.Output(), __metadata('design:type', core_1.EventEmitter)], BaseChartComponent.prototype, "chartClick", void 0);
-    __decorate([core_1.Output(), __metadata('design:type', core_1.EventEmitter)], BaseChartComponent.prototype, "chartHover", void 0);
-    BaseChartComponent = __decorate([core_1.Component({
-      selector: 'base-chart',
-      template: "<canvas style=\"width: 100%; height: 100%;\"></canvas>",
-      directives: [common_1.CORE_DIRECTIVES, common_1.FORM_DIRECTIVES, common_1.NgClass]
-    }), __metadata('design:paramtypes', [core_1.ElementRef])], BaseChartComponent);
-    return BaseChartComponent;
-  }());
-  exports.BaseChartComponent = BaseChartComponent;
-  function rgba(colour, alpha) {
-    return 'rgba(' + colour.concat(alpha).join(',') + ')';
-  }
-  function getRandomInt(min, max) {
-    return Math.floor(Math.random() * (max - min + 1)) + min;
-  }
-  function formatLineColor(colors) {
-    return {
-      backgroundColor: rgba(colors, 0.4),
-      borderColor: rgba(colors, 1),
-      pointBackgroundColor: rgba(colors, 1),
-      pointBorderColor: '#fff',
-      pointHoverBackgroundColor: '#fff',
-      pointHoverBorderColor: rgba(colors, 0.8)
-    };
-  }
-  function formatBarColor(colors) {
-    return {
-      backgroundColor: rgba(colors, 0.6),
-      borderColor: rgba(colors, 1),
-      hoverBackgroundColor: rgba(colors, 0.8),
-      hoverBorderColor: rgba(colors, 1)
-    };
-  }
-  function formatPieColors(colors) {
-    return {
-      backgroundColor: colors.map(function(color) {
-        return rgba(color, 0.6);
-      }),
-      borderColor: colors.map(function() {
-        return '#fff';
-      }),
-      pointBackgroundColor: colors.map(function(color) {
-        return rgba(color, 1);
-      }),
-      pointBorderColor: colors.map(function() {
-        return '#fff';
-      }),
-      pointHoverBackgroundColor: colors.map(function(color) {
-        return rgba(color, 1);
-      }),
-      pointHoverBorderColor: colors.map(function(color) {
-        return rgba(color, 1);
-      })
-    };
-  }
-  function formatPolarAreaColors(colors) {
-    return {
-      backgroundColor: colors.map(function(color) {
-        return rgba(color, 0.6);
-      }),
-      borderColor: colors.map(function(color) {
-        return rgba(color, 1);
-      }),
-      hoverBackgroundColor: colors.map(function(color) {
-        return rgba(color, 0.8);
-      }),
-      hoverBorderColor: colors.map(function(color) {
-        return rgba(color, 1);
-      })
-    };
-  }
-  function getRandomColor() {
-    return [getRandomInt(0, 255), getRandomInt(0, 255), getRandomInt(0, 255)];
-  }
-  function generateColor(index) {
-    return BaseChartComponent.defaultColors[index] || getRandomColor();
-  }
-  function generateColors(count) {
-    var colorsArr = new Array(count);
-    for (var i = 0; i < count; i++) {
-      colorsArr[i] = BaseChartComponent.defaultColors[i] || getRandomColor();
+        BaseChartComponent.prototype.ngOnDestroy = function () {
+            if (this.chart) {
+                this.chart.destroy();
+                this.chart = void 0;
+            }
+        };
+        BaseChartComponent.prototype.getChartBuilder = function (ctx /*, data:Array<any>, options:any*/) {
+            var _this = this;
+            var datasets = void 0;
+            // in case if datasets is not provided, but data is present
+            if (!this.datasets || !this.datasets.length && this.data && this.data.length) {
+                if (Array.isArray(this.data[0])) {
+                    datasets = this.data.map(function (data, index) {
+                        return { data: data, label: _this.labels[index] || "Label " + index };
+                    });
+                } else {
+                    datasets = [{ data: this.data, label: "Label 0" }];
+                }
+            }
+            if (this.datasets && this.datasets.length || datasets && datasets.length) {
+                datasets = (this.datasets || datasets).map(function (elm, index) {
+                    var newElm = Object.assign({}, elm);
+                    if (_this.colors && _this.colors.length) {
+                        Object.assign(newElm, _this.colors[index]);
+                    } else {
+                        Object.assign(newElm, getColors(_this.chartType, index, newElm.data.length));
+                    }
+                    return newElm;
+                });
+            }
+            if (!datasets) {
+                throw new Error("ng-charts configuration error, \n      data or datasets field are required to render char " + this.chartType);
+            }
+            var options = Object.assign({}, this.options);
+            if (this.legend === false) {
+                options.legend = { display: false };
+            }
+            // hock for onHover and onClick events
+            options.hover = options.hover || {};
+            if (!options.hover.onHover) {
+                options.hover.onHover = function (active) {
+                    if (active && !active.length) {
+                        return;
+                    }
+                    _this.chartHover.emit({ active: active });
+                };
+            }
+            if (!options.onClick) {
+                options.onClick = function (event, active) {
+                    _this.chartClick.emit({ event: event, active: active });
+                };
+            }
+            var opts = {
+                type: this.chartType,
+                data: {
+                    labels: this.labels,
+                    datasets: datasets
+                },
+                options: options
+            };
+            if (typeof Chart === 'undefined') {
+                throw new Error('ng2-charts configuration issue: Embedding Chart.js lib is mandatory');
+            }
+            return new Chart(ctx, opts);
+        };
+        BaseChartComponent.prototype.refresh = function () {
+            var _this = this;
+            if (this.options && this.options.responsive && this.parent.clientHeight === 0) {
+                return setTimeout(function () {
+                    return _this.refresh();
+                }, 50);
+            }
+            // todo: remove this line, it is producing flickering
+            this.ngOnDestroy();
+            this.chart = this.getChartBuilder(this.ctx /*, data, this.options*/);
+        };
+        BaseChartComponent.defaultColors = [[255, 99, 132], [54, 162, 235], [255, 206, 86], [231, 233, 237], [75, 192, 192], [151, 187, 205], [220, 220, 220], [247, 70, 74], [70, 191, 189], [253, 180, 92], [148, 159, 177], [77, 83, 96]];
+        __decorate([core_1.Input(), __metadata('design:type', Object)], BaseChartComponent.prototype, "data", void 0);
+        __decorate([core_1.Input(), __metadata('design:type', Array)], BaseChartComponent.prototype, "datasets", void 0);
+        __decorate([core_1.Input(), __metadata('design:type', Array)], BaseChartComponent.prototype, "labels", void 0);
+        __decorate([core_1.Input(), __metadata('design:type', Object)], BaseChartComponent.prototype, "options", void 0);
+        __decorate([core_1.Input(), __metadata('design:type', String)], BaseChartComponent.prototype, "chartType", void 0);
+        __decorate([core_1.Input(), __metadata('design:type', Array)], BaseChartComponent.prototype, "colors", void 0);
+        __decorate([core_1.Input(), __metadata('design:type', Boolean)], BaseChartComponent.prototype, "legend", void 0);
+        __decorate([core_1.Output(), __metadata('design:type', core_1.EventEmitter)], BaseChartComponent.prototype, "chartClick", void 0);
+        __decorate([core_1.Output(), __metadata('design:type', core_1.EventEmitter)], BaseChartComponent.prototype, "chartHover", void 0);
+        BaseChartComponent = __decorate([core_1.Component({
+            selector: 'base-chart',
+            template: "<canvas style=\"width: 100%; height: 100%;\"></canvas>",
+            styles: [":host { display: block; }"]
+        }), __metadata('design:paramtypes', [core_1.ElementRef])], BaseChartComponent);
+        return BaseChartComponent;
+    }();
+    exports.BaseChartComponent = BaseChartComponent;
+    function rgba(colour, alpha) {
+        return 'rgba(' + colour.concat(alpha).join(',') + ')';
     }
-    return colorsArr;
-  }
-  function getColors(chartType, index, count) {
-    if (chartType === 'pie' || chartType === 'doughnut') {
-      return formatPieColors(generateColors(count));
+    function getRandomInt(min, max) {
+        return Math.floor(Math.random() * (max - min + 1)) + min;
     }
-    if (chartType === 'polarArea') {
-      return formatPolarAreaColors(generateColors(count));
+    function formatLineColor(colors) {
+        return {
+            backgroundColor: rgba(colors, 0.4),
+            borderColor: rgba(colors, 1),
+            pointBackgroundColor: rgba(colors, 1),
+            pointBorderColor: '#fff',
+            pointHoverBackgroundColor: '#fff',
+            pointHoverBorderColor: rgba(colors, 0.8)
+        };
     }
-    if (chartType === 'line' || chartType === 'radar') {
-      return formatLineColor(generateColor(index));
+    function formatBarColor(colors) {
+        return {
+            backgroundColor: rgba(colors, 0.6),
+            borderColor: rgba(colors, 1),
+            hoverBackgroundColor: rgba(colors, 0.8),
+            hoverBorderColor: rgba(colors, 1)
+        };
     }
-    if (chartType === 'bar') {
-      return formatBarColor(generateColor(index));
+    function formatPieColors(colors) {
+        return {
+            backgroundColor: colors.map(function (color) {
+                return rgba(color, 0.6);
+            }),
+            borderColor: colors.map(function () {
+                return '#fff';
+            }),
+            pointBackgroundColor: colors.map(function (color) {
+                return rgba(color, 1);
+            }),
+            pointBorderColor: colors.map(function () {
+                return '#fff';
+            }),
+            pointHoverBackgroundColor: colors.map(function (color) {
+                return rgba(color, 1);
+            }),
+            pointHoverBorderColor: colors.map(function (color) {
+                return rgba(color, 1);
+            })
+        };
     }
-    return generateColor(index);
-  }
-  exports.CHART_DIRECTIVES = [BaseChartComponent];
-  return module.exports;
+    function formatPolarAreaColors(colors) {
+        return {
+            backgroundColor: colors.map(function (color) {
+                return rgba(color, 0.6);
+            }),
+            borderColor: colors.map(function (color) {
+                return rgba(color, 1);
+            }),
+            hoverBackgroundColor: colors.map(function (color) {
+                return rgba(color, 0.8);
+            }),
+            hoverBorderColor: colors.map(function (color) {
+                return rgba(color, 1);
+            })
+        };
+    }
+    function getRandomColor() {
+        return [getRandomInt(0, 255), getRandomInt(0, 255), getRandomInt(0, 255)];
+    }
+    /**
+     * Generate colors for line|bar charts
+     * @param index
+     * @returns {number[]|Color}
+     */
+    function generateColor(index) {
+        return BaseChartComponent.defaultColors[index] || getRandomColor();
+    }
+    /**
+     * Generate colors for pie|doughnut charts
+     * @param count
+     * @returns {Colors}
+     */
+    function generateColors(count) {
+        var colorsArr = new Array(count);
+        for (var i = 0; i < count; i++) {
+            colorsArr[i] = BaseChartComponent.defaultColors[i] || getRandomColor();
+        }
+        return colorsArr;
+    }
+    /**
+     * Generate colors by chart type
+     * @param chartType
+     * @param index
+     * @param count
+     * @returns {Color}
+     */
+    function getColors(chartType, index, count) {
+        if (chartType === 'pie' || chartType === 'doughnut') {
+            return formatPieColors(generateColors(count));
+        }
+        if (chartType === 'polarArea') {
+            return formatPolarAreaColors(generateColors(count));
+        }
+        if (chartType === 'line' || chartType === 'radar') {
+            return formatLineColor(generateColor(index));
+        }
+        if (chartType === 'bar' || chartType === 'horizontalBar') {
+            return formatBarColor(generateColor(index));
+        }
+        return generateColor(index);
+    }
+    var ChartsModule = function () {
+        function ChartsModule() {}
+        ChartsModule = __decorate([core_1.NgModule({
+            declarations: [BaseChartComponent],
+            exports: [BaseChartComponent],
+            imports: []
+        }), __metadata('design:paramtypes', [])], ChartsModule);
+        return ChartsModule;
+    }();
+    exports.ChartsModule = ChartsModule;
+    return module.exports;
 });
+System.registerDynamic("ng2-charts/ng2-charts", ["./components/charts/charts"], true, function ($__require, exports, module) {
+    "use strict";
 
-System.registerDynamic("ng2-charts/ng2-charts", ["./components/charts/charts"], true, function($__require, exports, module) {
-  "use strict";
-  ;
-  var define,
-      global = this,
-      GLOBAL = this;
-  function __export(m) {
-    for (var p in m)
-      if (!exports.hasOwnProperty(p))
-        exports[p] = m[p];
-  }
-  var charts_1 = $__require('./components/charts/charts');
-  __export($__require('./components/charts/charts'));
-  Object.defineProperty(exports, "__esModule", {value: true});
-  exports.default = {directives: [charts_1.CHART_DIRECTIVES]};
-  return module.exports;
+    var define,
+        global = this || self,
+        GLOBAL = global;
+    function __export(m) {
+        for (var p in m) if (!exports.hasOwnProperty(p)) exports[p] = m[p];
+    }
+    __export($__require("./components/charts/charts"));
+    return module.exports;
 });
-
 //# sourceMappingURL=ng2-charts.js.map

bundles/ng2-charts.min.js

@@ -1,2 +0,2 @@
-System.registerDynamic("ng2-charts/components/charts/charts",["@angular/core","@angular/common"],!0,function($__require,exports,module){"use strict";function rgba(colour,alpha){return"rgba("+colour.concat(alpha).join(",")+")"}function getRandomInt(min,max){return Math.floor(Math.random()*(max-min+1))+min}function formatLineColor(colors){return{backgroundColor:rgba(colors,.4),borderColor:rgba(colors,1),pointBackgroundColor:rgba(colors,1),pointBorderColor:"#fff",pointHoverBackgroundColor:"#fff",pointHoverBorderColor:rgba(colors,.8)}}function formatBarColor(colors){return{backgroundColor:rgba(colors,.6),borderColor:rgba(colors,1),hoverBackgroundColor:rgba(colors,.8),hoverBorderColor:rgba(colors,1)}}function formatPieColors(colors){return{backgroundColor:colors.map(function(color){return rgba(color,.6)}),borderColor:colors.map(function(){return"#fff"}),pointBackgroundColor:colors.map(function(color){return rgba(color,1)}),pointBorderColor:colors.map(function(){return"#fff"}),pointHoverBackgroundColor:colors.map(function(color){return rgba(color,1)}),pointHoverBorderColor:colors.map(function(color){return rgba(color,1)})}}function formatPolarAreaColors(colors){return{backgroundColor:colors.map(function(color){return rgba(color,.6)}),borderColor:colors.map(function(color){return rgba(color,1)}),hoverBackgroundColor:colors.map(function(color){return rgba(color,.8)}),hoverBorderColor:colors.map(function(color){return rgba(color,1)})}}function getRandomColor(){return[getRandomInt(0,255),getRandomInt(0,255),getRandomInt(0,255)]}function generateColor(index){return BaseChartComponent.defaultColors[index]||getRandomColor()}function generateColors(count){for(var colorsArr=new Array(count),i=0;count>i;i++)colorsArr[i]=BaseChartComponent.defaultColors[i]||getRandomColor();return colorsArr}function getColors(chartType,index,count){return"pie"===chartType||"doughnut"===chartType?formatPieColors(generateColors(count)):"polarArea"===chartType?formatPolarAreaColors(generateColors(count)):"line"===chartType||"radar"===chartType?formatLineColor(generateColor(index)):"bar"===chartType?formatBarColor(generateColor(index)):generateColor(index)}var __decorate=this&&this.__decorate||function(decorators,target,key,desc){var d,c=arguments.length,r=3>c?target:null===desc?desc=Object.getOwnPropertyDescriptor(target,key):desc;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)r=Reflect.decorate(decorators,target,key,desc);else for(var i=decorators.length-1;i>=0;i--)(d=decorators[i])&&(r=(3>c?d(r):c>3?d(target,key,r):d(target,key))||r);return c>3&&r&&Object.defineProperty(target,key,r),r},__metadata=this&&this.__metadata||function(k,v){return"object"==typeof Reflect&&"function"==typeof Reflect.metadata?Reflect.metadata(k,v):void 0},core_1=$__require("@angular/core"),common_1=$__require("@angular/common"),BaseChartComponent=function(){function BaseChartComponent(element){this.labels=[],this.options={responsive:!0},this.chartClick=new core_1.EventEmitter,this.chartHover=new core_1.EventEmitter,this.initFlag=!1,this.element=element}return BaseChartComponent.prototype.ngOnInit=function(){this.ctx=this.element.nativeElement.children[0].getContext("2d"),this.cvs=this.element.nativeElement.children[0],this.parent=this.element.nativeElement,this.initFlag=!0,(this.data||this.datasets)&&this.refresh()},BaseChartComponent.prototype.ngOnChanges=function(){this.initFlag&&this.refresh()},BaseChartComponent.prototype.ngOnDestroy=function(){this.chart&&(this.chart.destroy(),this.chart=void 0)},BaseChartComponent.prototype.getChartBuilder=function(ctx){var _this=this,datasets=void 0;if((!this.datasets||!this.datasets.length&&this.data&&this.data.length)&&(datasets=Array.isArray(this.data[0])?this.data.map(function(data,index){return{data:data,label:_this.labels[index]||"Label "+index}}):[{data:this.data,label:"Label 0"}]),(this.datasets&&this.datasets.length||datasets&&datasets.length)&&(datasets=(this.datasets||datasets).map(function(elm,index){var newElm=Object.assign({},elm);return _this.colors&&_this.colors.length?Object.assign(newElm,_this.colors[index]):Object.assign(newElm,getColors(_this.chartType,index,newElm.data.length)),newElm})),!datasets)throw new Error("ng-charts configuration error, \n      data or datasets field are required to render char "+this.chartType);var options=Object.assign({},this.options);options.hover=options.hover||{},options.hover.onHover||(options.hover.onHover=function(active){active&&!active.length||_this.chartHover.emit({active:active})}),options.onClick||(options.onClick=function(event,active){_this.chartClick.emit({event:event,active:active})});var opts={type:this.chartType,data:{labels:this.labels,datasets:datasets},options:options};if("undefined"==typeof Chart)throw new Error("ng2-charts configuration issue: Embedding Chart.js lib is mandatory");return new Chart(ctx,opts)},BaseChartComponent.prototype.refresh=function(){var _this=this;return this.options&&this.options.responsive&&0===this.parent.clientHeight?setTimeout(function(){return _this.refresh()},50):(this.ngOnDestroy(),void(this.chart=this.getChartBuilder(this.ctx)))},BaseChartComponent.defaultColors=[[255,99,132],[54,162,235],[255,206,86],[231,233,237],[75,192,192],[151,187,205],[220,220,220],[247,70,74],[70,191,189],[253,180,92],[148,159,177],[77,83,96]],__decorate([core_1.Input(),__metadata("design:type",Object)],BaseChartComponent.prototype,"data",void 0),__decorate([core_1.Input(),__metadata("design:type",Array)],BaseChartComponent.prototype,"datasets",void 0),__decorate([core_1.Input(),__metadata("design:type",Array)],BaseChartComponent.prototype,"labels",void 0),__decorate([core_1.Input(),__metadata("design:type",Object)],BaseChartComponent.prototype,"options",void 0),__decorate([core_1.Input(),__metadata("design:type",String)],BaseChartComponent.prototype,"chartType",void 0),__decorate([core_1.Input(),__metadata("design:type",Array)],BaseChartComponent.prototype,"colors",void 0),__decorate([core_1.Input(),__metadata("design:type",Boolean)],BaseChartComponent.prototype,"legend",void 0),__decorate([core_1.Output(),__metadata("design:type",core_1.EventEmitter)],BaseChartComponent.prototype,"chartClick",void 0),__decorate([core_1.Output(),__metadata("design:type",core_1.EventEmitter)],BaseChartComponent.prototype,"chartHover",void 0),BaseChartComponent=__decorate([core_1.Component({selector:"base-chart",template:'<canvas style="width: 100%; height: 100%;"></canvas>',directives:[common_1.CORE_DIRECTIVES,common_1.FORM_DIRECTIVES,common_1.NgClass]}),__metadata("design:paramtypes",[core_1.ElementRef])],BaseChartComponent)}();return exports.BaseChartComponent=BaseChartComponent,exports.CHART_DIRECTIVES=[BaseChartComponent],module.exports}),System.registerDynamic("ng2-charts/ng2-charts",["./components/charts/charts"],!0,function($__require,exports,module){"use strict";function __export(m){for(var p in m)exports.hasOwnProperty(p)||(exports[p]=m[p])}var charts_1=$__require("./components/charts/charts");return __export($__require("./components/charts/charts")),Object.defineProperty(exports,"__esModule",{value:!0}),exports["default"]={directives:[charts_1.CHART_DIRECTIVES]},module.exports});
+System.registerDynamic("ng2-charts/components/charts/charts",["@angular/core"],!0,function($__require,exports,module){"use strict";function rgba(colour,alpha){return"rgba("+colour.concat(alpha).join(",")+")"}function getRandomInt(min,max){return Math.floor(Math.random()*(max-min+1))+min}function formatLineColor(colors){return{backgroundColor:rgba(colors,.4),borderColor:rgba(colors,1),pointBackgroundColor:rgba(colors,1),pointBorderColor:"#fff",pointHoverBackgroundColor:"#fff",pointHoverBorderColor:rgba(colors,.8)}}function formatBarColor(colors){return{backgroundColor:rgba(colors,.6),borderColor:rgba(colors,1),hoverBackgroundColor:rgba(colors,.8),hoverBorderColor:rgba(colors,1)}}function formatPieColors(colors){return{backgroundColor:colors.map(function(color){return rgba(color,.6)}),borderColor:colors.map(function(){return"#fff"}),pointBackgroundColor:colors.map(function(color){return rgba(color,1)}),pointBorderColor:colors.map(function(){return"#fff"}),pointHoverBackgroundColor:colors.map(function(color){return rgba(color,1)}),pointHoverBorderColor:colors.map(function(color){return rgba(color,1)})}}function formatPolarAreaColors(colors){return{backgroundColor:colors.map(function(color){return rgba(color,.6)}),borderColor:colors.map(function(color){return rgba(color,1)}),hoverBackgroundColor:colors.map(function(color){return rgba(color,.8)}),hoverBorderColor:colors.map(function(color){return rgba(color,1)})}}function getRandomColor(){return[getRandomInt(0,255),getRandomInt(0,255),getRandomInt(0,255)]}function generateColor(index){return BaseChartComponent.defaultColors[index]||getRandomColor()}function generateColors(count){for(var colorsArr=new Array(count),i=0;i<count;i++)colorsArr[i]=BaseChartComponent.defaultColors[i]||getRandomColor();return colorsArr}function getColors(chartType,index,count){return"pie"===chartType||"doughnut"===chartType?formatPieColors(generateColors(count)):"polarArea"===chartType?formatPolarAreaColors(generateColors(count)):"line"===chartType||"radar"===chartType?formatLineColor(generateColor(index)):"bar"===chartType||"horizontalBar"===chartType?formatBarColor(generateColor(index)):generateColor(index)}var __decorate=(this||self,this&&this.__decorate||function(decorators,target,key,desc){var d,c=arguments.length,r=c<3?target:null===desc?desc=Object.getOwnPropertyDescriptor(target,key):desc;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)r=Reflect.decorate(decorators,target,key,desc);else for(var i=decorators.length-1;i>=0;i--)(d=decorators[i])&&(r=(c<3?d(r):c>3?d(target,key,r):d(target,key))||r);return c>3&&r&&Object.defineProperty(target,key,r),r}),__metadata=this&&this.__metadata||function(k,v){if("object"==typeof Reflect&&"function"==typeof Reflect.metadata)return Reflect.metadata(k,v)},core_1=$__require("@angular/core"),BaseChartComponent=function(){function BaseChartComponent(element){this.labels=[],this.options={responsive:!0},this.chartClick=new core_1.EventEmitter,this.chartHover=new core_1.EventEmitter,this.initFlag=!1,this.element=element}return BaseChartComponent.prototype.ngOnInit=function(){this.ctx=this.element.nativeElement.children[0].getContext("2d"),this.cvs=this.element.nativeElement.children[0],this.parent=this.element.nativeElement,this.initFlag=!0,(this.data||this.datasets)&&this.refresh()},BaseChartComponent.prototype.ngOnChanges=function(){this.initFlag&&this.refresh()},BaseChartComponent.prototype.ngOnDestroy=function(){this.chart&&(this.chart.destroy(),this.chart=void 0)},BaseChartComponent.prototype.getChartBuilder=function(ctx){var _this=this,datasets=void 0;if((!this.datasets||!this.datasets.length&&this.data&&this.data.length)&&(datasets=Array.isArray(this.data[0])?this.data.map(function(data,index){return{data:data,label:_this.labels[index]||"Label "+index}}):[{data:this.data,label:"Label 0"}]),(this.datasets&&this.datasets.length||datasets&&datasets.length)&&(datasets=(this.datasets||datasets).map(function(elm,index){var newElm=Object.assign({},elm);return _this.colors&&_this.colors.length?Object.assign(newElm,_this.colors[index]):Object.assign(newElm,getColors(_this.chartType,index,newElm.data.length)),newElm})),!datasets)throw new Error("ng-charts configuration error, \n      data or datasets field are required to render char "+this.chartType);var options=Object.assign({},this.options);this.legend===!1&&(options.legend={display:!1}),options.hover=options.hover||{},options.hover.onHover||(options.hover.onHover=function(active){active&&!active.length||_this.chartHover.emit({active:active})}),options.onClick||(options.onClick=function(event,active){_this.chartClick.emit({event:event,active:active})});var opts={type:this.chartType,data:{labels:this.labels,datasets:datasets},options:options};if("undefined"==typeof Chart)throw new Error("ng2-charts configuration issue: Embedding Chart.js lib is mandatory");return new Chart(ctx,opts)},BaseChartComponent.prototype.refresh=function(){var _this=this;return this.options&&this.options.responsive&&0===this.parent.clientHeight?setTimeout(function(){return _this.refresh()},50):(this.ngOnDestroy(),void(this.chart=this.getChartBuilder(this.ctx)))},BaseChartComponent.defaultColors=[[255,99,132],[54,162,235],[255,206,86],[231,233,237],[75,192,192],[151,187,205],[220,220,220],[247,70,74],[70,191,189],[253,180,92],[148,159,177],[77,83,96]],__decorate([core_1.Input(),__metadata("design:type",Object)],BaseChartComponent.prototype,"data",void 0),__decorate([core_1.Input(),__metadata("design:type",Array)],BaseChartComponent.prototype,"datasets",void 0),__decorate([core_1.Input(),__metadata("design:type",Array)],BaseChartComponent.prototype,"labels",void 0),__decorate([core_1.Input(),__metadata("design:type",Object)],BaseChartComponent.prototype,"options",void 0),__decorate([core_1.Input(),__metadata("design:type",String)],BaseChartComponent.prototype,"chartType",void 0),__decorate([core_1.Input(),__metadata("design:type",Array)],BaseChartComponent.prototype,"colors",void 0),__decorate([core_1.Input(),__metadata("design:type",Boolean)],BaseChartComponent.prototype,"legend",void 0),__decorate([core_1.Output(),__metadata("design:type",core_1.EventEmitter)],BaseChartComponent.prototype,"chartClick",void 0),__decorate([core_1.Output(),__metadata("design:type",core_1.EventEmitter)],BaseChartComponent.prototype,"chartHover",void 0),BaseChartComponent=__decorate([core_1.Component({selector:"base-chart",template:'<canvas style="width: 100%; height: 100%;"></canvas>',styles:[":host { display: block; }"]}),__metadata("design:paramtypes",[core_1.ElementRef])],BaseChartComponent)}();exports.BaseChartComponent=BaseChartComponent;var ChartsModule=function(){function ChartsModule(){}return ChartsModule=__decorate([core_1.NgModule({declarations:[BaseChartComponent],exports:[BaseChartComponent],imports:[]}),__metadata("design:paramtypes",[])],ChartsModule)}();return exports.ChartsModule=ChartsModule,module.exports}),System.registerDynamic("ng2-charts/ng2-charts",["./components/charts/charts"],!0,function($__require,exports,module){"use strict";function __export(m){for(var p in m)exports.hasOwnProperty(p)||(exports[p]=m[p])}this||self;return __export($__require("./components/charts/charts")),module.exports});
 //# sourceMappingURL=ng2-charts.min.js.map

CHANGELOG.md

@@ -0,1 +1,27 @@
+<a name="1.2.0"></a>
+# [1.2.0](https://github.com/valor-software/ng2-charts/compare/v1.1.2...v1.2.0) (2016-09-09)
+
+
+
+<a name="1.1.2"></a>
+## [1.1.2](https://github.com/valor-software/ng2-charts/compare/v1.1.1...v1.1.2) (2016-09-09)
+
+
+### Bug Fixes
+
+* **options:** to have colors on horizontalBar graphs ([#394](https://github.com/valor-software/ng2-charts/issues/394)) ([ab06ad2](https://github.com/valor-software/ng2-charts/commit/ab06ad2))
+
+
+
+<a name="1.1.1"></a>
+## [1.1.1](https://github.com/valor-software/ng2-charts/compare/v1.1.0...v1.1.1) (2016-09-08)
+
+
+### Features
+
+* **docs:** add issue template with a starting plunkr ([#335](https://github.com/valor-software/ng2-charts/issues/335)) ([a69bca4](https://github.com/valor-software/ng2-charts/commit/a69bca4))
+* **options:** disable legend if not provided ([#318](https://github.com/valor-software/ng2-charts/issues/318)) ([516fb6e](https://github.com/valor-software/ng2-charts/commit/516fb6e))
+
+
+
 <a name="1.1.0"></a>
@@ -12,3 +38,2 @@ # [1.1.0](https://github.com/valor-software/ng2-charts/compare/v1.0.3...v1.1.0) (2016-05-17)
 
-* package: S:
 - series property removed
@@ -15,0 +40,0 @@ - datasets property added (please prefer it over data property)

components/charts/charts.d.ts

@@ -52,2 +52,3 @@ import { OnDestroy, OnInit, OnChanges, EventEmitter, ElementRef } from '@angular/core';
 }
-export declare const CHART_DIRECTIVES: Array<any>;
+export declare class ChartsModule {
+}

components/charts/charts.js

@@ -12,3 +12,2 @@ "use strict";
 var core_1 = require('@angular/core');
-var common_1 = require('@angular/common');
 var BaseChartComponent = (function () {
@@ -75,2 +74,5 @@ function BaseChartComponent(element) {
         var options = Object.assign({}, this.options);
+        if (this.legend === false) {
+            options.legend = { display: false };
+        }
         // hock for onHover and onClick events
@@ -167,3 +169,3 @@ options.hover = options.hover || {};
             template: "<canvas style=\"width: 100%; height: 100%;\"></canvas>",
-            directives: [common_1.CORE_DIRECTIVES, common_1.FORM_DIRECTIVES, common_1.NgClass]
+            styles: [":host { display: block; }"]
         }), 
@@ -257,3 +259,3 @@ __metadata('design:paramtypes', [core_1.ElementRef])
     }
-    if (chartType === 'bar') {
+    if (chartType === 'bar' || chartType === 'horizontalBar') {
         return formatBarColor(generateColor(index));
@@ -263,2 +265,19 @@ }
 }
-exports.CHART_DIRECTIVES = [BaseChartComponent];
+var ChartsModule = (function () {
+    function ChartsModule() {
+    }
+    ChartsModule = __decorate([
+        core_1.NgModule({
+            declarations: [
+                BaseChartComponent
+            ],
+            exports: [
+                BaseChartComponent
+            ],
+            imports: []
+        }), 
+        __metadata('design:paramtypes', [])
+    ], ChartsModule);
+    return ChartsModule;
+}());
+exports.ChartsModule = ChartsModule;

components/charts/readme.md

@@ -18,3 +18,3 @@ ### Usage
 - `options` (`?any`) - chart options (as from [Chart.js documentation](http://www.chartjs.org/docs/))
-- `colours` (`?Array<any>`) - data colours, will use default and|or random colours if not specified (see below)
+- `colors` (`?Array<any>`) - data colors, will use default and|or random colors if not specified (see below)
 - `legend`: (`?boolean=false`) - if true show legend below the chart, otherwise not be shown
@@ -28,4 +28,4 @@
 
-### Colours
+### Colors
 
-There are a set several default colours. Colours can be replaced using the `colours` attribute. If there is more data than colours, colours are generated randomly.
+There are a set several default colors. Colors can be replaced using the `colors` attribute. If there is more data than colors, colors are generated randomly.

ng2-charts.d.ts

 export * from './components/charts/charts';
-declare var _default: {
-    directives: any[][];
-};
-export default _default;

ng2-charts.js

@@ -5,9 +5,2 @@ "use strict";
 }
-var charts_1 = require('./components/charts/charts');
 __export(require('./components/charts/charts'));
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = {
-    directives: [
-        charts_1.CHART_DIRECTIVES
-    ]
-};

package.json

 {
   "name": "ng2-charts",
-  "version": "1.1.0",
+  "version": "1.2.0",
   "description": "Reactive, responsive, beautiful charts for Angular2 based on Chart.js",
   "scripts": {
     "flow.install:typings": "./node_modules/.bin/typings install",
-    "flow.compile": "npm run flow.install:typings && npm run flow.compile:common && npm run flow.compile:system ",
-    "flow.compile:common": "./node_modules/.bin/tsc",
+    "flow.compile": "npm run flow.install:typings && npm run flow.compile:common && npm run flow.compile:system",
+    "flow.compile:common": "./node_modules/.bin/tsc -p tsconfig.publish.json",
     "flow.compile:system": "./.config/bundle-system.js",
-    "flow.copy:src": "./node_modules/.bin/cpy ng2-charts.ts \"components/**/*.ts\" ts --parents",
+    "flow.copy:src": "./node_modules/.bin/cpy ng2-charts.ts \"components/*.ts\" ts --parents",
     "flow.clean": "./node_modules/.bin/del bundles coverage demo-build typings \"components/**/*.+(js|d.ts|js.map)\" dist \"ng2-charts.+(js|d.ts|js.map)\"",
@@ -17,12 +17,13 @@ "flow.deploy:gh-pages": "npm run flow.build:prod && ./node_modules/.bin/gh-pages -d demo-build",
     "flow.changelog": "./node_modules/.bin/conventional-changelog -i CHANGELOG.md -s -p angular -v",
-    "flow.github-release": "conventional-github-releaser -p angular",
-    "flow.build:prod": "NODE_ENV=production ./node_modules/.bin/webpack --progress --color",
+    "flow.github-release": "./node_modules/.bin/conventional-github-releaser -p angular",
+    "flow.build:prod": "NODE_ENV=production ./node_modules/.bin/webpack --progress --color --display-error-details --display-cached",
     "flow.build:dev": "./node_modules/.bin/webpack --progress --color",
     "flow.serve:dev": "./node_modules/.bin/webpack-dev-server --hot --inline --colors --display-error-details --display-cached",
     "flow.serve:prod": "NODE_ENV=production ./node_modules/.bin/webpack-dev-server --hot --inline --colors --display-error-details --display-cached",
-    "prepublish": "npm run flow.clean && npm run flow.compile && npm run flow.copy:src",
+    "prepublish": "npm run flow.clean && npm run flow.compile",
     "postpublish": "npm run flow.deploy:gh-pages",
     "start": "npm run flow.serve:dev",
-    "test": "npm run flow.lint",
-    "karma-test": "NODE_ENV=test ./node_modules/.bin/karma start",
+    "pretest": "npm run flow.lint",
+    "test": "NODE_ENV=test ./node_modules/.bin/karma start",
+    "test:watch": "NODE_ENV=test ./node_modules/.bin/karma start --auto-watch --no-single-run",
     "preversion": "npm test",
@@ -50,27 +51,27 @@ "version": "npm run flow.changelog && git add -A",
   "peerDependencies": {
-    "@angular/core": "^2.0.0-rc.1",
-    "@angular/common": "^2.0.0-rc.1"
+    "@angular/core": "2.0.0-rc.6",
+    "@angular/compiler": "2.0.0-rc.6",
+    "@angular/common": "2.0.0-rc.6",
+    "@angular/forms": "2.0.0-rc.6"
   },
   "dependencies": {
-    "chart.js": "2.1.3"
+    "chart.js": "2.2.2"
   },
   "devDependencies": {
-    "@angular/common": "2.0.0-rc.1",
-    "@angular/compiler": "2.0.0-rc.1",
-    "@angular/core": "2.0.0-rc.1",
-    "@angular/platform-browser": "2.0.0-rc.1",
-    "@angular/platform-browser-dynamic": "2.0.0-rc.1",
-    "async": "2.0.0-rc.3",
-    "bootstrap": "3.3.6",
-    "clean-webpack-plugin": "0.1.9",
-    "compression-webpack-plugin": "0.3.1",
+    "@angular/common": "2.0.0-rc.6",
+    "@angular/compiler": "2.0.0-rc.6",
+    "@angular/core": "2.0.0-rc.6",
+    "@angular/forms": "2.0.0-rc.6",
+    "@angular/platform-browser": "2.0.0-rc.6",
+    "@angular/platform-browser-dynamic": "2.0.0-rc.6",
+    "async": "2.0.1",
+    "bootstrap": "3.3.7",
     "conventional-changelog-cli": "1.2.0",
-    "conventional-github-releaser": "1.1.2",
-    "copy-webpack-plugin": "3.0.0",
-    "cpy-cli": "1.0.0",
+    "conventional-github-releaser": "1.1.3",
+    "copy-webpack-plugin": "3.0.1",
+    "cpy-cli": "1.0.1",
     "del-cli": "0.2.0",
     "es6-promise": "3.2.1",
     "es6-shim": "0.35.1",
-    "eslint-config-valorsoft": "0.0.11",
-    "exports-loader": "0.6.3",
+    "eslint-config-valorsoft": "0.1.0",
     "gh-pages": "0.11.0",
@@ -80,27 +81,21 @@ "gitignore-to-glob": "0.2.1",
     "gulp-clean": "0.3.2",
-    "gulp-eslint": "2.0.0",
+    "gulp-eslint": "3.0.1",
     "gulp-size": "2.1.0",
-    "gulp-tsc": "1.1.5",
-    "gulp-tslint": "5.0.0",
-    "html-loader": "0.4.3",
-    "html-webpack-plugin": "2.17.0",
-    "markdown-loader": "0.1.7",
-    "marked": "0.3.5",
-    "ng2-bootstrap": "1.0.16",
+    "gulp-tsc": "1.2.3",
+    "gulp-tslint": "6.1.1",
+    "marked": "0.3.6",
+    "ng2-bootstrap": "1.1.1",
+    "ng2-webpack-config": "0.0.4",
     "pre-commit": "1.1.3",
-    "prismjs": "1.5.0",
+    "prismjs": "1.5.1",
     "prismjs-loader": "0.0.3",
-    "raw-loader": "0.5.1",
-    "reflect-metadata": "0.1.2",
+    "reflect-metadata": "0.1.8",
     "require-dir": "0.3.0",
-    "rxjs": "5.0.0-beta.6",
-    "systemjs-builder": "0.15.16",
+    "rxjs": "5.0.0-beta.10",
+    "systemjs-builder": "0.15.31",
     "transfer-webpack-plugin": "0.1.4",
-    "ts-loader": "0.8.2",
-    "tslint-config-valorsoft": "1.0.3",
+    "tslint-config-valorsoft": "1.1.1",
     "typescript": "1.8.10",
-    "typings": "0.8.1",
-    "webpack": "1.13.0",
-    "webpack-dev-server": "1.14.1",
-    "zone.js": "0.6.12"
+    "typings": "1.3.3",
+    "zone.js": "0.6.17"
   },
@@ -107,0 +102,0 @@ "contributors": [

README.md

@@ -14,2 +14,3 @@ # ng2-charts [![npm version](https://badge.fury.io/js/ng2-charts.svg)](http://badge.fury.io/js/ng2-charts)
 [http://valor-software.github.io/ng2-charts/](http://valor-software.github.io/ng2-charts/)
+[http://plnkr.co/edit/7fGsiuRjcF0M0Ffeoml2?p=preview](http://plnkr.co/edit/7fGsiuRjcF0M0Ffeoml2?p=preview)
 
@@ -34,3 +35,3 @@ - - -
   ```html
-  <script src="node_modules/chart.js/dist/Chart.bundle.min.js"></script>
+  <script src="node_modules/chart.js/src/chart.js"></script>
   ```
@@ -50,3 +51,8 @@ ### Usage & Demo
 ```typescript
-import {CHART_DIRECTIVES} from 'ng2-charts/ng2-charts';
+import { ChartsModule } from 'ng2-charts/ng2-charts';
+
+// In your App's module:
+imports: [
+   ChartsModule
+]
 ```
@@ -66,3 +72,3 @@
 - `options` (`?any`) - chart options (as from [Chart.js documentation](http://www.chartjs.org/docs/))
-- `colours` (`?Array<any>`) - data colours, will use default and|or random colours if not specified (see below)
+- `colors` (`?Array<any>`) - data colors, will use default and|or random colors if not specified (see below)
 - `legend`: (`?boolean=false`) - if true show legend below the chart, otherwise not be shown
@@ -76,8 +82,7 @@
 
-### Colours
+### Colors
 
-There are a set several default colours. Colours can be replaced using the `colours` attribute. If there is more data than colours, colours are generated randomly.
+There are a set several default colors. Colors can be replaced using the `colors` attribute. If there is more data than colors, colors are generated randomly.
 
 
-
 ## Troubleshooting
@@ -84,0 +89,0 @@

tsconfig.json

@@ -20,5 +20,6 @@ {
   "files": [
-    "./typings/browser.d.ts",
+    "./demo/custom-typings.d.ts",
+    "./typings/index.d.ts",
     "./ng2-charts.ts"
   ]
 }

tslint.json

 {
   "extends": "tslint-config-valorsoft",
-  "rulesDirectory": "./node_modules/codelyzer"
+  "rulesDirectory": "./node_modules/codelyzer",
+  "rules": {
+    "component-selector-name": [false, ""],
+    "only-arrow-functions": false
+  }
 }

typings.json

 {
   "dependencies": {
-    "moment": "registry:npm/moment#2.10.5+20160211003958",
-    "webpack": "registry:npm/webpack#1.12.9+20160219013405"
+    "webpack": "registry:npm/webpack#1.12.9+20160418172948"
   },
   "devDependencies": {},
-  "ambientDependencies": {
-    "es6-shim": "registry:dt/es6-shim#0.31.2+20160317120654",
-    "jasmine": "registry:dt/jasmine#2.2.0+20160317120654",
+  "globalDependencies": {
+    "es6-shim": "registry:dt/es6-shim#0.31.2+20160602141504",
+    "jasmine": "registry:dt/jasmine#2.2.0+20160621224255",
     "require": "registry:dt/require#2.1.20+20160316155526"
   }
 }

Fixed alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

65382

increased by14.44%

Dev dependency count

39

decreased by-17.02%

Number of package files

29

increased by16%

Lines of code

880

increased by16.56%

Number of lines in readme file

95

increased by5.56%

Number of medium supply chain risk alerts

0

decreased by-100%

Worsened metrics

Dependency count

5

increased by66.67%

Dependency changes

• + Added@angular/common@2.0.0-rc.6(transitive)

• + Added@angular/compiler@2.0.0-rc.6(transitive)

• + Added@angular/core@2.0.0-rc.6(transitive)

• + Added@angular/forms@2.0.0-rc.6(transitive)

• + Addedchart.js@2.2.2(transitive)

• + Addedchartjs-color@2.4.1(transitive)

• + Addedchartjs-color-string@0.6.0(transitive)

• + Addedcolor-convert@1.9.3(transitive)

• + Addedcolor-name@1.1.3(transitive)

• + Addedrxjs@5.0.0-beta.11(transitive)

• + Addedsymbol-observable@1.2.0(transitive)

• + Addedzone.js@0.6.26(transitive)

• - Removed@angular/common@2.4.10(transitive)

• - Removed@angular/core@2.4.10(transitive)

• - Removedchart.js@2.1.3(transitive)

• - Removedchartjs-color@1.0.22(transitive)

• - Removedchartjs-color-string@0.4.0(transitive)

• - Removedcolor-convert@0.5.3(transitive)

• - Removedrxjs@5.5.12(transitive)

• - Removedsymbol-observable@1.0.1(transitive)

• - Removedzone.js@0.7.8(transitive)

• Updatedchart.js@2.2.2