@univerjs-pro/sheets-chart-ui 1.0.0-alpha.2 → 1.0.0-alpha.3

package/lib/types/services/chart-content-layout.d.ts

@@ -1,4 +1,3 @@
-export declare const CHART_CONTENT_PADDING = 8;
 export interface IChartOuterRect {
     width: number;
     height: number;
@@ -32,5 +31,5 @@ export interface IChartOffset {
 }
 export declare function getChartContentRect(rect: IChartOuterRect, minSize?: number): IChartOuterRect;
 export declare function getChartHostPlacement(rect: IChartOuterRect, scale?: IChartScale, floatDomLayout?: IChartFloatDomLayout): IChartHostPlacement;
-export declare function getChartCanvasContentOffset(rect: IChartOuterRect, scale: Required<IChartScale>): IChartOffset;
+export declare function getChartContentOffset(_scale?: IChartScale): IChartOffset;
 export declare function getChartFloatDomInnerOffset(layout?: IChartFloatDomLayout): IChartOffset;

package/lib/types/services/chart-element-popup-anchor.d.ts

@@ -0,0 +1,10 @@
+import type { IChartElementEvent } from '@univerjs-pro/engine-chart';
+import type { IDisposable } from '@univerjs/core';
+import type { IBoundRectNoAngle } from '@univerjs/engine-render';
+import type { Observable } from 'rxjs';
+export interface IChartElementPopupAnchorObserver extends IDisposable {
+    initialRect: IBoundRectNoAngle;
+    anchorRect$: Observable<IBoundRectNoAngle>;
+    visible: boolean;
+}
+export declare function createChartElementPopupAnchorObserver(event: IChartElementEvent, update$: Observable<unknown> | undefined, onHidden: () => void): IChartElementPopupAnchorObserver;

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

@@ -0,0 +1,9 @@
+import type { ChartElementConfigTarget } from '@univerjs-pro/chart-ui';
+import type { ChartModel, IChartElementHit } from '@univerjs-pro/engine-chart';
+import type { IChartEditPanelRoute } from './chart-panel-route';
+export interface ISheetsChartElementSelection {
+    target: ChartElementConfigTarget;
+    route: IChartEditPanelRoute;
+    showFloatMenu: boolean;
+}
+export declare function resolveSheetsChartElementSelection(chartModel: ChartModel, hit: IChartElementHit): ISheetsChartElementSelection | undefined;

package/lib/types/services/chart-image-rect.d.ts

@@ -4,11 +4,14 @@ import { Rect } from '@univerjs/engine-render';
 export declare class ChartImageRect extends Rect {
     private readonly _getImage;
     private readonly _shouldSuppressSnapshot;
+    private readonly _disposeImage;
     private _urlImage;
     private _url;
-    constructor(key: string, config: IRectProps, _getImage: () => ChartImageSource | undefined, _shouldSuppressSnapshot?: () => boolean);
+    constructor(key: string, config: IRectProps, _getImage: () => ChartImageSource | undefined, _shouldSuppressSnapshot?: () => boolean, _disposeImage?: () => void);
+    dispose(): void;
     render(mainCtx: UniverRenderingContext, bounds?: IViewportInfo): this;
     protected _draw(ctx: UniverRenderingContext, _bounds?: IViewportInfo, renderWidth?: number, renderHeight?: number): void;
+    private _drawChartFrame;
     isHit(coord: Vector2): boolean;
     private _drawChartImage;
     private _getDrawable;

package/lib/types/services/chart-panel-route.d.ts

@@ -0,0 +1,20 @@
+import type { ChartElementConfigTarget } from '@univerjs-pro/chart-ui';
+import type { IChartElementHit } from '@univerjs-pro/engine-chart';
+export interface IChartEditPanelRoute {
+    tab: 'style' | 'data';
+    section?: 'chartStyle' | 'chartAndAxisTitles' | 'legend' | 'horizontalAxis' | 'verticalAxis' | 'rightVerticalAxis' | 'series' | 'pieStyle' | 'paretoBarSeries' | 'paretoLineSeries' | 'waterfallSeries' | 'relation' | 'wordCloud';
+    titleKey?: 'title' | 'subtitle' | 'xAxisTitle' | 'yAxisTitle' | 'rightYAxisTitle';
+    axisId?: 'xAxis' | 'yAxis' | 'rightYAxis';
+    seriesId?: string;
+}
+export interface IChartSelectedElementState {
+    chartId: string;
+    element: IChartElementHit;
+    target: ChartElementConfigTarget;
+    route: IChartEditPanelRoute;
+}
+export interface IChartPanelRouteState {
+    chartId: string;
+    route: IChartEditPanelRoute | null;
+}
+export declare function resolveChartEditPanelRoute(target: ChartElementConfigTarget): IChartEditPanelRoute | undefined;

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

@@ -1,5 +1,7 @@
-import type { ChartDirection, ChartImageSource, ChartStyle, IChartConfig, IChartRenderModel } from '@univerjs-pro/engine-chart';
-import { ChartThemeService } from '@univerjs-pro/engine-chart';
+import type { ChartDirection, ChartElementEventHandler, ChartElementEventType, ChartImageSource, ChartStyle, IChartConfig, IChartRenderModel } 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';
 import { ChartModelService } from '@univerjs-pro/sheets-chart';
 import { Disposable, IConfigService, Injector, IUniverInstanceService, LocaleService, ThemeService } from '@univerjs/core';
 import { IDrawingManagerService } from '@univerjs/drawing';
@@ -27,16 +29,19 @@ export declare class ChartRenderService extends Disposable {
     private readonly _themeService;
     private readonly _configService;
     private readonly _chartSnapshotStoreService;
-    private _renderModelMap;
     private _chartInstanceMap;
-    private _currentModel;
+    private _chartEventHandlers;
+    private _chartEventSubscriptions;
+    private _chartElementEditMode;
+    private readonly _renderModelManager;
+    private readonly _ownsRenderModelManager;
     private _renderDebounceMap;
     private _debounceHandleMap;
     private readonly _chartRenderMode;
     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);
+    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;
@@ -63,16 +68,23 @@ export declare class ChartRenderService extends Disposable {
     }): void;
     private _debounceHandle;
     handleActiveSubUnitChange(): void;
+    setElementEditMode(chartId: string, enabled: boolean): void;
+    exportImage(chartId: string): Promise<string | undefined>;
+    on(chartId: string, type: ChartElementEventType, handler: ChartElementEventHandler): IDisposable;
+    private _getCurrentSnapshotImage;
+    private _bindChartEventHandlers;
+    private _bindChartEventHandler;
+    private _disposeChartEventSubscription;
+    private _disposeChartEventSubscriptions;
     getRenderModel(name: string): IChartRenderModel<Record<string, any>> | undefined;
     checkChartCanRender(id: string): boolean;
     private _getChartRenderSkipReason;
     render(id: string, config: IChartConfig, style: ChartStyle): 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;
     private _getOrCreateChartRenderInstance;
     private _createChartRenderInstanceContext;
-    printChart(id: string, chartHost: HTMLDivElement, rect: {
-        width: number;
-        height: number;
-    }): Promise<void>;
     private _cancelDebouncedCallbacks;
     dispose(): void;
 }

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

