@design.estate/dees-catalog 1.8.3 → 1.8.4

package/dist_ts_web/elements/dees-chart-area.d.ts

@@ -9,10 +9,16 @@ export declare class DeesChartArea extends DeesElement {
     static demo: () => TemplateResult<1>;
     chart: ApexCharts;
     label: string;
+    series: ApexAxisChartSeries;
+    yAxisFormatter: (value: number) => string;
     private resizeObserver;
+    private resizeTimeout;
     constructor();
     static styles: CSSResult[];
     render(): TemplateResult;
     firstUpdated(): Promise<void>;
+    updated(changedProperties: Map<string, any>): Promise<void>;
+    updateSeries(newSeries: ApexAxisChartSeries): Promise<void>;
+    appendData(seriesIndex: number, newData: any[]): Promise<void>;
     resizeChart(): Promise<void>;
 }

package/dist_ts_web/elements/dees-chart-area.demo.js

@@ -1,21 +1,270 @@
-import { html } from '@design.estate/dees-element';
+import { html, css } from '@design.estate/dees-element';
 export const demoFunc = () => {
+    let chartElement;
+    let intervalId;
+    let currentDataset = 'system';
+    // Get element reference after render
+    setTimeout(() => {
+        const charts = document.querySelectorAll('dees-chart-area');
+        if (charts.length > 0) {
+            chartElement = charts[charts.length - 1];
+        }
+    }, 100);
+    // Y-axis formatters for different datasets
+    const formatters = {
+        system: (val) => `${val}%`,
+        network: (val) => `${val} Mbps`,
+        sales: (val) => `$${val.toLocaleString()}`,
+    };
+    // Different datasets to showcase
+    const datasets = {
+        system: {
+            label: 'System Usage (%)',
+            series: [
+                {
+                    name: 'CPU',
+                    data: [
+                        { x: new Date(Date.now() - 300000).toISOString(), y: 25 },
+                        { x: new Date(Date.now() - 240000).toISOString(), y: 30 },
+                        { x: new Date(Date.now() - 180000).toISOString(), y: 28 },
+                        { x: new Date(Date.now() - 120000).toISOString(), y: 35 },
+                        { x: new Date(Date.now() - 60000).toISOString(), y: 32 },
+                        { x: new Date().toISOString(), y: 38 },
+                    ],
+                },
+                {
+                    name: 'Memory',
+                    data: [
+                        { x: new Date(Date.now() - 300000).toISOString(), y: 45 },
+                        { x: new Date(Date.now() - 240000).toISOString(), y: 48 },
+                        { x: new Date(Date.now() - 180000).toISOString(), y: 46 },
+                        { x: new Date(Date.now() - 120000).toISOString(), y: 52 },
+                        { x: new Date(Date.now() - 60000).toISOString(), y: 50 },
+                        { x: new Date().toISOString(), y: 55 },
+                    ],
+                },
+            ],
+        },
+        network: {
+            label: 'Network Traffic (Mbps)',
+            series: [
+                {
+                    name: 'Download',
+                    data: [
+                        { x: new Date(Date.now() - 300000).toISOString(), y: 120 },
+                        { x: new Date(Date.now() - 240000).toISOString(), y: 150 },
+                        { x: new Date(Date.now() - 180000).toISOString(), y: 180 },
+                        { x: new Date(Date.now() - 120000).toISOString(), y: 165 },
+                        { x: new Date(Date.now() - 60000).toISOString(), y: 190 },
+                        { x: new Date().toISOString(), y: 175 },
+                    ],
+                },
+                {
+                    name: 'Upload',
+                    data: [
+                        { x: new Date(Date.now() - 300000).toISOString(), y: 25 },
+                        { x: new Date(Date.now() - 240000).toISOString(), y: 30 },
+                        { x: new Date(Date.now() - 180000).toISOString(), y: 35 },
+                        { x: new Date(Date.now() - 120000).toISOString(), y: 28 },
+                        { x: new Date(Date.now() - 60000).toISOString(), y: 32 },
+                        { x: new Date().toISOString(), y: 40 },
+                    ],
+                },
+            ],
+        },
+        sales: {
+            label: 'Sales Analytics',
+            series: [
+                {
+                    name: 'Revenue',
+                    data: [
+                        { x: '2025-01-01', y: 45000 },
+                        { x: '2025-01-02', y: 52000 },
+                        { x: '2025-01-03', y: 48000 },
+                        { x: '2025-01-04', y: 61000 },
+                        { x: '2025-01-05', y: 58000 },
+                        { x: '2025-01-06', y: 65000 },
+                    ],
+                },
+                {
+                    name: 'Profit',
+                    data: [
+                        { x: '2025-01-01', y: 12000 },
+                        { x: '2025-01-02', y: 14000 },
+                        { x: '2025-01-03', y: 11000 },
+                        { x: '2025-01-04', y: 18000 },
+                        { x: '2025-01-05', y: 16000 },
+                        { x: '2025-01-06', y: 20000 },
+                    ],
+                },
+            ],
+        },
+    };
+    // Generate random value within range
+    const getRandomValue = (min, max) => {
+        return Math.floor(Math.random() * (max - min + 1)) + min;
+    };
+    // Add real-time data
+    const addRealtimeData = () => {
+        if (!chartElement)
+            return;
+        const dataset = datasets[currentDataset];
+        const newTimestamp = new Date().toISOString();
+        // Generate new data points based on dataset type
+        let newData = [];
+        if (currentDataset === 'system') {
+            newData = [
+                [{ x: newTimestamp, y: getRandomValue(25, 45) }], // CPU
+                [{ x: newTimestamp, y: getRandomValue(45, 65) }], // Memory
+            ];
+        }
+        else if (currentDataset === 'network') {
+            newData = [
+                [{ x: newTimestamp, y: getRandomValue(100, 250) }], // Download
+                [{ x: newTimestamp, y: getRandomValue(20, 50) }], // Upload
+            ];
+        }
+        // Keep only last 10 data points
+        const currentSeries = chartElement.series.map((series, index) => ({
+            ...series,
+            data: [...series.data.slice(-9), ...(newData[index] || [])],
+        }));
+        chartElement.series = currentSeries;
+    };
+    // Switch dataset
+    const switchDataset = (name) => {
+        currentDataset = name;
+        if (chartElement) {
+            const dataset = datasets[name];
+            chartElement.label = dataset.label;
+            chartElement.series = dataset.series;
+            chartElement.yAxisFormatter = formatters[name];
+        }
+    };
+    // Start/stop real-time updates
+    const startRealtime = () => {
+        if (!intervalId && (currentDataset === 'system' || currentDataset === 'network')) {
+            intervalId = window.setInterval(() => addRealtimeData(), 2000);
+        }
+    };
+    const stopRealtime = () => {
+        if (intervalId) {
+            window.clearInterval(intervalId);
+            intervalId = null;
+        }
+    };
+    // Randomize current data
+    const randomizeData = () => {
+        if (!chartElement)
+            return;
+        const currentSeries = chartElement.series.map(series => ({
+            ...series,
+            data: series.data.map(point => ({
+                ...point,
+                y: typeof point.y === 'number'
+                    ? point.y * (0.8 + Math.random() * 0.4) // +/- 20% variation
+                    : point.y,
+            })),
+        }));
+        chartElement.series = currentSeries;
+    };
     return html `
     <style>
-      .demoBox {
-        position: relative;
-        background: #000000;
-        height: 100%;
-        width: 100%;
-        padding: 40px;
-        box-sizing: border-box;
-      }
+      ${css `
+        .demoBox {
+          position: relative;
+          background: #000000;
+          height: 100%;
+          width: 100%;
+          padding: 40px;
+          box-sizing: border-box;
+          display: flex;
+          flex-direction: column;
+          gap: 24px;
+        }
+        
+        .controls {
+          display: flex;
+          flex-wrap: wrap;
+          gap: 12px;
+          margin-bottom: 8px;
+        }
+        
+        .control-section {
+          display: flex;
+          gap: 8px;
+          align-items: center;
+          padding: 8px;
+          background: rgba(255, 255, 255, 0.05);
+          border-radius: 6px;
+        }
+        
+        .section-label {
+          color: #999;
+          font-size: 12px;
+          font-family: 'Geist Sans', sans-serif;
+          margin-right: 8px;
+        }
+        
+        .chart-container {
+          flex: 1;
+          min-height: 400px;
+        }
+        
+        .info {
+          color: #666;
+          font-size: 11px;
+          font-family: 'Geist Sans', sans-serif;
+          text-align: center;
+          margin-top: 8px;
+        }
+      `}
     </style>
     <div class="demoBox">
-      <dees-chart-area
-        .label=${'System Usage'}
-      ></dees-chart-area>
+      <div class="controls">
+        <div class="control-section">
+          <span class="section-label">Dataset:</span>
+          <dees-button 
+            @clicked=${() => switchDataset('system')}
+            type=${currentDataset === 'system' ? 'highlighted' : 'normal'}
+          >System Usage</dees-button>
+          <dees-button 
+            @clicked=${() => switchDataset('network')}
+            type=${currentDataset === 'network' ? 'highlighted' : 'normal'}
+          >Network Traffic</dees-button>
+          <dees-button 
+            @clicked=${() => switchDataset('sales')}
+            type=${currentDataset === 'sales' ? 'highlighted' : 'normal'}
+          >Sales Data</dees-button>
+        </div>
+        
+        <div class="control-section">
+          <span class="section-label">Real-time:</span>
+          <dees-button @clicked=${() => startRealtime()}>Start Live</dees-button>
+          <dees-button @clicked=${() => stopRealtime()}>Stop Live</dees-button>
+        </div>
+        
+        <div class="control-section">
+          <span class="section-label">Actions:</span>
+          <dees-button @clicked=${() => randomizeData()}>Randomize Values</dees-button>
+          <dees-button @clicked=${() => addRealtimeData()}>Add Point</dees-button>
+        </div>
+      </div>
+      
+      <div class="chart-container">
+        <dees-chart-area
+          .label=${datasets[currentDataset].label}
+          .series=${datasets[currentDataset].series}
+          .yAxisFormatter=${formatters[currentDataset]}
+        ></dees-chart-area>
+      </div>
+      
+      <div class="info">
+        Real-time updates work with System Usage and Network Traffic datasets • 
+        Chart updates every 2 seconds when live mode is active • 
+        Try switching datasets and randomizing values
+      </div>
     </div>
   `;
 };
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGVlcy1jaGFydC1hcmVhLmRlbW8uanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi90c193ZWIvZWxlbWVudHMvZGVlcy1jaGFydC1hcmVhLmRlbW8udHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLElBQUksRUFBRSxNQUFNLDZCQUE2QixDQUFDO0FBRW5ELE1BQU0sQ0FBQyxNQUFNLFFBQVEsR0FBRyxHQUFHLEVBQUU7SUFDM0IsT0FBTyxJQUFJLENBQUE7Ozs7Ozs7Ozs7Ozs7aUJBYUksY0FBYzs7O0dBRzVCLENBQUM7QUFDSixDQUFDLENBQUMifQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGVlcy1jaGFydC1hcmVhLmRlbW8uanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi90c193ZWIvZWxlbWVudHMvZGVlcy1jaGFydC1hcmVhLmRlbW8udHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLElBQUksRUFBRSxHQUFHLEVBQUUsTUFBTSw2QkFBNkIsQ0FBQztBQUd4RCxNQUFNLENBQUMsTUFBTSxRQUFRLEdBQUcsR0FBRyxFQUFFO0lBQzNCLElBQUksWUFBMkIsQ0FBQztJQUNoQyxJQUFJLFVBQWtCLENBQUM7SUFDdkIsSUFBSSxjQUFjLEdBQUcsUUFBUSxDQUFDO0lBRTlCLHFDQUFxQztJQUNyQyxVQUFVLENBQUMsR0FBRyxFQUFFO1FBQ2QsTUFBTSxNQUFNLEdBQUcsUUFBUSxDQUFDLGdCQUFnQixDQUFDLGlCQUFpQixDQUFDLENBQUM7UUFDNUQsSUFBSSxNQUFNLENBQUMsTUFBTSxHQUFHLENBQUMsRUFBRSxDQUFDO1lBQ3RCLFlBQVksR0FBRyxNQUFNLENBQUMsTUFBTSxDQUFDLE1BQU0sR0FBRyxDQUFDLENBQWtCLENBQUM7UUFDNUQsQ0FBQztJQUNILENBQUMsRUFBRSxHQUFHLENBQUMsQ0FBQztJQUVSLDJDQUEyQztJQUMzQyxNQUFNLFVBQVUsR0FBRztRQUNqQixNQUFNLEVBQUUsQ0FBQyxHQUFXLEVBQUUsRUFBRSxDQUFDLEdBQUcsR0FBRyxHQUFHO1FBQ2xDLE9BQU8sRUFBRSxDQUFDLEdBQVcsRUFBRSxFQUFFLENBQUMsR0FBRyxHQUFHLE9BQU87UUFDdkMsS0FBSyxFQUFFLENBQUMsR0FBVyxFQUFFLEVBQUUsQ0FBQyxJQUFJLEdBQUcsQ0FBQyxjQUFjLEVBQUUsRUFBRTtLQUNuRCxDQUFDO0lBRUYsaUNBQWlDO0lBQ2pDLE1BQU0sUUFBUSxHQUFHO1FBQ2YsTUFBTSxFQUFFO1lBQ04sS0FBSyxFQUFFLGtCQUFrQjtZQUN6QixNQUFNLEVBQUU7Z0JBQ047b0JBQ0UsSUFBSSxFQUFFLEtBQUs7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QkFDMUQsRUFBRSxDQUFDLEVBQUUsSUFBSSxJQUFJLENBQUMsSUFBSSxDQUFDLEdBQUcsRUFBRSxHQUFHLE1BQU0sQ0FBQyxDQUFDLFdBQVcsRUFBRSxFQUFFLENBQUMsRUFBRSxHQUFHLEVBQUU7d0JBQzFELEVBQUUsQ0FBQyxFQUFFLElBQUksSUFBSSxDQUFDLElBQUksQ0FBQyxHQUFHLEVBQUUsR0FBRyxLQUFLLENBQUMsQ0FBQyxXQUFXLEVBQUUsRUFBRSxDQUFDLEVBQUUsR0FBRyxFQUFFO3dCQUN6RCxFQUFFLENBQUMsRUFBRSxJQUFJLElBQUksRUFBRSxDQUFDLFdBQVcsRUFBRSxFQUFFLENBQUMsRUFBRSxHQUFHLEVBQUU7cUJBQ3hDO2lCQUNGO2dCQUNEO29CQUNFLElBQUksRUFBRSxRQUFRO29CQUNkLElBQUksRUFBRTt3QkFDSixFQUFFLENBQUMsRUFBRSxJQUFJLElBQUksQ0FBQyxJQUFJLENBQUMsR0FBRyxFQUFFLEdBQUcsTUFBTSxDQUFDLENBQUMsV0FBVyxFQUFFLEVBQUUsQ0FBQyxFQUFFLEVBQUUsRUFBRTt3QkFDekQsRUFBRSxDQUFDLEVBQUUsSUFBSSxJQUFJLENBQUMsSUFBSSxDQUFDLEdBQUcsRUFBRSxHQUFHLE1BQU0sQ0FBQyxDQUFDLFdBQVcsRUFBRSxFQUFFLENBQUMsRUFBRSxFQUFFLEVBQUU7d0JBQ3pELEVBQUUsQ0FBQyxFQUFFLElBQUksSUFBSSxDQUFDLElBQUksQ0FBQyxHQUFHLEVBQUUsR0FBRyxNQUFNLENBQUMsQ0FBQyxXQUFXLEVBQUUsRUFBRSxDQUFDLEVBQUUsRUFBRSxFQUFFO3dCQUN6RCxFQUFFLENBQUMsRUFBRSxJQUFJLElBQUksQ0FBQyxJQUFJLENBQUMsR0FBRyxFQUFFLEdBQUcsTUFBTSxDQUFDLENBQUMsV0FBVyxFQUFFLEVBQUUsQ0FBQyxFQUFFLEVBQUUsRUFBRTt3QkFDekQsRUFBRSxDQUFDLEVBQUUsSUFBSSxJQUFJLENBQUMsSUFBSSxDQUFDLEdBQUcsRUFBRSxHQUFHLEtBQUssQ0FBQyxDQUFDLFdBQVcsRUFBRSxFQUFFLENBQUMs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

