photon-grid-core 0.0.1

package/chart/chart-engine.js

@@ -0,0 +1,96 @@
+import { GridEventType } from '../types/event.types';
+import { ChartDataTransformer } from './chart-data-transformer';
+import { ChartRenderer } from './chart-renderer';
+import { createDiv } from '../renderer/dom-utils';
+export class ChartEngine {
+    constructor(eventBus) {
+        this.eventBus = eventBus;
+        this.charts = new Map();
+        this.transformer = new ChartDataTransformer();
+    }
+    createChart(parentEl, config, rows, columns) {
+        const existing = this.charts.get(config.chartId);
+        if (existing) {
+            this.destroyChart(config.chartId);
+        }
+        const containerEl = createDiv('pg-chart');
+        containerEl.setAttribute('data-chart-id', config.chartId);
+        if (config.title) {
+            const titleEl = createDiv('pg-chart__title');
+            titleEl.textContent = config.title;
+            containerEl.appendChild(titleEl);
+        }
+        const canvas = document.createElement('canvas');
+        canvas.className = 'pg-chart__canvas';
+        containerEl.appendChild(canvas);
+        parentEl.appendChild(containerEl);
+        const chartRenderer = new ChartRenderer(canvas);
+        const activeChart = {
+            config,
+            containerEl,
+            canvas,
+            renderer: chartRenderer,
+        };
+        this.charts.set(config.chartId, activeChart);
+        this.renderChart(config.chartId, rows, columns);
+        this.eventBus.emit(GridEventType.CHART_CREATED, { chartId: config.chartId });
+        return config.chartId;
+    }
+    renderChart(chartId, rows, columns) {
+        const chart = this.charts.get(chartId);
+        if (!chart)
+            return;
+        const { config } = chart;
+        let chartData;
+        if (config.labelColId && config.valueColIds) {
+            chartData = this.transformer.fromSelectedColumns(rows, columns, config.labelColId, config.valueColIds);
+        }
+        else {
+            const firstLabelCol = columns.find((c) => c.type === 'string' || c.type === 'dropdown');
+            const numberCols = columns.filter((c) => c.type === 'number' || c.type === 'currency');
+            if (!firstLabelCol || numberCols.length === 0)
+                return;
+            chartData = this.transformer.transform(rows, {
+                labelField: firstLabelCol.field,
+                valueFields: numberCols.slice(0, 3).map((c) => c.field),
+                ...config.transformOptions,
+            });
+        }
+        chart.renderer.render(chartData, {
+            type: config.type,
+            width: config.width ?? 600,
+            height: config.height ?? 320,
+            ...config.renderOptions,
+        });
+    }
+    updateChartData(chartId, rows, columns) {
+        this.renderChart(chartId, rows, columns);
+    }
+    destroyChart(chartId) {
+        const chart = this.charts.get(chartId);
+        if (!chart)
+            return;
+        chart.renderer.destroy();
+        chart.containerEl.remove();
+        this.charts.delete(chartId);
+        this.eventBus.emit(GridEventType.CHART_DESTROYED, { chartId });
+    }
+    destroyAll() {
+        for (const chartId of this.charts.keys()) {
+            this.destroyChart(chartId);
+        }
+    }
+    getChart(chartId) {
+        return this.charts.get(chartId);
+    }
+    getAllChartIds() {
+        return Array.from(this.charts.keys());
+    }
+    exportChartAsImage(chartId, format = 'png') {
+        const chart = this.charts.get(chartId);
+        if (!chart)
+            return null;
+        return chart.canvas.toDataURL(`image/${format}`, 0.95);
+    }
+}
+//# sourceMappingURL=chart-engine.js.map

package/chart/chart-engine.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"chart-engine.js","sourceRoot":"","sources":["../../src/chart/chart-engine.ts"],"names":[],"mappings":"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"}

package/chart/chart-panel.d.ts

