@univerjs-pro/sheets-chart-ui 1.0.0-alpha.8 → 1.0.0-beta.1

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

@@ -3,356 +3,54 @@ declare const locale: {
         permission: {
             editErr: string;
         };
-        insertChart: string;
-        editChart: string;
-        openChartPanel: string;
-        deleteChart: string;
-        exportImage: string;
-        copy: string;
-        hideChartPanel: string;
-        setupChart: string;
-        customChart: string;
-        default: string;
-        reset: string;
-        chartType: string;
-        themes: string;
-        dataRange: string;
-        stack: string;
-        category: string;
-        aggregate: string;
-        allSeries: string;
-        series: string;
-        addSeries: string;
-        moreSettings: string;
-        min: string;
-        max: string;
-        invalidType: {
-            gaps: string;
-            zero: string;
-            connectDataPointsWithStraightLines: string;
-        };
-        blank: string;
-        seriesBlock: {
-            format: string;
-            dataPointStyle: string;
-        };
-        backgroundColor: string;
-        chartBorderColor: string;
-        titles: {
-            title: string;
-            mainTitle: string;
-            subTitle: string;
-            xAxisTitle: string;
-            yAxisTitle: string;
-            rightYAxisTitle: string;
-            titleFormat: string;
-            titleText: string;
-            titlePosition: string;
-            titleAlign: string;
-        };
-        axisPositionType: {
-            start: string;
-            center: string;
-            end: string;
-        };
-        gradientFill: string;
-        settingsLabels: {
-            switchToRowOrColumn: string;
+        common: {
+            setup: string;
+            customize: string;
+            editChart: string;
             useAsCategoryLabels: string;
-            showEmptyCellsAs: string;
-        };
-        positionType: {
-            auto: string;
-            inside: string;
-            outside: string;
-            top: string;
-            bottom: string;
-            left: string;
-            right: string;
-            hide: string;
-        };
-        align: {
-            left: string;
-            center: string;
-            right: string;
-        };
-        alignY: {
-            top: string;
-            middle: string;
-            bottom: string;
-        };
-        chartStyle: string;
-        chartAndAxisTitles: string;
-        legend: string;
-        legendSelectMode: string;
-        legendSelectModeType: {
-            single: string;
-            multiple: string;
-            close: string;
-        };
-        legendVisualMapType: {
-            continuous: string;
-            piecewise: string;
-        };
-        axes: {
-            axis: string;
-            axisOptions: string;
+            switchRowColumn: string;
+            dataRange: string;
+            insertChart: string;
+            openChartPanel: string;
+            deleteChart: string;
+            hideChartPanel: string;
+            chartAndAxisTitles: string;
+            chartStyle: string;
+            heatmap: string;
             horizontalAxis: string;
-            verticalAxis: string;
+            legend: string;
             rightVerticalAxis: string;
-            leftAxis: string;
-            rightAxis: string;
-            useRightAxis: string;
-        };
-        position: string;
-        dataLabels: string;
-        gridlinesAndTicks: string;
-        indicatorLine: string;
-        indicatorLineType: string;
-        indicatorLineColor: string;
-        indicatorLabel: string;
-        indicatorValue: string;
-        shape: {
-            polygon: string;
-            circle: string;
-            square: string;
-            triangle: string;
-            diamond: string;
-            rect: string;
-            roundRect: string;
-            pin: string;
-            arrow: string;
-            none: string;
-            emptyCircle: string;
-            emptySquare: string;
-            emptyTriangle: string;
-            emptyDiamond: string;
-            emptyRect: string;
-            emptyRoundRect: string;
-            emptyPin: string;
-            emptyArrow: string;
-        };
-        border: string;
-        value: string;
-        fill: string;
-        line: string;
-        withOpacity: string;
-        withColor: string;
-        withThickness: string;
-        withType: string;
-        withSize: string;
-        withShape: string;
-        withFormat: string;
-        dataPoint: string;
-        dataNodeShape: string;
-        addDataPoint: string;
-        point: string;
-        percentage: string;
-        lineType: {
-            line: string;
-            smooth: string;
-            step: string;
-        };
-        stackType: {
-            stack: string;
-            percent: string;
-        };
-        lineDashType: string;
-        dashType: {
-            solid: string;
-            dash: string;
-            dot: string;
-        };
-        color: string;
-        gridlines: {
-            majorGridlines: string;
-            text: string;
-        };
-        ticks: {
-            majorTick: string;
-            tickPosition: string;
-            tickLength: string;
-        };
-        none: string;
-        theIndexItem: string;
-        seriesDefaultName: string;
-        categoryDefaultName: string;
-        styleEditPanel: {
-            showLabels: string;
-            showDataLabels: string;
-            padAngle: string;
-            halfPie: string;
-            rosePie: string;
-            pieValScale: string;
-            pieValSuffix: string;
-            pieDigitalFixed: string;
-            showLabelLine: string;
-            reverseAxisOrder: string;
-            showAxisLine: string;
-            labelPosition: string;
-            labelText: string;
-            repeatWordCould: string;
-            gap: string;
-            useAbsValue: string;
-            labelRotate: string;
-            wordCloudShape: string;
-            useDateAxis: string;
-            dateAxisTips: string;
-        };
-        doughnutHole: string;
-        radar: {
-            fill: string;
-        };
-        msg: {
-            invalidSource: string;
-            emptyTips: string;
-            sankeyCircularTips: string;
-        };
-        cloud: {
-            title: string;
-            word: string;
-            frequency: string;
-        };
-        trendline: {
-            name: string;
-            displayName: string;
-            addTrendLine: string;
-            trendlineType: string;
-            trendlineName: string;
-            trendlineColor: string;
-            trendlineThickness: string;
-            trendlineDashType: string;
-            exp: string;
-            linear: string;
-            log: string;
-            pow: string;
-            movingAvg: string;
-            poly: string;
-            order: string;
-            period: string;
-            showFormula: string;
-            showR2: string;
-            formula: string;
-            r2: string;
-        };
-        bubble: {
-            xAxis: string;
-            yAxis: string;
-            size: string;
-            label: string;
-            emptyTips: string;
-        };
-        candlestick: {
+            series: string;
+            trendline: string;
+            verticalAxis: string;
             category: string;
-            open: string;
-            high: string;
-            low: string;
-            close: string;
-            mappingError: string;
-            rising: string;
-            falling: string;
-            doji: string;
-            bodyColor: string;
-            fillOpacity: string;
-            wickColor: string;
-            wickWidth: string;
-            wickOpacity: string;
-            hollow: string;
-            restoreDefault: string;
-            candleWidth: string;
-            auto: string;
-            state: string;
-        };
-        histogram: {
-            value: string;
-            binningMode: string;
-            auto: string;
-            count: string;
-            width: string;
-            binCount: string;
-            binWidth: string;
-            underflow: string;
-            overflow: string;
-            binGap: string;
-        };
-        treemap: {
-            hierarchy: string;
-            value: string;
-            addHierarchy: string;
-            parentLabelLayout: string;
-            banner: string;
-            overlapping: string;
-            none: string;
-            leafLabel: string;
-            categoryName: string;
-            labelContent: string;
-            labelFormat: string;
-            moveUp: string;
-            moveDown: string;
-            removeHierarchy: string;
-            diagnostic: string;
-        };
-        relation: {
-            title: string;
-            auto: string;
-            circular: string;
-            force: string;
-            useValueAsSymbolSize: string;
-            layoutType: string;
-            forceOptions: string;
-            repulsion: string;
-            gravity: string;
-            edgeLength: string;
-            rotateLabel: string;
-            emphasis: string;
-            emptyTips: string;
+            copy: string;
+            exportImage: string;
         };
         waterfall: {
-            stackType: string;
-            arrangement: string;
-            stacked: string;
+            subtotal: string;
             positive: string;
             negative: string;
-            subtotal: string;
-            showSubtotal: string;
-            positiveStyle: string;
-            negativeStyle: string;
-            subtotalStyle: string;
-            positiveLegendText: string;
-            negativeLegendText: string;
-            subtotalLegendText: string;
-        };
-        pareto: {
-            lineName: string;
-            lineSeries: string;
-            barSeries: string;
-        };
-        visualMapScope: string;
-        boxplot: {
-            min: string;
-            q1: string;
-            median: string;
-            q3: string;
-            max: string;
         };
         chartTypes: {
             line: string;
-            area: string;
-            areaStacked: string;
-            areaPercentStacked: string;
             column: string;
             bar: string;
             barStacked: string;
             barPercentStacked: string;
             pie: string;
             donut: string;
-            scatter: string;
+            pieOfPie: string;
+            barOfPie: string;
+            area: string;
+            areaStacked: string;
+            areaPercentStacked: string;
             radar: string;
-            bubble: string;
-            stock: string;
+            scatter: string;
             combination: string;
             wordCloud: string;
             funnel: string;
+            bubble: string;
             relation: string;
             waterfall: string;
             pareto: string;
@@ -362,29 +60,31 @@ declare const locale: {
             candlestick: string;
             histogram: string;
             treemap: string;
+            sunburst: string;
+            gauge: string;
+            chord: string;
+        };
+        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;
         };
-        dialog: {
-            numfmt: {
-                general: string;
-                accounting: string;
-                currency: string;
-                date: string;
-                thousandthPercentile: string;
-                fieldSetting: string;
-                formatTypes: string;
-                confirm: string;
-                cancel: string;
-                generalDesc: string;
-                accountingDesc: string;
-                currencyDesc: string;
-                dateDesc: string;
-                thousandthPercentileDesc: string;
-                decimalPlaces: string;
-                currencyTypes: string;
-                negativeNumberTypes: string;
-                dateTypes: string;
-            };
-            setFormat: string;
+        chord: {
+            target: string;
         };
     };
 };

package/lib/types/menu/chart-context-menu.d.ts

@@ -1,6 +1,5 @@
 import type { IAccessor } from '@univerjs/core';
 import type { IMenuButtonItem } from '@univerjs/ui';
-export declare const SHEETS_CHART_CONTEXT_MENU_POSITION = "SHEETS_CHART_CONTEXT_MENU";
 export declare function ChartEditContextMenuFactory(accessor: IAccessor): IMenuButtonItem;
 export declare function ChartCopyContextMenuFactory(accessor: IAccessor): IMenuButtonItem;
 export declare function ChartExportImageContextMenuFactory(accessor: IAccessor): IMenuButtonItem;

package/lib/types/services/chart-element-selection.d.ts

@@ -1,11 +1,9 @@
-import type { ChartElementConfigTarget } from '@univerjs-pro/chart-ui';
+import type { IChartElementSelection } from '@univerjs-pro/chart-ui';
 import type { ChartModel, IChartElementHit } from '@univerjs-pro/engine-chart';
-import type { IChartEditPanelRoute } from './chart-panel-route';
+import { resolveChartEditPanelRoute } from '@univerjs-pro/chart-ui';
 import { ChartTypeBits } from '@univerjs-pro/engine-chart';
-export interface ISheetsChartElementSelection {
-    target: ChartElementConfigTarget;
-    route: IChartEditPanelRoute;
-    showFloatMenu: boolean;
+export interface ISheetsChartElementSelection extends IChartElementSelection {
+    route: NonNullable<ReturnType<typeof resolveChartEditPanelRoute>>;
 }
 export declare function supportsSheetsChartElementFloatMenu(chartType: ChartTypeBits): boolean;
 export declare function resolveSheetsChartElementSelection(chartModel: ChartModel, hit: IChartElementHit): ISheetsChartElementSelection | undefined;

package/lib/types/services/chart-image-export-provider.d.ts

@@ -0,0 +1,15 @@
+import type { IChartImageExportProvider, IChartImageExportTarget } from '@univerjs-pro/chart-ui';
+import { ChartImageExportService } from '@univerjs-pro/chart-ui';
+import { Disposable } from '@univerjs/core';
+import { ChartRenderService } from './chart-render.service';
+interface ISheetChartImageExportTarget extends IChartImageExportTarget {
+    readonly unitId: string;
+    readonly subUnitId: string;
+}
+export declare class SheetChartImageExportProvider extends Disposable implements IChartImageExportProvider {
+    private readonly _renderService;
+    constructor(imageExportService: ChartImageExportService, _renderService: ChartRenderService);
+    supports(chart: IChartImageExportTarget): chart is ISheetChartImageExportTarget;
+    exportImage(chart: IChartImageExportTarget): Promise<string | undefined>;
+}
+export {};

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

@@ -1,4 +1,4 @@
-import type { ChartDirection, ChartElementEventHandler, ChartElementEventType, ChartImageSource, ChartStyle, IChartConfig, IChartRenderModel } from '@univerjs-pro/engine-chart';
+import type { ChartDirection, ChartElementEventHandler, ChartElementEventType, ChartImageSource, ChartRuntimeStyle, ChartStyle, IChartConfig } from '@univerjs-pro/engine-chart';
 import type { IDisposable } from '@univerjs/core';
 import type { Scene } from '@univerjs/engine-render';
 import { ChartThemeService, IChartRenderModelManagerService } from '@univerjs-pro/engine-chart';
@@ -9,13 +9,14 @@ import { IRenderManagerService } from '@univerjs/engine-render';
 import { SheetCanvasFloatDomManagerService } from '@univerjs/sheets-drawing-ui';
 import { ChartSnapshotStoreService } from './chart-snapshot-store.service';
 import { IChartHostProviderService } from './sheets-chart-host-provider.service';
+import { ISheetsChartUIService } from './sheets-chart-ui.service';
 interface IRuntimeChartModel {
     id?: string;
     chartType?: IChartConfig['type'];
     style: ChartStyle;
-    getRuntimeContext(direction?: ChartDirection): NonNullable<ChartStyle['runtime']>;
+    getRuntimeContext(direction?: ChartDirection): ChartRuntimeStyle['runtime'];
 }
-export declare function createRuntimeChartStyle(chartModel: IRuntimeChartModel, direction: ChartDirection): ChartStyle;
+export declare function createRuntimeChartStyle(chartModel: IRuntimeChartModel, direction: ChartDirection, addWatermark?: boolean): ChartRuntimeStyle;
 export declare class ChartRenderService extends Disposable {
     private _chartHostProvider;
     private readonly _sheetCanvasFloatDomManagerService;
@@ -24,26 +25,25 @@ export declare class ChartRenderService extends Disposable {
     private _univerInstanceService;
     private _renderManagerService;
     private readonly _localeService;
+    private readonly _chartUIService;
     protected readonly _injector: Injector;
     private readonly _chartThemeService;
     private readonly _themeService;
     private readonly _configService;
     private readonly _chartSnapshotStoreService;
+    private readonly _renderModelManager;
     private _chartInstanceMap;
     private _chartEventHandlers;
     private _chartEventSubscriptions;
     private _chartElementEditMode;
-    private readonly _renderModelManager;
     private _renderDebounceMap;
     private _debounceHandleMap;
     private readonly _chartRenderMode;
+    private readonly _addWatermark;
     private readonly _lastRenderInputMap;
     private _activeChartId;
     private _lastActiveSheet;
-    constructor(_chartHostProvider: IChartHostProviderService, _sheetCanvasFloatDomManagerService: SheetCanvasFloatDomManagerService, _chartModelService: ChartModelService, _drawingManagerService: IDrawingManagerService, _univerInstanceService: IUniverInstanceService, _renderManagerService: IRenderManagerService, _localeService: LocaleService, _injector: Injector, _chartThemeService: ChartThemeService, _themeService: ThemeService, _configService: IConfigService, _chartSnapshotStoreService: ChartSnapshotStoreService, renderModelManager: IChartRenderModelManagerService);
-    private _getWatermark;
-    registerRenderModel(name: string, renderModel: IChartRenderModel): void;
-    setRenderModel(name: string): void;
+    constructor(_chartHostProvider: IChartHostProviderService, _sheetCanvasFloatDomManagerService: SheetCanvasFloatDomManagerService, _chartModelService: ChartModelService, _drawingManagerService: IDrawingManagerService, _univerInstanceService: IUniverInstanceService, _renderManagerService: IRenderManagerService, _localeService: LocaleService, _chartUIService: ISheetsChartUIService, _injector: Injector, _chartThemeService: ChartThemeService, _themeService: ThemeService, _configService: IConfigService, _chartSnapshotStoreService: ChartSnapshotStoreService, _renderModelManager: IChartRenderModelManagerService);
     getChartSnapshotImage(id: string): ChartImageSource | undefined;
     private _resolveChartRenderMode;
     private _getChartSnapshotKey;
@@ -75,10 +75,10 @@ export declare class ChartRenderService extends Disposable {
     private _bindChartEventHandler;
     private _disposeChartEventSubscription;
     private _disposeChartEventSubscriptions;
-    getRenderModel(name: string): IChartRenderModel<Record<string, any>> | undefined;
+    createRuntimeChartStyle(chartModel: IRuntimeChartModel, direction: ChartDirection): ChartRuntimeStyle;
     checkChartCanRender(id: string): boolean;
     private _getChartRenderSkipReason;
-    render(id: string, config: IChartConfig, style: ChartStyle): Promise<void>;
+    render(id: string, config: IChartConfig, style: ChartRuntimeStyle): Promise<void>;
     /** Render static chart snapshots into the print scene so drawing z-order is preserved. */
     renderChartsForPrinting(unitId: string, subUnitId: string, scene: Scene): Promise<void>;
     private _createPrintingChartObject;

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

@@ -31,6 +31,7 @@ export declare class SheetChartHost extends Disposable implements IDomChartHost
     private _waiter;
     private _hostStyle;
     private _savedWrapperStyle;
+    private _drawingGeometry;
     constructor(chartId: string, _getFloatDomInfo: () => ReturnType<SheetCanvasFloatDomManagerService['getFloatDomInfo']>, _getPlacement: () => ISheetChartHostPlacement | null, _setHostStyle: (style: IChartHostStyle) => void, _isProviderDisposed: () => boolean, _markReady: () => void, _markNotReady: () => void);
     isManaged(): boolean;
     markUnmanaged(): void;
@@ -46,6 +47,8 @@ export declare class SheetChartHost extends Disposable implements IDomChartHost
     private _createHost;
     private _cancelHostWait;
     private _applyHostStyle;
+    private _syncLayoutOnDrawingTransform;
+    private _getDrawingGeometry;
     private _resolveLayout;
     private _frameStyle;
     private _activateHostWrapper;