@realitycollective/iwsdk-uiextensions 0.1.0-preview.4

package/dist/systems/drag-system.js

@@ -0,0 +1,167 @@
+/**
+ * UIDragSystem - drag windows by the title bar.
+ *
+ * Reuses `@pmndrs/handle` (the exact library behind the IWSDK's grab
+ * systems): a `HandleStore` targets the window entity's object while being
+ * *bound* to the title-bar uikit element, so grabbing the title bar with the
+ * ray (or a pinch) moves the whole window with the same feel as native IWSDK
+ * grabbing. The system pumps its own stores, so it works even when the app
+ * doesn't enable `features.grabbing`.
+ *
+ * Dragging implies placing: on grab the window leaves any dock region and
+ * switches to `world-locked`; on release near a region it docks there.
+ */
+import { HandleStore } from '@pmndrs/handle';
+import { PanelDocument, Vector3, createSystem, } from '@iwsdk/core';
+import { UIDockRegion, UIDockedTo, UIWindow, UIWindowState } from '../components.js';
+import { WINDOW_CHROME_IDS } from '@realitycollective/webxr-uiextensions';
+import { DockMode } from '@realitycollective/webxr-uiextensions';
+import { faceViewerYaw } from '@realitycollective/webxr-uiextensions';
+import { HoldToDrag } from '@realitycollective/webxr-uiextensions';
+import { regionRegistryFor } from '../region-registry-store.js';
+import { windowManagerFor } from '../manager-registry.js';
+export class UIDragSystem extends createSystem({
+    windows: { required: [UIWindow, UIWindowState, PanelDocument] },
+    regions: { required: [UIDockRegion] },
+}) {
+    states = new Map();
+    worldPosition = new Vector3();
+    viewerPosition = new Vector3();
+    init() {
+        this.cleanupFuncs.push(this.queries.windows.subscribe('qualify', (entity) => {
+            this.attach(entity);
+        }), this.queries.windows.subscribe('disqualify', (entity) => {
+            this.detach(entity);
+        }));
+        this.queries.windows.entities.forEach((entity) => this.attach(entity));
+    }
+    update(delta) {
+        for (const [entity, state] of this.states) {
+            const held = state.store.inputState.size > 0;
+            const { phase, began, ended } = state.hold.update(held, delta);
+            if (began) {
+                this.onDragStart(entity);
+            }
+            if (phase === 'dragging') {
+                // The store only runs while an actual drag is in progress: presses
+                // shorter than the hold delay never move the window (they're
+                // clicks), and skipping the release-frame update stops the handle
+                // from restoring its grab-time rotation over our billboard yaw.
+                state.store.update(delta);
+                this.whileDragging(entity);
+            }
+            if (ended) {
+                this.onDragEnd(entity);
+            }
+        }
+    }
+    attach(entity) {
+        if (this.states.has(entity) || !entity.getValue(UIWindow, 'movable')) {
+            return;
+        }
+        const document = PanelDocument.data.document[entity.index];
+        const titlebar = document?.getElementById(WINDOW_CHROME_IDS.titlebar);
+        const object = entity.object3D;
+        if (!titlebar || !object) {
+            return;
+        }
+        const store = new HandleStore(object, () => ({
+            translate: true,
+            rotate: false,
+            scale: false,
+            multitouch: false,
+            projectRays: false,
+        }));
+        // The title-bar uikit element is an Object3D - bind it as the grab
+        // surface while the store's target stays the window root.
+        store.bind(titlebar);
+        this.states.set(entity, {
+            store,
+            hold: new HoldToDrag(Math.max(0, entity.getValue(UIWindow, 'dragDelay'))),
+        });
+    }
+    detach(entity) {
+        const state = this.states.get(entity);
+        if (!state) {
+            return;
+        }
+        try {
+            state.store.cancel();
+        }
+        catch {
+            // Handle stores throw when cancelled with no active input; ignore.
+        }
+        this.states.delete(entity);
+    }
+    onDragStart(entity) {
+        const id = entity.getValue(UIWindow, 'windowId');
+        const manager = windowManagerFor(this.world);
+        if (id && manager.has(id)) {
+            manager.focus(id);
+            // Mark dragging BEFORE the dock change so the pin label reads "PIN"
+            // (loose in hand) throughout the drag, not "UNPIN".
+            manager.setDragging(id, true);
+        }
+        // Grabbing takes the window out of any region and out of follow mode -
+        // the user is placing it by hand.
+        if (entity.hasComponent(UIDockedTo)) {
+            entity.removeComponent(UIDockedTo);
+        }
+        if (entity.getValue(UIWindow, 'dockMode') !== DockMode.WorldLocked) {
+            entity.setValue(UIWindow, 'dockMode', DockMode.WorldLocked);
+        }
+    }
+    whileDragging(entity) {
+        if (!entity.getValue(UIWindow, 'billboardWhileDragging')) {
+            return;
+        }
+        const object = entity.object3D;
+        if (!object) {
+            return;
+        }
+        object.getWorldPosition(this.worldPosition);
+        this.camera.getWorldPosition(this.viewerPosition);
+        const yaw = faceViewerYaw([this.worldPosition.x, this.worldPosition.y, this.worldPosition.z], [this.viewerPosition.x, this.viewerPosition.y, this.viewerPosition.z], object.rotation.y);
+        object.rotation.set(0, yaw, 0);
+    }
+    onDragEnd(entity) {
+        const id = entity.getValue(UIWindow, 'windowId');
+        const manager = windowManagerFor(this.world);
+        if (id && manager.has(id)) {
+            manager.setDragging(id, false); // released → placed → label "UNPIN"
+        }
+        // Settle facing the viewer at the drop spot - the window keeps the
+        // orientation it was dragged in, not its pre-drag rotation.
+        this.whileDragging(entity);
+        const object = entity.object3D;
+        if (!object) {
+            return;
+        }
+        object.getWorldPosition(this.worldPosition);
+        const dropPoint = [
+            this.worldPosition.x,
+            this.worldPosition.y,
+            this.worldPosition.z,
+        ];
+        const registry = regionRegistryFor(this.world);
+        const origins = new Map();
+        this.queries.regions.entities.forEach((regionEntity) => {
+            const regionId = regionEntity.getValue(UIDockRegion, 'regionId');
+            const regionObject = regionEntity.object3D;
+            if (!regionId || !regionObject) {
+                return;
+            }
+            regionObject.getWorldPosition(this.viewerPosition);
+            origins.set(regionId, [
+                this.viewerPosition.x,
+                this.viewerPosition.y,
+                this.viewerPosition.z,
+            ]);
+        });
+        const captured = registry.capture(dropPoint, origins);
+        if (captured !== undefined) {
+            entity.addComponent(UIDockedTo, { regionId: captured });
+        }
+    }
+}
+//# sourceMappingURL=drag-system.js.map