@@ -0,0 +1,54 @@
+import type { ChartData } from './chart-data-transformer';
+export type ChartPanelType = 'column-grouped' | 'column-stacked' | 'column-100stacked' | 'bar-grouped' | 'bar-stacked' | 'bar-100stacked' | 'pie' | 'doughnut' | 'line' | 'area' | 'scatter' | 'polar' | 'funnel';
+export declare class ChartPanel {
+    private containerEl;
+    private backdropEl;
+    private cardEl;
+    private canvasEl;
+    private dotsMenuEl;
+    private dotsBtnEl;
+    private fullscreenBtnEl;
+    private legendEl;
+    private renderer;
+    private resizeObserver;
+    private isFullscreen;
+    private currentData;
+    private currentType;
+    private currentTitle;
+    /** Dataset indices the user has toggled off via the legend. */
+    private hiddenSeries;
+    /** Current top-left position of the card within the backdrop. */
+    private panelX;
+    private panelY;
+    constructor(containerEl: HTMLElement);
+    open(type: ChartPanelType, title: string, data: ChartData | null): void;
+    close(): void;
+    private buildDom;
+    /**
+     * Position the card at the center of the backdrop.
+     * Called once after building the DOM and on fullscreen exit.
+     */
+    private centerPanel;
+    private applyPosition;
+    /**
+     * Wire drag-to-move onto the header bar.
+     * Clamped strictly within the backdrop bounds so the panel never escapes the grid.
+     */
+    private attachDrag;
+    private closeDotsMenu;
+    private toggleFullscreen;
+    private renderChart;
+    /**
+     * Populates the HTML legend bar with one clickable button per dataset.
+     * Each button acts as a toggle: clicking animates the corresponding bars
+     * in or out and dims the legend entry to signal its state.
+     */
+    private buildLegend;
+    /**
+     * Toggles a dataset's visibility with a smooth bar-height animation.
+     * The legend item is dimmed while its series is hidden.
+     */
+    private handleLegendToggle;
+    private downloadChart;
+}
+//# sourceMappingURL=chart-panel.d.ts.map

package/chart/chart-panel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"chart-panel.d.ts","sourceRoot":"","sources":["../../src/chart/chart-panel.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;AAG1D,MAAM,MAAM,cAAc,GACtB,gBAAgB,GAAG,gBAAgB,GAAG,mBAAmB,GACzD,aAAa,GAAG,aAAa,GAAG,gBAAgB,GAChD,KAAK,GAAG,UAAU,GAClB,MAAM,GAAG,MAAM,GACf,SAAS,GAAG,OAAO,GAAG,QAAQ,CAAC;AASnC,qBAAa,UAAU;IAqBT,OAAO,CAAC,WAAW;IApB/B,OAAO,CAAC,UAAU,CAA4B;IAC9C,OAAO,CAAC,MAAM,CAA4B;IAC1C,OAAO,CAAC,QAAQ,CAAkC;IAClD,OAAO,CAAC,UAAU,CAA4B;IAC9C,OAAO,CAAC,SAAS,CAA4B;IAC7C,OAAO,CAAC,eAAe,CAA4B;IACnD,OAAO,CAAC,QAAQ,CAA4B;IAC5C,OAAO,CAAC,QAAQ,CAA8B;IAC9C,OAAO,CAAC,cAAc,CAA+B;IACrD,OAAO,CAAC,YAAY,CAAS;IAC7B,OAAO,CAAC,WAAW,CAA0B;IAC7C,OAAO,CAAC,WAAW,CAAoC;IACvD,OAAO,CAAC,YAAY,CAAM;IAC1B,+DAA+D;IAC/D,OAAO,CAAC,YAAY,CAAqB;IAEzC,iEAAiE;IACjE,OAAO,CAAC,MAAM,CAAK;IACnB,OAAO,CAAC,MAAM,CAAK;gBAEC,WAAW,EAAE,WAAW;IAE5C,IAAI,CAAC,IAAI,EAAE,cAAc,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,SAAS,GAAG,IAAI,GAAG,IAAI;IAcvE,KAAK,IAAI,IAAI;IAgBb,OAAO,CAAC,QAAQ;IA2HhB;;;OAGG;IACH,OAAO,CAAC,WAAW;IAWnB,OAAO,CAAC,aAAa;IAMrB;;;OAGG;IACH,OAAO,CAAC,UAAU;IAmClB,OAAO,CAAC,aAAa;IAKrB,OAAO,CAAC,gBAAgB;IAoBxB,OAAO,CAAC,WAAW;IAwBnB;;;;OAIG;IACH,OAAO,CAAC,WAAW;IAwBnB;;;OAGG;IACH,OAAO,CAAC,kBAAkB;IA4B1B,OAAO,CAAC,aAAa;CA8BtB"}

