@netless/window-manager 1.0.0-canary.7 → 1.0.0-canary.71

package/dist/{App → src/App}/AppContext.d.ts

@@ -1,17 +1,19 @@
-import { Storage } from "./Storage";
 import { autorun, listenDisposed, listenUpdated, reaction, unlistenDisposed, unlistenUpdated, toJS } from "white-web-sdk";
+import { Storage } from "@netless/synced-store";
 import type { Room, SceneDefinition, View } from "white-web-sdk";
 import type { ReadonlyTeleBox } from "@netless/telebox-insider";
 import type Emittery from "emittery";
-import type { BoxManager } from "../BoxManager";
 import type { AppEmitterEvent, Member } from "../index";
 import type { AppManager } from "../AppManager";
 import type { AppProxy } from "./AppProxy";
 import type { MagixEventAddListener, MagixEventDispatcher, MagixEventRemoveListener } from "./MagixEvent";
 import { WhiteBoardView } from "./WhiteboardView";
-export declare class AppContext<TAttributes = any, TMagixEventPayloads = any, TAppOptions = any> {
+export declare type CreateWhiteBoardViewParams = {
+    size?: number;
+    syncCamera?: boolean;
+};
+export declare class AppContext<TAttributes extends Record<string, any> = any, TMagixEventPayloads = any, TAppOptions = any> {
     private manager;
-    private boxManager;
     appId: string;
     private appProxy;
     private appOptions?;
@@ -30,16 +32,19 @@ export declare class AppContext<TAttributes = any, TMagixEventPayloads = any, TA
     private store;
     readonly isAddApp: boolean;
     readonly isReplay: boolean;
-    private whiteBoardView?;
+    whiteBoardView?: WhiteBoardView;
     _viewWrapper?: HTMLElement;
-    constructor(manager: AppManager, boxManager: BoxManager, appId: string, appProxy: AppProxy, appOptions?: TAppOptions | (() => TAppOptions) | undefined);
+    constructor(manager: AppManager, appId: string, appProxy: AppProxy, appOptions?: TAppOptions | (() => TAppOptions) | undefined);
     get displayer(): import("white-web-sdk").Displayer<import("white-web-sdk").DisplayerCallbacks>;
+    get destroyed(): boolean;
+    get attributes(): TAttributes;
     /** @deprecated Use context.storage.state instead. */
     getAttributes: () => TAttributes | undefined;
     getScenes: () => SceneDefinition[] | undefined;
     get view(): View | undefined;
-    createWhiteBoardView: (size?: number | undefined) => WhiteBoardView;
-    private initPageSize;
+    get now(): number;
+    createWhiteBoardView: (params?: CreateWhiteBoardViewParams | undefined) => WhiteBoardView;
+    private ensurePageSize;
     getInitScenePath: () => string | undefined;
     /** Get App writable status. */
     get isWritable(): boolean;
@@ -47,7 +52,7 @@ export declare class AppContext<TAttributes = any, TMagixEventPayloads = any, TA
     get box(): ReadonlyTeleBox;
     get room(): Room | undefined;
     get members(): Member[];
-    get memberState(): Member;
+    get currentMember(): Member | undefined;
     /** @deprecated Use context.storage.setState instead. */
     setAttributes: (attributes: TAttributes) => void;
     /** @deprecated Use context.storage.setState instead. */
@@ -56,16 +61,13 @@ export declare class AppContext<TAttributes = any, TMagixEventPayloads = any, TA
     setScenePath: (scenePath: string) => Promise<void>;
     /** Get the local App options. */
     getAppOptions: () => TAppOptions | undefined;
-    private _storage?;
-    /** Main Storage for attributes. */
-    get storage(): Storage<TAttributes>;
     /**
      * Create separated storages for flexible state management.
-     * @param storeId Namespace for the storage. Storages of the same namespace share the same data.
+     * @param namespace Namespace for the storage. Storages of the same namespace share the same data.
      * @param defaultState Default state for initial storage creation.
      * @returns
      */
-    createStorage: <TState>(storeId: string, defaultState?: TState | undefined) => Storage<TState>;
+    createStorage: <TState extends Record<string, any>>(namespace: string, defaultState?: TState | undefined) => Storage<TState>;
     /** Dispatch events to other clients (and self). */
     dispatchMagixEvent: MagixEventDispatcher<TMagixEventPayloads>;
     /** Listen to events from others clients (and self messages). */

package/dist/{App → src/App}/AppProxy.d.ts

@@ -2,13 +2,15 @@ import Emittery from "emittery";
 import { AppContext } from "./AppContext";
 import { AppPageStateImpl } from "./AppPageStateImpl";
 import { Val } from "value-enhancer";
+import { SideEffectManager } from "side-effect-manager";
 import type { ICamera, ISize } from "../AttributesDelegate";
-import type { AppEmitterEvent, AppInitState, BaseInsertParams } from "../index";
-import type { SceneState, View, SceneDefinition, Camera } from "white-web-sdk";
+import type { AppEmitterEvent, BaseInsertParams } from "../index";
+import type { SceneState, View, SceneDefinition } from "white-web-sdk";
 import type { AppManager } from "../AppManager";
 import type { NetlessApp } from "../typings";
 import type { ReadonlyTeleBox } from "@netless/telebox-insider";
 import type { PageRemoveService, PageState } from "../Page";
+import type { AppState } from "./type";
 export declare type AppEmitter = Emittery<AppEmitterEvent>;
 export declare class AppProxy implements PageRemoveService {
     private params;
@@ -26,19 +28,30 @@ export declare class AppProxy implements PageRemoveService {
     private store;
     uid: string;
     isAddApp: boolean;
-    private status;
+    status: "normal" | "destroyed";
     private stateKey;
     _pageState: AppPageStateImpl;
-    private _prevFullPath;
-    appResult?: NetlessApp<any>;
-    appContext?: AppContext<any, any>;
-    private sideEffectManager;
-    camera$: Val<ICamera | undefined, any>;
+    appResult?: NetlessApp;
+    appContext?: AppContext;
+    sideEffectManager: SideEffectManager;
+    private valManager;
+    private fullPath$;
+    private viewSync?;
+    camera$: Val<{
+        id: string;
+        centerX: number | null;
+        centerY: number | null;
+        scale: number;
+    } | undefined, any>;
     size$: Val<ISize | undefined, any>;
-    private appViewSync?;
     box$: Val<ReadonlyTeleBox | undefined, any>;
     view$: Val<View | undefined, any>;
+    syncCamera$: Val<boolean, any>;
+    whiteBoardViewCreated$: Val<boolean, any>;
     constructor(params: BaseInsertParams, manager: AppManager, appId: string, isAddApp: boolean);
+    fireMemberStateChange: () => void;
+    private onMemberStateChange;
+    private computedInitialRect;
     createAppDir(): View;
     private initScenes;
     get view(): View | undefined;
@@ -59,7 +72,7 @@ export declare class AppProxy implements PageRemoveService {
     onSeek(time: number): Promise<void>;
     onReconnected(): Promise<void>;
     onRemoveScene(scenePath: string): Promise<void>;
-    getAppInitState: (id: string) => AppInitState | undefined;
+    getAppInitState: (id: string) => AppState | undefined;
     emitAppSceneStateChange(sceneState: SceneState): void;
     emitAppIsWritableChange(): void;
     private makeAppEventListener;
@@ -75,7 +88,13 @@ export declare class AppProxy implements PageRemoveService {
     setSceneIndex(index: number): void;
     storeCamera: (camera: ICamera) => void;
     storeSize: (size: ISize) => void;
-    moveCamera: (camera: Camera) => void;
+    updateSize: (width: number, height: number) => void;
+    moveCamera: (camera: Partial<ICamera>) => void;
     destroy(needCloseBox: boolean, cleanAttrs: boolean, skipUpdate: boolean, error?: Error): Promise<void>;
+    private addCameraReaction;
+    private addSizeReaction;
+    onFocus: () => void;
+    private setupDone;
+    private setupFailed;
     close(): Promise<void>;
 }

package/dist/src/App/WhiteboardView.d.ts

@@ -0,0 +1,27 @@
+import type { ReadonlyVal } from "value-enhancer";
+import type { AddPageParams, PageController, PageState } from "../Page";
+import type { AppProxy } from "./AppProxy";
+import type { AppContext } from "./AppContext";
+import type { View } from "white-web-sdk";
+import type { TeleBoxRect } from "@netless/telebox-insider";
+import type { ICamera, ISize } from "../AttributesDelegate";
+export declare type WhiteBoardViewCamera = Omit<ICamera, "id">;
+export declare type WhiteBoardViewRect = Omit<ISize, "id">;
+export declare class WhiteBoardView implements PageController {
+    view: View;
+    protected appContext: AppContext;
+    protected appProxy: AppProxy;
+    ensureSize: (size: number) => void;
+    readonly pageState$: ReadonlyVal<PageState>;
+    readonly camera$: ReadonlyVal<WhiteBoardViewCamera>;
+    readonly baseRect$: ReadonlyVal<WhiteBoardViewRect | undefined>;
+    constructor(view: View, appContext: AppContext, appProxy: AppProxy, ensureSize: (size: number) => void);
+    get pageState(): PageState;
+    moveCamera(camera: Partial<WhiteBoardViewCamera>): void;
+    nextPage: () => Promise<boolean>;
+    prevPage: () => Promise<boolean>;
+    jumpPage: (index: number) => Promise<boolean>;
+    addPage: (params?: AddPageParams | undefined) => Promise<void>;
+    removePage: (index?: number | undefined) => Promise<boolean>;
+    setBaseRect(rect: Omit<TeleBoxRect, "x" | "y">): void;
+}

package/dist/{App → src/App}/index.d.ts

@@ -1,3 +1,4 @@
 export * from "./AppProxy";
 export * from "./AppContext";
 export * from "./WhiteboardView";
+export * from "./type";

package/dist/src/App/type.d.ts

@@ -0,0 +1,21 @@
+export declare type AppState = {
+    id: string;
+    focus?: boolean;
+    SceneIndex?: number;
+    draggable?: boolean;
+    position?: {
+        x: number;
+        y: number;
+    };
+    ratio?: number;
+    resizable?: boolean;
+    size?: {
+        width: number;
+        height: number;
+    };
+    stageRatio?: number;
+    visible?: boolean;
+    zIndex?: number;
+    maximized: boolean | null;
+    minimized: boolean | null;
+};

package/dist/{AppListener.d.ts → src/AppListener.d.ts}

@@ -11,11 +11,11 @@ export declare class AppListeners {
     private appResizeHandler;
     private boxStateChangeHandler;
     private setMainViewScenePathHandler;
-    private moveCameraHandler;
-    private moveCameraToContainHandler;
     private cursorMoveHandler;
     private rootDirRemovedHandler;
     private refreshHandler;
     private initMainViewCameraHandler;
     private setAppFocusViewIndexHandler;
+    private moveCameraHandler;
+    private moveCameraToContainHandler;
 }

package/dist/{AppManager.d.ts → src/AppManager.d.ts}

@@ -3,11 +3,13 @@ import { AppProxy } from "./App";
 import { MainViewProxy } from "./View/MainView";
 import { WindowManager } from "./index";
 import { ViewManager } from "./View/ViewManager";
+import { Val } from "value-enhancer";
 import type { ReconnectRefresher } from "./ReconnectRefresher";
 import type { BoxManager } from "./BoxManager";
-import type { Displayer, Room, SceneState } from "white-web-sdk";
+import type { Displayer, Room, ScenesCallbacksNode, SceneState, Size } from "white-web-sdk";
 import type { AddAppParams, TeleBoxRect } from "./index";
 import type { Member } from "./Helper";
+import { ScrollMode } from "./View/ScrollMode";
 export declare class AppManager {
     windowManger: WindowManager;
     displayer: Displayer;
@@ -21,10 +23,14 @@ export declare class AppManager {
     mainViewScenesLength: number;
     private appListeners;
     boxManager?: BoxManager;
-    private _prevSceneIndex;
-    private _prevFocused;
-    private callbacksNode;
+    scrollMode?: ScrollMode;
+    scrollBaseSize$: Val<Size | null, any>;
+    callbacksNode: ScenesCallbacksNode | null;
     private appCreateQueue;
+    private sceneIndex$;
+    private focused$;
+    members$: Val<Member[], any>;
+    isWritable$: Val<boolean, any>;
     private sideEffectManager;
     sceneState: SceneState | null;
     rootDirRemoving: boolean;
@@ -51,7 +57,6 @@ export declare class AppManager {
     get mainView(): import("white-web-sdk").View;
     get focusApp(): AppProxy | undefined;
     get uid(): string;
-    get members(): Member[];
     getMainViewSceneDir(): string;
     private onCreated;
     private onBoxMove;
@@ -65,9 +70,9 @@ export declare class AppManager {
     private onFocusChange;
     attributesUpdateCallback: import("lodash").DebouncedFunc<(apps: any) => Promise<void>>;
     /**
-     * 插件更新 attributes 时的回调
+     * 插件更新 apps 时的回调
      *
-     * @param {*} attributes
+     * @param {*} apps
      * @memberof WindowManager
      */
     _attributesUpdateCallback(apps: any): Promise<void>;

package/dist/{AttributesDelegate.d.ts → src/AttributesDelegate.d.ts}

@@ -1,6 +1,6 @@
 import { AppAttributes } from "./constants";
 import type { AddAppParams, AppSyncAttributes } from "./index";
-import type { Camera, Size, View } from "white-web-sdk";
+import type { Size, View } from "white-web-sdk";
 import type { Cursor } from "./Cursor/Cursor";
 export declare enum Fields {
     Apps = "apps",
@@ -33,8 +33,11 @@ export declare type StoreContext = {
     safeUpdateAttributes: (keys: string[], value: any) => void;
     safeSetAttributes: (attributes: any) => void;
 };
-export declare type ICamera = Camera & {
+export declare type ICamera = {
     id: string;
+    centerX: number | null;
+    centerY: number | null;
+    scale: number;
 };
 export declare type ISize = Size & {
     id: string;

package/dist/{BoxManager.d.ts → src/BoxManager.d.ts}

@@ -1,15 +1,16 @@
 import { AppAttributes } from "./constants";
+import { SideEffectManager } from "side-effect-manager";
 import { TELE_BOX_STATE, TeleBoxManager } from "@netless/telebox-insider";
 import { WindowManager } from "./index";
 import type { BoxEmitterType } from "./BoxEmitter";
-import type { AddAppOptions, AppInitState } from "./index";
-import type { TeleBoxManagerUpdateConfig, ReadonlyTeleBox, TeleBoxColorScheme, TeleBoxRect, TeleBoxConfig } from "@netless/telebox-insider";
+import type { AddAppOptions } from "./index";
+import type { TeleBoxManagerUpdateConfig, ReadonlyTeleBox, TeleBoxColorScheme, TeleBoxRect, TeleBoxConfig, TeleBoxFullscreen, TeleBoxManagerThemeConfig } from "@netless/telebox-insider";
 import type Emittery from "emittery";
 import type { NetlessApp } from "./typings";
 import type { View } from "white-web-sdk";
 import type { CallbacksType } from "./callback";
 import type { EmitterType } from "./InternalEmitter";
-import { SideEffectManager } from "side-effect-manager";
+import type { AppState } from "./App/type";
 export { TELE_BOX_STATE };
 export declare type CreateBoxParams = {
     appId: string;
@@ -44,10 +45,15 @@ export declare type CreateTeleBoxManagerConfig = {
     collectorStyles?: Partial<CSSStyleDeclaration>;
     prefersColorScheme?: TeleBoxColorScheme;
     stageRatio?: number;
+    containerStyle?: string;
+    stageStyle?: string;
+    fullscreen?: TeleBoxFullscreen;
+    defaultBoxBodyStyle?: string | null;
+    defaultBoxStageStyle?: string | null;
+    theme?: TeleBoxManagerThemeConfig;
 };
 export declare type BoxManagerContext = {
     safeSetAttributes: (attributes: any) => void;
-    getMainView: () => View;
     updateAppState: (appId: string, field: AppAttributes, value: any) => void;
     emitter: EmitterType;
     boxEmitter: BoxEmitterType;
@@ -63,7 +69,6 @@ export declare class BoxManager {
     teleBoxManager: TeleBoxManager;
     protected sideEffectManager: SideEffectManager;
     constructor(context: BoxManagerContext, createTeleBoxManagerConfig?: CreateTeleBoxManagerConfig);
-    private get mainView();
     private get canOperate();
     get boxState(): "normal" | "minimized" | "maximized";
     get maximized(): boolean;
@@ -72,6 +77,7 @@ export declare class BoxManager {
     get prefersColorScheme(): TeleBoxColorScheme;
     get boxSize(): number;
     get stageRect(): TeleBoxRect;
+    get stageRect$(): import("value-enhancer").ReadonlyVal<TeleBoxRect, any>;
     createBox(params: CreateBoxParams): ReadonlyTeleBox | undefined;
     setupBoxManager(createTeleBoxManagerConfig?: CreateTeleBoxManagerConfig): TeleBoxManager;
     getBox(appId: string): ReadonlyTeleBox | undefined;
@@ -79,7 +85,7 @@ export declare class BoxManager {
     boxIsFocus(appId: string): boolean | undefined;
     getFocusBox(): ReadonlyTeleBox | undefined;
     getTopBox(): ReadonlyTeleBox | undefined;
-    updateBoxState(state?: AppInitState): void;
+    updateBoxState(state?: AppState): void;
     moveBox({ appId, x, y }: MoveBoxParams): void;
     focusBox({ appId }: AppId, skipUpdate?: boolean): void;
     resizeBox({ appId, width, height, skipUpdate }: ResizeBoxParams): void;

package/dist/{BuiltinApps.d.ts → src/BuiltinApps.d.ts}

@@ -3,3 +3,6 @@ export declare const BuiltinApps: {
     DocsViewer: string;
     MediaPlayer: string;
 };
+export declare const BuiltinAppsMap: {
+    [x: string]: any;
+};

package/dist/{Cursor → src/Cursor}/index.d.ts

@@ -1,5 +1,5 @@
 import { Cursor } from "./Cursor";
-import type { ApplianceIcons } from "../index";
+import type { ApplianceIcons, TeleBoxRect } from "../index";
 import type { PositionType } from "../AttributesDelegate";
 import type { RoomMember, View } from "white-web-sdk";
 import type { AppManager } from "../AppManager";
@@ -15,14 +15,15 @@ export declare type MoveCursorParams = {
 export declare class CursorManager {
     private manager;
     private enableCursor;
-    containerRect?: DOMRect;
-    wrapperRect?: DOMRect;
+    wrapperRect?: TeleBoxRect;
+    playgroundRect?: DOMRect;
     cursorInstances: Map<string, Cursor>;
     roomMembers?: readonly RoomMember[];
     private mainViewElement?;
     private sideEffectManager;
     private store;
     applianceIcons: ApplianceIcons;
+    get playground$(): import("value-enhancer").Val<HTMLElement | undefined, any>;
     constructor(manager: AppManager, enableCursor: boolean, applianceIcons?: ApplianceIcons);
     private onCursorMove;
     private initCursorInstance;

package/dist/{Helper.d.ts → src/Helper.d.ts}

@@ -1,5 +1,6 @@
+import { WindowManager } from "./index";
 import type { Room, RoomMember } from "white-web-sdk";
-export declare const setupWrapper: (root: HTMLElement) => {
+export declare const setupWrapper: (root: HTMLElement, target: HTMLElement) => {
     playground: HTMLDivElement;
     mainViewElement: HTMLDivElement;
 };
@@ -8,10 +9,5 @@ export declare const findMemberByUid: (room: Room | undefined, uid: string) => R
 export declare type Member = RoomMember & {
     uid: string;
 };
-export declare const serializeRoomMembers: (members: readonly RoomMember[]) => {
-    memberId: number;
-    memberState: import("white-web-sdk").MemberState;
-    session: string;
-    payload?: import("white-web-sdk").UserPayload | undefined;
-    uid: string;
-}[];
+export declare const serializeRoomMembers: (members: readonly RoomMember[]) => any[];
+export declare const createInvisiblePlugin: (room: Room) => Promise<WindowManager | undefined>;

package/dist/{InternalEmitter.d.ts → src/InternalEmitter.d.ts}

@@ -1,7 +1,6 @@
 import Emittery from "emittery";
 import type { TeleBoxRect } from "@netless/telebox-insider";
-import type { AppInitState, CursorMovePayload } from "./index";
-import type { Member } from "./Helper";
+import type { CursorMovePayload } from "./index";
 import type { MemberState } from "white-web-sdk";
 export declare type RemoveSceneParams = {
     scenePath: string;
@@ -9,7 +8,6 @@ export declare type RemoveSceneParams = {
 };
 export declare type EmitterEvent = {
     onCreated: undefined;
-    InitReplay: AppInitState;
     error: Error;
     seekStart: undefined;
     seek: number;
@@ -32,7 +30,6 @@ export declare type EmitterEvent = {
     changePageState: undefined;
     writableChange: boolean;
     containerSizeRatioUpdate: number;
-    roomMembersChange: Member[];
     memberStateChange: MemberState;
 };
 export declare type EmitterType = Emittery<EmitterEvent>;

package/dist/{Page → src/Page}/PageController.d.ts

@@ -1,15 +1,17 @@
 import type { SceneDefinition } from "white-web-sdk";
 export declare type AddPageParams = {
     after?: boolean;
-    scene?: SceneDefinition;
+    scene?: SceneDefinition | SceneDefinition[];
 };
 export declare type PageState = {
     index: number;
     length: number;
+    pages: string[];
 };
 export interface PageController {
     nextPage: () => Promise<boolean>;
     prevPage: () => Promise<boolean>;
+    jumpPage: (index: number) => Promise<boolean>;
     addPage: (params?: AddPageParams) => Promise<void>;
     removePage: (index: number) => Promise<boolean>;
     pageState: PageState;

package/dist/{PageState.d.ts → src/PageState.d.ts}

@@ -5,5 +5,6 @@ export declare class PageStateImpl {
     constructor(manager: AppManager);
     get index(): number;
     get length(): number;
+    getPages(): string[];
     toObject(): PageState;
 }

package/dist/{Register → src/Register}/index.d.ts

@@ -11,18 +11,20 @@ export declare type SyncRegisterAppPayload = {
     name: string | undefined;
 };
 export declare type SyncRegisterApp = (payload: SyncRegisterAppPayload) => void;
-declare class AppRegister {
+export declare class AppRegister {
     kindEmitters: Map<string, Emittery<RegisterEvents>>;
     registered: Map<string, RegisterParams>;
     appClassesCache: Map<string, Promise<NetlessApp>>;
     appClasses: Map<string, () => Promise<NetlessApp>>;
+    downloaded: Map<string, string>;
     private syncRegisterApp;
     setSyncRegisterApp(fn: SyncRegisterApp): void;
     onSyncRegisterAppChange: (payload: SyncRegisterAppPayload) => void;
     register(params: RegisterParams): Promise<void>;
+    downloadApp(kind: string): Promise<NetlessApp<any, any, any, any> | undefined> | undefined;
+    removeDownloaded(kind: string): Promise<void>;
     unregister(kind: string): void;
     notifyApp<T extends keyof RegisterEvents>(kind: string, event: T, payload: RegisterEvents[T]): Promise<void>;
     private createKindEmitter;
 }
 export declare const appRegister: AppRegister;
-export {};

package/dist/{Register → src/Register}/loader.d.ts

@@ -1,4 +1,4 @@
 import type { NetlessApp } from "../typings";
-export declare const getScript: (url: string) => Promise<string>;
+export declare const getScript: (kind: string, url: string) => Promise<string>;
 export declare const executeScript: (text: string, appName: string) => NetlessApp;
 export declare const loadApp: (url: string, key: string, name?: string | undefined) => Promise<NetlessApp | undefined>;

package/dist/src/Register/storage.d.ts

@@ -0,0 +1,11 @@
+import type { AppRegister } from "./index";
+export declare type Item = {
+    kind: string;
+    url: string;
+    sourceCode: string;
+};
+export declare const initDb: (appRegister: AppRegister) => Promise<void>;
+export declare const setItem: (kind: string, url: string, val: any) => Promise<void> | undefined;
+export declare const getItem: (kind: string) => Promise<Item | null>;
+export declare const removeItem: (key: string) => Promise<void> | undefined;
+export declare const getAll: () => Promise<Item[]> | undefined;

package/dist/{Utils → src/Utils}/Reactive.d.ts

@@ -1,6 +1,6 @@
 import { UpdateEventKind } from "white-web-sdk";
 import type { AkkoObjectUpdatedListener } from "white-web-sdk";
 export declare const onObjectByEvent: (event: UpdateEventKind) => (object: any, func: () => void) => (() => void) | undefined;
-export declare const safeListenPropsUpdated: <T>(getProps: () => T, callback: AkkoObjectUpdatedListener<T>, onDestroyed?: ((props: unknown) => void) | undefined) => () => void;
+export declare const safeListenPropsUpdated: <T extends Object>(getProps: () => T, callback: AkkoObjectUpdatedListener<T>, onDestroyed?: ((props: unknown) => void) | undefined) => () => void;
 export declare const onObjectRemoved: (object: any, func: () => void) => (() => void) | undefined;
 export declare const onObjectInserted: (object: any, func: () => void) => (() => void) | undefined;

package/dist/{Utils → src/Utils}/error.d.ts

@@ -19,9 +19,12 @@ export declare class BoxNotCreatedError extends Error {
 export declare class InvalidScenePath extends Error {
     message: string;
 }
-export declare class BoxManagerNotFoundError extends Error {
+export declare class BoxManagerNotInitializeError extends Error {
     message: string;
 }
 export declare class BindContainerRoomPhaseInvalidError extends Error {
     message: string;
 }
+export declare class InvalidViewModeError extends Error {
+    message: string;
+}

package/dist/src/View/CameraSynchronizer.d.ts

@@ -0,0 +1,21 @@
+import type { TeleBoxRect } from "@netless/telebox-insider";
+import type { View } from "white-web-sdk";
+import type { ICamera, ISize } from "../AttributesDelegate";
+export declare type SaveCamera = (camera: ICamera) => void;
+export declare class CameraSynchronizer {
+    protected saveCamera: SaveCamera;
+    remoteCamera?: ICamera;
+    remoteSize?: ISize;
+    protected rect?: TeleBoxRect;
+    protected view?: View;
+    protected scale: number;
+    protected cameraUpdating: boolean;
+    constructor(saveCamera: SaveCamera);
+    setRect: (rect: TeleBoxRect, updateCamera?: boolean) => void;
+    setView(view: View): void;
+    onRemoteUpdate: import("lodash").DebouncedFunc<(camera: ICamera, size: ISize, skipUpdate?: any) => void>;
+    onRemoteSizeUpdate(size: ISize): void;
+    onLocalCameraUpdate(camera: ICamera): void;
+    private moveCameraToContian;
+    private moveCamera;
+}

package/dist/{View → src/View}/MainView.d.ts

@@ -1,26 +1,46 @@
+import { Val } from "value-enhancer";
+import { ViewSync } from "./ViewSync";
+import type { ICamera, ISize } from "../AttributesDelegate";
 import type { Size, View } from "white-web-sdk";
 import type { AppManager } from "../AppManager";
+import type { MoveCameraParams } from "../typings";
 export declare class MainViewProxy {
     private manager;
     private started;
     private mainViewIsAddListener;
     private mainView;
     private store;
-    private synchronizer;
     private sideEffectManager;
+    camera$: Val<{
+        id: string;
+        centerX: number | null;
+        centerY: number | null;
+        scale: number;
+    } | undefined, any>;
+    size$: Val<ISize | undefined, any>;
+    view$: Val<View | undefined, any>;
+    private cameraUpdatePromise?;
+    viewSync?: ViewSync;
     constructor(manager: AppManager);
+    createViewSync: () => void;
     private startListenWritableChange;
     ensureCameraAndSize(): void;
+    moveCamera: (camera: MoveCameraParams) => void;
+    moveCameraToPromise: (camera: MoveCameraParams) => Promise<boolean>;
+    private debouncedStoreCamera;
+    private storeCurrentCameraSize;
     private get mainViewCamera();
     private get mainViewSize();
     private get didRelease();
-    private moveCameraSizeByAttributes;
     start(): void;
     addCameraReaction: () => void;
-    setCameraAndSize(): void;
+    saveToCamera$: () => void;
+    storeCurrentCamera: () => void;
+    storeCurrentSize: () => void;
+    storeCamera: (camera: ICamera) => void;
+    storeSize: (size: ISize) => void;
     private cameraReaction;
-    sizeChangeHandler: import("lodash").DebouncedFunc<(size: Size) => void>;
-    onUpdateContainerSizeRatio: () => void;
+    private sizeReaction;
     get view(): View;
     get cameraState(): {
         width: number;
@@ -33,8 +53,6 @@ export declare class MainViewProxy {
     onReconnect(): void;
     setFocusScenePath(path: string | undefined): View | undefined;
     rebind(): void;
-    private onCameraUpdatedByDevice;
-    private getStageSize;
     addMainViewListener(): void;
     removeMainViewListener(): void;
     private mainViewClickListener;