@univerjs-pro/slides-chart-ui 1.0.0-alpha.2 → 1.0.0-alpha.4

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

@@ -0,0 +1,51 @@
+import type { ISlideDrawing } from '@univerjs-pro/slides';
+import type { ISlideChartRuntimeModel } from '@univerjs-pro/slides-chart';
+import { SlideChartModelService } from '@univerjs-pro/slides-chart';
+import { Disposable, IUniverInstanceService } from '@univerjs/core';
+import { IRenderManagerService } from '@univerjs/engine-render';
+import { SlideChartRenderModeService } from './slide-chart-render-mode.service';
+export interface ISlideChartEditSession {
+    unitId: string;
+    subUnitId: string;
+    drawingId: string;
+    chartId: string;
+}
+export declare class SlideChartEditSessionService extends Disposable {
+    private readonly _slideDrawingService;
+    private readonly _modelService;
+    private readonly _renderModeService;
+    private readonly _univerInstanceService;
+    private readonly _renderManagerService;
+    private _activeSession;
+    private readonly _activeSession$;
+    readonly activeSession$: import("rxjs").Observable<ISlideChartEditSession | null>;
+    private readonly _subscriptions;
+    private _activeSlideSubscription;
+    private _transformStartSubscription;
+    constructor(_slideDrawingService: {
+        getDrawingByParam(params: {
+            unitId: string;
+            subUnitId: string;
+            drawingId: string;
+        }): ISlideDrawing | null | undefined;
+        remove$?: {
+            subscribe(handler: (drawings: ISlideDrawing[]) => void): {
+                unsubscribe(): void;
+            };
+        };
+    }, _modelService: Pick<SlideChartModelService, 'ensureChartModel' | 'setActiveChartRuntime'> & {
+        chartModelRemoved$?: {
+            subscribe(handler: (runtime: ISlideChartRuntimeModel) => void): {
+                unsubscribe(): void;
+            };
+        };
+    }, _renderModeService: SlideChartRenderModeService, _univerInstanceService: Pick<IUniverInstanceService, 'focused$' | 'getUnit'>, _renderManagerService: Pick<IRenderManagerService, 'getRenderById'>);
+    getActiveSession(): ISlideChartEditSession | null;
+    open(session: ISlideChartEditSession): boolean;
+    close(): void;
+    isActive(chartId: string): boolean;
+    dispose(): void;
+    private _initLifecycleListeners;
+    private _bindActiveSlideListener;
+    private _bindTransformStartListener;
+}

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

@@ -0,0 +1,83 @@
+import type { IDomChartHost, IImageChartHost } from '@univerjs-pro/engine-chart';
+import type { ISlideDrawing, ISlideLineStyle } from '@univerjs-pro/slides';
+import type { IDisposable } from '@univerjs/core';
+import type { IBoundRectNoAngle } from '@univerjs/engine-render';
+import { ChartHostRenderMode } from '@univerjs-pro/engine-chart';
+import { SlideChartModelService } from '@univerjs-pro/slides-chart';
+import { Disposable, LocaleService } from '@univerjs/core';
+import { IRenderManagerService } from '@univerjs/engine-render';
+import { SlideChartRenderModeService } from './slide-chart-render-mode.service';
+import { SlideChartRenderService } from './slide-chart-render.service';
+interface ISlideChartImageObjectHandle {
+    changeChartSource(url: string): void;
+    makeDirty(dirty?: boolean): void;
+    setChartStroke?(stroke?: ISlideLineStyle): void;
+}
+export interface ISlideChartHostContext {
+    unitId: string;
+    subUnitId: string;
+    drawingId: string;
+    chartId: string;
+    width: number;
+    height: number;
+    drawing: ISlideDrawing;
+    stroke?: ISlideLineStyle;
+    imageObject?: ISlideChartImageObjectHandle;
+}
+export declare class SlideChartHostProviderService extends Disposable {
+    private readonly _renderManagerService;
+    private readonly _localeService;
+    private readonly _modelService;
+    private readonly _renderService;
+    private readonly _renderModeService;
+    private readonly _hostContextMap;
+    private readonly _hostContextTokenMap;
+    private readonly _domHostMap;
+    private readonly _hostLayoutSubscriptions;
+    private readonly _runtimeRenderSubscriptions;
+    private readonly _domReadyChartIds;
+    private readonly _lastImageDataUrlMap;
+    private readonly _removeHost$;
+    private readonly _imageUpdated$;
+    private readonly _domReadyChanged$;
+    private readonly _layoutChanged$;
+    readonly removeHost$: import("rxjs").Observable<string>;
+    readonly imageUpdated$: import("rxjs").Observable<string>;
+    readonly domReadyChanged$: import("rxjs").Observable<string>;
+    readonly layoutChanged$: import("rxjs").Observable<string>;
+    constructor(_renderManagerService: IRenderManagerService, _localeService: LocaleService, _modelService: SlideChartModelService, _renderService: SlideChartRenderService, _renderModeService: SlideChartRenderModeService);
+    registerHostContext(context: ISlideChartHostContext): IDisposable;
+    getHostContext(chartId: string): ISlideChartHostContext | undefined;
+    ensureHost(chartId: string, mode: ChartHostRenderMode.Image): IImageChartHost | null;
+    ensureHost(chartId: string, mode: ChartHostRenderMode.Dom): IDomChartHost | null;
+    ensureHost(chartId: string, mode: ChartHostRenderMode): IImageChartHost | IDomChartHost | null;
+    getImageDataUrl(chartId: string): string | undefined;
+    commitImageHost(chartId: string, host: IImageChartHost): void;
+    renderChart(chartId: string): Promise<void>;
+    removeHost(chartId: string): void;
+    private _removeDomHost;
+    syncHostLayout(chartId: string): void;
+    checkHost(chartId: string): boolean;
+    isDomReady(chartId: string): boolean;
+    markHostReady(chartId: string): void;
+    markHostNotReady(chartId: string): void;
+    getClientRect(chartId: string, bounds?: {
+        left: number;
+        top: number;
+        right: number;
+        bottom: number;
+    }): IBoundRectNoAngle | null;
+    private _createImageChartHost;
+    private _getOrCreateDomChartHost;
+    private _bindHostLayoutListeners;
+    private _disposeHostLayoutListeners;
+    private _bindRuntimeRenderListener;
+    private _disposeRuntimeRenderListener;
+    private _applyDomHostLayout;
+    private _getCanvasClientScale;
+    private _transformCanvasBoundToClientBound;
+    private _getChartRenderObject;
+    private _requestChartCanvasRender;
+    dispose(): void;
+}
+export {};

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