package/chart/chart-panel.js

@@ -0,0 +1,350 @@
+import { ChartRenderer } from './chart-renderer';
+const ICON_EMPTY_CHART = `<svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="18" height="18" rx="2"/><path d="M3 9h18M9 21V9"/><line x1="7" y1="15" x2="7" y2="17"/><line x1="12" y1="12" x2="12" y2="17"/><line x1="17" y1="14" x2="17" y2="17"/></svg>`;
+const ICON_CLOSE = `<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round"><line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/></svg>`;
+const ICON_FULLSCREEN = `<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M8 3H5a2 2 0 0 0-2 2v3m18 0V5a2 2 0 0 0-2-2h-3m0 18h3a2 2 0 0 0 2-2v-3M3 16v3a2 2 0 0 0 2 2h3"/></svg>`;
+const ICON_FULLSCREEN_EXIT = `<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M8 3v3a2 2 0 0 1-2 2H3m18 0h-3a2 2 0 0 1-2-2V3m0 18v-3a2 2 0 0 1 2-2h3M3 16h3a2 2 0 0 1 2 2v3"/></svg>`;
+const ICON_DOTS = `<svg width="4" height="16" viewBox="0 0 4 16" fill="currentColor"><circle cx="2" cy="2" r="1.5"/><circle cx="2" cy="8" r="1.5"/><circle cx="2" cy="14" r="1.5"/></svg>`;
+const ICON_DOWNLOAD = `<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><polyline points="7 10 12 15 17 10"/><line x1="12" y1="15" x2="12" y2="3"/></svg>`;
+export class ChartPanel {
+    constructor(containerEl) {
+        this.containerEl = containerEl;
+        this.backdropEl = null;
+        this.cardEl = null;
+        this.canvasEl = null;
+        this.dotsMenuEl = null;
+        this.dotsBtnEl = null;
+        this.fullscreenBtnEl = null;
+        this.legendEl = null;
+        this.renderer = null;
+        this.resizeObserver = null;
+        this.isFullscreen = false;
+        this.currentData = null;
+        this.currentType = 'column-grouped';
+        this.currentTitle = '';
+        /** Dataset indices the user has toggled off via the legend. */
+        this.hiddenSeries = new Set();
+        /** Current top-left position of the card within the backdrop. */
+        this.panelX = 0;
+        this.panelY = 0;
+    }
+    open(type, title, data) {
+        this.close();
+        this.currentType = type;
+        this.currentTitle = title;
+        this.currentData = data;
+        this.isFullscreen = false;
+        this.hiddenSeries = new Set();
+        this.buildDom(title, data === null);
+        if (data !== null) {
+            if (data.datasets.length > 1)
+                this.buildLegend(data);
+            this.renderChart();
+        }
+    }
+    close() {
+        this.resizeObserver?.disconnect();
+        this.resizeObserver = null;
+        this.renderer?.destroy();
+        this.renderer = null;
+        this.backdropEl?.remove();
+        this.backdropEl = null;
+        this.cardEl = null;
+        this.canvasEl = null;
+        this.dotsMenuEl = null;
+        this.dotsBtnEl = null;
+        this.fullscreenBtnEl = null;
+        this.legendEl = null;
+        this.currentData = null;
+    }
+    buildDom(title, isEmpty) {
+        const backdrop = document.createElement('div');
+        backdrop.className = 'pg-chart-panel-backdrop pg-chart-panel-backdrop--open';
+        backdrop.addEventListener('mousedown', (e) => {
+            if (e.target === backdrop)
+                this.close();
+        });
+        const card = document.createElement('div');
+        card.className = 'pg-chart-panel';
+        backdrop.appendChild(card);
+        // Header
+        const header = document.createElement('div');
+        header.className = 'pg-chart-panel__header';
+        const titleEl = document.createElement('div');
+        titleEl.className = 'pg-chart-panel__title';
+        titleEl.textContent = isEmpty ? 'Chart Range' : title;
+        const actions = document.createElement('div');
+        actions.className = 'pg-chart-panel__actions';
+        const fullscreenBtn = document.createElement('button');
+        fullscreenBtn.className = 'pg-chart-panel__action-btn';
+        fullscreenBtn.title = 'Toggle fullscreen';
+        fullscreenBtn.innerHTML = ICON_FULLSCREEN;
+        fullscreenBtn.addEventListener('click', () => this.toggleFullscreen());
+        const closeBtn = document.createElement('button');
+        closeBtn.className = 'pg-chart-panel__action-btn';
+        closeBtn.title = 'Close';
+        closeBtn.innerHTML = ICON_CLOSE;
+        closeBtn.addEventListener('click', () => this.close());
+        actions.appendChild(fullscreenBtn);
+        actions.appendChild(closeBtn);
+        header.appendChild(titleEl);
+        header.appendChild(actions);
+        card.appendChild(header);
+        // Body
+        const body = document.createElement('div');
+        body.className = 'pg-chart-panel__body';
+        if (isEmpty) {
+            const emptyEl = document.createElement('div');
+            emptyEl.className = 'pg-chart-panel__empty';
+            emptyEl.innerHTML = `
+        <span class="pg-chart-panel__empty-icon">${ICON_EMPTY_CHART}</span>
+        <span class="pg-chart-panel__empty-text">No chart data available</span>
+        <span class="pg-chart-panel__empty-sub">Select cells that include Number, Currency, or Percentage columns</span>
+      `;
+            body.appendChild(emptyEl);
+        }
+        else {
+            const canvas = document.createElement('canvas');
+            canvas.className = 'pg-chart-panel__canvas';
+            body.appendChild(canvas);
+            const dotsBtn = document.createElement('button');
+            dotsBtn.className = 'pg-chart-panel__dots-btn';
+            dotsBtn.title = 'Download';
+            dotsBtn.innerHTML = ICON_DOTS;
+            const dotsMenu = document.createElement('div');
+            dotsMenu.className = 'pg-chart-panel__dots-menu';
+            const pngItem = document.createElement('button');
+            pngItem.className = 'pg-chart-panel__dots-item';
+            pngItem.innerHTML = `${ICON_DOWNLOAD} Download PNG`;
+            pngItem.addEventListener('click', () => { this.downloadChart('png'); this.closeDotsMenu(); });
+            const jpegItem = document.createElement('button');
+            jpegItem.className = 'pg-chart-panel__dots-item';
+            jpegItem.innerHTML = `${ICON_DOWNLOAD} Download JPEG`;
+            jpegItem.addEventListener('click', () => { this.downloadChart('jpeg'); this.closeDotsMenu(); });
+            dotsMenu.appendChild(pngItem);
+            dotsMenu.appendChild(jpegItem);
+            dotsBtn.addEventListener('click', (e) => {
+                e.stopPropagation();
+                const isOpen = dotsMenu.classList.contains('pg-chart-panel__dots-menu--open');
+                if (isOpen) {
+                    this.closeDotsMenu();
+                }
+                else {
+                    dotsMenu.classList.add('pg-chart-panel__dots-menu--open');
+                    dotsBtn.classList.add('pg-chart-panel__dots-btn--active');
+                    setTimeout(() => {
+                        document.addEventListener('mousedown', () => this.closeDotsMenu(), { once: true });
+                    });
+                }
+            });
+            body.appendChild(dotsBtn);
+            body.appendChild(dotsMenu);
+            this.canvasEl = canvas;
+            this.dotsMenuEl = dotsMenu;
+            this.dotsBtnEl = dotsBtn;
+            this.resizeObserver = new ResizeObserver(() => { this.renderChart(); });
+            this.resizeObserver.observe(body);
+        }
+        card.appendChild(body);
+        // Legend sits below the body in the card's flex column; height is 0 when
+        // empty (single-series chart) so it never wastes space.
+        const legend = document.createElement('div');
+        legend.className = 'pg-chart-panel__legend';
+        card.appendChild(legend);
+        this.legendEl = legend;
+        this.containerEl.appendChild(backdrop);
+        this.backdropEl = backdrop;
+        this.cardEl = card;
+        this.fullscreenBtnEl = fullscreenBtn;
+        this.centerPanel();
+        this.attachDrag(header);
+    }
+    /**
+     * Position the card at the center of the backdrop.
+     * Called once after building the DOM and on fullscreen exit.
+     */
+    centerPanel() {
+        if (!this.backdropEl || !this.cardEl)
+            return;
+        const bw = this.backdropEl.offsetWidth;
+        const bh = this.backdropEl.offsetHeight;
+        const cw = this.cardEl.offsetWidth;
+        const ch = this.cardEl.offsetHeight;
+        this.panelX = Math.max(0, (bw - cw) / 2);
+        this.panelY = Math.max(0, (bh - ch) / 2);
+        this.applyPosition();
+    }
+    applyPosition() {
+        if (!this.cardEl)
+            return;
+        this.cardEl.style.left = `${this.panelX}px`;
+        this.cardEl.style.top = `${this.panelY}px`;
+    }
+    /**
+     * Wire drag-to-move onto the header bar.
+     * Clamped strictly within the backdrop bounds so the panel never escapes the grid.
+     */
+    attachDrag(header) {
+        header.addEventListener('mousedown', (e) => {
+            if (this.isFullscreen)
+                return;
+            if (e.target.closest('button'))
+                return;
+            e.preventDefault();
+            const startMX = e.clientX;
+            const startMY = e.clientY;
+            const startPX = this.panelX;
+            const startPY = this.panelY;
+            header.classList.add('pg-chart-panel__header--dragging');
+            this.cardEl?.classList.add('pg-chart-panel--dragging');
+            const onMove = (mv) => {
+                if (!this.backdropEl || !this.cardEl)
+                    return;
+                const maxX = this.backdropEl.offsetWidth - this.cardEl.offsetWidth;
+                const maxY = this.backdropEl.offsetHeight - this.cardEl.offsetHeight;
+                this.panelX = Math.max(0, Math.min(startPX + mv.clientX - startMX, maxX));
+                this.panelY = Math.max(0, Math.min(startPY + mv.clientY - startMY, maxY));
+                this.applyPosition();
+            };
+            const onUp = () => {
+                header.classList.remove('pg-chart-panel__header--dragging');
+                this.cardEl?.classList.remove('pg-chart-panel--dragging');
+                document.removeEventListener('mousemove', onMove);
+                document.removeEventListener('mouseup', onUp);
+            };
+            document.addEventListener('mousemove', onMove);
+            document.addEventListener('mouseup', onUp);
+        });
+    }
+    closeDotsMenu() {
+        this.dotsMenuEl?.classList.remove('pg-chart-panel__dots-menu--open');
+        this.dotsBtnEl?.classList.remove('pg-chart-panel__dots-btn--active');
+    }
+    toggleFullscreen() {
+        if (!this.cardEl || !this.fullscreenBtnEl)
+            return;
+        this.isFullscreen = !this.isFullscreen;
+        this.cardEl.classList.toggle('pg-chart-panel--fullscreen', this.isFullscreen);
+        this.fullscreenBtnEl.innerHTML = this.isFullscreen ? ICON_FULLSCREEN_EXIT : ICON_FULLSCREEN;
+        this.fullscreenBtnEl.title = this.isFullscreen ? 'Exit fullscreen' : 'Toggle fullscreen';
+        if (this.isFullscreen) {
+            // Inset 16px from each edge to match calc(100% - 32px) dimensions
+            this.panelX = 0;
+            this.panelY = 0;
+            this.applyPosition();
+        }
+        else {
+            // Re-centre after layout recalculates the shrunk card dimensions
+            setTimeout(() => { this.centerPanel(); this.renderChart(); }, 50);
+            return;
+        }
+        setTimeout(() => this.renderChart(), 50);
+    }
+    renderChart() {
+        if (!this.canvasEl || !this.currentData || !this.cardEl)
+            return;
+        const body = this.canvasEl.parentElement;
+        if (!body)
+            return;
+        const w = body.clientWidth - 16;
+        const h = body.clientHeight - 16;
+        if (w <= 0 || h <= 0)
+            return;
+        if (!this.renderer) {
+            this.renderer = new ChartRenderer(this.canvasEl);
+        }
+        this.renderer.render(this.currentData, {
+            type: this.currentType,
+            width: w,
+            height: h,
+            showLegend: false,
+            showGrid: true,
+            animationDuration: 400,
+        });
+    }
+    /**
+     * Populates the HTML legend bar with one clickable button per dataset.
+     * Each button acts as a toggle: clicking animates the corresponding bars
+     * in or out and dims the legend entry to signal its state.
+     */
+    buildLegend(data) {
+        if (!this.legendEl)
+            return;
+        this.legendEl.innerHTML = '';
+        data.datasets.forEach((ds, i) => {
+            const item = document.createElement('button');
+            item.type = 'button';
+            item.className = 'pg-chart-panel__legend-item';
+            const swatch = document.createElement('span');
+            swatch.className = 'pg-chart-panel__legend-swatch';
+            swatch.style.background = ds.color ?? '#008FFB';
+            const label = document.createElement('span');
+            label.className = 'pg-chart-panel__legend-label';
+            label.textContent = ds.label;
+            item.appendChild(swatch);
+            item.appendChild(label);
+            item.addEventListener('click', () => this.handleLegendToggle(i));
+            this.legendEl.appendChild(item);
+        });
+    }
+    /**
+     * Toggles a dataset's visibility with a smooth bar-height animation.
+     * The legend item is dimmed while its series is hidden.
+     */
+    handleLegendToggle(index) {
+        if (!this.renderer || !this.currentData || !this.canvasEl)
+            return;
+        const body = this.canvasEl.parentElement;
+        if (!body)
+            return;
+        const w = body.clientWidth - 16;
+        const h = body.clientHeight - 16;
+        if (w <= 0 || h <= 0)
+            return;
+        const nowVisible = this.hiddenSeries.has(index); // toggling TO visible if currently hidden
+        if (nowVisible) {
+            this.hiddenSeries.delete(index);
+        }
+        else {
+            this.hiddenSeries.add(index);
+        }
+        const item = this.legendEl?.children[index];
+        item?.classList.toggle('pg-chart-panel__legend-item--hidden', !nowVisible);
+        this.renderer.toggleSeries(index, nowVisible, this.currentData, {
+            type: this.currentType,
+            width: w,
+            height: h,
+            showLegend: false,
+            showGrid: true,
+            animationDuration: 400,
+        });
+    }
+    downloadChart(format) {
+        if (!this.canvasEl)
+            return;
+        let sourceCanvas = this.canvasEl;
+        // JPEG has no alpha channel — composite onto a white background so
+        // transparent areas don't render as solid black.
+        if (format === 'jpeg') {
+            const offscreen = document.createElement('canvas');
+            offscreen.width = this.canvasEl.width;
+            offscreen.height = this.canvasEl.height;
+            const ctx = offscreen.getContext('2d');
+            if (ctx) {
+                ctx.fillStyle = '#ffffff';
+                ctx.fillRect(0, 0, offscreen.width, offscreen.height);
+                ctx.drawImage(this.canvasEl, 0, 0);
+                sourceCanvas = offscreen;
+            }
+        }
+        const mimeType = format === 'png' ? 'image/png' : 'image/jpeg';
+        const dataUrl = sourceCanvas.toDataURL(mimeType, 0.95);
+        const a = document.createElement('a');
+        a.href = dataUrl;
+        a.download = `${this.currentTitle || 'chart'}.${format}`;
+        // Must be in the DOM for the click to trigger a download in all browsers.
+        document.body.appendChild(a);
+        a.click();
+        document.body.removeChild(a);
+    }
+}
+//# sourceMappingURL=chart-panel.js.map