@@ -1,5 +1,6 @@
 import type { IChartHostRect, IChartHostStyle, IDomChartHost } from '@univerjs-pro/engine-chart';
 import type { SheetCanvasFloatDomManagerService } from '@univerjs/sheets-drawing-ui';
+import { ChartHostRenderMode } from '@univerjs-pro/engine-chart';
 import { Disposable } from '@univerjs/core';
 export interface IChartHostHandle {
     mountNode: HTMLElement;
@@ -24,12 +25,15 @@ export declare class SheetChartHost extends Disposable implements IDomChartHost
     private readonly _isProviderDisposed;
     private readonly _markReady;
     private readonly _markNotReady;
-    readonly mode: "dom";
+    readonly mode = ChartHostRenderMode.Dom;
+    private _frameNode;
     private _mountNode;
+    private _borderNode;
     private _managed;
     private _pendingToken;
     private _pendingHost;
     private _waiter;
+    private _hostStyle;
     private _savedWrapperStyle;
     constructor(chartId: string, _getFloatDomInfo: () => ReturnType<SheetCanvasFloatDomManagerService['getFloatDomInfo']>, _getPlacement: () => SheetChartHostPlacement | null, _setHostStyle: (style: IChartHostStyle) => void, _isProviderDisposed: () => boolean, _markReady: () => void, _markNotReady: () => void);
     isManaged(): boolean;
@@ -46,6 +50,7 @@ export declare class SheetChartHost extends Disposable implements IDomChartHost
     private _createHost;
     private _cancelHostWait;
     private _applyHostPlacement;
+    private _applyHostStyle;
     private _activateHostWrapper;
     private _restoreHostWrapper;
 }

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

@@ -1,5 +1,5 @@
 import type { ChartImageSource, IChartHostRect, IChartHostStyle } from '@univerjs-pro/engine-chart';
