@coreui/angular-chartjs - npm Package Compare versions

Comparing version 5.4.1 to 5.4.3

lib/chartjs.component.d.ts

@@ -1,6 +0,8 @@
-import { AfterViewInit, ElementRef, EventEmitter, OnChanges, OnDestroy, SimpleChanges } from '@angular/core';
-import type { ChartData, ChartOptions, ChartType, Plugin } from 'chart.js';
+import { ElementRef, OnChanges, OnDestroy, SimpleChanges } from '@angular/core';
+import type { ChartConfiguration, ChartData, InteractionItem, Plugin } from 'chart.js';
 import { Chart as ChartJS } from 'chart.js';
+import { BooleanInput } from './chartjs.interface';
 import * as i0 from "@angular/core";
-export declare class ChartjsComponent implements AfterViewInit, OnDestroy, OnChanges {
+export declare class ChartjsComponent implements OnDestroy, OnChanges {
+    static ngAcceptInputType_redraw: BooleanInput;
     private readonly ngZone;
@@ -11,10 +13,10 @@ private readonly renderer;
      * Enables custom html based tooltips instead of standard tooltips.
-     * @type boolean
+     * @return boolean
      * @default true
      */
-    customTooltips: boolean;
+    readonly customTooltips: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
     /**
      * The data object that is passed into the Chart.js chart (more info).
      */
-    data?: ChartData;
+    readonly data: import("@angular/core").InputSignal<ChartData<keyof import("chart.js").ChartTypeRegistry, (number | [number, number] | import("chart.js").Point | import("chart.js").BubbleDataPoint | null)[], unknown> | undefined>;
     /**
@@ -25,36 +27,38 @@ * A fallback when the canvas cannot be rendered. Can be used for accessible chart descriptions.
      * Height attribute applied to the rendered canvas.
-     * @type number | undefined
-     * @default 150
+     * @return number | undefined
+     * @default null
      */
-    height?: number;
+    readonly height: import("@angular/core").InputSignalWithTransform<number | null, unknown>;
     /**
      * ID attribute applied to the rendered canvas.
-     * @type string
+     * @return string
      */
-    id: string;
+    readonly idInput: import("@angular/core").InputSignal<string>;
+    get id(): string;
     /**
      * The options object that is passed into the Chart.js chart.
      */
-    options?: ChartOptions;
+    readonly optionsInput: import("@angular/core").InputSignal<import("node_modules/chart.js/dist/types/utils")._DeepPartialObject<import("chart.js").CoreChartOptions<keyof import("chart.js").ChartTypeRegistry> & import("chart.js").ElementChartOptions<keyof import("chart.js").ChartTypeRegistry> & import("chart.js").PluginChartOptions<keyof import("chart.js").ChartTypeRegistry> & import("chart.js").DatasetChartOptions<keyof import("chart.js").ChartTypeRegistry> & import("chart.js").ScaleChartOptions<keyof import("chart.js").ChartTypeRegistry>> | undefined>;
+    readonly options: import("@angular/core").WritableSignal<import("node_modules/chart.js/dist/types/utils")._DeepPartialObject<import("chart.js").CoreChartOptions<keyof import("chart.js").ChartTypeRegistry> & import("chart.js").ElementChartOptions<keyof import("chart.js").ChartTypeRegistry> & import("chart.js").PluginChartOptions<keyof import("chart.js").ChartTypeRegistry> & import("chart.js").DatasetChartOptions<keyof import("chart.js").ChartTypeRegistry> & import("chart.js").ScaleChartOptions<keyof import("chart.js").ChartTypeRegistry>> | undefined>;
     /**
      * The plugins array that is passed into the Chart.js chart
      */
-    plugins: Plugin[];
+    readonly plugins: import("@angular/core").InputSignal<Plugin<keyof import("chart.js").ChartTypeRegistry, import("node_modules/chart.js/dist/types/basic").AnyObject>[]>;
     /**
      * If true, will tear down and redraw chart on all updates.
-     * @type boolean
+     * @return boolean
      * @default false
      */
-    redraw: boolean;
+    readonly redraw: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
     /**
      * Chart.js chart type.
-     * @type {'line' | 'bar' | 'radar' | 'doughnut' | 'polarArea' | 'bubble' | 'pie' | 'scatter'}
+     * @return {'line' | 'bar' | 'radar' | 'doughnut' | 'polarArea' | 'bubble' | 'pie' | 'scatter'}
      */
-    type: ChartType;
+    readonly type: import("@angular/core").InputSignal<keyof import("chart.js").ChartTypeRegistry>;
     /**
      * Width attribute applied to the rendered canvas.
-     * @type number | undefined
-     * @default 300
+     * @return number | undefined
+     * @default null
      */
-    width?: number;
+    readonly width: import("@angular/core").InputSignalWithTransform<number | null, unknown>;
     /**
@@ -64,15 +68,14 @@ * Put the chart into the wrapper div element.
      */
-    wrapper: boolean;
-    readonly getDatasetAtEvent: EventEmitter<any>;
-    readonly getElementAtEvent: EventEmitter<any>;
-    readonly getElementsAtEvent: EventEmitter<any>;
-    readonly chartRef: EventEmitter<any>;
-    canvasElement: ElementRef;
+    readonly wrapper: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    readonly getDatasetAtEvent: import("@angular/core").OutputEmitterRef<InteractionItem[]>;
+    readonly getElementAtEvent: import("@angular/core").OutputEmitterRef<InteractionItem[]>;
+    readonly getElementsAtEvent: import("@angular/core").OutputEmitterRef<InteractionItem[]>;
+    readonly chartRef: import("@angular/core").OutputEmitterRef<any>;
+    readonly canvasElement: import("@angular/core").Signal<ElementRef<any>>;
     chart: ChartJS;
     ctx: CanvasRenderingContext2D;
-    get hostClasses(): {
+    readonly hostClasses: import("@angular/core").Signal<{
         'chart-wrapper': boolean;
-    };
+    }>;
     constructor();
-    ngAfterViewInit(): void;
     ngOnChanges(changes: SimpleChanges): void;
@@ -87,12 +90,7 @@ ngOnDestroy(): void;
     private chartDataConfig;
-    private chartOptions;
-    private chartConfig;
+    readonly chartOptions: import("@angular/core").Signal<import("node_modules/chart.js/dist/types/utils")._DeepPartialObject<import("chart.js").CoreChartOptions<keyof import("chart.js").ChartTypeRegistry> & import("chart.js").ElementChartOptions<keyof import("chart.js").ChartTypeRegistry> & import("chart.js").PluginChartOptions<keyof import("chart.js").ChartTypeRegistry> & import("chart.js").DatasetChartOptions<keyof import("chart.js").ChartTypeRegistry> & import("chart.js").ScaleChartOptions<keyof import("chart.js").ChartTypeRegistry>>>;
+    readonly chartConfig: import("@angular/core").Signal<ChartConfiguration<keyof import("chart.js").ChartTypeRegistry, (number | [number, number] | import("chart.js").Point | import("chart.js").BubbleDataPoint | null)[], unknown>>;
     private chartCustomTooltips;
     static ɵfac: i0.ɵɵFactoryDeclaration<ChartjsComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ChartjsComponent, "c-chart", ["cChart"], { "customTooltips": { "alias": "customTooltips"; "required": false; }; "data": { "alias": "data"; "required": false; }; "height": { "alias": "height"; "required": false; }; "id": { "alias": "id"; "required": false; }; "options": { "alias": "options"; "required": false; }; "plugins": { "alias": "plugins"; "required": false; }; "redraw": { "alias": "redraw"; "required": false; }; "type": { "alias": "type"; "required": false; }; "width": { "alias": "width"; "required": false; }; "wrapper": { "alias": "wrapper"; "required": false; }; }, { "getDatasetAtEvent": "getDatasetAtEvent"; "getElementAtEvent": "getElementAtEvent"; "getElementsAtEvent": "getElementsAtEvent"; "chartRef": "chartRef"; }, never, ["*"], true, never>;
-    static ngAcceptInputType_customTooltips: unknown;
-    static ngAcceptInputType_height: string | number;
-    static ngAcceptInputType_redraw: unknown;
-    static ngAcceptInputType_width: string | number;
-    static ngAcceptInputType_wrapper: unknown;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ChartjsComponent, "c-chart", ["cChart"], { "customTooltips": { "alias": "customTooltips"; "required": false; "isSignal": true; }; "data": { "alias": "data"; "required": false; "isSignal": true; }; "height": { "alias": "height"; "required": false; "isSignal": true; }; "idInput": { "alias": "id"; "required": false; "isSignal": true; }; "optionsInput": { "alias": "options"; "required": false; "isSignal": true; }; "plugins": { "alias": "plugins"; "required": false; "isSignal": true; }; "redraw": { "alias": "redraw"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; "wrapper": { "alias": "wrapper"; "required": false; "isSignal": true; }; }, { "getDatasetAtEvent": "getDatasetAtEvent"; "getElementAtEvent": "getElementAtEvent"; "getElementsAtEvent": "getElementsAtEvent"; "chartRef": "chartRef"; }, never, ["*"], true, never>;
 }

package.json

 {
   "name": "@coreui/angular-chartjs",
-  "version": "5.4.1",
+  "version": "5.4.3",
   "description": "Angular wrapper component for Chart.js",
@@ -28,3 +28,3 @@ "copyright": "Copyright 2025 creativeLabs Łukasz Holeczek",
   "peerDependencies": {
-    "@angular/core": "^19.1.0",
+    "@angular/core": "^19.2.0",
     "@coreui/chartjs": "~4.1.0",
@@ -31,0 +31,0 @@ "chart.js": "^4.4.8"

README.md

 <p align="center">
-  <a href="https://coreui.io/">
+  <a href="https://coreui.io/" target="_blank">
     <img
@@ -14,13 +14,24 @@ src="https://coreui.io/images/brand/coreui-signet.svg"
 <p align="center">
-  <a href="https://coreui.io/angular/docs/"><strong>Explore @coreui/angular-chartjs docs & examples »</strong></a>
+  <a href="https://coreui.io/angular/docs/" target="_blank">Explore <strong>@coreui/angular-chartjs docs & examples »</strong></a>
   <br>
   <br>
-  <a href="https://github.com/coreui/coreui-angular/issues/new?template=bug_report.md">Report bug</a>
+  <a href="https://github.com/coreui/coreui-angular/issues/new?template=bug_report.md" target="_blank">Report bug</a>
   ·
-  <a href="https://github.com/coreui/coreui-angular/issues/new?template=feature_request.md">Request feature</a>
+  <a href="https://github.com/coreui/coreui-angular/issues/new?template=feature_request.md" target="_blank">Request feature</a>
   ·
   <a href="https://blog.coreui.io/">Blog</a>
 </p>
+<hr>
+<p>
+Featured CoreUI for Angular libraries:
+<br>
+· <a href="https://github.com/coreui/coreui-angular/tree/main/projects/coreui-angular" target="_blank">CoreUI Components for Angular</a>
+<br>
+· <a href="https://github.com/coreui/coreui-angular/tree/main/projects/coreui-angular-chartjs" target="_blank">CoreUI Angular wrapper for Chart.js v4</a>
+<br>
+· <a href="https://github.com/coreui/coreui-angular/tree/main/projects/coreui-icons-angular" target="_blank">CoreUI Icons for Angular</a>
+</p>
+<hr>
 
-## Status
+### Status
 
@@ -30,6 +41,6 @@ ![angular][angular-badge]
 [![npm package][npm-badge-latest]][npm]
-[![npm package][npm-badge-next]][npm]  
-[![NPM downloads][npm-download]][npm]
+[![npm package][npm-badge-next]][npm]
+[![NPM downloads][npm-download]][npm]  
+[![Project chartjs check](https://github.com/coreui/coreui-angular/actions/workflows/project-chartjs-check.yml/badge.svg)](https://github.com/coreui/coreui-angular/actions/workflows/project-chartjs-check.yml)
 
-
 [npm-badge-v5-ng19]: https://img.shields.io/npm/v/@coreui/angular-chartjs/v5-ng19?style=flat-square&color=brightgreen
@@ -40,3 +51,3 @@ [npm-badge-latest]: https://img.shields.io/npm/v/@coreui/angular-chartjs/latest?style=flat-square&color=brightgreen
 [npm-download]: https://img.shields.io/npm/dm/@coreui/angular-chartjs.svg?style=flat-square
-[angular-badge]: https://img.shields.io/badge/angular-^19.1.0-lightgrey.svg?style=flat-square&logo=angular
+[angular-badge]: https://img.shields.io/badge/angular-^19.2.0-lightgrey.svg?style=flat-square&logo=angular
 
@@ -53,4 +64,4 @@ ##### install:
 npm install chart.js@4
-npm install @coreui/chartjs@4
-npm install @coreui/angular-chartjs@5.2
+npm install @coreui/chartjs@~4.1
+npm install @coreui/angular-chartjs@~5.4
 ````
@@ -57,0 +68,0 @@

No alert changes

Improved metrics

Total package byte prevSize

64141

12.9%

Number of package files

18

5.88%

Lines of code

568

12.48%

Number of lines in readme file

204

5.7%

Worsened metrics

Number of downloads

25161

-4.65%

Number of versions

130

-0.76%

Published versions last months

4

-20%

Published versions last year

53

-1.85%

No dependency changes