package/chart/chart-panel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"chart-panel.js","sourceRoot":"","sources":["../../src/chart/chart-panel.ts"],"names":[],"mappings":"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"}

package/chart/chart-renderer.d.ts

@@ -0,0 +1,93 @@
+import type { ChartData } from './chart-data-transformer';
+import type { ChartPanelType } from './chart-panel';
+export interface ChartRenderOptions {
+    type: ChartPanelType | 'bar' | 'line' | 'pie' | 'doughnut';
+    width?: number;
+    height?: number;
+    padding?: number;
+    showLegend?: boolean;
+    showGrid?: boolean;
+    showValues?: boolean;
+    barWidth?: number;
+    lineWidth?: number;
+    smooth?: boolean;
+    fontFamily?: string;
+    fontSize?: number;
+    textColor?: string;
+    gridColor?: string;
+    backgroundColor?: string;
+    animationDuration?: number;
+}
+export declare class ChartRenderer {
+    private canvas;
+    private ctx;
+    private animProgress;
+    private rafId;
+    private hoverX;
+    private hoverY;
+    private hoverRafId;
+    /** Smoothly lerped cursor-Y used to animate the tooltip like ApexCharts. */
+    private tooltipSmoothedY;
+    private lastData;
+    private lastOptions;
+    /** Per-dataset scale multiplier used by toggle animations (0 = hidden, 1 = full). */
+    private seriesScales;
+    /** Active RAF IDs for per-series toggle animations, keyed by dataset index. */
+    private seriesToggleRafs;
+    constructor(canvas: HTMLCanvasElement);
+    render(data: ChartData, opts?: ChartRenderOptions): void;
+    destroy(): void;
+    /**
+     * Animate a single dataset in or out without re-running the full chart animation.
+     * Each dataset's bar heights are multiplied by a per-series scale factor that is
+     * smoothly interpolated from its current value to 0 (hide) or 1 (show).
+     *
+     * @param index     - Index in `data.datasets` to animate.
+     * @param toVisible - `true` = grow bars into view; `false` = shrink bars to zero.
+     * @param data      - Full chart data including the toggled series.
+     * @param opts      - Render options matching the current chart configuration.
+     */
+    toggleSeries(index: number, toVisible: boolean, data: ChartData, opts?: ChartRenderOptions): void;
+    private attachEvents;
+    private scheduleHoverRedraw;
+    /**
+     * Eases `tooltipSmoothedY` toward the raw cursor Y (`hoverY`) by a lerp
+     * factor that produces an ApexCharts-style lag behind fast movement.
+     *
+     * @returns `true` when another frame is still required to complete the easing.
+     */
+    private stepTooltipLerp;
+    private drawHover;
+    private drawCartesianHover;
+    private drawBarHover;
+    private drawTooltip;
+    private animate;
+    private getPlotArea;
+    private draw;
+    private drawColumnGrouped;
+    private drawColumnStacked;
+    private drawColumn100Stacked;
+    private drawBarGrouped;
+    private drawBarStacked;
+    private drawBar100Stacked;
+    private drawLine;
+    private drawArea;
+    private drawPie;
+    private drawScatter;
+    private drawPolar;
+    private drawFunnel;
+    private drawGridLines;
+    /**
+     * Draws relative (0–100 %) Y-axis gridlines for multi-series charts where each
+     * dataset is normalised to its own maximum, making the shared axis unitless.
+     */
+    private drawGridLinesRelative;
+    private drawLegend;
+    private drawAxes;
+    private niceMax;
+    private getLabelStep;
+    private easeOutQuart;
+    private truncate;
+    private formatNum;
+}
+//# sourceMappingURL=chart-renderer.d.ts.map