-import type { Rect } from '@univerjs/engine-render';
+import type { IChartOuterRect } from './chart-content-layout';
 import type { ChartSnapshotStoreService } from './chart-snapshot-store.service';
 import { ImageChartHost } from '@univerjs-pro/engine-chart';
 interface ChartSnapshotKey {
@@ -13,7 +13,7 @@ export declare class SheetImageChartHost extends ImageChartHost {
     private readonly _snapshotKey;
     private readonly _snapshotStore;
     private readonly _requestPaint;
-    constructor(chartId: string, _getOuterRect: () => Rect | null, _setHostStyle: (style: IChartHostStyle) => void, _snapshotKey: ChartSnapshotKey, _snapshotStore: ChartSnapshotStoreService, _requestPaint: () => void);
+    constructor(chartId: string, _getOuterRect: () => IChartOuterRect | null, _setHostStyle: (style: IChartHostStyle) => void, _snapshotKey: ChartSnapshotKey, _snapshotStore: ChartSnapshotStoreService, _requestPaint: () => void);
     getRect(): IChartHostRect | null;
     setStyle(style: IChartHostStyle): void;
     nextVersion(): number;

package/lib/types/services/sheets-chart-host-provider.service.d.ts

@@ -1,12 +1,12 @@
-import type { ChartHostRenderMode, IDomChartHost, IImageChartHost } from '@univerjs-pro/engine-chart';
-import type { Rect } from '@univerjs/engine-render';
+import type { IDomChartHost, IImageChartHost } from '@univerjs-pro/engine-chart';
 import type { Observable } from 'rxjs';
+import type { IChartOuterRect } from './chart-content-layout';
 import type { ChartHostHandle } from './sheet-chart-host';
+import { ChartHostRenderMode } from '@univerjs-pro/engine-chart';
 import { Disposable } from '@univerjs/core';
 import { IRenderManagerService } from '@univerjs/engine-render';
 import { SheetCanvasFloatDomManagerService } from '@univerjs/sheets-drawing-ui';
 import { ChartSnapshotStoreService } from './chart-snapshot-store.service';
-export { createHostElement } from './sheet-chart-host';
 export interface IChartHostProviderService {
     ensureHost(chartId: string, mode: 'image'): Promise<IImageChartHost | null>;
     ensureHost(chartId: string, mode: 'dom'): Promise<IDomChartHost | null>;
@@ -16,7 +16,7 @@ export interface IChartHostProviderService {
         dispose: () => void;
     }>;
     setHostStyle: (chartId: string, style: Record<string, any>) => void;
-    getHostSize: (chartId: string) => Rect | null;
+    getHostSize: (chartId: string) => IChartOuterRect | null;
     removeHost$: Observable<string>;
     removeHost: (chartId: string) => void;
     checkHost: (chartId: string) => boolean;
@@ -37,14 +37,14 @@ export declare class SheetsChartHostProviderService extends Disposable implement
     private _getSceneAndTransformerByDrawingSearch;
     setBorder(id: string, color: string): void;
     setHostStyle(id: string, style: Record<string, any>): void;
-    getHostSize(id: string): Rect | null;
+    getHostSize(id: string): IChartOuterRect | null;
     checkHost(id: string): boolean;
     syncHostLayout(id: string): void;
     removeHost(id: string): void;
     ensureHost(id: string): Promise<ChartHostHandle>;
-    ensureHost(id: string, mode: 'image'): Promise<IImageChartHost | null>;
-    ensureHost(id: string, mode: 'dom'): Promise<IDomChartHost | null>;
-    ensureHost(id: string, mode: ChartHostRenderMode): Promise<IImageChartHost | IDomChartHost | null>;
+    ensureHost(id: string, mode: ChartHostRenderMode.Image | 'image'): Promise<IImageChartHost | null>;
+    ensureHost(id: string, mode: ChartHostRenderMode.Dom | 'dom'): Promise<IDomChartHost | null>;
+    ensureHost(id: string, mode: ChartHostRenderMode | 'image' | 'dom'): Promise<IImageChartHost | IDomChartHost | null>;
     isDomReady(id: string): boolean;
     markHostNotReady(id: string): void;
     invalidateSnapshot(id: string): void;

package/lib/types/services/sheets-chart-ui.service.d.ts

@@ -1,12 +1,13 @@
 import type { AreaLineStyle, ChartModel, ChartStyle, DeepPartial, IAllSeriesStyle, IAxisOptions, IChartContext, IChartStyle, ILegendStyle, InvalidValueType, IPieLabelStyle, IRelationForceOptions, IRuntimeAxis, ITrendLine, LinePointShape, RadarShape, RelationChartLayoutEnum, RightYAxisOptions, TitlePositionEnum, WaterfallStackTypeEnum, WordCloudShapeEnum } from '@univerjs-pro/engine-chart';
-import type { IChartSourceMultiRangeItem, IChartUpdateConfigCommandParams, IChartUpdateSourceCommandParams, ISheetChartSourceSingleRange } from '@univerjs-pro/sheets-chart';
+import type { IChartSourceMultiRangeItem, IChartUpdateConfigCommandParams, IChartUpdateSourceCommandParams, ISheetChartSourceSingleRange, SheetChartModel } from '@univerjs-pro/sheets-chart';
 import type { Nullable } from '@univerjs/core';
 import type { Observable } from 'rxjs';
+import type { IChartEditPanelRoute, IChartPanelRouteState, IChartSelectedElementState } from './chart-panel-route';
 import { CategoryType, ChartTypeBits, DataOrientation } from '@univerjs-pro/engine-chart';
 import { ChartModelService, SheetsChartService } from '@univerjs-pro/sheets-chart';
 import { Disposable, ICommandService, IUniverInstanceService, LocaleService } from '@univerjs/core';
 import { IChartHostProviderService } from './sheets-chart-host-provider.service';
-export declare function registryChartConfigState(service: SheetsChartUIService): void;
+export declare function registryChartConfigState(service: ISheetsChartUIService): void;
 export interface IChartOptionType {
     label: string;
     value: string;
@@ -61,11 +62,11 @@ export interface IChartConfigStateMap {
     dataPointsOptions: IChartConfigState<Nullable<IChartOptionType[]>>;
     chartThemeColorType: IChartConfigState<Nullable<string>>;
     titlePosition: IChartConfigState<Nullable<TitlePositionEnum>, TitlePositionEnum>;
-    bubbleSizeSeriesId: IChartConfigState<Nullable<number>, number | undefined>;
-    bubbleXAxis: IChartConfigState<Nullable<number>, number>;
-    bubbleYAxis: IChartConfigState<Nullable<number>, number>;
-    bubbleLabel: IChartConfigState<Nullable<number>, number>;
-    bubbleSeries: IChartConfigState<Nullable<number>, number>;
+    bubbleSizeIndex: IChartConfigState<Nullable<number>, number | undefined>;
+    scatterXIndex: IChartConfigState<Nullable<number>, number>;
+    scatterYIndex: IChartConfigState<Nullable<number>, number>;
+    scatterLabelIndex: IChartConfigState<Nullable<number>, number>;
+    bubbleSeriesIndex: IChartConfigState<Nullable<number>, number>;
     relationLayout: IChartConfigState<Nullable<RelationChartLayoutEnum>, RelationChartLayoutEnum>;
     useValueAsSymbolSize: IChartConfigState<Nullable<boolean>, boolean>;
     forceOption: IChartConfigState<Nullable<IRelationForceOptions>, IRelationForceOptions | undefined>;
@@ -91,7 +92,32 @@ export type IChartConfigState<GetValue, SetValue = GetValue> = {
     set?(value: SetValue): void;
     get(): Observable<GetValue> | undefined;
 } | Observable<GetValue>;
-export declare class SheetsChartUIService extends Disposable {
+export interface ISheetsChartUIService {
+    readonly activeChartModel: Nullable<SheetChartModel>;
+    readonly activeChartModel$: Observable<Nullable<SheetChartModel>>;
+    readonly activeEditChart: string | null;
+    readonly activeEditChart$: Observable<string | null>;
+    readonly direction$: LocaleService['direction$'];
+    readonly panelRoute$: Observable<IChartPanelRouteState | null>;
+    readonly rangeSelectMode: boolean;
+    readonly selectedElement$: Observable<IChartSelectedElementState | null>;
+    setActiveEditChart(chartId: string | null): void;
+    setRangeSelectMode(on: boolean): void;
+    isElementEditModeActive(chartId: string): boolean;
+    setSelectedElement(state: IChartSelectedElementState | null): void;
+    setPanelRoute(chartId: string, route: IChartEditPanelRoute | null): void;
+    clearPanelRoute(): void;
+    getDataSource(id: string): ReturnType<SheetsChartService['getChartDataSource']>;
+    registerViewState<T extends ChartConfigStateKey = ChartConfigStateKey>(id: T, state: (chartModel: ChartModel) => IChartConfigStateMap[T]): void;
+    getViewState<V extends ChartConfigStateValue = ChartConfigStateValue>(id: ChartConfigStateKey, activeChartModel?: Nullable<SheetChartModel>): IChartConfigState<V> | undefined;
+    executeChartUpdateConfig(params: Omit<IChartUpdateConfigCommandParams, 'unitId'>): void;
+    executeChartUpdateSourceConfig(params: Omit<IChartUpdateSourceCommandParams, 'unitId'>): void;
+    removeViewState(id: ChartConfigStateKey): void;
+    setBorder(id: string, color: string): void;
+    t(...args: Parameters<LocaleService['t']>): string;
+}
+export declare const ISheetsChartUIService: import("@wendellhu/redi").IdentifierDecorator<ISheetsChartUIService>;
+export declare class SheetsChartUIService extends Disposable implements ISheetsChartUIService {
     private readonly _chartModelService;
     private readonly _sheetsChartService;
     private readonly _commandService;
@@ -100,14 +126,27 @@ export declare class SheetsChartUIService extends Disposable {
     private _univerInstanceService;
     private _viewState;
     private _rangeSelectMode;
+    private readonly _activeEditChart$;
+    private readonly _selectedElement$;
+    private readonly _panelRoute$;
+    readonly activeEditChart$: Observable<string | null>;
+    readonly selectedElement$: Observable<IChartSelectedElementState | null>;
+    readonly panelRoute$: Observable<IChartPanelRouteState | null>;
     constructor(_chartModelService: ChartModelService, _sheetsChartService: SheetsChartService, _commandService: ICommandService, _localeService: LocaleService, _chartHostProviderService: IChartHostProviderService, _univerInstanceService: IUniverInstanceService);
-    get activeChartModel(): Nullable<import("@univerjs-pro/sheets-chart").SheetChartModel>;
+    get activeChartModel(): Nullable<SheetChartModel>;
+    get activeChartModel$(): Observable<Nullable<SheetChartModel>>;
     get rangeSelectMode(): boolean;
+    get activeEditChart(): string | null;
     get direction$(): Observable<"ltr" | "rtl">;
-    set rangeSelectMode(on: boolean);
+    setRangeSelectMode(on: boolean): void;
+    setActiveEditChart(chartId: string | null): void;
+    isElementEditModeActive(chartId: string): boolean;
+    setSelectedElement(state: IChartSelectedElementState | null): void;
+    setPanelRoute(chartId: string, route: IChartEditPanelRoute | null): void;
+    clearPanelRoute(): void;
     getDataSource(id: string): import("@univerjs-pro/sheets-chart/models/types.js").ISheetChartDataSource | undefined;
     registerViewState<T extends ChartConfigStateKey = ChartConfigStateKey>(id: T, state: (chartModel: ChartModel) => IChartConfigStateMap[T]): void;
-    getViewState<V extends ChartConfigStateValue = ChartConfigStateValue>(id: ChartConfigStateKey): IChartConfigState<V> | undefined;
+    getViewState<V extends ChartConfigStateValue = ChartConfigStateValue>(id: ChartConfigStateKey, activeChartModel?: Nullable<SheetChartModel>): IChartConfigState<V> | undefined;
     executeChartUpdateConfig(params: Omit<IChartUpdateConfigCommandParams, 'unitId'>): void;
     executeChartUpdateSourceConfig(params: Omit<IChartUpdateSourceCommandParams, 'unitId'>): void;
     removeViewState(id: ChartConfigStateKey): void;

package/lib/types/views/chart-edit-panel/Options.d.ts

@@ -3,15 +3,13 @@ import type { LocaleKey } from '../../locale/types';
 import type { IChartOptionType } from '../../services/sheets-chart-ui.service';
 import { AreaLineStyle, AxisAlignEnum, ChartBorderDashType, ChartTrendlineType, InvalidValueType, LabelContentType, LegendPositionEnum, LinePointShape, PieLabelPosition, RadarShape, SelectModeEnum, SeriesLabelPosition, TextAlign, TextVerticalAlign, TitlePositionEnum, WaterfallStackTypeEnum } from '@univerjs-pro/engine-chart';
 export type OptionType = IChartOptionType;
-export declare const defaultOption: {
-    label: string;
-    value: string;
-};
+export interface ILocaleOption<T = string> {
+    label: LocaleKey;
+    value: T;
+}
+export declare const defaultOption: ILocaleOption<string>;
 export declare const chartTypeToIcon: Record<string, ReactNode>;
-export declare const seriesChartTypeOptions: {
-    label: "sheets-chart-ui.categoryDefaultName" | "sheets-chart-ui.seriesDefaultName" | "sheets-chart-ui.theIndexItem" | "sheets-chart-ui.none" | "sheets-chart-ui.line" | "sheets-chart-ui.stack" | "sheets-chart-ui.fill" | "sheets-chart-ui.value" | "sheets-chart-ui.default" | "sheets-chart-ui.category" | "sheets-chart-ui.series" | "sheets-chart-ui.color" | "sheets-chart-ui.min" | "sheets-chart-ui.max" | "sheets-chart-ui.border" | "sheets-chart-ui.point" | "sheets-chart-ui.chartType" | "sheets-chart-ui.legend" | "sheets-chart-ui.gradientFill" | "sheets-chart-ui.backgroundColor" | "sheets-chart-ui.position" | "sheets-chart-ui.reset" | "sheets-chart-ui.aggregate" | "sheets-chart-ui.doughnutHole" | "sheets-chart-ui.indicatorLineType" | "sheets-chart-ui.indicatorLineColor" | "sheets-chart-ui.blank" | "sheets-chart-ui.chartStyle" | "sheets-chart-ui.cloud.word" | "sheets-chart-ui.cloud.frequency" | "sheets-chart-ui.waterfall.positive" | "sheets-chart-ui.waterfall.negative" | "sheets-chart-ui.waterfall.subtotal" | "sheets-chart-ui.boxplot.min" | "sheets-chart-ui.boxplot.max" | "sheets-chart-ui.boxplot.q1" | "sheets-chart-ui.boxplot.median" | "sheets-chart-ui.boxplot.q3" | "sheets-chart-ui.bubble.emptyTips" | "sheets-chart-ui.relation.emptyTips" | "sheets-chart-ui.pareto.lineName" | "sheets-chart-ui.msg.emptyTips" | "sheets-chart-ui.msg.sankeyCircularTips" | "sheets-chart-ui.align.left" | "sheets-chart-ui.align.right" | "sheets-chart-ui.align.center" | "sheets-chart-ui.dataRange" | "sheets-chart-ui.insertChart" | "sheets-chart-ui.editChart" | "sheets-chart-ui.openChartPanel" | "sheets-chart-ui.deleteChart" | "sheets-chart-ui.hideChartPanel" | "sheets-chart-ui.setupChart" | "sheets-chart-ui.customChart" | "sheets-chart-ui.themes" | "sheets-chart-ui.allSeries" | "sheets-chart-ui.addSeries" | "sheets-chart-ui.moreSettings" | "sheets-chart-ui.chartBorderColor" | "sheets-chart-ui.chartAndAxisTitles" | "sheets-chart-ui.legendSelectMode" | "sheets-chart-ui.dataLabels" | "sheets-chart-ui.gridlinesAndTicks" | "sheets-chart-ui.indicatorLine" | "sheets-chart-ui.indicatorLabel" | "sheets-chart-ui.indicatorValue" | "sheets-chart-ui.withOpacity" | "sheets-chart-ui.withColor" | "sheets-chart-ui.withThickness" | "sheets-chart-ui.withType" | "sheets-chart-ui.withSize" | "sheets-chart-ui.withShape" | "sheets-chart-ui.withFormat" | "sheets-chart-ui.dataPoint" | "sheets-chart-ui.dataNodeShape" | "sheets-chart-ui.addDataPoint" | "sheets-chart-ui.percentage" | "sheets-chart-ui.lineDashType" | "sheets-chart-ui.visualMapScope" | "sheets-chart-ui.cloud.title" | "sheets-chart-ui.shape.polygon" | "sheets-chart-ui.shape.circle" | "sheets-chart-ui.shape.square" | "sheets-chart-ui.shape.triangle" | "sheets-chart-ui.shape.diamond" | "sheets-chart-ui.shape.rect" | "sheets-chart-ui.shape.roundRect" | "sheets-chart-ui.shape.pin" | "sheets-chart-ui.shape.arrow" | "sheets-chart-ui.shape.none" | "sheets-chart-ui.shape.emptyCircle" | "sheets-chart-ui.shape.emptySquare" | "sheets-chart-ui.shape.emptyTriangle" | "sheets-chart-ui.shape.emptyDiamond" | "sheets-chart-ui.shape.emptyRect" | "sheets-chart-ui.shape.emptyRoundRect" | "sheets-chart-ui.shape.emptyPin" | "sheets-chart-ui.shape.emptyArrow" | "sheets-chart-ui.waterfall.arrangement" | "sheets-chart-ui.waterfall.stacked" | "sheets-chart-ui.waterfall.stackType" | "sheets-chart-ui.waterfall.showSubtotal" | "sheets-chart-ui.waterfall.positiveStyle" | "sheets-chart-ui.waterfall.negativeStyle" | "sheets-chart-ui.waterfall.subtotalStyle" | "sheets-chart-ui.waterfall.positiveLegendText" | "sheets-chart-ui.waterfall.negativeLegendText" | "sheets-chart-ui.waterfall.subtotalLegendText" | "sheets-chart-ui.radar.fill" | "sheets-chart-ui.bubble.size" | "sheets-chart-ui.bubble.label" | "sheets-chart-ui.bubble.xAxis" | "sheets-chart-ui.bubble.yAxis" | "sheets-chart-ui.dialog.setFormat" | "sheets-chart-ui.dialog.numfmt.date" | "sheets-chart-ui.dialog.numfmt.currency" | "sheets-chart-ui.dialog.numfmt.cancel" | "sheets-chart-ui.dialog.numfmt.general" | "sheets-chart-ui.dialog.numfmt.confirm" | "sheets-chart-ui.dialog.numfmt.accounting" | "sheets-chart-ui.dialog.numfmt.thousandthPercentile" | "sheets-chart-ui.dialog.numfmt.fieldSetting" | "sheets-chart-ui.dialog.numfmt.formatTypes" | "sheets-chart-ui.dialog.numfmt.generalDesc" | "sheets-chart-ui.dialog.numfmt.accountingDesc" | "sheets-chart-ui.dialog.numfmt.currencyDesc" | "sheets-chart-ui.dialog.numfmt.dateDesc" | "sheets-chart-ui.dialog.numfmt.thousandthPercentileDesc" | "sheets-chart-ui.dialog.numfmt.decimalPlaces" | "sheets-chart-ui.dialog.numfmt.currencyTypes" | "sheets-chart-ui.dialog.numfmt.negativeNumberTypes" | "sheets-chart-ui.dialog.numfmt.dateTypes" | "sheets-chart-ui.titles.title" | "sheets-chart-ui.titles.xAxisTitle" | "sheets-chart-ui.titles.yAxisTitle" | "sheets-chart-ui.titles.rightYAxisTitle" | "sheets-chart-ui.titles.titlePosition" | "sheets-chart-ui.titles.subTitle" | "sheets-chart-ui.titles.mainTitle" | "sheets-chart-ui.titles.titleFormat" | "sheets-chart-ui.titles.titleText" | "sheets-chart-ui.titles.titleAlign" | "sheets-chart-ui.relation.auto" | "sheets-chart-ui.relation.circular" | "sheets-chart-ui.relation.force" | "sheets-chart-ui.relation.title" | "sheets-chart-ui.relation.emphasis" | "sheets-chart-ui.relation.layoutType" | "sheets-chart-ui.relation.useValueAsSymbolSize" | "sheets-chart-ui.relation.repulsion" | "sheets-chart-ui.relation.edgeLength" | "sheets-chart-ui.relation.gravity" | "sheets-chart-ui.relation.rotateLabel" | "sheets-chart-ui.relation.forceOptions" | "sheets-chart-ui.pareto.lineSeries" | "sheets-chart-ui.pareto.barSeries" | "sheets-chart-ui.lineType.line" | "sheets-chart-ui.lineType.smooth" | "sheets-chart-ui.lineType.step" | "sheets-chart-ui.dashType.solid" | "sheets-chart-ui.dashType.dot" | "sheets-chart-ui.dashType.dash" | "sheets-chart-ui.axes.axis" | "sheets-chart-ui.axes.axisOptions" | "sheets-chart-ui.axes.horizontalAxis" | "sheets-chart-ui.axes.verticalAxis" | "sheets-chart-ui.axes.rightVerticalAxis" | "sheets-chart-ui.axes.leftAxis" | "sheets-chart-ui.axes.rightAxis" | "sheets-chart-ui.axes.useRightAxis" | "sheets-chart-ui.stackType.stack" | "sheets-chart-ui.stackType.percent" | "sheets-chart-ui.permission.editErr" | "sheets-chart-ui.msg.invalidSource" | "sheets-chart-ui.invalidType.zero" | "sheets-chart-ui.invalidType.gaps" | "sheets-chart-ui.invalidType.connectDataPointsWithStraightLines" | "sheets-chart-ui.seriesBlock.format" | "sheets-chart-ui.seriesBlock.dataPointStyle" | "sheets-chart-ui.axisPositionType.center" | "sheets-chart-ui.axisPositionType.start" | "sheets-chart-ui.axisPositionType.end" | "sheets-chart-ui.settingsLabels.switchToRowOrColumn" | "sheets-chart-ui.settingsLabels.useAsCategoryLabels" | "sheets-chart-ui.settingsLabels.showEmptyCellsAs" | "sheets-chart-ui.positionType.left" | "sheets-chart-ui.positionType.right" | "sheets-chart-ui.positionType.bottom" | "sheets-chart-ui.positionType.top" | "sheets-chart-ui.positionType.hide" | "sheets-chart-ui.positionType.auto" | "sheets-chart-ui.positionType.inside" | "sheets-chart-ui.positionType.outside" | "sheets-chart-ui.alignY.bottom" | "sheets-chart-ui.alignY.top" | "sheets-chart-ui.alignY.middle" | "sheets-chart-ui.legendSelectModeType.single" | "sheets-chart-ui.legendSelectModeType.multiple" | "sheets-chart-ui.legendSelectModeType.close" | "sheets-chart-ui.legendVisualMapType.continuous" | "sheets-chart-ui.legendVisualMapType.piecewise" | "sheets-chart-ui.gridlines.text" | "sheets-chart-ui.gridlines.majorGridlines" | "sheets-chart-ui.ticks.majorTick" | "sheets-chart-ui.ticks.tickPosition" | "sheets-chart-ui.ticks.tickLength" | "sheets-chart-ui.styleEditPanel.padAngle" | "sheets-chart-ui.styleEditPanel.useDateAxis" | "sheets-chart-ui.styleEditPanel.rosePie" | "sheets-chart-ui.styleEditPanel.showLabelLine" | "sheets-chart-ui.styleEditPanel.gap" | "sheets-chart-ui.styleEditPanel.useAbsValue" | "sheets-chart-ui.styleEditPanel.wordCloudShape" | "sheets-chart-ui.styleEditPanel.showLabels" | "sheets-chart-ui.styleEditPanel.showDataLabels" | "sheets-chart-ui.styleEditPanel.halfPie" | "sheets-chart-ui.styleEditPanel.pieValScale" | "sheets-chart-ui.styleEditPanel.pieValSuffix" | "sheets-chart-ui.styleEditPanel.pieDigitalFixed" | "sheets-chart-ui.styleEditPanel.reverseAxisOrder" | "sheets-chart-ui.styleEditPanel.showAxisLine" | "sheets-chart-ui.styleEditPanel.labelPosition" | "sheets-chart-ui.styleEditPanel.labelText" | "sheets-chart-ui.styleEditPanel.repeatWordCould" | "sheets-chart-ui.styleEditPanel.labelRotate" | "sheets-chart-ui.styleEditPanel.dateAxisTips" | "sheets-chart-ui.trendline.exp" | "sheets-chart-ui.trendline.linear" | "sheets-chart-ui.trendline.log" | "sheets-chart-ui.trendline.movingAvg" | "sheets-chart-ui.trendline.poly" | "sheets-chart-ui.trendline.pow" | "sheets-chart-ui.trendline.name" | "sheets-chart-ui.trendline.formula" | "sheets-chart-ui.trendline.displayName" | "sheets-chart-ui.trendline.order" | "sheets-chart-ui.trendline.period" | "sheets-chart-ui.trendline.showFormula" | "sheets-chart-ui.trendline.showR2" | "sheets-chart-ui.trendline.addTrendLine" | "sheets-chart-ui.trendline.trendlineType" | "sheets-chart-ui.trendline.trendlineName" | "sheets-chart-ui.trendline.trendlineColor" | "sheets-chart-ui.trendline.trendlineThickness" | "sheets-chart-ui.trendline.trendlineDashType" | "sheets-chart-ui.trendline.r2" | "sheets-chart-ui.chartTypes.line" | "sheets-chart-ui.chartTypes.column" | "sheets-chart-ui.chartTypes.wordCloud" | "sheets-chart-ui.chartTypes.waterfall" | "sheets-chart-ui.chartTypes.bar" | "sheets-chart-ui.chartTypes.scatter" | "sheets-chart-ui.chartTypes.pie" | "sheets-chart-ui.chartTypes.radar" | "sheets-chart-ui.chartTypes.funnel" | "sheets-chart-ui.chartTypes.sankey" | "sheets-chart-ui.chartTypes.boxplot" | "sheets-chart-ui.chartTypes.heatmap" | "sheets-chart-ui.chartTypes.bubble" | "sheets-chart-ui.chartTypes.combination" | "sheets-chart-ui.chartTypes.area" | "sheets-chart-ui.chartTypes.relation" | "sheets-chart-ui.chartTypes.pareto" | "sheets-chart-ui.chartTypes.areaStacked" | "sheets-chart-ui.chartTypes.areaPercentStacked" | "sheets-chart-ui.chartTypes.barStacked" | "sheets-chart-ui.chartTypes.barPercentStacked" | "sheets-chart-ui.chartTypes.donut" | "sheets-chart-ui.chartTypes.stock";
-    value: string;
-}[];
+export declare const seriesChartTypeOptions: Array<ILocaleOption<string>>;
 export declare const titleOptions: readonly [{
     readonly label: "sheets-chart-ui.titles.mainTitle";
     readonly value: "title";
@@ -65,26 +63,14 @@ export declare const textAlignOptions: readonly [{
     readonly value: "right";
 }];
 export type TextAlignOptionValue = typeof textAlignOptions[number]['value'];
-export declare function getAllSeriesOption(): {
-    label: string;
-    value: string;
-};
+export declare function getAllSeriesOption(): ILocaleOption<string>;
 export declare const lineOpacityOptions: {
     label: string;
     value: string;
 }[];
-export declare const axisPositionOptions: {
-    label: string;
-    value: string;
-}[];
-export declare const borderDashTypeOptions: {
-    label: string;
-    value: ChartBorderDashType;
-}[];
-export declare const linePointShapeOptions: {
-    label: string;
-    value: LinePointShape;
-}[];
+export declare const axisPositionOptions: Array<ILocaleOption<string>>;
+export declare const borderDashTypeOptions: Array<ILocaleOption<ChartBorderDashType>>;
+export declare const linePointShapeOptions: Array<ILocaleOption<LinePointShape>>;
 export declare const linePointSizeOptions: {
     label: string;
     value: string;
@@ -106,34 +92,13 @@ export declare const trendlineOrderOptions: {
     label: string;
     value: string;
 }[];
-export declare const dataLabelPositionOptions: {
-    label: string;
-    value: SeriesLabelPosition;
-}[];
-export declare const pieDataLabelPositionOptions: {
-    label: string;
-    value: PieLabelPosition;
-}[];
-export declare const legendLabelPositionOptions: {
-    label: string;
-    value: LegendPositionEnum;
-}[];
-export declare const legendSelectModeOptions: {
-    label: string;
-    value: SelectModeEnum;
-}[];
-export declare const legendVisualMapTypeOptions: {
-    label: string;
-    value: string;
-}[];
-export declare const titlePositionOptions: {
-    label: string;
-    value: TitlePositionEnum;
-}[];
-export declare const axisTitlePositionOptions: {
-    label: string;
-    value: AxisAlignEnum;
-}[];
+export declare const dataLabelPositionOptions: Array<ILocaleOption<SeriesLabelPosition>>;
+export declare const pieDataLabelPositionOptions: Array<ILocaleOption<PieLabelPosition>>;
+export declare const legendLabelPositionOptions: Array<ILocaleOption<LegendPositionEnum>>;
+export declare const legendSelectModeOptions: Array<ILocaleOption<SelectModeEnum>>;
+export declare const legendVisualMapTypeOptions: Array<ILocaleOption<string>>;
+export declare const titlePositionOptions: Array<ILocaleOption<TitlePositionEnum>>;
+export declare const axisTitlePositionOptions: Array<ILocaleOption<AxisAlignEnum>>;
 /**
  * chart title position options X
  */
@@ -148,40 +113,22 @@ export declare const titlePositionYOptions: {
     label: string;
     value: TextVerticalAlign;
 }[];
-export declare const axisListOptions: {
-    value: string;
-    label: string;
-}[];
+export declare const axisListOptions: Array<ILocaleOption<string>>;
 export declare const tickThicknessOptions: {
     label: string;
     value: string;
 }[];
-export declare const stackTypeOptions: OptionType[];
-export declare const areaLineTypeOptions: {
-    label: string;
-    value: AreaLineStyle;
-}[];
+export declare const stackTypeOptions: Array<ILocaleOption<string>>;
+export declare const areaLineTypeOptions: Array<ILocaleOption<AreaLineStyle>>;
 export declare const pieDonutHoleOptions: {
     label: string;
     value: string;
 }[];
-export declare const radarShapeOptions: {
-    label: string;
-    value: RadarShape;
-}[];
-export declare const invalidValueOptions: {
-    label: string;
-    value: InvalidValueType;
-}[];
+export declare const radarShapeOptions: Array<ILocaleOption<RadarShape>>;
+export declare const invalidValueOptions: Array<ILocaleOption<InvalidValueType>>;
 export declare const labelContentTypeList: LabelContentType[];
-export declare const labelContentOptions: {
-    value: string;
-    label: LocaleKey;
-}[];
-export declare const pieLabelContentOptions: {
-    value: string;
-    label: LocaleKey;
-}[];
+export declare const labelContentOptions: Array<ILocaleOption<string>>;
+export declare const pieLabelContentOptions: ILocaleOption<string>[];
 export declare const tickLengthOptions: {
     label: string;
     value: string;
@@ -190,10 +137,7 @@ export declare const tickWidthOptions: {
     label: string;
     value: string;
 }[];
-export declare const RelationLayoutOptions: {
-    label: string;
-    value: string;
-}[];
+export declare const RelationLayoutOptions: Array<ILocaleOption<string>>;
 export declare const DateFormatList: {
     label: string;
     suffix: string;
@@ -218,7 +162,4 @@ export declare const CurrencyFormatList: ({
 })[];
 export declare const UNIVER_SHEET_CHART_FORMAT_DIALOG_ID = "univer-sheet-chart-format-dialog-id";
 export declare const UNIVER_SHEET_CHART_FORMAT_DIALOG = "univer-sheet-chart-format-dialog";
-export declare const waterfallStackTypeOptions: {
-    label: string;
-    value: WaterfallStackTypeEnum;
-}[];
+export declare const waterfallStackTypeOptions: Array<ILocaleOption<WaterfallStackTypeEnum>>;

package/lib/types/views/chart-edit-panel/RadarChartOptionsEdit.d.ts

@@ -1,5 +1,3 @@
-import type { SheetsChartUIService } from '../../services/sheets-chart-ui.service';
 export declare const RadarChartOptionsEdit: (props: {
-    service: SheetsChartUIService;
     className?: string;
 }) => import("react").JSX.Element;

package/lib/types/views/chart-edit-panel/data-tab-panel/BubbleDataEdit.d.ts

@@ -1,11 +1,6 @@
-import type { SheetsChartUIService } from '../../../services/sheets-chart-ui.service';
-interface IBubbleDataEditProps {
-    service: SheetsChartUIService;
-}
 export interface IBubbleSeriesOption {
     label: string;
     value: string;
     isCategoryList: boolean;
 }
-export declare const BubbleDataEdit: (props: IBubbleDataEditProps) => import("react").JSX.Element;
-export {};
+export declare const BubbleDataEdit: () => import("react").JSX.Element;

package/lib/types/views/chart-edit-panel/data-tab-panel/DataTabPanel.d.ts

@@ -1,4 +1 @@
-export declare const ChartEditBlockTitle: ({ title }: {
-    title: string;
-}) => import("react").JSX.Element;
 export declare const DataTabPanel: () => import("react").JSX.Element;

package/lib/types/views/chart-edit-panel/style-tab-panel/AxisOptionsEdit.d.ts

@@ -1,11 +1,9 @@
 import type { DeepPartial, IAxisOptions } from '@univerjs-pro/engine-chart';
 import type { Nullable } from '@univerjs/core';
-import type { SheetsChartUIService } from '../../../services/sheets-chart-ui.service';
 export interface IAxisOptionsEditProps {
     valueAxis: boolean;
     canUseDateAxis: boolean;
     axisOptions: Nullable<DeepPartial<IAxisOptions>>;
     onChange?: (axisOptions: DeepPartial<IAxisOptions>) => void;
-    sheetsChartUIService: SheetsChartUIService;
 }
 export declare const AxisOptionsEdit: (props: IAxisOptionsEditProps) => import("react").JSX.Element;

package/lib/types/views/chart-edit-panel/style-tab-panel/DataLabelOptions.d.ts

@@ -1,6 +1,6 @@
+import type { PropertyChangeFunction } from '@univerjs-pro/chart-ui';
 import type { ChartTypeBits, IPieLabelStyle, ISeriesLabelStyle } from '@univerjs-pro/engine-chart';
 import type { Nullable } from '@univerjs/core';
-import type { PropertyChangeFunction } from '../font-format-bar';
 import type { OptionType } from '../Options';
 type UnionLabelStyle = ISeriesLabelStyle | IPieLabelStyle;
 export interface IDataLabelOptionsProps {

package/lib/types/views/chart-edit-panel/style-tab-panel/ParetoLine.d.ts

@@ -1,6 +1,4 @@
-import type { SheetsChartUIService } from '../../../services/sheets-chart-ui.service';
 interface ITrendLineStyleEditProps {
-    service: SheetsChartUIService;
     isLineSeries: boolean;
 }
 export declare const ParetoStyleEdit: (props: ITrendLineStyleEditProps) => import("react").JSX.Element;

package/lib/types/views/chart-edit-panel/style-tab-panel/PieChartStyleEdit.d.ts

@@ -1,8 +1,6 @@
 import type { Nullable } from '@univerjs/core';
-import type { SheetsChartUIService } from '../../../services/sheets-chart-ui.service';
 import { ChartTypeBits } from '@univerjs-pro/engine-chart';
 export declare const PieChartStyleEdit: (props: {
     chartType: Nullable<ChartTypeBits>;
-    service: SheetsChartUIService;
     onChartTypeChange?: (chartType: ChartTypeBits) => void;
 }) => import("react").JSX.Element;

package/lib/types/views/chart-edit-panel/style-tab-panel/RelationEdit.d.ts

@@ -1,6 +1 @@
-import type { SheetsChartUIService } from '../../../services/sheets-chart-ui.service';
-interface IRelationEditProps {
-    service: SheetsChartUIService;
-}
-export declare function RelationEdit(props: IRelationEditProps): import("react").JSX.Element;
-export {};
+export declare function RelationEdit(): import("react").JSX.Element;

package/lib/types/views/chart-edit-panel/style-tab-panel/TrendLineEdit.d.ts

@@ -1,6 +1 @@
-import type { SheetsChartUIService } from '../../../services/sheets-chart-ui.service';
-interface ITrendLineStyleEditProps {
-    uiService: SheetsChartUIService;
-}
-export declare const TrendLineStyleEdit: (props: ITrendLineStyleEditProps) => import("react").JSX.Element | null;
-export {};
+export declare const TrendLineStyleEdit: () => import("react").JSX.Element | null;

package/lib/types/views/chart-edit-panel/style-tab-panel/WaterfallSeriesEdit.d.ts

@@ -1,6 +1 @@
-import type { SheetsChartUIService } from '../../../services/sheets-chart-ui.service';
-interface IWaterfallSeriesEditProps {
-    service: SheetsChartUIService;
-}
-export declare const WaterfallSeriesEdit: (props: IWaterfallSeriesEditProps) => import("react").JSX.Element;
-export {};
+export declare const WaterfallSeriesEdit: () => import("react").JSX.Element;

package/lib/types/views/chart-edit-panel/style-tab-panel/WordCloudShapeSelector.d.ts

@@ -1,6 +1 @@
-import type { SheetsChartUIService } from '../../../services/sheets-chart-ui.service';
-interface IWordCloudShapeSelectorProps {
-    service: SheetsChartUIService;
-}
-export declare function WordCloudShapeSelector(props: IWordCloudShapeSelectorProps): import("react").JSX.Element;
-export {};
+export declare function WordCloudShapeSelector(): import("react").JSX.Element;

package/lib/types/views/chart-edit-panel/style-tab-panel/grid-line-and-tick-options/GridLineAndTickOptions.d.ts

@@ -1,9 +1,7 @@
 import type { IRuntimeAxis } from '@univerjs-pro/engine-chart';
 import type { Nullable } from '@univerjs/core';
-import type { SheetsChartUIService } from '../../../../services/sheets-chart-ui.service';
 export interface IGridLineAndTickOptionsProps {
     className?: string;
-    service: SheetsChartUIService;
     runtimeAxes: Nullable<IRuntimeAxis[]>;
 }
 export declare const GridLineAndTickOptions: (props: IGridLineAndTickOptionsProps) => import("react").JSX.Element;