@netless/window-manager 1.0.0-canary.2 → 1.0.0-canary.22

package/__mocks__/white-web-sdk.ts

@@ -34,8 +34,17 @@ enum ViewMode {
     Broadcaster = "broadcaster",
 }
 
+enum AnimationMode {
+    Immediately = "immediately",
+    Continuous = "continuous",
+}
+
 const isPlayer = vi.fn(() => false);
+const unlistenDisposed = vi.fn();
+const unlistenUpdated = vi.fn();
+const toJS = vi.fn();
 
 export {
-    InvisiblePlugin, UpdateEventKind, ApplianceNames, ViewMode, isPlayer
+    InvisiblePlugin, UpdateEventKind, ApplianceNames, ViewMode, isPlayer, unlistenDisposed,
+    unlistenUpdated, toJS, AnimationMode
 }

package/dist/App/AppContext.d.ts

@@ -3,15 +3,17 @@ import { autorun, listenDisposed, listenUpdated, reaction, unlistenDisposed, unl
 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";
+import { WhiteBoardView } from "./WhiteboardView";
+export declare type CreateWhiteBoardViewParams = {
+    size?: number;
+    syncCamera?: boolean;
+};
 export declare class AppContext<TAttributes = any, TMagixEventPayloads = any, TAppOptions = any> {
     private manager;
-    private boxManager;
     appId: string;
     private appProxy;
     private appOptions?;
@@ -30,15 +32,17 @@ export declare class AppContext<TAttributes = any, TMagixEventPayloads = any, TA
     private store;
     readonly isAddApp: boolean;
     readonly isReplay: boolean;
-    private whiteBoardView?;
-    constructor(manager: AppManager, boxManager: BoxManager, appId: string, appProxy: AppProxy, appOptions?: TAppOptions | (() => TAppOptions) | undefined);
+    whiteBoardView?: WhiteBoardView;
+    _viewWrapper?: HTMLElement;
+    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;
     /** @deprecated Use context.storage.state instead. */
     getAttributes: () => TAttributes | undefined;
     getScenes: () => SceneDefinition[] | undefined;
     get view(): View | undefined;
-    createWhiteBoardView: (size?: number | undefined) => WhiteBoardView;
-    private initPageSize;
+    createWhiteBoardView: (params?: CreateWhiteBoardViewParams | undefined) => WhiteBoardView;
+    private ensurePageSize;
     getInitScenePath: () => string | undefined;
     /** Get App writable status. */
     get isWritable(): boolean;

package/dist/App/AppProxy.d.ts

@@ -1,12 +1,16 @@
 import Emittery from "emittery";
 import { AppContext } from "./AppContext";
 import { AppPageStateImpl } from "./AppPageStateImpl";
-import type { AppEmitterEvent, AppInitState, BaseInsertParams } from "../index";
+import { Val } from "value-enhancer";
+import { SideEffectManager } from "side-effect-manager";
+import type { ICamera, ISize } from "../AttributesDelegate";
+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;
@@ -22,15 +26,32 @@ export declare class AppProxy implements PageRemoveService {
     private appProxies;
     private viewManager;
     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;
+    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>;
+    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;
@@ -51,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;
@@ -65,6 +86,13 @@ export declare class AppProxy implements PageRemoveService {
     removeSceneByIndex(index: number): Promise<boolean>;
     setSceneIndexWithoutSync(index: number): void;
     setSceneIndex(index: number): void;
+    storeCamera: (camera: ICamera) => void;
+    storeSize: (size: ISize) => 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;
     close(): Promise<void>;
 }

package/dist/App/{WhiteBoardView.d.ts → WhiteboardView.d.ts}

@@ -2,15 +2,24 @@ 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 } from "../AttributesDelegate";
+export declare type WhiteBoardViewCamera = Omit<ICamera, "scale" | "id">;
 export declare class WhiteBoardView implements PageController {
+    view: View;
     protected appContext: AppContext;
     protected appProxy: AppProxy;
+    ensureSize: (size: number) => void;
     readonly pageState$: ReadonlyVal<PageState>;
-    constructor(appContext: AppContext, appProxy: AppProxy);
+    readonly camera$: ReadonlyVal<WhiteBoardViewCamera>;
+    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>;
+    setRect(rect: Omit<TeleBoxRect, "x" | "y">): void;
 }

package/dist/App/index.d.ts

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

package/dist/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/AppManager.d.ts

@@ -16,15 +16,15 @@ export declare class AppManager {
     appStatus: Map<string, AppStatus>;
     store: import("./AttributesDelegate").AttributesDelegate;
     mainViewProxy: MainViewProxy;
-    refresher?: ReconnectRefresher;
+    refresher: ReconnectRefresher;
     isReplay: boolean;
     mainViewScenesLength: number;
     private appListeners;
     boxManager?: BoxManager;
-    private _prevSceneIndex;
-    private _prevFocused;
     private callbacksNode;
     private appCreateQueue;
+    private sceneIndex$;
+    private focused$;
     private sideEffectManager;
     sceneState: SceneState | null;
     rootDirRemoving: boolean;
@@ -65,9 +65,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

@@ -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",
@@ -14,7 +14,9 @@ export declare enum Fields {
     Position = "position",
     CursorState = "cursorState",
     FullPath = "fullPath",
-    Registered = "registered"
+    Registered = "registered",
+    Camera = "camera",
+    Size = "size"
 }
 export declare type Apps = {
     [key: string]: AppSyncAttributes;
@@ -31,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;
@@ -50,6 +55,7 @@ export declare class AttributesDelegate {
     getMinimized(): any;
     setupAppAttributes(params: AddAppParams, id: string, isDynamicPPT: boolean): void;
     updateAppState(appId: string, stateName: AppAttributes, state: any): void;
+    updateAppAttributes(appId: string, key: string, value: any): void;
     cleanAppAttributes(id: string): void;
     cleanFocus(): void;
     getAppSceneIndex(id: string): any;
@@ -59,8 +65,8 @@ export declare class AttributesDelegate {
     getBoxState(): any;
     setMainViewScenePath(scenePath: string): void;
     setMainViewSceneIndex(index: number): void;
-    getMainViewCamera(): MainViewCamera;
-    getMainViewSize(): MainViewSize;
+    getMainViewCamera(): ICamera;
+    getMainViewSize(): ISize;
     setMainViewCamera(camera: ICamera): void;
     setMainViewSize(size: ISize): void;
     setMainViewCameraAndSize(camera: ICamera, size: ISize): void;
@@ -71,17 +77,6 @@ export declare class AttributesDelegate {
     cleanCursor(uid: string): void;
     setMainViewFocusPath(mainView: View): void;
 }
-export declare type MainViewSize = {
-    id: string;
-    width: number;
-    height: number;
-};
-export declare type MainViewCamera = {
-    id: string;
-    centerX: number;
-    centerY: number;
-    scale: number;
-};
 export declare type Cursors = {
     [key: string]: Cursor;
 };

package/dist/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 { AddAppOptions } from "./index";
 import type { TeleBoxManagerUpdateConfig, ReadonlyTeleBox, TeleBoxColorScheme, TeleBoxRect, TeleBoxConfig } 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,10 @@ export declare type CreateTeleBoxManagerConfig = {
     collectorStyles?: Partial<CSSStyleDeclaration>;
     prefersColorScheme?: TeleBoxColorScheme;
     stageRatio?: number;
+    highlightStage?: boolean;
 };
 export declare type BoxManagerContext = {
     safeSetAttributes: (attributes: any) => void;
-    getMainView: () => View;
     updateAppState: (appId: string, field: AppAttributes, value: any) => void;
     emitter: EmitterType;
     boxEmitter: BoxEmitterType;
@@ -63,7 +64,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,14 +72,15 @@ export declare class BoxManager {
     get prefersColorScheme(): TeleBoxColorScheme;
     get boxSize(): number;
     get stageRect(): TeleBoxRect;
-    createBox(params: CreateBoxParams): void;
+    get stageRect$(): import("value-enhancer").ReadonlyVal<TeleBoxRect, any>;
+    createBox(params: CreateBoxParams): ReadonlyTeleBox | undefined;
     setupBoxManager(createTeleBoxManagerConfig?: CreateTeleBoxManagerConfig): TeleBoxManager;
     getBox(appId: string): ReadonlyTeleBox | undefined;
     closeBox(appId: string, skipUpdate?: boolean): ReadonlyTeleBox | undefined;
     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/Cursor/index.d.ts

@@ -15,7 +15,6 @@ export declare type MoveCursorParams = {
 export declare class CursorManager {
     private manager;
     private enableCursor;
-    containerRect?: DOMRect;
     wrapperRect?: DOMRect;
     cursorInstances: Map<string, Cursor>;
     roomMembers?: readonly RoomMember[];

package/dist/InternalEmitter.d.ts

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

package/dist/Page/PageController.d.ts

@@ -10,6 +10,7 @@ export declare type PageState = {
 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/ReconnectRefresher.d.ts

@@ -17,7 +17,7 @@ export declare class ReconnectRefresher {
     private _onReconnected;
     private releaseDisposers;
     refresh(): void;
-    add(id: string, func: any): void;
+    add(id: string, func: any): () => void;
     remove(id: string): void;
     hasReactor(id: string): boolean;
     destroy(): void;

package/dist/Utils/Common.d.ts

@@ -4,6 +4,7 @@ import type Emittery from "emittery";
 export declare const genAppId: (kind: string) => Promise<string>;
 export declare const setViewFocusScenePath: (view: View, focusScenePath: string) => View | undefined;
 export declare const setViewSceneIndex: (view: View, index: number) => View | undefined;
+export declare const releaseView: (view: View) => void;
 export declare const setScenePath: (room: Room | undefined, scenePath: string) => void;
 export declare const getScenePath: (room: Room | undefined, dir: string | undefined, index: number) => string | undefined;
 export declare const removeScenes: (room: Room | undefined, scenePath: string, index?: number | undefined) => void;

package/dist/View/CameraSynchronizer.d.ts

@@ -1,17 +1,17 @@
 import type { TeleBoxRect } from "@netless/telebox-insider";
-import type { Camera, View, Size } from "white-web-sdk";
-import type { MainViewSize } from "../AttributesDelegate";
-export declare type SaveCamera = (camera: Camera) => void;
+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;
-    protected remoteCamera?: Camera;
-    protected remoteSize?: MainViewSize;
+    remoteCamera?: ICamera;
+    remoteSize?: ISize;
     protected rect?: TeleBoxRect;
     protected view?: View;
     constructor(saveCamera: SaveCamera);
-    setRect(rect: TeleBoxRect): void;
+    setRect: import("lodash").DebouncedFunc<(rect: TeleBoxRect) => void>;
     setView(view: View): void;
-    onRemoteUpdate: import("lodash").DebouncedFunc<(camera: Camera, size: MainViewSize) => void>;
-    onLocalCameraUpdate(camera: Camera): void;
-    onLocalSizeUpdate(size: Size): void;
+    onRemoteUpdate: import("lodash").DebouncedFunc<(camera: ICamera, size: ISize) => void>;
+    onRemoteSizeUpdate(size: ISize): void;
+    onLocalCameraUpdate(camera: ICamera): void;
 }

package/dist/View/MainView.d.ts

@@ -1,3 +1,6 @@
+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";
 export declare class MainViewProxy {
@@ -6,21 +9,31 @@ export declare class MainViewProxy {
     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>;
+    viewSync?: ViewSync;
     constructor(manager: AppManager);
+    createViewSync: () => void;
     private startListenWritableChange;
     ensureCameraAndSize(): void;
     private get mainViewCamera();
     private get mainViewSize();
     private get didRelease();
-    private moveCameraSizeByAttributes;
     start(): void;
     addCameraReaction: () => void;
-    setCameraAndSize(): 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 +46,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;

package/dist/View/ViewSync.d.ts

@@ -0,0 +1,24 @@
+import { ViewMode } from "white-web-sdk";
+import type { View } from "white-web-sdk";
+import type { Val, ReadonlyVal } from "value-enhancer";
+import type { ICamera, ISize } from "../AttributesDelegate";
+import type { TeleBoxRect } from "@netless/telebox-insider";
+export declare type ViewSyncContext = {
+    uid: string;
+    camera$: Val<ICamera | undefined, boolean>;
+    size$: Val<ISize | undefined>;
+    stageRect$: ReadonlyVal<TeleBoxRect>;
+    viewMode$?: Val<ViewMode>;
+    storeCamera: (camera: ICamera) => void;
+    storeSize: (size: ISize) => void;
+    view$: Val<View | undefined>;
+};
+export declare class ViewSync {
+    private context;
+    private sem;
+    private synchronizer;
+    constructor(context: ViewSyncContext);
+    bindView: (view?: View | undefined) => void;
+    private onCameraUpdatedByDevice;
+    destroy(): void;
+}

package/dist/constants.d.ts

@@ -5,7 +5,6 @@ export declare enum Events {
     AppBoxStateChange = "AppBoxStateChange",
     GetAttributes = "GetAttributes",
     UpdateWindowManagerWrapper = "UpdateWindowManagerWrapper",
-    InitReplay = "InitReplay",
     WindowCreated = "WindowCreated",
     SetMainViewScenePath = "SetMainViewScenePath",
     SetMainViewSceneIndex = "SetMainViewSceneIndex",
@@ -24,7 +23,12 @@ export declare enum AppAttributes {
     Size = "size",
     Position = "position",
     SceneIndex = "SceneIndex",
-    ZIndex = "zIndex"
+    ZIndex = "zIndex",
+    Visible = "visible",
+    Ratio = "ratio",
+    StageRatio = "stageRatio",
+    Draggable = "draggable",
+    Resizable = "resizable"
 }
 export declare enum AppEvents {
     setBoxSize = "setBoxSize",