package/chart/chart-renderer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"chart-renderer.d.ts","sourceRoot":"","sources":["../../src/chart/chart-renderer.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;AAC1D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAEpD,MAAM,WAAW,kBAAkB;IACjC,IAAI,EAAE,cAAc,GAAG,KAAK,GAAG,MAAM,GAAG,KAAK,GAAG,UAAU,CAAC;IAC3D,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B;AAoCD,qBAAa,aAAa;IACxB,OAAO,CAAC,MAAM,CAAoB;IAClC,OAAO,CAAC,GAAG,CAA2B;IACtC,OAAO,CAAC,YAAY,CAAK;IACzB,OAAO,CAAC,KAAK,CAAuB;IAGpC,OAAO,CAAC,MAAM,CAAuB;IACrC,OAAO,CAAC,MAAM,CAAuB;IACrC,OAAO,CAAC,UAAU,CAAuB;IACzC,4EAA4E;IAC5E,OAAO,CAAC,gBAAgB,CAAuB;IAC/C,OAAO,CAAC,QAAQ,CAA0B;IAC1C,OAAO,CAAC,WAAW,CAA6C;IAEhE,qFAAqF;IACrF,OAAO,CAAC,YAAY,CAAgB;IACpC,+EAA+E;IAC/E,OAAO,CAAC,gBAAgB,CAA6B;gBAEzC,MAAM,EAAE,iBAAiB;IAQrC,MAAM,CAAC,IAAI,EAAE,SAAS,EAAE,IAAI,GAAE,kBAA+C,GAAG,IAAI;IAwBpF,OAAO,IAAI,IAAI;IAaf;;;;;;;;;OASG;IACH,YAAY,CAAC,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,IAAI,GAAE,kBAA+C,GAAG,IAAI;IAkC7H,OAAO,CAAC,YAAY;IAoBpB,OAAO,CAAC,mBAAmB;IAkB3B;;;;;OAKG;IACH,OAAO,CAAC,eAAe;IAevB,OAAO,CAAC,SAAS;IAejB,OAAO,CAAC,kBAAkB;IA6E1B,OAAO,CAAC,YAAY;IA2CpB,OAAO,CAAC,WAAW;IAuHnB,OAAO,CAAC,OAAO;IAkBf,OAAO,CAAC,WAAW;IAiBnB,OAAO,CAAC,IAAI;IAmCZ,OAAO,CAAC,iBAAiB;IAoEzB,OAAO,CAAC,iBAAiB;IAoDzB,OAAO,CAAC,oBAAoB;IA+C5B,OAAO,CAAC,cAAc;IAyEtB,OAAO,CAAC,cAAc;IAwEtB,OAAO,CAAC,iBAAiB;IAmEzB,OAAO,CAAC,QAAQ;IAmDhB,OAAO,CAAC,QAAQ;IAqDhB,OAAO,CAAC,OAAO;IAwDf,OAAO,CAAC,WAAW;IAwCnB,OAAO,CAAC,SAAS;IA0DjB,OAAO,CAAC,UAAU;IAyClB,OAAO,CAAC,aAAa;IAmBrB;;;OAGG;IACH,OAAO,CAAC,qBAAqB;IAqB7B,OAAO,CAAC,UAAU;IAoBlB,OAAO,CAAC,QAAQ;IAQhB,OAAO,CAAC,OAAO;IAUf,OAAO,CAAC,YAAY;IAKpB,OAAO,CAAC,YAAY;IAIpB,OAAO,CAAC,QAAQ;IAIhB,OAAO,CAAC,SAAS;CAMlB"}