@univerjs-pro/boards-chart-ui 1.0.0-alpha.8 → 1.0.0-beta.0

package/lib/types/controllers/board-chart-panel.controller.d.ts

@@ -5,17 +5,19 @@ import { IBoardSidePanelService } from '@univerjs-pro/boards-ui';
 import { Disposable, LocaleService } from '@univerjs/core';
 import { BoardChartEditSessionService } from '../services/board-chart-edit-session.service';
 import { BoardChartRenderService } from '../services/board-chart-render.service';
+import { IBoardChartUIService } from '../services/board-chart-ui.service';
 export declare class BoardChartPanelController extends Disposable implements IRenderModule {
     private readonly _renderContext;
     private readonly _editSessionService;
     private readonly _sidePanelService;
     private readonly _modelService;
     private readonly _renderService;
+    private readonly _chartUIService;
     private readonly _localeService;
     private _activePanelKey;
     private _activePanelDisposable;
     private _activeEditOverlay;
-    constructor(_renderContext: IRenderContext<UnitModel>, _editSessionService: BoardChartEditSessionService, _sidePanelService: IBoardSidePanelService, _modelService: BoardChartModelService, _renderService: BoardChartRenderService, _localeService: LocaleService);
+    constructor(_renderContext: IRenderContext<UnitModel>, _editSessionService: BoardChartEditSessionService, _sidePanelService: IBoardSidePanelService, _modelService: BoardChartModelService, _renderService: BoardChartRenderService, _chartUIService: IBoardChartUIService, _localeService: LocaleService);
     dispose(): void;
     private _syncPanel;
     private _closeActivePanel;

package/lib/types/index.d.ts

@@ -6,7 +6,6 @@ export { BoardChartOpenEditController } from './controllers/board-chart-open-edi
 export { BoardChartPanelController } from './controllers/board-chart-panel.controller';
 export { BoardChartSelectionController } from './controllers/board-chart-selection.controller';
 export { BoardChartSnapshotRefreshController } from './controllers/board-chart-snapshot-refresh.controller';
-export { useBoardChartConfigState } from './hooks';
 export { BOARDS_CHART_UI_PLUGIN_NAME, enableChartTool, UniverBoardsChartUIPlugin } from './plugin';
 export { BoardChartRenderAdapter } from './render-adapters/board-chart-render-adapter';
 export { BoardChartClipboardAdapter } from './services/board-chart-clipboard-adapter';
@@ -14,10 +13,9 @@ export { BoardChartDataEditService } from './services/board-chart-data-edit.serv
 export type { IBoardChartDataEditState, IBoardChartUpdateDataOptions } from './services/board-chart-data-edit.service';
 export { BoardChartEditSessionService } from './services/board-chart-edit-session.service';
 export type { BoardChartEditSessionCloseReason, BoardChartEditSessionSource, IBoardChartEditSession, IBoardChartEditSessionOpenParams, } from './services/board-chart-edit-session.service';
-export { BoardDomChartHost, BoardImageChartHost } from './services/board-chart-host';
-export { BoardChartRenderService, IBoardChartRenderModelService } from './services/board-chart-render.service';
+export { BoardDomChartHost } from './services/board-chart-host';
+export { BoardChartRenderService } from './services/board-chart-render.service';
 export type { IBoardChartRenderInput, IBoardChartRenderSpecResult, } from './services/board-chart-render.service';
 export { BOARD_CHART_SNAPSHOT_BORDER_WIDTH, BoardChartSnapshotRenderService, IBoardChartSnapshotRendererService, resolveBoardChartSnapshotStyle, } from './services/board-chart-snapshot-render.service';
-export type { IBoardChartInvalidation, IBoardChartInvalidationOptions, IBoardChartSnapshotEntry, IBoardChartSnapshotRenderer, IBoardChartSnapshotRequest, } from './services/board-chart-snapshot-render.service';
+export type { IBoardChartSnapshotRequest, } from './services/board-chart-snapshot-render.service';
 export { BoardChartUIService, IBoardChartUIService } from './services/board-chart-ui.service';
-export type { BoardChartConfigStateKey, BoardChartConfigStateValue, IBoardChartConfigState, IBoardChartConfigStateMap, IBoardChartOption, InferBoardChartConfigStateValue, } from './services/board-chart-ui.service';

package/lib/types/locale/en-US.d.ts

@@ -1,240 +1,37 @@
 declare const locale: {
     'boards-chart-ui': {
-        editChart: string;
-        deleteChart: string;
-        setupChart: string;
-        customizeChart: string;
-        data: string;
-        editData: string;
-        insertChartFailed: string;
-        insert: string;
-        chartType: string;
-        themes: string;
-        gradientFill: string;
-        stack: string;
-        category: string;
-        series: string;
-        addSeries: string;
-        removeSeries: string;
-        switchRowColumn: string;
-        waterfall: string;
-        useSubtotal: string;
-        chartStyle: string;
-        chartAndAxisTitles: string;
-        legend: string;
-        horizontalAxis: string;
-        verticalAxis: string;
-        rightVerticalAxis: string;
-        gridlinesAndTicks: string;
-        indicatorLine: string;
-        trendline: string;
-        paretoBarSeries: string;
-        paretoLineSeries: string;
-        pie: string;
-        wordCloud: string;
-        radar: string;
-        funnel: string;
-        heatmap: string;
-        relation: string;
-        lineAndArea: string;
-        bubbleData: string;
-        waterfallStack: string;
-        field: {
-            label: string;
-            xAxis: string;
-            yAxis: string;
-            size: string;
-            position: string;
-            labelFormat: string;
-            labelRotate: string;
-            min: string;
-            max: string;
-            numberFormat: string;
-            gridlineColor: string;
-            gridlineWidth: string;
-            tickPosition: string;
-            tickLength: string;
-            tickWidth: string;
-            tickColor: string;
-            seriesType: string;
-            fill: string;
-            fillOpacity: string;
-            border: string;
-            borderWidth: string;
-            borderDash: string;
-            borderOpacity: string;
-            pointShape: string;
-            pointSize: string;
-            pointColor: string;
-            dataPoint: string;
-            selectDataPoint: string;
-            pointFill: string;
-            pointOpacity: string;
-            dataNodeShape: string;
-            layout: string;
-            repulsion: string;
-            gravity: string;
-            edgeLength: string;
-            displayName: string;
-            type: string;
-            order: string;
-            period: string;
-            lineColor: string;
-            lineOpacity: string;
-            lineType: string;
-            lineWidth: string;
-            formulaColor: string;
-            r2Color: string;
-            textSize: string;
-            titleSize: string;
-            title: string;
-            titleText: string;
-            titlePosition: string;
-            titleAlign: string;
-            titleFormat: string;
-            legendText: string;
-            doughnutHole: string;
-            valueScale: string;
-            fixedDigits: string;
-            valueSuffix: string;
-            shape: string;
-            maskImageId: string;
-            gap: string;
-            visualMap: string;
-            areaLine: string;
-            invalidValues: string;
-            selectMode: string;
-            legendLabelFormat: string;
-            axis: string;
-            line: string;
-            labelBackground: string;
-            labelText: string;
-        };
-        control: {
-            dataLabels: string;
-            showLabels: string;
-            reverseAxis: string;
-            showAxisLine: string;
-            useDateAxis: string;
-            majorGridlines: string;
-            majorTicks: string;
-            useRightVerticalAxis: string;
-            useValueAsSymbolSize: string;
-            emphasisOnHover: string;
-            rotateLabels: string;
-            showFormula: string;
-            showR2: string;
-            padAngle: string;
-            halfPie: string;
-            rosePie: string;
-            showLabelLine: string;
-            repeatWords: string;
-            fill: string;
-            useAbsoluteValues: string;
-        };
-        content: {
-            trendlineIndex: string;
-            trendlineUnavailable: string;
-            positive: string;
-            negative: string;
-            subtotal: string;
-        };
-        option: {
-            default: string;
-            none: string;
-            stacked: string;
-            percentStacked: string;
-            top: string;
-            right: string;
-            bottom: string;
-            left: string;
-            arrangement: string;
-            solid: string;
-            dashed: string;
-            dotted: string;
-            circle: string;
-            square: string;
-            triangle: string;
-            diamond: string;
-            rectangle: string;
-            roundRectangle: string;
-            pin: string;
-            arrow: string;
-            emptyCircle: string;
-            emptySquare: string;
-            emptyTriangle: string;
-            emptyDiamond: string;
-            emptyRectangle: string;
-            emptyRoundRectangle: string;
-            emptyPin: string;
-            emptyArrow: string;
-            auto: string;
-            inside: string;
-            outside: string;
-            value: string;
-            percentage: string;
-            chartTitle: string;
-            subtitle: string;
-            horizontalAxisTitle: string;
-            verticalAxisTitle: string;
-            rightVerticalAxisTitle: string;
-            start: string;
-            center: string;
-            end: string;
-            single: string;
-            multiple: string;
-            disabled: string;
-            continuous: string;
-            piecewise: string;
-            line: string;
-            smooth: string;
-            step: string;
-            polygon: string;
-            showAsGaps: string;
-            showAsZero: string;
-            connectDataPoints: string;
-            circular: string;
-            force: string;
-            column: string;
-            area: string;
-            linear: string;
-            exponential: string;
-            logarithmic: string;
-            power: string;
-            movingAverage: string;
-            polynomial: string;
-            allSeries: string;
-            cloud: string;
-            rect: string;
-            cardioid: string;
-            heart: string;
-            triangleForward: string;
-            pentagon: string;
-            star: string;
-        };
         dataEditor: {
             unavailable: string;
-            tableEmpty: string;
             updateFailed: string;
-            candlestickColumnsError: string;
+        };
+        common: {
+            editChart: string;
+            deleteChart: string;
+            editData: string;
+            insertChartFailed: string;
+            data: string;
             cancel: string;
+            insert: string;
+            setup: string;
+            customize: string;
+            switchRowColumn: string;
             duplicate: string;
             apply: string;
-        };
-        candlestick: {
+            chartAndAxisTitles: string;
+            chartStyle: string;
+            heatmap: string;
+            horizontalAxis: string;
+            legend: string;
+            rightVerticalAxis: string;
+            series: string;
+            trendline: string;
+            verticalAxis: string;
+            tableDataEmpty: string;
             category: string;
-            open: string;
-            high: string;
-            low: string;
-            close: string;
-        };
-        histogram: {
-            value: string;
-            frequency: string;
-        };
-        treemap: {
-            hierarchy: string;
+            label: string;
             value: string;
+            valueField: string;
+            chartType: string;
         };
         chartTypes: {
             line: string;
@@ -246,6 +43,8 @@ declare const locale: {
             barPercentStacked: string;
             pie: string;
             donut: string;
+            pieOfPie: string;
+            barOfPie: string;
             area: string;
             areaStacked: string;
             areaPercentStacked: string;
@@ -264,10 +63,77 @@ declare const locale: {
             candlestick: string;
             histogram: string;
             treemap: string;
+            sunburst: string;
+            gauge: string;
+            chord: string;
         };
-        treemapTooltip: {
+        section: {
+            candlestick: string;
+            chord: string;
+            funnel: string;
+            gauge: string;
+            gridlinesAndTicks: string;
+            histogram: string;
+            indicatorLine: string;
+            lineAndArea: string;
+            paretoBar: string;
+            paretoLine: string;
+            pie: string;
+            radar: string;
+            relation: string;
+            sunburst: string;
+            treemap: string;
+            waterfall: string;
+            wordCloud: string;
+        };
+        candlestick: {
+            columnsError: string;
+            close: string;
+            high: string;
+            low: string;
+            open: string;
+            series: string;
+        };
+        chord: {
+            source: string;
+            target: string;
+            emptyDiagnostic: string;
+            mappingDiagnostic: string;
+            configDiagnostic: string;
+            count: string;
+            associatedValue: string;
+        };
+        sunburst: {
+            hierarchy: string;
             ownValue: string;
             children: string;
+            diagnostic: string;
+        };
+        histogram: {
+            frequency: string;
+        };
+        pie: {
+            aggregateOther: string;
+            aggregateMembers: string;
+        };
+        treemap: {
+            hierarchy: string;
+            ownValue: string;
+            children: string;
+            diagnostic: string;
+        };
+        gauge: {
+            emptyDiagnostic: string;
+            mappingDiagnostic: string;
+            configDiagnostic: string;
+        };
+        chartField: {
+            missingCategoryFields: string;
+            missingSeriesFields: string;
+            invalidFieldIndex: string;
+            invalidValueFieldType: string;
+            invalidDataStructure: string;
+            unsupportedChartType: string;
         };
     };
 };

package/lib/types/services/board-chart-clipboard-adapter.d.ts

@@ -1,11 +1,11 @@
 import type { IBoardPageElement } from '@univerjs-pro/boards';
-import type { IBoardChartInlineDataSource, IBoardChartSnapshot } from '@univerjs-pro/boards-chart';
 import type { IBoardClipboardPreparedResourcePaste, IBoardClipboardResourceAdapter } from '@univerjs-pro/boards-ui';
+import type { IStaticChartInlineDataSource, IStaticChartSnapshot } from '@univerjs-pro/engine-chart';
 import { BoardChartResourceService } from '@univerjs-pro/boards-chart';
 export declare const BOARD_CHART_CLIPBOARD_RESOURCE_KEY = "board-chart";
 interface IBoardChartClipboardPayload {
-    charts: Record<string, IBoardChartSnapshot>;
-    dataSources: Record<string, IBoardChartInlineDataSource>;
+    charts: Record<string, IStaticChartSnapshot>;
+    dataSources: Record<string, IStaticChartInlineDataSource>;
     chartIdByElementId: Record<string, string>;
 }
 export declare class BoardChartClipboardAdapter implements IBoardClipboardResourceAdapter {

package/lib/types/services/board-chart-data-edit.service.d.ts

@@ -1,11 +1,10 @@
-import type { BoardChartCellValue, IBoardChartInlineDataSource } from '@univerjs-pro/boards-chart';
-import type { ChartTypeBits } from '@univerjs-pro/engine-chart';
+import type { ChartTypeBits, InlineChartCellValue, IStaticChartInlineDataSource } from '@univerjs-pro/engine-chart';
 import { BoardChartModelService, BoardChartResourceService } from '@univerjs-pro/boards-chart';
 import { Disposable, ICommandService } from '@univerjs/core';
 export interface IBoardChartDataEditState {
     chartId: string;
     chartType: ChartTypeBits;
-    dataSource: IBoardChartInlineDataSource;
+    dataSource: IStaticChartInlineDataSource;
     sharingCount: number;
     unitId: string;
 }
@@ -14,7 +13,7 @@ export interface IBoardChartUpdateDataOptions {
     name?: string;
     unitId: string;
     updateShared?: boolean;
-    values: BoardChartCellValue[][];
+    values: InlineChartCellValue[][];
 }
 export declare class BoardChartDataEditService extends Disposable {
     private readonly _resourceService;

package/lib/types/services/board-chart-edit-session.service.d.ts

@@ -1,3 +1,4 @@
+import type { IChartEditPanelRoute } from '@univerjs-pro/chart-ui';
 import { IBoardElementService } from '@univerjs-pro/boards';
 import { IBoardElementStateService } from '@univerjs-pro/boards-ui';
 import { Disposable } from '@univerjs/core';
@@ -7,6 +8,7 @@ export interface IBoardChartEditSession {
     source: BoardChartEditSessionSource;
     subUnitId: string;
     unitId: string;
+    route?: IChartEditPanelRoute;
 }
 export type BoardChartEditSessionSource = 'doubleClick' | 'programmatic' | 'quickToolbar';
 export type BoardChartEditSessionCloseReason = 'dispose' | 'elementRemoved' | 'manual' | 'pageChange' | 'selectionChange' | 'transformStart';
@@ -16,6 +18,7 @@ export interface IBoardChartEditSessionOpenParams {
     source: BoardChartEditSessionSource;
     subUnitId: string;
     unitId: string;
+    route?: IChartEditPanelRoute;
 }
 export declare class BoardChartEditSessionService extends Disposable {
     private readonly _elementStateService;

package/lib/types/services/board-chart-host.d.ts

@@ -1,18 +1,6 @@
-import type { ChartImageSource, IChartHostRect, IChartHostStyle, IDomChartHost } from '@univerjs-pro/engine-chart';
-import { ChartHostRenderMode, ImageChartHost } from '@univerjs-pro/engine-chart';
+import type { IChartHostRect, IChartHostStyle, IDomChartHost } from '@univerjs-pro/engine-chart';
+import { ChartHostRenderMode } from '@univerjs-pro/engine-chart';
 import { Disposable } from '@univerjs/core';
-export declare class BoardImageChartHost extends ImageChartHost {
-    private readonly _rect;
-    private _dataUrl;
-    constructor(chartId: string, _rect: IChartHostRect);
-    getRect(): IChartHostRect;
-    setStyle(_style: IChartHostStyle): void;
-    nextVersion(): number;
-    commitSnapshot(image: ChartImageSource, _version: number): boolean;
-    requestPaint(): void;
-    invalidateSnapshot(): void;
-    getDataUrl(): string | undefined;
-}
 export declare class BoardDomChartHost extends Disposable implements IDomChartHost {
     readonly chartId: string;
     private readonly _host;

package/lib/types/services/board-chart-render.service.d.ts

@@ -1,12 +1,11 @@
-import type { IBoardChartRuntimeModel } from '@univerjs-pro/boards-chart';
-import type { ChartElementEventHandler, ChartElementEventType, ChartHostRenderMode, ChartStyle, IChartConfig, IChartHostRect, IChartInstance, IChartRenderInstance, IChartRenderModel } from '@univerjs-pro/engine-chart';
+import type { ChartElementEventHandler, ChartElementEventType, ChartHostRenderMode, ChartRuntimeStyle, ChartStyle, IChartConfig, IChartHostRect, IChartInstance, IChartRenderInstance, IStaticChartModelRuntime } from '@univerjs-pro/engine-chart';
 import type { IDisposable } from '@univerjs/core';
 import { ChartThemeService, IChartRenderModelManagerService } from '@univerjs-pro/engine-chart';
 import { Disposable, LocaleService } from '@univerjs/core';
 export interface IBoardChartRenderSpecResult {
     spec: Record<string, unknown>;
     chartConfig: IChartConfig;
-    chartStyle: ChartStyle;
+    chartStyle: ChartRuntimeStyle;
     hostStyle: {
         fill?: string;
         stroke?: string;
@@ -19,29 +18,25 @@ export interface IBoardChartRenderSpecResult {
 }
 export interface IBoardChartRenderInput {
     chartConfig: IChartConfig;
-    chartStyle: ChartStyle;
+    chartStyle: ChartRuntimeStyle;
 }
-export declare const IBoardChartRenderModelService: import("@wendellhu/redi").IdentifierDecorator<IChartRenderModel<Record<string, any>>>;
 export declare class BoardChartRenderService extends Disposable {
     private readonly _localeService;
     private readonly _chartThemeService;
+    private readonly _renderModelManager;
     private readonly _chartInstanceMap;
     private readonly _chartElementEditMode;
     private readonly _chartEventHandlers;
     private readonly _chartEventSubscriptions;
-    private readonly _renderModelManager;
-    constructor(_localeService: LocaleService, _chartThemeService: ChartThemeService, renderModelManager: IChartRenderModelManagerService, renderModel?: IChartRenderModel);
-    registerRenderModel(name: string, renderModel: IChartRenderModel): void;
-    setRenderModel(name: string): void;
-    getRenderModel(name?: string): IChartRenderModel | undefined;
+    constructor(_localeService: LocaleService, _chartThemeService: ChartThemeService, _renderModelManager: IChartRenderModelManagerService);
     createChartInstance(): IChartInstance;
     createChartInstance(mode: ChartHostRenderMode): IChartRenderInstance;
     registerChartInstance(unitId: string, chartId: string, chartInstance: IChartRenderInstance): IDisposable;
     setElementEditMode(unitId: string, chartId: string, enabled: boolean): void;
     isElementEditModeActive(unitId: string, chartId: string): boolean;
     on(unitId: string, chartId: string, type: ChartElementEventType, handler: ChartElementEventHandler): IDisposable;
-    createRenderInput(runtime: IBoardChartRuntimeModel): IBoardChartRenderInput;
-    createRenderSpec(runtime: IBoardChartRuntimeModel, rect: IChartHostRect, chartInstance?: IChartInstance): IBoardChartRenderSpecResult;
+    createRenderInput(runtime: IStaticChartModelRuntime): IBoardChartRenderInput;
+    createRenderSpec(runtime: IStaticChartModelRuntime, rect: IChartHostRect, chartInstance?: IChartInstance): IBoardChartRenderSpecResult;
     getHostStyle(chartStyle: ChartStyle): IBoardChartRenderSpecResult['hostStyle'];
     applyHostStyle(host: HTMLElement, hostStyle: IBoardChartRenderSpecResult['hostStyle']): void;
     private _createChartRenderInstanceContext;

package/lib/types/services/board-chart-snapshot-render.service.d.ts

@@ -1,59 +1,15 @@
-import type { IBoardChartRuntimeModel } from '@univerjs-pro/boards-chart';
-import type { ChartStyle } from '@univerjs-pro/engine-chart';
+import type { IChartSnapshotRenderer, IChartSnapshotRequest } from '@univerjs-pro/chart-ui';
+import type { ChartRuntimeStyle, IStaticChartModelRuntime } from '@univerjs-pro/engine-chart';
 import { BoardChartModelService } from '@univerjs-pro/boards-chart';
-import { Disposable, LocaleService } from '@univerjs/core';
-import { Subject } from 'rxjs';
+import { ChartSnapshotQueue } from '@univerjs-pro/chart-ui';
+import { LocaleService } from '@univerjs/core';
 import { BoardChartRenderService } from './board-chart-render.service';
-export interface IBoardChartSnapshotRequest {
-    unitId: string;
-    chartId: string;
-    width: number;
-    height: number;
-    dpr?: number;
+export interface IBoardChartSnapshotRequest extends IChartSnapshotRequest {
     mode?: 'main' | 'thumbnail';
 }
-export interface IBoardChartSnapshotEntry {
-    key: string;
-    status: 'pending' | 'ready' | 'error';
-    dataUrl?: string;
-    error?: unknown;
-}
-export interface IBoardChartInvalidation {
-    unitId: string;
-    chartId: string;
-}
-export interface IBoardChartInvalidationOptions {
-    waitForConfig?: boolean;
-}
-export interface IBoardChartSnapshotRenderer {
-    render(request: IBoardChartSnapshotRequest, runtime: IBoardChartRuntimeModel): Promise<string>;
-}
-export declare const IBoardChartSnapshotRendererService: import("@wendellhu/redi").IdentifierDecorator<IBoardChartSnapshotRenderer>;
+export declare const IBoardChartSnapshotRendererService: import("@wendellhu/redi").IdentifierDecorator<IChartSnapshotRenderer<IBoardChartSnapshotRequest, IStaticChartModelRuntime>>;
 export declare const BOARD_CHART_SNAPSHOT_BORDER_WIDTH = 0;
-export declare function resolveBoardChartSnapshotStyle(chartStyle: ChartStyle): ChartStyle;
-export declare class BoardChartSnapshotRenderService extends Disposable {
-    private readonly _localeService;
-    private readonly _modelService;
-    readonly snapshotUpdated$: Subject<IBoardChartSnapshotEntry>;
-    readonly chartInvalidated$: Subject<IBoardChartInvalidation>;
-    private readonly _cache;
-    private readonly _queue;
-    private readonly _configWaitKeys;
-    private readonly _renderer;
-    private _rendering;
-    private _activeDrain;
-    constructor(_localeService: LocaleService, _modelService: BoardChartModelService, renderService: BoardChartRenderService, renderer?: IBoardChartSnapshotRenderer);
-    requestSnapshot(request: IBoardChartSnapshotRequest): IBoardChartSnapshotEntry;
-    getSnapshot(request: IBoardChartSnapshotRequest): IBoardChartSnapshotEntry | undefined;
-    invalidateChart(unitId: string, chartId: string, options?: IBoardChartInvalidationOptions): void;
-    getCacheKey(request: IBoardChartSnapshotRequest): string;
-    flushForTests(): Promise<void>;
-    dispose(): void;
-    private _drainQueue;
-    private _invalidateSnapshotsForDirectionChange;
-    private _runQueue;
-    private _renderOne;
-    private _waitForRuntimeConfig;
-    private _getChartKey;
-    private _getRuntimeModel;
+export declare function resolveBoardChartSnapshotStyle(chartStyle: ChartRuntimeStyle): ChartRuntimeStyle;
+export declare class BoardChartSnapshotRenderService extends ChartSnapshotQueue<IBoardChartSnapshotRequest> {
+    constructor(localeService: LocaleService, modelService: BoardChartModelService, renderService: BoardChartRenderService, renderer?: IChartSnapshotRenderer<IBoardChartSnapshotRequest>);
 }