raain-ui 1.11.2 → 1.11.33

package/RELEASE.md

@@ -2,4 +2,5 @@
 
 - 0.x.x : first extracts from RAAIN
 - 1.(-)9.x : factories uses in UI (map, compare, config)
-- 1.10.x : UI feedbacks (cartesians, show/hide)
+- 1.10.x : UI feedbacks (fix cartesians, add show/hide capability)
+- 1.11.x : Factory refactored, add perf monitoring

package/factories/ElementsFactory.d.ts

@@ -4,6 +4,8 @@ import { CompareElement, CompareElementInput } from './CompareElement';
 import { ConfigurationElement, ConfigurationElementInput } from './ConfigurationElement';
 import { DateStatusElement, DateStatusElementInput } from './DateStatusElement';
 import { SpeedMatrixElement, SpeedMatrixElementInput } from './SpeedMatrixElement';
+import { MonitoringBarsElement, MonitoringBarsElementInput } from './MonitoringBarsElement';
+import { MonitoringLinesElement, MonitoringLinesElementInput } from './MonitoringLinesElement';
 export declare class ElementsFactory {
     center: MapLatLng | {
         lat: number;
@@ -25,4 +27,6 @@ export declare class ElementsFactory {
     createConfiguration(element: HTMLCanvasElement, inputs: ConfigurationElementInput): ConfigurationElement;
     createDateStatus(element: HTMLCanvasElement, inputs: DateStatusElementInput): DateStatusElement;
     createSpeedMatrixIndicator(element: HTMLCanvasElement, inputs: SpeedMatrixElementInput): SpeedMatrixElement;
+    createMonitoringBars(element: HTMLCanvasElement, inputs: MonitoringBarsElementInput): MonitoringBarsElement;
+    createMonitoringLines(element: HTMLCanvasElement, inputs: MonitoringLinesElementInput): MonitoringLinesElement;
 }

package/factories/ElementsFactory.js

@@ -7,6 +7,8 @@ const CompareElement_1 = require("./CompareElement");
 const ConfigurationElement_1 = require("./ConfigurationElement");
 const DateStatusElement_1 = require("./DateStatusElement");
 const SpeedMatrixElement_1 = require("./SpeedMatrixElement");
+const MonitoringBarsElement_1 = require("./MonitoringBarsElement");
+const MonitoringLinesElement_1 = require("./MonitoringLinesElement");
 class ElementsFactory {
     constructor(center = { lat: 0, lng: 0 }, addSomeDebugInfos = false) {
         this.center = center;
@@ -40,6 +42,16 @@ class ElementsFactory {
         speedMatrixElement.build(element, inputs);
         return speedMatrixElement;
     }
+    createMonitoringBars(element, inputs) {
+        const el = new MonitoringBarsElement_1.MonitoringBarsElement(this.addSomeDebugInfos);
+        el.build(element, inputs);
+        return el;
+    }
+    createMonitoringLines(element, inputs) {
+        const el = new MonitoringLinesElement_1.MonitoringLinesElement(this.addSomeDebugInfos);
+        el.build(element, inputs);
+        return el;
+    }
 }
 exports.ElementsFactory = ElementsFactory;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiRWxlbWVudHNGYWN0b3J5LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vc3JjL2ZhY3Rvcmllcy9FbGVtZW50c0ZhY3RvcnkudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7O0FBQUEsa0RBQTZDO0FBQzdDLDZDQUF5RDtBQUN6RCxxREFBcUU7QUFDckUsaUVBQXVGO0FBQ3ZGLDJEQUE4RTtBQUM5RSw2REFBaUY7QUFFakYsTUFBYSxlQUFlO0lBRXhCLFlBQ1csU0FBbUcsRUFBQyxHQUFHLEVBQUUsQ0FBQyxFQUFFLEdBQUcsRUFBRSxDQUFDLEVBQUMsRUFDaEgsb0JBQW9CLEtBQUs7UUFENUIsV0FBTSxHQUFOLE1BQU0sQ0FBNkc7UUFDaEgsc0JBQWlCLEdBQWpCLGlCQUFpQixDQUFRO1FBRW5DLE1BQU0sR0FBRyxHQUFHLE9BQU8sSUFBSSxDQUFDLE1BQU0sQ0FBQyxHQUFHLEtBQUssV0FBVyxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQUMsTUFBTSxDQUFDLEdBQUcsQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLE1BQU0sQ0FBQyxRQUFRLENBQUM7UUFDNUYsTUFBTSxHQUFHLEdBQUcsT0FBTyxJQUFJLENBQUMsTUFBTSxDQUFDLEdBQUcsS0FBSyxXQUFXLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQyxNQUFNLENBQUMsR0FBRyxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQUMsTUFBTSxDQUFDLFNBQVMsQ0FBQztRQUM3RixJQUFJLENBQUMsTUFBTSxHQUFHLElBQUkscUJBQVMsQ0FBQyxHQUFHLEVBQUUsR0FBRyxDQUFDLENBQUM7SUFDMUMsQ0FBQztJQUVNLFNBQVMsQ0FBQyxPQUFvQixFQUFFLE1BQXVCO1FBQzFELE1BQU0sVUFBVSxHQUFHLElBQUksdUJBQVUsQ0FBQyxJQUFJLENBQUMsTUFBTSxFQUFFLElBQUksQ0FBQyxpQkFBaUIsQ0FBQyxDQUFDO1FBQ3ZFLFVBQVUsQ0FBQyxLQUFLLENBQUMsT0FBTyxFQUFFLE1BQU0sQ0FBQyxDQUFDO1FBQ2xDLE9BQU8sVUFBVSxDQUFDO0lBQ3RCLENBQUM7SUFFTSxhQUFhLENBQUMsT0FBMEIsRUFBRSxNQUEyQjtRQUN4RSxNQUFNLGNBQWMsR0FBRyxJQUFJLCtCQUFjLENBQUMsSUFBSSxDQUFDLGlCQUFpQixDQUFDLENBQUM7UUFDbEUsY0FBYyxDQUFDLEtBQUssQ0FBQyxPQUFPLEVBQUUsTUFBTSxDQUFDLENBQUM7UUFDdEMsT0FBTyxjQUFjLENBQUM7SUFDMUIsQ0FBQztJQUVNLG1CQUFtQixDQUFDLE9BQTBCLEVBQUUsTUFBaUM7UUFDcEYsTUFBTSxvQkFBb0IsR0FBRyxJQUFJLDJDQUFvQixDQUFDLElBQUksQ0FBQyxpQkFBaUIsQ0FBQyxDQUFDO1FBQzlFLG9CQUFvQixDQUFDLEtBQUssQ0FBQyxPQUFPLEVBQUUsTUFBTSxDQUFDLENBQUM7UUFDNUMsT0FBTyxvQkFBb0IsQ0FBQztJQUNoQyxDQUFDO0lBRU0sZ0JBQWdCLENBQUMsT0FBMEIsRUFBRSxNQUE4QjtRQUM5RSxNQUFNLGlCQUFpQixHQUFHLElBQUkscUNBQWlCLENBQUMsSUFBSSxDQUFDLGlCQUFpQixDQUFDLENBQUM7UUFDeEUsaUJBQWlCLENBQUMsS0FBSyxDQUFDLE9BQU8sRUFBRSxNQUFNLENBQUMsQ0FBQztRQUN6QyxPQUFPLGlCQUFpQixDQUFDO0lBQzdCLENBQUM7SUFFTSwwQkFBMEIsQ0FBQyxPQUEwQixFQUFFLE1BQStCO1FBQ3pGLE1BQU0sa0JBQWtCLEdBQUcsSUFBSSx1Q0FBa0IsQ0FBQyxJQUFJLENBQUMsaUJBQWlCLENBQUMsQ0FBQztRQUMxRSxrQkFBa0IsQ0FBQyxLQUFLLENBQUMsT0FBTyxFQUFFLE1BQU0sQ0FBQyxDQUFDO1FBQzFDLE9BQU8sa0JBQWtCLENBQUM7SUFDOUIsQ0FBQztDQUVKO0FBekNELDBDQXlDQyJ9
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiRWxlbWVudHNGYWN0b3J5LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vc3JjL2ZhY3Rvcmllcy9FbGVtZW50c0ZhY3RvcnkudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7O0FBQUEsa0RBQTZDO0FBQzdDLDZDQUF5RDtBQUN6RCxxREFBcUU7QUFDckUsaUVBQXVGO0FBQ3ZGLDJEQUE4RTtBQUM5RSw2REFBaUY7QUFDakYsbUVBQTBGO0FBQzFGLHFFQUE2RjtBQUU3RixNQUFhLGVBQWU7SUFFeEIsWUFDVyxTQUFtRyxFQUFDLEdBQUcsRUFBRSxDQUFDLEVBQUUsR0FBRyxFQUFFLENBQUMsRUFBQyxFQUNoSCxvQkFBb0IsS0FBSztRQUQ1QixXQUFNLEdBQU4sTUFBTSxDQUE2RztRQUNoSCxzQkFBaUIsR0FBakIsaUJBQWlCLENBQVE7UUFFbkMsTUFBTSxHQUFHLEdBQUcsT0FBTyxJQUFJLENBQUMsTUFBTSxDQUFDLEdBQUcsS0FBSyxXQUFXLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQyxNQUFNLENBQUMsR0FBRyxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQUMsTUFBTSxDQUFDLFFBQVEsQ0FBQztRQUM1RixNQUFNLEdBQUcsR0FBRyxPQUFPLElBQUksQ0FBQyxNQUFNLENBQUMsR0FBRyxLQUFLLFdBQVcsQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLE1BQU0sQ0FBQyxHQUFHLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQyxNQUFNLENBQUMsU0FBUyxDQUFDO1FBQzdGLElBQUksQ0FBQyxNQUFNLEdBQUcsSUFBSSxxQkFBUyxDQUFDLEdBQUcsRUFBRSxHQUFHLENBQUMsQ0FBQztJQUMxQyxDQUFDO0lBRU0sU0FBUyxDQUFDLE9BQW9CLEVBQUUsTUFBdUI7UUFDMUQsTUFBTSxVQUFVLEdBQUcsSUFBSSx1QkFBVSxDQUFDLElBQUksQ0FBQyxNQUFNLEVBQUUsSUFBSSxDQUFDLGlCQUFpQixDQUFDLENBQUM7UUFDdkUsVUFBVSxDQUFDLEtBQUssQ0FBQyxPQUFPLEVBQUUsTUFBTSxDQUFDLENBQUM7UUFDbEMsT0FBTyxVQUFVLENBQUM7SUFDdEIsQ0FBQztJQUVNLGFBQWEsQ0FBQyxPQUEwQixFQUFFLE1BQTJCO1FBQ3hFLE1BQU0sY0FBYyxHQUFHLElBQUksK0JBQWMsQ0FBQyxJQUFJLENBQUMsaUJBQWlCLENBQUMsQ0FBQztRQUNsRSxjQUFjLENBQUMsS0FBSyxDQUFDLE9BQU8sRUFBRSxNQUFNLENBQUMsQ0FBQztRQUN0QyxPQUFPLGNBQWMsQ0FBQztJQUMxQixDQUFDO0lBRU0sbUJBQW1CLENBQUMsT0FBMEIsRUFBRSxNQUFpQztRQUNwRixNQUFNLG9CQUFvQixHQUFHLElBQUksMkNBQW9CLENBQUMsSUFBSSxDQUFDLGlCQUFpQixDQUFDLENBQUM7UUFDOUUsb0JBQW9CLENBQUMsS0FBSyxDQUFDLE9BQU8sRUFBRSxNQUFNLENBQUMsQ0FBQztRQUM1QyxPQUFPLG9CQUFvQixDQUFDO0lBQ2hDLENBQUM7SUFFTSxnQkFBZ0IsQ0FBQyxPQUEwQixFQUFFLE1BQThCO1FBQzlFLE1BQU0saUJBQWlCLEdBQUcsSUFBSSxxQ0FBaUIsQ0FBQyxJQUFJLENBQUMsaUJBQWlCLENBQUMsQ0FBQztRQUN4RSxpQkFBaUIsQ0FBQyxLQUFLLENBQUMsT0FBTyxFQUFFLE1BQU0sQ0FBQyxDQUFDO1FBQ3pDLE9BQU8saUJBQWlCLENBQUM7SUFDN0IsQ0FBQztJQUVNLDBCQUEwQixDQUFDLE9BQTBCLEVBQUUsTUFBK0I7UUFDekYsTUFBTSxrQkFBa0IsR0FBRyxJQUFJLHVDQUFrQixDQUFDLElBQUksQ0FBQyxpQkFBaUIsQ0FBQyxDQUFDO1FBQzFFLGtCQUFrQixDQUFDLEtBQUssQ0FBQyxPQUFPLEVBQUUsTUFBTSxDQUFDLENBQUM7UUFDMUMsT0FBTyxrQkFBa0IsQ0FBQztJQUM5QixDQUFDO0lBRU0sb0JBQW9CLENBQUMsT0FBMEIsRUFBRSxNQUFrQztRQUN0RixNQUFNLEVBQUUsR0FBRyxJQUFJLDZDQUFxQixDQUFDLElBQUksQ0FBQyxpQkFBaUIsQ0FBQyxDQUFDO1FBQzdELEVBQUUsQ0FBQyxLQUFLLENBQUMsT0FBTyxFQUFFLE1BQU0sQ0FBQyxDQUFDO1FBQzFCLE9BQU8sRUFBRSxDQUFDO0lBQ2QsQ0FBQztJQUVNLHFCQUFxQixDQUFDLE9BQTBCLEVBQUUsTUFBbUM7UUFDeEYsTUFBTSxFQUFFLEdBQUcsSUFBSSwrQ0FBc0IsQ0FBQyxJQUFJLENBQUMsaUJBQWlCLENBQUMsQ0FBQztRQUM5RCxFQUFFLENBQUMsS0FBSyxDQUFDLE9BQU8sRUFBRSxNQUFNLENBQUMsQ0FBQztRQUMxQixPQUFPLEVBQUUsQ0FBQztJQUNkLENBQUM7Q0FFSjtBQXJERCwwQ0FxREMifQ==

package/factories/MonitoringBarsElement.d.ts

@@ -0,0 +1,20 @@
+import Chart from 'chart.js/auto';
+export declare class MonitoringBarsElementInput {
+    bars: Array<{
+        label: string;
+        percentage: number;
+    }>;
+    constructor(bars?: Array<{
+        label: string;
+        percentage: number;
+    }>);
+}
+export declare class MonitoringBarsElement {
+    protected addSomeDebugInfos: boolean;
+    chart: Chart<any>;
+    constructor(addSomeDebugInfos?: boolean);
+    build(element: HTMLCanvasElement, inputs: MonitoringBarsElementInput): void;
+    add(bars: Array<{
+        percentage: number;
+    }>): void;
+}

package/factories/MonitoringBarsElement.js

@@ -0,0 +1,66 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MonitoringBarsElement = exports.MonitoringBarsElementInput = void 0;
+const auto_1 = __importDefault(require("chart.js/auto"));
+const Tools_1 = require("./Tools");
+class MonitoringBarsElementInput {
+    constructor(bars = []) {
+        this.bars = bars;
+    }
+}
+exports.MonitoringBarsElementInput = MonitoringBarsElementInput;
+class MonitoringBarsElement {
+    constructor(addSomeDebugInfos = false) {
+        this.addSomeDebugInfos = addSomeDebugInfos;
+    }
+    build(element, inputs) {
+        const labels = inputs.bars.map(b => b.label);
+        const data = inputs.bars.map(b => b.percentage);
+        const config = {
+            type: 'bar',
+            data: {
+                labels,
+                datasets: [{
+                        data,
+                        borderColor: Tools_1.ChartColors.greenCpu,
+                        backgroundColor: Tools_1.ChartColors.greenCpu,
+                    }]
+            },
+            options: {
+                responsive: true,
+                scales: {
+                    x: {
+                        grid: {
+                            display: false
+                        }
+                    },
+                    y: {
+                        min: 0,
+                        beginAtZero: true,
+                        max: 100,
+                        display: false,
+                    }
+                },
+                grid: {
+                    display: false,
+                    drawTicks: false,
+                },
+                plugins: {
+                    legend: {
+                        display: false,
+                    },
+                },
+            }
+        };
+        this.chart = new auto_1.default(element, config);
+    }
+    add(bars) {
+        this.chart.data.datasets[0].data = bars.map(b => b.percentage);
+        this.chart.update();
+    }
+}
+exports.MonitoringBarsElement = MonitoringBarsElement;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTW9uaXRvcmluZ0JhcnNFbGVtZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vc3JjL2ZhY3Rvcmllcy9Nb25pdG9yaW5nQmFyc0VsZW1lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7O0FBQUEseURBQWtDO0FBQ2xDLG1DQUFvQztBQUVwQyxNQUFhLDBCQUEwQjtJQUNuQyxZQUNXLE9BQXFELEVBQUU7UUFBdkQsU0FBSSxHQUFKLElBQUksQ0FBbUQ7SUFFbEUsQ0FBQztDQUNKO0FBTEQsZ0VBS0M7QUFFRCxNQUFhLHFCQUFxQjtJQUk5QixZQUFzQixvQkFBb0IsS0FBSztRQUF6QixzQkFBaUIsR0FBakIsaUJBQWlCLENBQVE7SUFDL0MsQ0FBQztJQUVNLEtBQUssQ0FBQyxPQUEwQixFQUFFLE1BQWtDO1FBRXZFLE1BQU0sTUFBTSxHQUFHLE1BQU0sQ0FBQyxJQUFJLENBQUMsR0FBRyxDQUFDLENBQUMsQ0FBQyxFQUFFLENBQUMsQ0FBQyxDQUFDLEtBQUssQ0FBQyxDQUFDO1FBQzdDLE1BQU0sSUFBSSxHQUFHLE1BQU0sQ0FBQyxJQUFJLENBQUMsR0FBRyxDQUFDLENBQUMsQ0FBQyxFQUFFLENBQUMsQ0FBQyxDQUFDLFVBQVUsQ0FBQyxDQUFDO1FBRWhELE1BQU0sTUFBTSxHQUFRO1lBQ2hCLElBQUksRUFBRSxLQUFLO1lBQ1gsSUFBSSxFQUFFO2dCQUNGLE1BQU07Z0JBQ04sUUFBUSxFQUFFLENBQUM7d0JBQ1AsSUFBSTt3QkFDSixXQUFXLEVBQUUsbUJBQVcsQ0FBQyxRQUFRO3dCQUNqQyxlQUFlLEVBQUUsbUJBQVcsQ0FBQyxRQUFRO3FCQUN4QyxDQUFDO2FBQ0w7WUFDRCxPQUFPLEVBQUU7Z0JBQ0wsVUFBVSxFQUFFLElBQUk7Z0JBQ2hCLE1BQU0sRUFBRTtvQkFDSixDQUFDLEVBQUU7d0JBQ0MsSUFBSSxFQUFFOzRCQUNGLE9BQU8sRUFBRSxLQUFLO3lCQUNqQjtxQkFDSjtvQkFDRCxDQUFDLEVBQUU7d0JBQ0MsR0FBRyxFQUFFLENBQUM7d0JBQ04sV0FBVyxFQUFFLElBQUk7d0JBQ2pCLEdBQUcsRUFBRSxHQUFHO3dCQUNSLE9BQU8sRUFBRSxLQUFLO3FCQUNqQjtpQkFDSjtnQkFDRCxJQUFJLEVBQUU7b0JBQ0YsT0FBTyxFQUFFLEtBQUs7b0JBQ2QsU0FBUyxFQUFFLEtBQUs7aUJBQ25CO2dCQUNELE9BQU8sRUFBRTtvQkFDTCxNQUFNLEVBQUU7d0JBQ0osT0FBTyxFQUFFLEtBQUs7cUJBQ2pCO2lCQUNKO2FBQ0o7U0FDSixDQUFDO1FBRUYsSUFBSSxDQUFDLEtBQUssR0FBRyxJQUFJLGNBQUssQ0FBQyxPQUFPLEVBQUUsTUFBTSxDQUFDLENBQUM7SUFDNUMsQ0FBQztJQUVNLEdBQUcsQ0FBQyxJQUFtQztRQUMxQyxJQUFJLENBQUMsS0FBSyxDQUFDLElBQUksQ0FBQyxRQUFRLENBQUMsQ0FBQyxDQUFDLENBQUMsSUFBSSxHQUFHLElBQUksQ0FBQyxHQUFHLENBQUMsQ0FBQyxDQUFDLEVBQUUsQ0FBQyxDQUFDLENBQUMsVUFBVSxDQUFDLENBQUM7UUFDL0QsSUFBSSxDQUFDLEtBQUssQ0FBQyxNQUFNLEVBQUUsQ0FBQztJQUN4QixDQUFDO0NBR0o7QUExREQsc0RBMERDIn0=

package/factories/MonitoringLinesElement.d.ts

@@ -0,0 +1,20 @@
+import Chart from 'chart.js/auto';
+export declare class MonitoringLinesElementInput {
+    points: Array<{
+        date: Date;
+        percentage: number;
+    }>;
+    limit: number;
+    constructor(points?: Array<{
+        date: Date;
+        percentage: number;
+    }>, limit?: number);
+}
+export declare class MonitoringLinesElement {
+    protected addSomeDebugInfos: boolean;
+    chart: Chart<any>;
+    limit: number;
+    constructor(addSomeDebugInfos?: boolean);
+    build(element: HTMLCanvasElement, inputs: MonitoringLinesElementInput): void;
+    add(percentage: number, date?: Date): void;
+}

package/factories/MonitoringLinesElement.js

@@ -0,0 +1,87 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MonitoringLinesElement = exports.MonitoringLinesElementInput = void 0;
+const auto_1 = __importDefault(require("chart.js/auto"));
+const Tools_1 = require("./Tools");
+class MonitoringLinesElementInput {
+    constructor(points = [], limit = 100) {
+        this.points = points;
+        this.limit = limit;
+    }
+}
+exports.MonitoringLinesElementInput = MonitoringLinesElementInput;
+class MonitoringLinesElement {
+    constructor(addSomeDebugInfos = false) {
+        this.addSomeDebugInfos = addSomeDebugInfos;
+    }
+    build(element, inputs) {
+        this.limit = inputs.limit;
+        const labels = inputs.points.map(b => b.date.toISOString());
+        const data = inputs.points.map(b => b.percentage);
+        const config = {
+            type: 'line',
+            data: {
+                labels,
+                datasets: [{
+                        data,
+                        borderColor: Tools_1.ChartColors.greenCpu,
+                        tension: 0.1,
+                    }]
+            },
+            options: {
+                responsive: true,
+                scales: {
+                    x: {
+                        // display: false,
+                        grid: {
+                        // display: false,
+                        },
+                        ticks: {
+                            display: false,
+                        },
+                    },
+                    y: {
+                        min: 0,
+                        beginAtZero: true,
+                        max: 100,
+                        // display: false,
+                        grid: {
+                        // display: false,
+                        },
+                        ticks: {
+                            display: false,
+                        },
+                    }
+                },
+                grid: {
+                    display: true,
+                    // drawTicks: false,
+                },
+                plugins: {
+                    legend: {
+                        display: false,
+                    },
+                },
+            }
+        };
+        this.chart = new auto_1.default(element, config);
+    }
+    add(percentage, date = new Date()) {
+        let allLabels = JSON.parse(JSON.stringify(this.chart.data.labels));
+        let allPoints = JSON.parse(JSON.stringify(this.chart.data.datasets[0].data));
+        if (allLabels.length >= this.limit) {
+            allLabels = allLabels.slice(1);
+            allPoints = allPoints.slice(1);
+        }
+        allLabels.push(date.toISOString());
+        allPoints.push(percentage);
+        this.chart.data.labels = allLabels;
+        this.chart.data.datasets[0].data = allPoints;
+        this.chart.update();
+    }
+}
+exports.MonitoringLinesElement = MonitoringLinesElement;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTW9uaXRvcmluZ0xpbmVzRWxlbWVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9mYWN0b3JpZXMvTW9uaXRvcmluZ0xpbmVzRWxlbWVudC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7QUFBQSx5REFBa0M7QUFDbEMsbUNBQW9DO0FBRXBDLE1BQWEsMkJBQTJCO0lBQ3BDLFlBQ1csU0FBb0QsRUFBRSxFQUN0RCxRQUFRLEdBQUc7UUFEWCxXQUFNLEdBQU4sTUFBTSxDQUFnRDtRQUN0RCxVQUFLLEdBQUwsS0FBSyxDQUFNO0lBRXRCLENBQUM7Q0FDSjtBQU5ELGtFQU1DO0FBRUQsTUFBYSxzQkFBc0I7SUFLL0IsWUFBc0Isb0JBQW9CLEtBQUs7UUFBekIsc0JBQWlCLEdBQWpCLGlCQUFpQixDQUFRO0lBQy9DLENBQUM7SUFFTSxLQUFLLENBQUMsT0FBMEIsRUFBRSxNQUFtQztRQUV4RSxJQUFJLENBQUMsS0FBSyxHQUFHLE1BQU0sQ0FBQyxLQUFLLENBQUM7UUFDMUIsTUFBTSxNQUFNLEdBQUcsTUFBTSxDQUFDLE1BQU0sQ0FBQyxHQUFHLENBQUMsQ0FBQyxDQUFDLEVBQUUsQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLFdBQVcsRUFBRSxDQUFDLENBQUM7UUFDNUQsTUFBTSxJQUFJLEdBQUcsTUFBTSxDQUFDLE1BQU0sQ0FBQyxHQUFHLENBQUMsQ0FBQyxDQUFDLEVBQUUsQ0FBQyxDQUFDLENBQUMsVUFBVSxDQUFDLENBQUM7UUFFbEQsTUFBTSxNQUFNLEdBQVE7WUFDaEIsSUFBSSxFQUFFLE1BQU07WUFDWixJQUFJLEVBQUU7Z0JBQ0YsTUFBTTtnQkFDTixRQUFRLEVBQUUsQ0FBQzt3QkFDUCxJQUFJO3dCQUNKLFdBQVcsRUFBRSxtQkFBVyxDQUFDLFFBQVE7d0JBQ2pDLE9BQU8sRUFBRSxHQUFHO3FCQUNmLENBQUM7YUFDTDtZQUNELE9BQU8sRUFBRTtnQkFDTCxVQUFVLEVBQUUsSUFBSTtnQkFDaEIsTUFBTSxFQUFFO29CQUNKLENBQUMsRUFBRTt3QkFDQyxrQkFBa0I7d0JBQ2xCLElBQUksRUFBRTt3QkFDRixrQkFBa0I7eUJBQ3JCO3dCQUNELEtBQUssRUFBRTs0QkFDSCxPQUFPLEVBQUUsS0FBSzt5QkFDakI7cUJBQ0o7b0JBQ0QsQ0FBQyxFQUFFO3dCQUNDLEdBQUcsRUFBRSxDQUFDO3dCQUNOLFdBQVcsRUFBRSxJQUFJO3dCQUNqQixHQUFHLEVBQUUsR0FBRzt3QkFDUixrQkFBa0I7d0JBQ2xCLElBQUksRUFBRTt3QkFDRixrQkFBa0I7eUJBQ3JCO3dCQUNELEtBQUssRUFBRTs0QkFDSCxPQUFPLEVBQUUsS0FBSzt5QkFDakI7cUJBQ0o7aUJBQ0o7Z0JBQ0QsSUFBSSxFQUFFO29CQUNGLE9BQU8sRUFBRSxJQUFJO29CQUNiLG9CQUFvQjtpQkFDdkI7Z0JBQ0QsT0FBTyxFQUFFO29CQUNMLE1BQU0sRUFBRTt3QkFDSixPQUFPLEVBQUUsS0FBSztxQkFDakI7aUJBQ0o7YUFDSjtTQUNKLENBQUM7UUFFRixJQUFJLENBQUMsS0FBSyxHQUFHLElBQUksY0FBSyxDQUFDLE9BQU8sRUFBRSxNQUFNLENBQUMsQ0FBQztJQUM1QyxDQUFDO0lBRU0sR0FBRyxDQUFDLFVBQWtCLEVBQUUsT0FBYSxJQUFJLElBQUksRUFBRTtRQUNsRCxJQUFJLFNBQVMsR0FBRyxJQUFJLENBQUMsS0FBSyxDQUFDLElBQUksQ0FBQyxTQUFTLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxJQUFJLENBQUMsTUFBTSxDQUFDLENBQUMsQ0FBQztRQUNuRSxJQUFJLFNBQVMsR0FBRyxJQUFJLENBQUMsS0FBSyxDQUFDLElBQUksQ0FBQyxTQUFTLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxJQUFJLENBQUMsUUFBUSxDQUFDLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQyxDQUFDLENBQUM7UUFFN0UsSUFBSSxTQUFTLENBQUMsTUFBTSxJQUFJLElBQUksQ0FBQyxLQUFLLEVBQUU7WUFDaEMsU0FBUyxHQUFHLFNBQVMsQ0FBQyxLQUFLLENBQUMsQ0FBQyxDQUFDLENBQUM7WUFDL0IsU0FBUyxHQUFHLFNBQVMsQ0FBQyxLQUFLLENBQUMsQ0FBQyxDQUFDLENBQUM7U0FDbEM7UUFFRCxTQUFTLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxXQUFXLEVBQUUsQ0FBQyxDQUFDO1FBQ25DLFNBQVMsQ0FBQyxJQUFJLENBQUMsVUFBVSxDQUFDLENBQUM7UUFFM0IsSUFBSSxDQUFDLEtBQUssQ0FBQyxJQUFJLENBQUMsTUFBTSxHQUFHLFNBQVMsQ0FBQztRQUNuQyxJQUFJLENBQUMsS0FBSyxDQUFDLElBQUksQ0FBQyxRQUFRLENBQUMsQ0FBQyxDQUFDLENBQUMsSUFBSSxHQUFHLFNBQVMsQ0FBQztRQUM3QyxJQUFJLENBQUMsS0FBSyxDQUFDLE1BQU0sRUFBRSxDQUFDO0lBQ3hCLENBQUM7Q0FHSjtBQWxGRCx3REFrRkMifQ==

package/factories/Tools.d.ts

@@ -3,6 +3,7 @@ export declare const ChartColors: {
     orange: string;
     yellow: string;
     green: string;
+    greenCpu: string;
     blue: string;
     purple: string;
     grey: string;

package/factories/Tools.js

@@ -10,6 +10,7 @@ exports.ChartColors = {
     orange: 'rgb(255, 159, 64)',
     yellow: 'rgb(255, 205, 86)',
     green: 'rgb(75, 192, 192)',
+    greenCpu: 'rgb(58,241,10)',
     blue: 'rgb(54, 162, 235)',
     purple: 'rgb(153, 102, 255)',
     grey: 'rgb(163,163,164)',
@@ -30,4 +31,4 @@ class Tools {
     }
 }
 exports.Tools = Tools;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiVG9vbHMuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi9zcmMvZmFjdG9yaWVzL1Rvb2xzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7OztBQUFBLDBEQUFxQztBQUV4QixRQUFBLFdBQVcsR0FBRztJQUN2QixHQUFHLEVBQUUsbUJBQW1CO0lBQ3hCLE1BQU0sRUFBRSxtQkFBbUI7SUFDM0IsTUFBTSxFQUFFLG1CQUFtQjtJQUMzQixLQUFLLEVBQUUsbUJBQW1CO0lBQzFCLElBQUksRUFBRSxtQkFBbUI7SUFDekIsTUFBTSxFQUFFLG9CQUFvQjtJQUM1QixJQUFJLEVBQUUsa0JBQWtCO0lBQ3hCLElBQUksRUFBRSxlQUFlO0NBQ3hCLENBQUM7QUFFRixJQUFZLFVBTVg7QUFORCxXQUFZLFVBQVU7SUFDbEIsaURBQU8sQ0FBQTtJQUNQLDJDQUFJLENBQUE7SUFDSiw2Q0FBSyxDQUFBO0lBQ0wseUNBQUcsQ0FBQTtJQUNILDJDQUFJLENBQUE7QUFDUixDQUFDLEVBTlcsVUFBVSxHQUFWLGtCQUFVLEtBQVYsa0JBQVUsUUFNckI7QUFFRCxNQUFhLEtBQUs7SUFFUCxNQUFNLENBQUMsZUFBZSxDQUFDLEtBQWEsRUFBRSxPQUFlO1FBQ3hELE1BQU0sS0FBSyxHQUFHLE9BQU8sS0FBSyxTQUFTLENBQUMsQ0FBQyxDQUFDLEdBQUcsQ0FBQyxDQUFDLENBQUMsQ0FBQyxHQUFHLE9BQU8sQ0FBQztRQUN4RCxPQUFPLElBQUEsZUFBUSxFQUFDLEtBQUssQ0FBQyxDQUFDLEtBQUssQ0FBQyxLQUFLLENBQUMsQ0FBQyxTQUFTLEVBQUUsQ0FBQztJQUNwRCxDQUFDO0NBQ0o7QUFORCxzQkFNQyJ9
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiVG9vbHMuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi9zcmMvZmFjdG9yaWVzL1Rvb2xzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7OztBQUFBLDBEQUFxQztBQUV4QixRQUFBLFdBQVcsR0FBRztJQUN2QixHQUFHLEVBQUUsbUJBQW1CO0lBQ3hCLE1BQU0sRUFBRSxtQkFBbUI7SUFDM0IsTUFBTSxFQUFFLG1CQUFtQjtJQUMzQixLQUFLLEVBQUUsbUJBQW1CO0lBQzFCLFFBQVEsRUFBRSxnQkFBZ0I7SUFDMUIsSUFBSSxFQUFFLG1CQUFtQjtJQUN6QixNQUFNLEVBQUUsb0JBQW9CO0lBQzVCLElBQUksRUFBRSxrQkFBa0I7SUFDeEIsSUFBSSxFQUFFLGVBQWU7Q0FDeEIsQ0FBQztBQUVGLElBQVksVUFNWDtBQU5ELFdBQVksVUFBVTtJQUNsQixpREFBTyxDQUFBO0lBQ1AsMkNBQUksQ0FBQTtJQUNKLDZDQUFLLENBQUE7SUFDTCx5Q0FBRyxDQUFBO0lBQ0gsMkNBQUksQ0FBQTtBQUNSLENBQUMsRUFOVyxVQUFVLEdBQVYsa0JBQVUsS0FBVixrQkFBVSxRQU1yQjtBQUVELE1BQWEsS0FBSztJQUVQLE1BQU0sQ0FBQyxlQUFlLENBQUMsS0FBYSxFQUFFLE9BQWU7UUFDeEQsTUFBTSxLQUFLLEdBQUcsT0FBTyxLQUFLLFNBQVMsQ0FBQyxDQUFDLENBQUMsR0FBRyxDQUFDLENBQUMsQ0FBQyxDQUFDLEdBQUcsT0FBTyxDQUFDO1FBQ3hELE9BQU8sSUFBQSxlQUFRLEVBQUMsS0FBSyxDQUFDLENBQUMsS0FBSyxDQUFDLEtBQUssQ0FBQyxDQUFDLFNBQVMsRUFBRSxDQUFDO0lBQ3BELENBQUM7Q0FDSjtBQU5ELHNCQU1DIn0=

package/index.d.ts

@@ -5,6 +5,8 @@ export * from './factories/CompareElement';
 export * from './factories/ConfigurationElement';
 export * from './factories/DateStatusElement';
 export * from './factories/SpeedMatrixElement';
+export * from './factories/MonitoringBarsElement';
+export * from './factories/MonitoringLinesElement';
 export * from './tools/PolarMapValue';
 export * from './tools/CartesianMapValue';
 export * from './tools/MapTools';

package/index.js

@@ -21,6 +21,8 @@ __exportStar(require("./factories/CompareElement"), exports);
 __exportStar(require("./factories/ConfigurationElement"), exports);
 __exportStar(require("./factories/DateStatusElement"), exports);
 __exportStar(require("./factories/SpeedMatrixElement"), exports);
+__exportStar(require("./factories/MonitoringBarsElement"), exports);
+__exportStar(require("./factories/MonitoringLinesElement"), exports);
 __exportStar(require("./tools/PolarMapValue"), exports);
 __exportStar(require("./tools/CartesianMapValue"), exports);
 __exportStar(require("./tools/MapTools"), exports);
@@ -42,4 +44,4 @@ __exportStar(require("./layers/CartesianLayer"), exports);
 __exportStar(require("./timeframes/FrameContainer"), exports);
 __exportStar(require("./timeframes/TimeframeContainer"), exports);
 __exportStar(require("./timeframes/TimeframeContainers"), exports);
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi9zcmMvaW5kZXgudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7Ozs7Ozs7OztBQUFBLDhEQUE0QztBQUM1QyxvREFBa0M7QUFDbEMseURBQXVDO0FBQ3ZDLDZEQUEyQztBQUMzQyxtRUFBaUQ7QUFDakQsZ0VBQThDO0FBQzlDLGlFQUErQztBQUUvQyx3REFBc0M7QUFDdEMsNERBQTBDO0FBQzFDLG1EQUFpQztBQUNqQyxvREFBa0M7QUFFbEMsd0RBQXNDO0FBQ3RDLG9FQUFrRDtBQUNsRCwyREFBeUM7QUFDekMsNERBQTBDO0FBQzFDLHdFQUFzRDtBQUN0RCwrREFBNkM7QUFFN0Msc0RBQW9DO0FBQ3BDLDREQUEwQztBQUMxQywwREFBd0M7QUFDeEMsd0RBQXNDO0FBQ3RDLHlEQUF1QztBQUN2QyxzREFBb0M7QUFDcEMsNERBQTBDO0FBQzFDLDBEQUF3QztBQUV4Qyw4REFBNEM7QUFDNUMsa0VBQWdEO0FBQ2hELG1FQUFpRCJ9
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi9zcmMvaW5kZXgudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7Ozs7Ozs7OztBQUFBLDhEQUE0QztBQUM1QyxvREFBa0M7QUFDbEMseURBQXVDO0FBQ3ZDLDZEQUEyQztBQUMzQyxtRUFBaUQ7QUFDakQsZ0VBQThDO0FBQzlDLGlFQUErQztBQUMvQyxvRUFBa0Q7QUFDbEQscUVBQW1EO0FBRW5ELHdEQUFzQztBQUN0Qyw0REFBMEM7QUFDMUMsbURBQWlDO0FBQ2pDLG9EQUFrQztBQUVsQyx3REFBc0M7QUFDdEMsb0VBQWtEO0FBQ2xELDJEQUF5QztBQUN6Qyw0REFBMEM7QUFDMUMsd0VBQXNEO0FBQ3RELCtEQUE2QztBQUU3QyxzREFBb0M7QUFDcEMsNERBQTBDO0FBQzFDLDBEQUF3QztBQUN4Qyx3REFBc0M7QUFDdEMseURBQXVDO0FBQ3ZDLHNEQUFvQztBQUNwQyw0REFBMEM7QUFDMUMsMERBQXdDO0FBRXhDLDhEQUE0QztBQUM1QyxrRUFBZ0Q7QUFDaEQsbUVBQWlEIn0=

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "raain-ui",
-  "version": "1.11.2",
+  "version": "1.11.33",
   "author": "contact@raain.io",
   "homepage": "https://github.com/raainio/raain-ui",
   "description": "raain.io ui layers",
@@ -43,7 +43,8 @@
     "typescript": "^5.0.3"
   },
   "scripts": {
-    "build": "rm -rf dist/ && npm version patch --no-git-tag-version && tsc --project tsconfig.json && cp *.md dist/ && cp package.json dist/",
-    "test": "nyc ./node_modules/.bin/_mocha --require ./tools/register.js 'specs/**/**.spec.ts'"
+    "clean": "rm -rf dist .coverage .nyc_output",
+    "test": "nyc ./node_modules/.bin/_mocha --require ./tools/register.js 'specs/**/**.spec.ts'",
+    "build": "rm -rf dist/ && npm version patch --no-git-tag-version && tsc --project tsconfig.json && cp *.md dist/ && cp package.json dist/"
   }
 }