@@ -1,5 +1,5 @@
 import type { ChartImageSource, IChartHostRect, IChartHostStyle, IDomChartHost } from '@univerjs-pro/engine-chart';
-import { ImageChartHost } from '@univerjs-pro/engine-chart';
+import { ChartHostRenderMode, ImageChartHost } from '@univerjs-pro/engine-chart';
 import { Disposable } from '@univerjs/core';
 export declare class SlideImageChartHost extends ImageChartHost {
     private readonly _rect;
@@ -17,13 +17,20 @@ export declare class SlideDomChartHost extends Disposable implements IDomChartHo
     readonly chartId: string;
     private readonly _host;
     private readonly _applyHostStyle;
-    readonly mode: "dom";
-    constructor(chartId: string, _host: HTMLElement, _applyHostStyle: (host: HTMLElement, style: IChartHostStyle) => void);
-    getRect(): IChartHostRect;
+    private readonly _getRenderRect?;
+    private readonly _markReady?;
+    private readonly _markNotReady?;
+    readonly mode = ChartHostRenderMode.Dom;
+    private _mountNode;
+    private _ready;
+    constructor(chartId: string, _host: HTMLElement, _applyHostStyle: (host: HTMLElement, style: IChartHostStyle) => void, _getRenderRect?: (() => IChartHostRect | null) | undefined, _markReady?: (() => void) | undefined, _markNotReady?: (() => void) | undefined);
+    getRect(): IChartHostRect | null;
     setStyle(style: IChartHostStyle): void;
+    getHostElement(): HTMLElement;
     ensureMount(): Promise<HTMLElement>;
     checkMounted(): boolean;
     syncLayout(): void;
     markReady(): void;
     markNotReady(): void;
+    dispose(): void;
 }

package/lib/types/services/slide-chart-insert.service.d.ts

@@ -1,6 +1,7 @@
 import type { ChartTypeBits } from '@univerjs-pro/engine-chart';
 import type { ISlideDrawing } from '@univerjs-pro/slides';
 import type { SlideChartCellValue } from '@univerjs-pro/slides-chart';