package/dist/systems/drag-system.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"drag-system.js","sourceRoot":"","sources":["../../src/systems/drag-system.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * UIDragSystem - drag windows by the title bar.\n *\n * Reuses `@pmndrs/handle` (the exact library behind the IWSDK's grab\n * systems): a `HandleStore` targets the window entity's object while being\n * *bound* to the title-bar uikit element, so grabbing the title bar with the\n * ray (or a pinch) moves the whole window with the same feel as native IWSDK\n * grabbing. The system pumps its own stores, so it works even when the app\n * doesn't enable `features.grabbing`.\n *\n * Dragging implies placing: on grab the window leaves any dock region and\n * switches to `world-locked`; on release near a region it docks there.\n */\nimport { HandleStore } from '@pmndrs/handle';\nimport {\n  PanelDocument,\n  UIKitDocument,\n  Object3D,\n  Vector3,\n  createSystem,\n  type Entity,\n} from '@iwsdk/core';\nimport { UIDockRegion, UIDockedTo, UIWindow, UIWindowState } from '../components.js';\nimport { WINDOW_CHROME_IDS } from '@realitycollective/webxr-uiextensions';\nimport { DockMode } from '@realitycollective/webxr-uiextensions';\nimport { faceViewerYaw } from '@realitycollective/webxr-uiextensions';\nimport { HoldToDrag } from '@realitycollective/webxr-uiextensions';\nimport type { Vec3 } from '@realitycollective/webxr-uiextensions';\nimport { regionRegistryFor } from '../region-registry-store.js';\nimport { windowManagerFor } from '../manager-registry.js';\n\ninterface DragState {\n  store: HandleStore<unknown>;\n  hold: HoldToDrag;\n}\n\nexport class UIDragSystem extends createSystem({\n  windows: { required: [UIWindow, UIWindowState, PanelDocument] },\n  regions: { required: [UIDockRegion] },\n}) {\n  private states = new Map<Entity, DragState>();\n  private worldPosition = new Vector3();\n  private viewerPosition = new Vector3();\n\n  override init(): void {\n    this.cleanupFuncs.push(\n      this.queries.windows.subscribe('qualify', (entity) => {\n        this.attach(entity);\n      }),\n      this.queries.windows.subscribe('disqualify', (entity) => {\n        this.detach(entity);\n      }),\n    );\n    this.queries.windows.entities.forEach((entity) => this.attach(entity));\n  }\n\n  override update(delta: number): void {\n    for (const [entity, state] of this.states) {\n      const held = state.store.inputState.size > 0;\n      const { phase, began, ended } = state.hold.update(held, delta);\n\n      if (began) {\n        this.onDragStart(entity);\n      }\n      if (phase === 'dragging') {\n        // The store only runs while an actual drag is in progress: presses\n        // shorter than the hold delay never move the window (they're\n        // clicks), and skipping the release-frame update stops the handle\n        // from restoring its grab-time rotation over our billboard yaw.\n        state.store.update(delta);\n        this.whileDragging(entity);\n      }\n      if (ended) {\n        this.onDragEnd(entity);\n      }\n    }\n  }\n\n  private attach(entity: Entity): void {\n    if (this.states.has(entity) || !entity.getValue(UIWindow, 'movable')) {\n      return;\n    }\n    const document = PanelDocument.data.document[entity.index] as\n      | UIKitDocument\n      | undefined;\n    const titlebar = document?.getElementById(WINDOW_CHROME_IDS.titlebar);\n    const object = entity.object3D;\n    if (!titlebar || !object) {\n      return;\n    }\n    const store = new HandleStore(object, () => ({\n      translate: true as const,\n      rotate: false as const,\n      scale: false as const,\n      multitouch: false,\n      projectRays: false,\n    }));\n    // The title-bar uikit element is an Object3D - bind it as the grab\n    // surface while the store's target stays the window root.\n    store.bind(titlebar as unknown as Object3D<never>);\n    this.states.set(entity, {\n      store,\n      hold: new HoldToDrag(Math.max(0, entity.getValue(UIWindow, 'dragDelay') as number)),\n    });\n  }\n\n  private detach(entity: Entity): void {\n    const state = this.states.get(entity);\n    if (!state) {\n      return;\n    }\n    try {\n      state.store.cancel();\n    } catch {\n      // Handle stores throw when cancelled with no active input; ignore.\n    }\n    this.states.delete(entity);\n  }\n\n  private onDragStart(entity: Entity): void {\n    const id = entity.getValue(UIWindow, 'windowId') as string;\n    const manager = windowManagerFor(this.world);\n    if (id && manager.has(id)) {\n      manager.focus(id);\n      // Mark dragging BEFORE the dock change so the pin label reads \"PIN\"\n      // (loose in hand) throughout the drag, not \"UNPIN\".\n      manager.setDragging(id, true);\n    }\n    // Grabbing takes the window out of any region and out of follow mode -\n    // the user is placing it by hand.\n    if (entity.hasComponent(UIDockedTo)) {\n      entity.removeComponent(UIDockedTo);\n    }\n    if (entity.getValue(UIWindow, 'dockMode') !== DockMode.WorldLocked) {\n      entity.setValue(UIWindow, 'dockMode', DockMode.WorldLocked);\n    }\n  }\n\n  private whileDragging(entity: Entity): void {\n    if (!entity.getValue(UIWindow, 'billboardWhileDragging')) {\n      return;\n    }\n    const object = entity.object3D;\n    if (!object) {\n      return;\n    }\n    object.getWorldPosition(this.worldPosition);\n    this.camera.getWorldPosition(this.viewerPosition);\n    const yaw = faceViewerYaw(\n      [this.worldPosition.x, this.worldPosition.y, this.worldPosition.z],\n      [this.viewerPosition.x, this.viewerPosition.y, this.viewerPosition.z],\n      object.rotation.y,\n    );\n    object.rotation.set(0, yaw, 0);\n  }\n\n  private onDragEnd(entity: Entity): void {\n    const id = entity.getValue(UIWindow, 'windowId') as string;\n    const manager = windowManagerFor(this.world);\n    if (id && manager.has(id)) {\n      manager.setDragging(id, false); // released → placed → label \"UNPIN\"\n    }\n    // Settle facing the viewer at the drop spot - the window keeps the\n    // orientation it was dragged in, not its pre-drag rotation.\n    this.whileDragging(entity);\n    const object = entity.object3D;\n    if (!object) {\n      return;\n    }\n    object.getWorldPosition(this.worldPosition);\n    const dropPoint: Vec3 = [\n      this.worldPosition.x,\n      this.worldPosition.y,\n      this.worldPosition.z,\n    ];\n\n    const registry = regionRegistryFor(this.world);\n    const origins = new Map<string, Vec3>();\n    this.queries.regions.entities.forEach((regionEntity) => {\n      const regionId = regionEntity.getValue(UIDockRegion, 'regionId') as string;\n      const regionObject = regionEntity.object3D;\n      if (!regionId || !regionObject) {\n        return;\n      }\n      regionObject.getWorldPosition(this.viewerPosition);\n      origins.set(regionId, [\n        this.viewerPosition.x,\n        this.viewerPosition.y,\n        this.viewerPosition.z,\n      ]);\n    });\n\n    const captured = registry.capture(dropPoint, origins);\n    if (captured !== undefined) {\n      entity.addComponent(UIDockedTo, { regionId: captured });\n    }\n  }\n}\n"]}