package/dist_ts_web/elements/dees-chart-area.js

@@ -16,23 +16,34 @@ let DeesChartArea = class DeesChartArea extends DeesElement {
     constructor() {
         super();
         this.label = 'Untitled Chart';
+        this.series = [];
+        this.yAxisFormatter = (val) => `${val} Mbps`;
         domtools.elementBasic.setup();
         this.resizeObserver = new ResizeObserver((entries) => {
-            for (let entry of entries) {
-                if (entry.target.classList.contains('mainbox')) {
-                    this.resizeChart(); // Call resizeChart when the .mainbox size changes
-                }
+            // Debounce resize calls to prevent excessive updates
+            if (this.resizeTimeout) {
+                clearTimeout(this.resizeTimeout);
             }
+            this.resizeTimeout = window.setTimeout(() => {
+                for (let entry of entries) {
+                    if (entry.target.classList.contains('mainbox') && this.chart) {
+                        this.resizeChart();
+                    }
+                }
+            }, 100); // 100ms debounce
         });
         this.registerStartupFunction(async () => {
             this.updateComplete.then(() => {
                 const mainbox = this.shadowRoot.querySelector('.mainbox');
                 if (mainbox) {
-                    this.resizeObserver.observe(mainbox); // Start observing the .mainbox element
+                    this.resizeObserver.observe(mainbox);
                 }
             });
         });
         this.registerGarbageFunction(async () => {
+            if (this.resizeTimeout) {
+                clearTimeout(this.resizeTimeout);
+            }
             this.resizeObserver.disconnect();
         });
     }
@@ -51,6 +62,7 @@ let DeesChartArea = class DeesChartArea extends DeesElement {
         height: 400px;
         background: #111;
         border-radius: 8px;
+        overflow: hidden;
       }
 
       .chartTitle {
@@ -60,6 +72,7 @@ let DeesChartArea = class DeesChartArea extends DeesElement {
         width: 100%;
         text-align: center;
         padding-top: 16px;
+        z-index: 10;
       }
       .chartContainer {
         position: absolute;
@@ -68,6 +81,7 @@ let DeesChartArea = class DeesChartArea extends DeesElement {
         bottom: 0px;
         right: 0px;
         padding: 32px 16px 16px 0px;
+        overflow: hidden;
       }
     `,
     ]; }
@@ -80,37 +94,64 @@ let DeesChartArea = class DeesChartArea extends DeesElement {
     `;
     }
     async firstUpdated() {
-        const domtoolsInstance = await this.domtoolsPromise;
+        await this.domtoolsPromise;
+        // Wait for next animation frame to ensure layout is complete
+        await new Promise(resolve => requestAnimationFrame(resolve));
+        // Get actual dimensions of the container
+        const mainbox = this.shadowRoot.querySelector('.mainbox');
+        const chartContainer = this.shadowRoot.querySelector('.chartContainer');
+        if (!mainbox || !chartContainer) {
+            console.error('Chart containers not found');
+            return;
+        }
+        // Calculate initial dimensions
+        const styleChartContainer = window.getComputedStyle(chartContainer);
+        const paddingTop = parseInt(styleChartContainer.paddingTop, 10);
+        const paddingBottom = parseInt(styleChartContainer.paddingBottom, 10);
+        const paddingLeft = parseInt(styleChartContainer.paddingLeft, 10);
+        const paddingRight = parseInt(styleChartContainer.paddingRight, 10);
+        const initialWidth = mainbox.clientWidth - paddingLeft - paddingRight;
+        const initialHeight = mainbox.offsetHeight - paddingTop - paddingBottom;
+        // Use provided series data or default demo data
+        const chartSeries = this.series.length > 0 ? this.series : [
+            {
+                name: 'cpu',
+                data: [
+                    { x: '2025-01-15T03:00:00', y: 25 },
+                    { x: '2025-01-15T07:00:00', y: 30 },
+                    { x: '2025-01-15T11:00:00', y: 20 },
+                    { x: '2025-01-15T15:00:00', y: 35 },
+                    { x: '2025-01-15T19:00:00', y: 25 },
+                ],
+            },
+            {
+                name: 'memory',
+                data: [
+                    { x: '2025-01-15T03:00:00', y: 10 },
+                    { x: '2025-01-15T07:00:00', y: 12 },
+                    { x: '2025-01-15T11:00:00', y: 10 },
+                    { x: '2025-01-15T15:00:00', y: 30 },
+                    { x: '2025-01-15T19:00:00', y: 40 },
+                ],
+            },
+        ];
         var options = {
-            series: [
-                {
-                    name: 'cpu',
-                    data: [
-                        { x: '2025-01-15T03:00:00', y: 25 },
-                        { x: '2025-01-15T07:00:00', y: 30 },
-                        { x: '2025-01-15T11:00:00', y: 20 },
-                        { x: '2025-01-15T15:00:00', y: 35 },
-                        { x: '2025-01-15T19:00:00', y: 25 },
-                    ],
-                },
-                {
-                    name: 'memory',
-                    data: [
-                        { x: '2025-01-15T03:00:00', y: 10 },
-                        { x: '2025-01-15T07:00:00', y: 12 },
-                        { x: '2025-01-15T11:00:00', y: 10 },
-                        { x: '2025-01-15T15:00:00', y: 30 },
-                        { x: '2025-01-15T19:00:00', y: 40 },
-                    ],
-                },
-            ],
+            series: chartSeries,
             chart: {
-                width: 0, // Adjusted for responsive width
-                height: 0, // Adjusted for responsive height
+                width: initialWidth || 100, // Use actual width or fallback
+                height: initialHeight || 100, // Use actual height or fallback
                 type: 'area',
                 toolbar: {
                     show: false, // This line disables the toolbar
                 },
+                animations: {
+                    enabled: true,
+                    speed: 400,
+                    animateGradually: {
+                        enabled: true,
+                        delay: 150
+                    },
+                },
             },
             dataLabels: {
                 enabled: false,
@@ -138,9 +179,7 @@ let DeesChartArea = class DeesChartArea extends DeesElement {
             yaxis: {
                 min: 0,
                 labels: {
-                    formatter: function (val) {
-                        return `${val} Mbps`; // Format Y-axis labels
-                    },
+                    formatter: this.yAxisFormatter,
                     style: {
                         colors: '#9e9e9e', // Label color
                         fontSize: '12px',
@@ -160,12 +199,9 @@ let DeesChartArea = class DeesChartArea extends DeesElement {
                 x: {
                     format: 'dd/MM/yy HH:mm',
                 },
-                custom: function ({ series, seriesIndex, dataPointIndex, w }) {
-                    // Get the x value
-                    const xValue = w.globals.labels[dataPointIndex];
+                custom: function ({ series, dataPointIndex, w }) {
                     // Iterate through each series and get its value
                     let tooltipContent = `<div style="padding: 10px; background: #1e1e2f; color: white; border-radius: 5px;">`;
-                    tooltipContent += ``; // `<strong>Time:</strong> ${xValue}<br/>`;
                     series.forEach((s, index) => {
                         const label = w.globals.seriesNames[index]; // Get series label
                         const value = s[dataPointIndex]; // Get value at data point
@@ -209,13 +245,53 @@ let DeesChartArea = class DeesChartArea extends DeesElement {
         };
         this.chart = new ApexCharts(this.shadowRoot.querySelector('.chartContainer'), options);
         await this.chart.render();
+        // Give the chart a moment to fully initialize before resizing
+        await new Promise(resolve => setTimeout(resolve, 100));
         await this.resizeChart();
     }
+    async updated(changedProperties) {
+        super.updated(changedProperties);
+        // Update chart if series data changes
+        if (changedProperties.has('series') && this.chart && this.series.length > 0) {
+            await this.updateSeries(this.series);
+        }
+        // Update y-axis formatter if it changes
+        if (changedProperties.has('yAxisFormatter') && this.chart) {
+            await this.chart.updateOptions({
+                yaxis: {
+                    labels: {
+                        formatter: this.yAxisFormatter,
+                    },
+                },
+            });
+        }
+    }
+    async updateSeries(newSeries) {
+        if (!this.chart) {
+            return;
+        }
+        await this.chart.updateSeries(newSeries, true);
+    }
+    async appendData(seriesIndex, newData) {
+        if (!this.chart) {
+            return;
+        }
+        const currentSeries = [...this.series];
+        if (currentSeries[seriesIndex]) {
+            currentSeries[seriesIndex].data = [...currentSeries[seriesIndex].data, ...newData];
+            await this.updateSeries(currentSeries);
+        }
+    }
     async resizeChart() {
+        if (!this.chart) {
+            return;
+        }
         const mainbox = this.shadowRoot.querySelector('.mainbox');
         const chartContainer = this.shadowRoot.querySelector('.chartContainer');
+        if (!mainbox || !chartContainer) {
+            return;
+        }
         // Get computed style of the element
-        const styleMainbox = window.getComputedStyle(mainbox);
         const styleChartContainer = window.getComputedStyle(chartContainer);
         // Extract padding values
         const paddingTop = parseInt(styleChartContainer.paddingTop, 10);
@@ -241,9 +317,17 @@ __decorate([
     property(),
     __metadata("design:type", String)
 ], DeesChartArea.prototype, "label", void 0);
+__decorate([
+    property({ type: Array }),
+    __metadata("design:type", Array)
+], DeesChartArea.prototype, "series", void 0);
+__decorate([
+    property({ type: Function }),
+    __metadata("design:type", Function)
+], DeesChartArea.prototype, "yAxisFormatter", void 0);
 DeesChartArea = __decorate([
     customElement('dees-chart-area'),
     __metadata("design:paramtypes", [])
 ], DeesChartArea);
 export { DeesChartArea };
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGVlcy1jaGFydC1hcmVhLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vdHNfd2ViL2VsZW1lbnRzL2RlZXMtY2hhcnQtYXJlYS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7QUFBQSxPQUFPLEVBQ0wsV0FBVyxFQUNYLEdBQUcsRUFDSCxVQUFVLEVBQ1YsYUFBYSxFQUNiLElBQUksRUFDSixRQUFRLEVBQ1IsS0FBSyxHQUdOLE1BQU0sNkJBQTZCLENBQUM7QUFFckMsT0FBTyxLQUFLLFFBQVEsTUFBTSw4QkFBOEIsQ0FBQztBQUN6RCxPQUFPLEVBQUUsUUFBUSxFQUFFLE1BQU0sMkJBQTJCLENBQUM7QUFFckQsT0FBTyxVQUFVLE1BQU0sWUFBWSxDQUFDO0FBUzdCLElBQU0sYUFBYSxHQUFuQixNQUFNLGFBQWMsU0FBUSxXQUFXO2FBQzlCLFNBQUksR0FBRyxRQUFRLEFBQVgsQ0FBWTtJQVc5QjtRQUNFLEtBQUssRUFBRSxDQUFDO1FBTEgsVUFBSyxHQUFXLGdCQUFnQixDQUFDO1FBTXRDLFFBQVEsQ0FBQyxZQUFZLENBQUMsS0FBSyxFQUFFLENBQUM7UUFFOUIsSUFBSSxDQUFDLGNBQWMsR0FBRyxJQUFJLGNBQWMsQ0FBQyxDQUFDLE9BQU8sRUFBRSxFQUFFO1lBQ25ELEtBQUssSUFBSSxLQUFLLElBQUksT0FBTyxFQUFFLENBQUM7Z0JBQzFCLElBQUksS0FBSyxDQUFDLE1BQU0sQ0FBQyxTQUFTLENBQUMsUUFBUSxDQUFDLFNBQVMsQ0FBQyxFQUFFLENBQUM7b0JBQy9DLElBQUksQ0FBQyxXQUFXLEVBQUUsQ0FBQyxDQUFDLGtEQUFrRDtnQkFDeEUsQ0FBQztZQUNILENBQUM7UUFDSCxDQUFDLENBQUMsQ0FBQztRQUNILElBQUksQ0FBQyx1QkFBdUIsQ0FBQyxLQUFLLElBQUksRUFBRTtZQUN0QyxJQUFJLENBQUMsY0FBYyxDQUFDLElBQUksQ0FBQyxHQUFHLEVBQUU7Z0JBQzVCLE1BQU0sT0FBTyxHQUFHLElBQUks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
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGVlcy1jaGFydC1hcmVhLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vdHNfd2ViL2VsZW1lbnRzL2RlZXMtY2hhcnQtYXJlYS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7QUFBQSxPQUFPLEVBQ0wsV0FBVyxFQUNYLEdBQUcsRUFDSCxVQUFVLEVBQ1YsYUFBYSxFQUNiLElBQUksRUFDSixRQUFRLEVBQ1IsS0FBSyxHQUdOLE1BQU0sNkJBQTZCLENBQUM7QUFFckMsT0FBTyxLQUFLLFFBQVEsTUFBTSw4QkFBOEIsQ0FBQztBQUN6RCxPQUFPLEVBQUUsUUFBUSxFQUFFLE1BQU0sMkJBQTJCLENBQUM7QUFFckQsT0FBTyxVQUFVLE1BQU0sWUFBWSxDQUFDO0FBUzdCLElBQU0sYUFBYSxHQUFuQixNQUFNLGFBQWMsU0FBUSxXQUFXO2FBQzlCLFNBQUksR0FBRyxRQUFRLEFBQVgsQ0FBWTtJQWtCOUI7UUFDRSxLQUFLLEVBQUUsQ0FBQztRQVpILFVBQUssR0FBVyxnQkFBZ0IsQ0FBQztRQUdqQyxXQUFNLEdBQXdCLEVBQUUsQ0FBQztRQUdqQyxtQkFBYyxHQUE4QixDQUFDLEdBQUcsRUFBRSxFQUFFLENBQUMsR0FBRyxHQUFHLE9BQU8sQ0FBQztRQU94RSxRQUFRLENBQUMsWUFBWSxDQUFDLEtBQUssRUFBRSxDQUFDO1FBRTlCLElBQUksQ0FBQyxjQUFjLEdBQUcsSUFBSSxjQUFjLENBQUMsQ0FBQyxPQUFPLEVBQUUsRUFBRTtZQUNuRCxxREFBcUQ7WUFDckQsSUFBSSxJQUFJLENBQUMsYUFBYSxFQUFFLENBQUM7Z0JBQ3ZCLFlBQVksQ0FBQyxJQUFJLENBQUMsYUFBYSxDQUFDLENBQUM7WUFDbkMsQ0FBQztZQUVELElBQUksQ0FBQyxhQUFhLEdBQUcsTUFBTSxDQUFDLFVBQVUsQ0FBQyxHQUFHLEVBQUU7Z0JBQzFDLEtBQUssSUFBSSxLQUFLLElBQUksT0FBTyxFQUFFLENBQUM7b0JBQzFCLElBQUksS0FBSyxDQUFDLE1B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

package/dist_ts_web/elements/dees-chart-log.d.ts

@@ -1,17 +1,29 @@
-import { DeesElement, type CSSResult, type TemplateResult } from '@design.estate/dees-element';
-import ApexCharts from 'apexcharts';
+import { DeesElement, type TemplateResult } from '@design.estate/dees-element';
 declare global {
     interface HTMLElementTagNameMap {
         'dees-chart-log': DeesChartLog;
     }
 }
+export interface ILogEntry {
+    timestamp: string;
+    level: 'debug' | 'info' | 'warn' | 'error' | 'success';
+    message: string;
+    source?: string;
+}
 export declare class DeesChartLog extends DeesElement {
     static demo: () => TemplateResult<1>;
-    chart: ApexCharts;
     label: string;
+    logEntries: ILogEntry[];
+    autoScroll: boolean;
+    maxEntries: number;
+    private logContainer;
     constructor();
-    static styles: CSSResult[];
+    static styles: import("@design.estate/dees-element").CSSResult[];
     render(): TemplateResult;
+    private renderLogEntry;
     firstUpdated(): Promise<void>;
-    updateLog(): Promise<void>;
+    updateLog(entries?: ILogEntry[]): Promise<void>;
+    clearLogs(): void;
+    private scrollToBottom;
+    addLog(level: ILogEntry['level'], message: string, source?: string): void;
 }