+import { ISlideDrawingStateService } from '@univerjs-pro/slides-ui';
 import { ICommandService, IUniverInstanceService } from '@univerjs/core';
 export interface ISlideChartInsertOptions {
     placeholderDrawing?: ISlideDrawing;
@@ -8,7 +9,8 @@ export interface ISlideChartInsertOptions {
 export declare class SlideChartInsertService {
     private readonly _instanceService;
     private readonly _commandService;
-    constructor(_instanceService: IUniverInstanceService, _commandService: ICommandService);
+    private readonly _drawingStateService;
+    constructor(_instanceService: IUniverInstanceService, _commandService: ICommandService, _drawingStateService: ISlideDrawingStateService);
     insertChartFromText(text: string, chartType: ChartTypeBits, options?: ISlideChartInsertOptions): boolean;
     insertChart(values: SlideChartCellValue[][], chartType: ChartTypeBits, options?: ISlideChartInsertOptions): boolean;
     private _insertChartIntoPlaceholder;

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

@@ -0,0 +1,15 @@
+import type { ISlideChartEditSession } from './slide-chart-edit-session.service';
+import { ChartHostRenderMode } from '@univerjs-pro/engine-chart';
+import { Disposable } from '@univerjs/core';
+export interface ISlideChartRenderModeChange {
+    chartId: string;
+    mode: ChartHostRenderMode;
+}
+export declare class SlideChartRenderModeService extends Disposable {
+    private _activeChartId;
+    private readonly _modeChanged$;
+    readonly modeChanged$: import("rxjs").Observable<ISlideChartRenderModeChange>;
+    getRenderMode(chartId: string): ChartHostRenderMode;
+    setActiveDomChart(session: ISlideChartEditSession | null): void;
+    dispose(): void;
+}

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

@@ -1,13 +1,20 @@
-import type { ChartHostRenderMode, ChartStyle, IChartConfig, IChartHostRect, IChartInstance, IChartRenderInstance, IChartRenderModel } from '@univerjs-pro/engine-chart';
+import type { ChartElementEventHandler, ChartElementEventType, ChartStyle, IChartConfig, IChartHost, IChartHostRect, IChartInstance, IChartRenderInstance, IChartRenderModel } from '@univerjs-pro/engine-chart';
 import type { ISlideChartRuntimeModel } from '@univerjs-pro/slides-chart';
-import { ChartThemeService } from '@univerjs-pro/engine-chart';
+import type { IDisposable } from '@univerjs/core';
+import { ChartHostRenderMode, ChartThemeService, IChartRenderModelManagerService } from '@univerjs-pro/engine-chart';
 import { Disposable, LocaleService } from '@univerjs/core';
 export interface ISlideChartRenderSpecResult {
     spec: Record<string, unknown>;
     chartConfig: IChartConfig;
     chartStyle: ChartStyle;
     hostStyle: {
-        fill: string;
+        fill?: string;
+        stroke?: string;
+        border?: {
+            color?: string;
+            width?: number;
+        };
+        radius?: number;
     };
 }
 export interface ISlideChartRenderInput {
@@ -17,19 +24,33 @@ export interface ISlideChartRenderInput {
 export declare const ISlideChartRenderModelService: import("@wendellhu/redi").IdentifierDecorator<IChartRenderModel<Record<string, any>>>;
 export declare class SlideChartRenderService extends Disposable {
     private readonly _localeService;
-    private readonly _chartThemeService?;
-    private readonly _renderModelMap;
-    private _currentRenderModel;
-    constructor(_localeService: LocaleService, renderModel?: IChartRenderModel, _chartThemeService?: ChartThemeService | undefined);
+    private readonly _chartThemeService;
+    private readonly _renderModelManager;
+    private readonly _chartInstanceMap;
+    private readonly _chartEventHandlers;
+    private readonly _chartEventSubscriptions;
+    private readonly _chartElementEditMode;
+    private readonly _lastImageDataUrlMap;
+    constructor(_localeService: LocaleService, _chartThemeService: ChartThemeService, renderModelManager: IChartRenderModelManagerService, renderModel?: IChartRenderModel);
     registerRenderModel(name: string, renderModel: IChartRenderModel): void;
     setRenderModel(name: string): void;
     getRenderModel(name?: string): IChartRenderModel | undefined;
     createChartInstance(): IChartInstance;
     createChartInstance(mode: ChartHostRenderMode): IChartRenderInstance;
+    render(runtime: ISlideChartRuntimeModel, host: IChartHost): Promise<void>;
+    setElementEditMode(chartId: string, enabled: boolean): void;
+    on(chartId: string, type: ChartElementEventType, handler: ChartElementEventHandler): IDisposable;
+    disposeChartInstance(chartId: string): void;
+    exportImage(chartId: string): Promise<string | undefined>;
     createRenderInput(runtime: ISlideChartRuntimeModel): ISlideChartRenderInput;
     createRenderSpec(runtime: ISlideChartRuntimeModel, rect: IChartHostRect, chartInstance?: IChartInstance): ISlideChartRenderSpecResult;
     getHostStyle(chartStyle: ChartStyle): ISlideChartRenderSpecResult['hostStyle'];
     applyHostStyle(host: HTMLElement, hostStyle: ISlideChartRenderSpecResult['hostStyle']): void;
+    private _getOrCreateChartRenderInstance;
+    private _bindChartEventHandlers;
+    private _bindChartEventHandler;
+    private _disposeChartEventSubscription;
+    private _disposeChartEventSubscriptions;
     private _createChartRenderInstanceContext;
     dispose(): void;
 }

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

@@ -2,6 +2,7 @@ import type { ChartStyle, DeepPartial, IChartContext, IChartDataAggregation, IPi
 import type { ISlideChartRuntimeModel, IUpdateSlideChartConfigCommandParams } from '@univerjs-pro/slides-chart';
 import type { Nullable } from '@univerjs/core';
 import type { Observable } from 'rxjs';
+import type { IChartEditPanelRoute, IChartPanelRouteState, IChartSelectedElementState } from './chart-panel-route';
 import { ChartTypeBits, DataOrientation, StackType } from '@univerjs-pro/engine-chart';
 import { ISlideDrawingService } from '@univerjs-pro/slides';
 import { SlideChartModelService, SlideChartResourceService } from '@univerjs-pro/slides-chart';
@@ -54,18 +55,57 @@ export type ISlideChartConfigState<GetValue, SetValue = GetValue> = {
     set?(value: SetValue): void;
     get(): Observable<GetValue> | undefined;
 } | Observable<GetValue>;
-export declare function registerSlideChartConfigState(service: SlideChartUIService): void;
-export declare class SlideChartUIService extends Disposable {
+export interface ISlideChartUIService {
+    readonly activeRuntimeModel: ISlideChartRuntimeModel | null;
+    readonly activeRuntimeModel$: Observable<ISlideChartRuntimeModel | null>;
+    readonly activeEditChart: string | null;
+    readonly activeEditChart$: Observable<string | null>;
+    readonly selectedElement$: Observable<IChartSelectedElementState | null>;
+    readonly panelRoute$: Observable<IChartPanelRouteState | null>;
+    readonly localeService: LocaleService;
+    readonly resourceService: SlideChartResourceService;
+    registerViewState<T extends SlideChartConfigStateKey = SlideChartConfigStateKey>(id: T, state: (runtime: ISlideChartRuntimeModel) => ISlideChartConfigStateMap[T]): void;
+    getViewState<V extends SlideChartConfigStateValue = SlideChartConfigStateValue>(id: SlideChartConfigStateKey, runtime?: ISlideChartRuntimeModel | null): ISlideChartConfigState<V> | undefined;
+    executeChartUpdateConfig(params: Omit<IUpdateSlideChartConfigCommandParams, 'unitId' | 'chartId'> & {
+        unitId?: string;
+        chartId?: string;
+        context?: Partial<IChartContext>;
+        dataAggregation?: Partial<IChartDataAggregation>;
+    }): void;
+    getDrawingBorderColor(unitId: string, subUnitId: string, drawingId: string): string | undefined;
+    updateDrawingBorderColor(unitId: string, subUnitId: string, drawingId: string, color: string): boolean;
+    setActiveEditChart(chartId: string | null): void;
+    isElementEditModeActive(chartId: string): boolean;
+    setSelectedElement(state: IChartSelectedElementState | null): void;
+    setPanelRoute(chartId: string, route: IChartEditPanelRoute | null): void;
+    clearPanelRoute(): void;
+}
+export declare const ISlideChartUIService: import("@wendellhu/redi").IdentifierDecorator<ISlideChartUIService>;
+export declare function registerSlideChartConfigState(service: ISlideChartUIService): void;
+export declare class SlideChartUIService extends Disposable implements ISlideChartUIService {
     private readonly _chartModelService;
     private readonly _commandService;
     readonly localeService: LocaleService;
     readonly resourceService: SlideChartResourceService;
     private readonly _slideDrawingService;
     private readonly _viewState;
+    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: SlideChartModelService, _commandService: ICommandService, localeService: LocaleService, resourceService: SlideChartResourceService, _slideDrawingService: ISlideDrawingService);
     get activeRuntimeModel(): ISlideChartRuntimeModel | null;
+    get activeRuntimeModel$(): Observable<ISlideChartRuntimeModel | null>;
+    get activeEditChart(): string | null;
+    setActiveEditChart(chartId: string | null): void;
+    isElementEditModeActive(chartId: string): boolean;
+    setSelectedElement(state: IChartSelectedElementState | null): void;
+    setPanelRoute(chartId: string, route: IChartEditPanelRoute | null): void;
+    clearPanelRoute(): void;
     registerViewState<T extends SlideChartConfigStateKey = SlideChartConfigStateKey>(id: T, state: (runtime: ISlideChartRuntimeModel) => ISlideChartConfigStateMap[T]): void;
-    getViewState<V extends SlideChartConfigStateValue = SlideChartConfigStateValue>(id: SlideChartConfigStateKey): ISlideChartConfigState<V> | undefined;
+    getViewState<V extends SlideChartConfigStateValue = SlideChartConfigStateValue>(id: SlideChartConfigStateKey, runtime?: ISlideChartRuntimeModel | null): ISlideChartConfigState<V> | undefined;
     executeChartUpdateConfig(params: Omit<IUpdateSlideChartConfigCommandParams, 'unitId' | 'chartId'> & {
         unitId?: string;
         chartId?: string;

package/lib/types/utils/ChartPanelOptions.d.ts

@@ -1,11 +1,15 @@
 import type { ChartThemeService } from '@univerjs-pro/engine-chart';
-import type { LocaleService } from '@univerjs/core';
 import type { ReactNode } from 'react';
+import type { LocaleKey } from '../locale/types';
 import { ChartTypeBits } from '@univerjs-pro/engine-chart';
 export interface ISlideChartSelectOption {
     label: ReactNode;
     value: string;
 }
+export interface ISlideChartLocaleOption<T = string> {
+    label: LocaleKey;
+    value: T;
+}
 export declare const SLIDE_CHART_TYPE_OPTIONS: readonly [{
     readonly label: "slides-chart-ui.chartTypes.line";
     readonly value: ChartTypeBits.Line;
@@ -70,17 +74,5 @@ export declare const SLIDE_CHART_TYPE_OPTIONS: readonly [{
     readonly label: "slides-chart-ui.chartTypes.boxplot";
     readonly value: ChartTypeBits.Boxplot;
 }];
-export declare const SLIDE_CHART_STACK_OPTIONS: {
-    label: string;
-    value: string;
-}[];
-export declare function buildSlideChartTypeOptions(localeService: Pick<LocaleService, 't'>): ISlideChartSelectOption[];
-export declare function renderThemeColorStrip(colors: string[]): import("react").JSX.Element;
+export declare const SLIDE_CHART_STACK_OPTIONS: Array<ISlideChartLocaleOption<string>>;
 export declare function buildSlideChartThemeOptions(themes: string[], chartThemeService: Pick<ChartThemeService, 'getColors'>): ISlideChartSelectOption[];
-export declare function buildTranslatedOptions<T extends string>(options: Array<{
-    label: string;
-    value: T;
-}>, localeService: Pick<LocaleService, 't'>): Array<{
-    label: string;
-    value: T;
-}>;

package/lib/types/views/render/chart-adaptor.d.ts

@@ -3,12 +3,14 @@ import type { IRenderConvertContext } from '@univerjs-pro/slides-ui';
 import type { Nullable } from '@univerjs/core';
 import type { BaseObject, IViewportInfo, UniverRenderingContext } from '@univerjs/engine-render';
 import { ObjectAdaptor, SlideImageObject } from '@univerjs-pro/slides-ui';
-import { SlideChartSnapshotRenderService } from '../../services/slide-chart-snapshot-render.service';
+import { SlideChartHostProviderService } from '../../services/slide-chart-host-provider.service';
 type SlideChartImageObjectProps = ConstructorParameters<typeof SlideImageObject>[1];
 export declare class SlideChartImageObject extends SlideImageObject {
     private _chartStroke?;
+    private _hideImage;
     constructor(key: string, props: SlideChartImageObjectProps);
     setChartStroke(stroke?: ISlideLineStyle): void;
+    setImageHidden(hidden: boolean): void;
     changeChartSource(url: string): void;
     protected _draw(ctx: UniverRenderingContext, bounds?: IViewportInfo, renderWidth?: number, renderHeight?: number): void;
     private _drawChartStroke;
@@ -16,11 +18,10 @@ export declare class SlideChartImageObject extends SlideImageObject {
     private _attachNativeLoadHandlers;
 }
 export declare class SlideChartObjectAdaptor extends ObjectAdaptor {
-    private readonly _snapshotService?;
+    private readonly _hostProvider;
     zIndex: number;
-    constructor(_snapshotService?: SlideChartSnapshotRenderService | undefined);
+    constructor(_hostProvider: SlideChartHostProviderService);
     check(drawing: ISlideDrawing): boolean;
     convert(drawing: ISlideDrawing, ctx: IRenderConvertContext): Nullable<BaseObject>;
-    private _watchSnapshotUpdates;
 }
 export {};