package/dist/systems/window-system.d.ts

@@ -0,0 +1,439 @@
+/**
+ * UIWindowSystem - wires window chrome, keeps the `WindowManager` in sync
+ * with entities, applies focus ordering and minimize state.
+ *
+ * Reuse over recreation: the panel itself is loaded/rendered by the IWSDK's
+ * `PanelUISystem`; this system only discovers the chrome elements by their
+ * well-known ids and drives them.
+ */
+import { type Entity } from '@iwsdk/core';
+declare const UIWindowSystem_base: import("elics").SystemConstructor<import("elics").SystemSchema, {
+    pendingWindows: {
+        required: (import("elics").Component<{
+            windowId: {
+                type: import("@iwsdk/core").Types.String;
+                default: string;
+            };
+            title: {
+                type: import("@iwsdk/core").Types.String;
+                default: string;
+            };
+            dockMode: {
+                type: import("@iwsdk/core").Types.Enum;
+                enum: {
+                    readonly WorldLocked: "world-locked";
+                    readonly BodyFollow: "body-follow";
+                    readonly HeadLocked: "head-locked";
+                };
+                default: "world-locked";
+            };
+            movable: {
+                type: import("@iwsdk/core").Types.Boolean;
+                default: true;
+            };
+            closable: {
+                type: import("@iwsdk/core").Types.Boolean;
+                default: true;
+            };
+            minimizable: {
+                type: import("@iwsdk/core").Types.Boolean;
+                default: true;
+            };
+            pinnable: {
+                type: import("@iwsdk/core").Types.Boolean;
+                default: true;
+            };
+            billboardWhileDragging: {
+                type: import("@iwsdk/core").Types.Boolean;
+                default: true;
+            };
+            dragDelay: {
+                type: import("@iwsdk/core").Types.Float32;
+                default: number;
+            };
+            followOffset: {
+                type: import("@iwsdk/core").Types.Vec3;
+                default: [number, number, number];
+            };
+            followSpeed: {
+                type: import("@iwsdk/core").Types.Float32;
+                default: number;
+            };
+            followTolerance: {
+                type: import("@iwsdk/core").Types.Float32;
+                default: number;
+            };
+            focusBias: {
+                type: import("@iwsdk/core").Types.Float32;
+                default: number;
+            };
+            targetWidth: {
+                type: import("@iwsdk/core").Types.Float32;
+                default: number;
+            };
+            targetHeight: {
+                type: import("@iwsdk/core").Types.Float32;
+                default: number;
+            };
+        }> | import("elics").Component<{
+            config: {
+                type: import("@iwsdk/core").Types.String;
+                default: string;
+            };
+        }> | import("elics").Component<{
+            document: {
+                type: import("@iwsdk/core").Types.Object;
+                default: undefined;
+            };
+        }>)[];
+        excluded: import("elics").Component<{
+            appliedDockMode: {
+                type: import("@iwsdk/core").Types.String;
+                default: string;
+            };
+            chromeWired: {
+                type: import("@iwsdk/core").Types.Boolean;
+                default: false;
+            };
+            homeDockMode: {
+                type: import("@iwsdk/core").Types.String;
+                default: string;
+            };
+            homeRegion: {
+                type: import("@iwsdk/core").Types.String;
+                default: string;
+            };
+            homePosition: {
+                type: import("@iwsdk/core").Types.Vec3;
+                default: [number, number, number];
+            };
+            homeYaw: {
+                type: import("@iwsdk/core").Types.Float32;
+                default: number;
+            };
+        }>[];
+    };
+    windows: {
+        required: (import("elics").Component<{
+            windowId: {
+                type: import("@iwsdk/core").Types.String;
+                default: string;
+            };
+            title: {
+                type: import("@iwsdk/core").Types.String;
+                default: string;
+            };
+            dockMode: {
+                type: import("@iwsdk/core").Types.Enum;
+                enum: {
+                    readonly WorldLocked: "world-locked";
+                    readonly BodyFollow: "body-follow";
+                    readonly HeadLocked: "head-locked";
+                };
+                default: "world-locked";
+            };
+            movable: {
+                type: import("@iwsdk/core").Types.Boolean;
+                default: true;
+            };
+            closable: {
+                type: import("@iwsdk/core").Types.Boolean;
+                default: true;
+            };
+            minimizable: {
+                type: import("@iwsdk/core").Types.Boolean;
+                default: true;
+            };
+            pinnable: {
+                type: import("@iwsdk/core").Types.Boolean;
+                default: true;
+            };
+            billboardWhileDragging: {
+                type: import("@iwsdk/core").Types.Boolean;
+                default: true;
+            };
+            dragDelay: {
+                type: import("@iwsdk/core").Types.Float32;
+                default: number;
+            };
+            followOffset: {
+                type: import("@iwsdk/core").Types.Vec3;
+                default: [number, number, number];
+            };
+            followSpeed: {
+                type: import("@iwsdk/core").Types.Float32;
+                default: number;
+            };
+            followTolerance: {
+                type: import("@iwsdk/core").Types.Float32;
+                default: number;
+            };
+            focusBias: {
+                type: import("@iwsdk/core").Types.Float32;
+                default: number;
+            };
+            targetWidth: {
+                type: import("@iwsdk/core").Types.Float32;
+                default: number;
+            };
+            targetHeight: {
+                type: import("@iwsdk/core").Types.Float32;
+                default: number;
+            };
+        }> | import("elics").Component<{
+            appliedDockMode: {
+                type: import("@iwsdk/core").Types.String;
+                default: string;
+            };
+            chromeWired: {
+                type: import("@iwsdk/core").Types.Boolean;
+                default: false;
+            };
+            homeDockMode: {
+                type: import("@iwsdk/core").Types.String;
+                default: string;
+            };
+            homeRegion: {
+                type: import("@iwsdk/core").Types.String;
+                default: string;
+            };
+            homePosition: {
+                type: import("@iwsdk/core").Types.Vec3;
+                default: [number, number, number];
+            };
+            homeYaw: {
+                type: import("@iwsdk/core").Types.Float32;
+                default: number;
+            };
+        }> | import("elics").Component<{
+            document: {
+                type: import("@iwsdk/core").Types.Object;
+                default: undefined;
+            };
+        }>)[];
+    };
+}, World, import("@iwsdk/core").System<import("elics").SystemSchema, {
+    pendingWindows: {
+        required: (import("elics").Component<{
+            windowId: {
+                type: import("@iwsdk/core").Types.String;
+                default: string;
+            };
+            title: {
+                type: import("@iwsdk/core").Types.String;
+                default: string;
+            };
+            dockMode: {
+                type: import("@iwsdk/core").Types.Enum;
+                enum: {
+                    readonly WorldLocked: "world-locked";
+                    readonly BodyFollow: "body-follow";
+                    readonly HeadLocked: "head-locked";
+                };
+                default: "world-locked";
+            };
+            movable: {
+                type: import("@iwsdk/core").Types.Boolean;
+                default: true;
+            };
+            closable: {
+                type: import("@iwsdk/core").Types.Boolean;
+                default: true;
+            };
+            minimizable: {
+                type: import("@iwsdk/core").Types.Boolean;
+                default: true;
+            };
+            pinnable: {
+                type: import("@iwsdk/core").Types.Boolean;
+                default: true;
+            };
+            billboardWhileDragging: {
+                type: import("@iwsdk/core").Types.Boolean;
+                default: true;
+            };
+            dragDelay: {
+                type: import("@iwsdk/core").Types.Float32;
+                default: number;
+            };
+            followOffset: {
+                type: import("@iwsdk/core").Types.Vec3;
+                default: [number, number, number];
+            };
+            followSpeed: {
+                type: import("@iwsdk/core").Types.Float32;
+                default: number;
+            };
+            followTolerance: {
+                type: import("@iwsdk/core").Types.Float32;
+                default: number;
+            };
+            focusBias: {
+                type: import("@iwsdk/core").Types.Float32;
+                default: number;
+            };
+            targetWidth: {
+                type: import("@iwsdk/core").Types.Float32;
+                default: number;
+            };
+            targetHeight: {
+                type: import("@iwsdk/core").Types.Float32;
+                default: number;
+            };
+        }> | import("elics").Component<{
+            config: {
+                type: import("@iwsdk/core").Types.String;
+                default: string;
+            };
+        }> | import("elics").Component<{
+            document: {
+                type: import("@iwsdk/core").Types.Object;
+                default: undefined;
+            };
+        }>)[];
+        excluded: import("elics").Component<{
+            appliedDockMode: {
+                type: import("@iwsdk/core").Types.String;
+                default: string;
+            };
+            chromeWired: {
+                type: import("@iwsdk/core").Types.Boolean;
+                default: false;
+            };
+            homeDockMode: {
+                type: import("@iwsdk/core").Types.String;
+                default: string;
+            };
+            homeRegion: {
+                type: import("@iwsdk/core").Types.String;
+                default: string;
+            };
+            homePosition: {
+                type: import("@iwsdk/core").Types.Vec3;
+                default: [number, number, number];
+            };
+            homeYaw: {
+                type: import("@iwsdk/core").Types.Float32;
+                default: number;
+            };
+        }>[];
+    };
+    windows: {
+        required: (import("elics").Component<{
+            windowId: {
+                type: import("@iwsdk/core").Types.String;
+                default: string;
+            };
+            title: {
+                type: import("@iwsdk/core").Types.String;
+                default: string;
+            };
+            dockMode: {
+                type: import("@iwsdk/core").Types.Enum;
+                enum: {
+                    readonly WorldLocked: "world-locked";
+                    readonly BodyFollow: "body-follow";
+                    readonly HeadLocked: "head-locked";
+                };
+                default: "world-locked";
+            };
+            movable: {
+                type: import("@iwsdk/core").Types.Boolean;
+                default: true;
+            };
+            closable: {
+                type: import("@iwsdk/core").Types.Boolean;
+                default: true;
+            };
+            minimizable: {
+                type: import("@iwsdk/core").Types.Boolean;
+                default: true;
+            };
+            pinnable: {
+                type: import("@iwsdk/core").Types.Boolean;
+                default: true;
+            };
+            billboardWhileDragging: {
+                type: import("@iwsdk/core").Types.Boolean;
+                default: true;
+            };
+            dragDelay: {
+                type: import("@iwsdk/core").Types.Float32;
+                default: number;
+            };
+            followOffset: {
+                type: import("@iwsdk/core").Types.Vec3;
+                default: [number, number, number];
+            };
+            followSpeed: {
+                type: import("@iwsdk/core").Types.Float32;
+                default: number;
+            };
+            followTolerance: {
+                type: import("@iwsdk/core").Types.Float32;
+                default: number;
+            };
+            focusBias: {
+                type: import("@iwsdk/core").Types.Float32;
+                default: number;
+            };
+            targetWidth: {
+                type: import("@iwsdk/core").Types.Float32;
+                default: number;
+            };
+            targetHeight: {
+                type: import("@iwsdk/core").Types.Float32;
+                default: number;
+            };
+        }> | import("elics").Component<{
+            appliedDockMode: {
+                type: import("@iwsdk/core").Types.String;
+                default: string;
+            };
+            chromeWired: {
+                type: import("@iwsdk/core").Types.Boolean;
+                default: false;
+            };
+            homeDockMode: {
+                type: import("@iwsdk/core").Types.String;
+                default: string;
+            };
+            homeRegion: {
+                type: import("@iwsdk/core").Types.String;
+                default: string;
+            };
+            homePosition: {
+                type: import("@iwsdk/core").Types.Vec3;
+                default: [number, number, number];
+            };
+            homeYaw: {
+                type: import("@iwsdk/core").Types.Float32;
+                default: number;
+            };
+        }> | import("elics").Component<{
+            document: {
+                type: import("@iwsdk/core").Types.Object;
+                default: undefined;
+            };
+        }>)[];
+    };
+}>>;
+export declare class UIWindowSystem extends UIWindowSystem_base {
+    private manager;
+    private entitiesById;
+    private localCamera;
+    init(): void;
+    update(): void;
+    entityFor(windowId: string): Entity | undefined;
+    private adoptWindow;
+    /** Return a window to its home: spawn region, or original placement/mode. */
+    returnHome(entity: Entity): void;
+    /** MIN when open, MAX when minimized - the label names the next action. */
+    private syncMinimizeLabel;
+    private syncPinLabel;
+    private releaseWindow;
+    private wireChrome;
+    private applyMinimized;
+    private documentOf;
+}
+export {};