@volter/editor-game 0.5.67 → 0.5.68

package/contributions/build-player.document.tsx

@@ -0,0 +1,95 @@
+/**
+ * BUILD PLAYER (`workspace.document`) — the project's last build, run as a
+ * player runs it: its own `dist/`, served by the editor server, in a frame
+ * with nothing of the editor inside it. Build Profiles' Build And Run opens
+ * it, as Unity's Build And Run launches the player and Godot's Web export
+ * runs in a browser; each run reloads the frame.
+ *
+ * What the build prints reaches the editor's console, prefixed
+ * `[Build Player]`, as a Godot export run with remote debug reports into the
+ * editor's debugger: its console calls, and its uncaught errors. The capture
+ * door photographs the build itself (`framed-document-capture.ts`).
+ */
+
+import type { ToolContributionProps } from '@volter/editor-sdk/contributions';
+import { registerFramedCapture } from '@volter/editor-sdk/kit/framed-document-capture';
+import { useSyncExternalStore } from 'react';
+import { BUILD_PLAYER_URL, buildRunCount, subscribeBuildRuns } from '../src/build/build-session';
+
+export const point = 'workspace.document';
+export const title = 'Build Player';
+
+const FORWARDED = ['log', 'info', 'warn', 'error'] as const;
+
+const HOOKED = Symbol('build-player-output');
+
+/** Hook the player's document once it exists: the build's module scripts run
+ *  before `load`, after its HTML is parsed and while their bundle is fetched,
+ *  so the frame is watched from insertion until its document is the build's. */
+function watchFrame(frame: HTMLIFrameElement | null): void {
+  if (!frame) return;
+  const tick = () => {
+    if (!frame.isConnected) return;
+    const player = frame.contentWindow as (Window & typeof globalThis & { [HOOKED]?: true }) | null;
+    if (player?.location.pathname === new URL(BUILD_PLAYER_URL, location.href).pathname) {
+      if (!player[HOOKED]) {
+        forwardOutput(player);
+        registerFramedCapture(frame, {
+          container: () => player.document.getElementById('game-canvas') ?? player.document.body,
+          canvasFrame: (canvas) => copyAfterRender(player, canvas),
+        });
+      }
+      if (player.document.readyState === 'complete') return;
+    }
+    setTimeout(tick, 0);
+  };
+  tick();
+}
+
+/** A copy of `canvas` taken in the player's next frame, after the game's own
+ *  frame callbacks (registered a frame earlier) have drawn it. */
+function copyAfterRender(player: Window & typeof globalThis, canvas: HTMLCanvasElement): Promise<CanvasImageSource | null> {
+  return new Promise((resolve) => {
+    player.requestAnimationFrame(() => {
+      const copy = player.document.createElement('canvas');
+      copy.width = canvas.width;
+      copy.height = canvas.height;
+      const context = copy.getContext('2d');
+      if (!context) return resolve(null);
+      context.drawImage(canvas, 0, 0);
+      resolve(copy);
+    });
+  });
+}
+
+function forwardOutput(player: Window & typeof globalThis & { [HOOKED]?: true }): void {
+  player[HOOKED] = true;
+  for (const level of FORWARDED) {
+    const own = player.console[level].bind(player.console);
+    player.console[level] = (...args: unknown[]) => {
+      own(...args);
+      console[level]('[Build Player]', ...args);
+    };
+  }
+  player.addEventListener('error', (event) => {
+    console.error('[Build Player] Uncaught', event.error ?? event.message);
+  });
+  player.addEventListener('unhandledrejection', (event) => {
+    console.error('[Build Player] Unhandled rejection', event.reason);
+  });
+  console.info(`[Build Player] Running ${player.document.title || 'the build'}`);
+}
+
+export default function BuildPlayerDocument(_props: ToolContributionProps) {
+  const run = useSyncExternalStore(subscribeBuildRuns, buildRunCount);
+  return (
+    <iframe
+      key={run}
+      title="Build Player"
+      data-build-player={run}
+      src={`${BUILD_PLAYER_URL}?run=${run}`}
+      ref={watchFrame}
+      style={{ width: '100%', height: '100%', border: 0, display: 'block', background: '#000' }}
+    />
+  );
+}

package/package.json

@@ -2,7 +2,7 @@
   "name": "@volter/editor-game",
   "author": "Volter AI, Inc.",
   "license": "AGPL-3.0-only",
-  "version": "0.5.67",
+  "version": "0.5.68",
   "publishConfig": {
     "access": "public"
   },
@@ -42,6 +42,7 @@
       "./contributions/autoplay.service.ts",
       "./contributions/bridge.command.ts",
       "./contributions/build-profiles.document.tsx",
+      "./contributions/build-player.document.tsx",
       "./contributions/build-progress.status.tsx",
       "./contributions/build.action.ts",
       "./contributions/build.command.ts",
@@ -100,11 +101,11 @@
     "serving": "./dist-node/serving.mjs"
   },
   "dependencies": {
-    "@volter/editor-sdk": "0.5.67",
-    "@volter/editor-project": "0.5.67",
-    "@volter/editor-threejs": "0.5.67",
-    "@volter/threejs-runtime": "0.5.67",
-    "@volter/game-runtime": "0.5.67",
+    "@volter/editor-sdk": "0.5.68",
+    "@volter/editor-project": "0.5.68",
+    "@volter/editor-threejs": "0.5.68",
+    "@volter/threejs-runtime": "0.5.68",
+    "@volter/game-runtime": "0.5.68",
     "@colyseus/msgpackr": "^1.11.3",
     "@colyseus/schema": "^4.0.14",
     "@colyseus/sdk": "^0.17.34",
@@ -137,7 +138,7 @@
     "xstate": "^5.32.4",
     "zod": "^4.3.6",
     "@fortawesome/fontawesome-svg-core": "^7.2.0",
-    "@volter/editor-react": "0.5.67"
+    "@volter/editor-react": "0.5.68"
   },
   "peerDependencies": {
     "@sparkjsdev/spark": "^2.1.0",

package/src/build/BuildProfilesPanel.tsx

@@ -32,6 +32,7 @@ import {
 import { useCallback, useEffect, useRef, useState, useSyncExternalStore } from 'react';
 import {
   type BuildTarget,
+  buildAndRun,
   buildSessionVersion,
   cancelBuild,
   getBuildSession,
@@ -331,6 +332,16 @@ export function BuildProfilesPanel() {
               >
                 {phase === 'done' ? 'Build Again' : 'Build'}
               </Button>
+              <Button
+                data-testid="build-profiles-build-and-run"
+                onClick={() => {
+                  if (!selected) return;
+                  if (phase === 'done') resetBuildSession();
+                  void buildAndRun(selected);
+                }}
+              >
+                Build And Run
+              </Button>
             </>
           )}
         </div>

package/src/build/build-session.ts

@@ -17,6 +17,7 @@ import {
 } from '../host/api/configurations';
 import type { EditorHostOutputDiagnostic } from '@volter/editor-sdk/host';
 import { editorHost } from '@volter/editor-sdk/host';
+import { BASE } from '@volter/editor-sdk/kit/api-base';
 import type { BuildReport } from '@volter/editor-sdk/session/build-report';
 import { useEffect, useState } from 'react';
 import { formatBytes } from './format-bytes';
@@ -34,6 +35,40 @@ export function openBuildProfilesDocument(): boolean {
   return editorHost().workspace.openContributedDocument(BUILD_PROFILES_DOCUMENT_ID);
 }
 
+/** The Build Player document's contribution id (`build-player.document.tsx`). */
+export const BUILD_PLAYER_DOCUMENT_ID = 'build-player.document';
+
+/** Where the editor server serves the project's built `dist/` (`routes/configurations.ts`). */
+export const BUILD_PLAYER_URL = `${BASE}/build/web/index.html`;
+
+let _runs = 0;
+const _runListeners = new Set<() => void>();
+
+/** How many times the build has been run: the player reloads on each. */
+export function buildRunCount(): number {
+  return _runs;
+}
+
+export function subscribeBuildRuns(fn: () => void): () => void {
+  _runListeners.add(fn);
+  return () => {
+    _runListeners.delete(fn);
+  };
+}
+
+/** Run the last build in the Build Player document, fresh. */
+export function runBuild(): boolean {
+  _runs++;
+  for (const fn of _runListeners) fn();
+  return editorHost().workspace.openContributedDocument(BUILD_PLAYER_DOCUMENT_ID);
+}
+
+/** Unity's Build And Run: build, and run the result when the build succeeds. */
+export async function buildAndRun(target: BuildTarget): Promise<void> {
+  await startBuild(target);
+  if (_session.phase === 'done' && _session.result?.ok) runBuild();
+}
+
 /** A build-role configuration's id (ARCHITECTURE-CORE §The project model). */
 export type BuildTarget = string;
 export type BuildPhase = 'idle' | 'building' | 'done';

package/src/canvas/canvas-board/CanvasBoardDocument.tsx

@@ -74,7 +74,8 @@ import {
 } from '@volter/editor-sdk/kit/workspace-document-registry';
 import { storyBoardPresentation } from '@volter/editor-sdk/kit/stories/story-presentation';
 import { getProjectStoryModules, subscribeProjectStoryModules } from '@volter/editor-sdk/kit/stories/story-registry';
-import { useEffect, useRef, useState, useSyncExternalStore } from 'react';
+import { useEffect, useMemo, useRef, useState, useSyncExternalStore } from 'react';
+import type { AuthoringAdapter, EditorNode } from '@volter/editor-project/adapter';
 import {
   buildCanvasBoard,
   type CanvasBoard,
@@ -113,6 +114,8 @@ interface CanvasBoardPresentation {
   zoomAt(clientX: number, clientY: number): boolean;
   /** The exhibit the board is currently showing as active, for the Inspector. */
   activeStoryId(): string | null;
+  /** Select one frame by its id, as a click on it does (the layers list's row). */
+  selectStory(storyId: string): boolean;
   dispose(): void;
 }
 
@@ -131,6 +134,53 @@ interface CanvasBoardPresentation {
  * An ungrouped exhibit (no district) carries no title and falls back to the
  * substrate's own module-path derivation, exactly like an untitled dom story.
  */
+/**
+ * THE BOARD'S LAYERS — Figma's layers panel lists a page's frames; this adapter hands the
+ * Hierarchy the board's frames the same way, each with its district beside its name. It owns no
+ * transform, inspector or structure: a frame is chosen here, and choosing one is the same act as
+ * clicking it on the board.
+ */
+function canvasBoardAdapter(
+  board: CanvasBoard,
+  selected: () => string | null,
+  select: (storyId: string) => void,
+): AuthoringAdapter & { notify(): void } {
+  const listeners = new Set<() => void>();
+  const nodes: EditorNode[] = boardRows(board).map((row) => ({
+    id: row.id,
+    label: row.label,
+    ...(row.title ? { secondaryLabel: row.title } : {}),
+    kind: 'frame',
+    typeLabel: 'Frame',
+    parentId: null,
+    childIds: [],
+  }));
+  return {
+    capabilities: { transform: false, inspectorFields: false, persist: false },
+    hierarchy: {
+      roots: () => nodes,
+      node: (id) => nodes.find((node) => node.id === id) ?? null,
+    },
+    selection: {
+      get: () => {
+        const id = selected();
+        return id ? [id] : [];
+      },
+      set: (ids) => {
+        const id = ids.at(-1);
+        if (id) select(id);
+      },
+    },
+    subscribe(listener) {
+      listeners.add(listener);
+      return () => listeners.delete(listener);
+    },
+    notify() {
+      for (const listener of listeners) listener();
+    },
+  };
+}
+
 function boardRows(board: CanvasBoard): ReactStoryBoardStory[] {
   return [
     ...board.exhibits.map((exhibit) => ({
@@ -305,6 +355,13 @@ function presentCanvasBoard(
     activeStoryId(): string | null {
       return selectedStoryId;
     },
+    selectStory(storyId: string): boolean {
+      if (!rows.some((row) => row.id === storyId)) return false;
+      selectedStoryId = storyId;
+      storyBoard?.activate(storyId, false);
+      onSelectionChanged?.();
+      return true;
+    },
     zoomAt(clientX: number, clientY: number): boolean {
       return storyBoard?.zoomAtClientPoint(clientX, clientY) ?? false;
     },
@@ -446,13 +503,29 @@ function CanvasBoardContent({ active }: WorkspaceDocumentContentProps) {
   // never reach the no-selection seam at all
   // (`workspace-document-registry.ts`'s `WorkspaceDocumentSelection`, and
   // `components/AssetEditorShell.tsx`, which registers the same pair).
+  // The layers list: the board's frames through their own adapter. The node stays null so the
+  // Inspector keeps describing the chosen frame through the subject published below.
+  const boardAdapter = useMemo(
+    () =>
+      board
+        ? canvasBoardAdapter(
+            board,
+            () => presentationRef.current?.activeStoryId() ?? null,
+            (storyId) => presentationRef.current?.selectStory(storyId),
+          )
+        : null,
+    [board],
+  );
+  useEffect(() => {
+    boardAdapter?.notify();
+  }, [boardAdapter, selectedStoryId]);
   useEffect(() => {
     if (!active) return;
     return registerWorkspaceDocumentSelection(CANVAS_COMPONENTS_DOCUMENT_ID, () => ({
-      adapter: null,
+      adapter: boardAdapter,
       nodeId: null,
     }));
-  }, [active]);
+  }, [active, boardAdapter]);
   useEffect(() => {
     if (!active || !selectedExhibit) return;
     return publishDocumentInspectionSubject(CANVAS_COMPONENTS_DOCUMENT_ID, () => ({

package/src/host/authoring/pixi-authoring-adapter.ts

@@ -82,8 +82,10 @@ import {
   readContainerAuthoringLabel,
 } from './pixi-source-identity';
 import { CanvasStructureHistory } from './pixi-structure-history';
+import { PIXI_CREATABLE_KINDS } from './pixi-creatable-kinds';
 import { fromNeutralTransform, toNeutralTransform } from './pixi-transform-channels';
 import { resolvesLiveOnly, runWritePipe } from '@volter/editor-sdk/kit/write-pipe';
+import { editorHost } from '@volter/editor-sdk/host';
 
 /**
  * What a write target is handed at construction — the live view it edits
@@ -302,12 +304,19 @@ export interface PixiAuthoringOptions {
  * `Texture.WHITE` and a size; a graphics gets a drawn rect): a node the author
  * cannot see is indistinguishable from a create that silently failed.
  */
-const CANVAS_CREATABLE_KINDS: readonly { kind: string; label: string }[] = [
-  { kind: 'container', label: 'Container' },
-  { kind: 'sprite', label: 'Sprite' },
-  { kind: 'text', label: 'Text' },
-  { kind: 'graphics', label: 'Graphics' },
-];
+/** The project-local section holding each canvas world's locked and grouped label paths. */
+const EDIT_LOCKS_SECTION = 'canvasEditLocks';
+type EditLocks = Record<string, { readonly locked: readonly string[]; readonly grouped: readonly string[] }>;
+
+function readEditLocks(): EditLocks {
+  return editorHost().projectLocalState.read<EditLocks>(EDIT_LOCKS_SECTION) ?? {};
+}
+
+function writeEditLocks(world: string, locks: EditLocks[string]): void {
+  editorHost().projectLocalState.write(EDIT_LOCKS_SECTION, { ...readEditLocks(), [world]: locks });
+}
+
+const CANVAS_CREATABLE_KINDS = PIXI_CREATABLE_KINDS;
 
 /** What a canvas world can take from the asset browser: an image becomes a
  *  Sprite. A model or an audio file has no display object to become here. */
@@ -417,6 +426,19 @@ function createDisplayObject(pixi: CanvasPixiNamespace, kind: string): Container
       return new pixi.Text({ text: 'Text', style: { fill: 0xffffff, fontSize: 24 } });
     case 'graphics':
       return new pixi.Graphics().rect(0, 0, 100, 100).fill(0xffffff);
+    case 'animatedSprite': {
+      const animated = new pixi.AnimatedSprite([pixi.Texture.WHITE]);
+      animated.setSize(64, 64);
+      return animated;
+    }
+    case 'tilingSprite':
+      return new pixi.TilingSprite({ texture: pixi.Texture.WHITE, width: 100, height: 100 });
+    case 'nineSliceSprite':
+      return new pixi.NineSliceSprite({ texture: pixi.Texture.WHITE, width: 100, height: 100 });
+    case 'bitmapText':
+      return new pixi.BitmapText({ text: 'BitmapText', style: { fill: 0xffffff, fontSize: 24 } });
+    case 'htmlText':
+      return new pixi.HTMLText({ text: 'HTMLText', style: { fill: 0xffffff, fontSize: 24 } });
     default:
       return null;
   }
@@ -490,6 +512,35 @@ interface CanvasBoxEditSession {
   readonly id: string;
   readonly transform: Transform;
   readonly rect: { x: number; y: number; width: number; height: number };
+  /** The parent's world matrix's linear part (Pixi's a, b, c, d), when the node has a parent. */
+  readonly parentLinear?: { a: number; b: number; c: number; d: number };
+}
+
+/**
+ * The local turn, in degrees, that turns the node's own x axis by `degrees` on screen. Godot measures
+ * a rotate drag in the parent's space; a turn added straight to the local rotation goes backwards
+ * under a mirrored parent and by the wrong amount under an unevenly scaled one.
+ */
+function localTurn(session: CanvasBoxEditSession, degrees: number): number {
+  const m = session.parentLinear;
+  if (!m) return degrees;
+  const det = m.a * m.d - m.b * m.c;
+  if (Math.abs(det) < 1e-9) return degrees;
+  const [, , z, w] = session.transform.rotation;
+  const r = 2 * Math.atan2(z, w);
+  // The node's x axis on screen, turned by the drag, taken back into the parent's space.
+  const vx = m.a * Math.cos(r) + m.c * Math.sin(r);
+  const vy = m.b * Math.cos(r) + m.d * Math.sin(r);
+  const t = (degrees * Math.PI) / 180;
+  const wx = vx * Math.cos(t) - vy * Math.sin(t);
+  const wy = vx * Math.sin(t) + vy * Math.cos(t);
+  const ux = (m.d * wx - m.c * wy) / det;
+  const uy = (-m.b * wx + m.a * wy) / det;
+  // A long drag passes half a turn: keep the answer beside the turn's own direction in that space.
+  const base = det < 0 ? -t : t;
+  const raw = Math.atan2(uy, ux) - r - base;
+  const wrapped = Math.atan2(Math.sin(raw), Math.cos(raw));
+  return ((base + wrapped) * 180) / Math.PI;
 }
 
 function boxPatchChannels(patch: Record<string, number>): TransformChannel[] {
@@ -538,7 +589,7 @@ function transformForBoxPatch(
     scale: [...session.transform.scale],
   };
   const rotate = patch['rotate'];
-  if (rotate !== undefined) next.rotation = rotateTransformZ(session.transform, rotate);
+  if (rotate !== undefined) next.rotation = rotateTransformZ(session.transform, localTurn(session, rotate));
   const width = patch['width'];
   if (width !== undefined && session.rect.width > 0) {
     next.scale[0] = session.transform.scale[0] * Math.max(0.0001, width / session.rect.width);
@@ -669,10 +720,17 @@ export class PixiAuthoringAdapter implements AuthoringAdapter {
     | undefined;
   private listeners = new Set<() => void>();
   private boxEditSessions = new Map<string, CanvasBoxEditSession>();
-  private lockedIds = new Set<string>();
-  /** Godot's Group: a click on any node inside a grouped one selects the group. Session-local, as
-   *  the lock is. */
-  private groupedIds = new Set<string>();
+  /**
+   * Lock (a click passes through the node) and Godot's Group (a click inside a grouped node selects
+   * the group), held by each node's label path in this world so they survive the remount a source
+   * write causes and the next session. Kept per checkout, as Unity keeps scene pickability per
+   * user; Godot writes them into the scene file instead.
+   */
+  private lockedPaths = new Set<string>();
+  private groupedPaths = new Set<string>();
+  private readonly editLockWorld: string;
+  /** Each node's label path, cleared whenever the tree is re-projected. */
+  private pathKeys = new Map<string, string>();
 
   constructor(
     private readonly root: Container,
@@ -728,8 +786,10 @@ export class PixiAuthoringAdapter implements AuthoringAdapter {
           const hit = this.projector.pick(clientX, clientY, (id) => this.isPickLocked(id));
           return hit ? this.groupOf(hit) : hit;
         },
-        candidates: (clientX, clientY) =>
-          this.projector.candidates(clientX, clientY, (id) => this.isPickLocked(id)),
+        candidates: (clientX, clientY, options) =>
+          this.projector.candidates(clientX, clientY, (id) =>
+            options?.includeLocked ? false : this.isPickLocked(id),
+          ),
       };
       this.rects = {
         rect: (id) => this.projector.rect(id),
@@ -750,7 +810,18 @@ export class PixiAuthoringAdapter implements AuthoringAdapter {
         this.target.provenance.source === 'source-code' && this.target.persistence !== undefined,
     };
     this.target.bind({ a2d: this.a2d, store, journal: opts.journal, notify: () => this.notify() });
-    this.structure = this.target.structure ?? this.liveStructure;
+    this.editLockWorld = opts.journal.id;
+    const saved = readEditLocks()[this.editLockWorld];
+    this.lockedPaths = new Set(saved?.locked ?? []);
+    this.groupedPaths = new Set(saved?.grouped ?? []);
+    const structure = this.target.structure ?? this.liveStructure;
+    // A placed creation reaches the structure in the new node's PARENT's own space: the target
+    // writes `x`/`y` as authored, and only this adapter knows the frame `rects` answer in.
+    this.structure = {
+      ...structure,
+      create: (kind, parentId, at) =>
+        structure.create(kind, parentId, at ? this.pointInParent(parentId ?? null, at) : undefined),
+    };
     this.assetDrop =
       this.target.assetDrop ??
       ({
@@ -851,6 +922,7 @@ export class PixiAuthoringAdapter implements AuthoringAdapter {
     queueMicrotask(() => {
       this.structureNotifyQueued = false;
       this.projector.reproject();
+      this.pathKeys.clear();
       this.watchStructure(this.root);
       this.target.onReindex();
       this.notify();
@@ -951,7 +1023,7 @@ export class PixiAuthoringAdapter implements AuthoringAdapter {
   // degrade — a half-answer would be a menu item that silently does nothing.
 
   private readonly liveStructure: StructureProvider = {
-    create: (kind, parentId) => this.createStructuralNode(kind, parentId ?? null),
+    create: (kind, parentId, at) => this.createStructuralNode(kind, parentId ?? null, at),
     remove: (id) => this.removeStructuralNodes([id]),
     removeMany: (ids) => this.removeStructuralNodes(ids),
     duplicate: (id) => this.duplicateStructuralNode(id),
@@ -1015,6 +1087,7 @@ export class PixiAuthoringAdapter implements AuthoringAdapter {
    */
   private afterStructuralChange(): void {
     this.projector.reproject();
+    this.pathKeys.clear();
     this.watchStructure(this.root);
     this.target.onReindex();
     this.notify();
@@ -1031,7 +1104,22 @@ export class PixiAuthoringAdapter implements AuthoringAdapter {
    * same turn. The live-only report is the other half of the answer and rides
    * back in `ack` (see `StructuralIdWrite`) instead of being fired `void`.
    */
-  private createStructuralNode(kind: string, parentId: string | null): StructuralIdWrite {
+  /** A point in the `rects` frame, in the space of the container a new child of `parentId` joins. */
+  private pointInParent(
+    parentId: string | null,
+    at: { readonly x: number; readonly y: number },
+  ): { x: number; y: number } | undefined {
+    const parent = this.containerFor(parentId);
+    if (!parent || typeof parent.updateLocalTransform !== 'function') return undefined;
+    const local = this.localToRootMatrix(parent).clone().invert().apply({ x: at.x, y: at.y });
+    return { x: local.x, y: local.y };
+  }
+
+  private createStructuralNode(
+    kind: string,
+    parentId: string | null,
+    at?: { readonly x: number; readonly y: number },
+  ): StructuralIdWrite {
     const parent = this.containerFor(parentId);
     if (!parent) {
       return {
@@ -1047,6 +1135,7 @@ export class PixiAuthoringAdapter implements AuthoringAdapter {
       };
     }
     node.label = defaultLabelFor(kind);
+    if (at) node.position.set(at.x, at.y);
     const label = `Create ${node.label}`;
     this.structureHistory.track(parent);
     this.structureHistory.track(node);
@@ -1280,7 +1369,13 @@ export class PixiAuthoringAdapter implements AuthoringAdapter {
         this.boxEditSessions.delete(id);
         return;
       }
-      this.boxEditSessions.set(id, { id, rect, transform: this.transforms.get(id) });
+      const parent = this.projector.object(id)?.parent?.worldTransform;
+      this.boxEditSessions.set(id, {
+        id,
+        rect,
+        transform: this.transforms.get(id),
+        ...(parent ? { parentLinear: { a: parent.a, b: parent.b, c: parent.c, d: parent.d } } : {}),
+      });
       this.transforms.beginEdit?.(id);
     },
     apply: (id, patch) => this.applyBoxEdit(id, patch),
@@ -1514,15 +1609,19 @@ export class PixiAuthoringAdapter implements AuthoringAdapter {
     ],
     get: (id, path) =>
       path === 'locked'
-        ? this.lockedIds.has(id)
+        ? this.lockedPaths.has(this.pathKeyOf(id))
         : path === 'grouped'
-          ? this.groupedIds.has(id)
+          ? this.groupedPaths.has(this.pathKeyOf(id))
           : this.target.get(id, path),
     set: (id, path, value) => {
       if (path === 'locked' || path === 'grouped') {
-        const set = path === 'locked' ? this.lockedIds : this.groupedIds;
-        if (value === true) set.add(id);
-        else set.delete(id);
+        const set = path === 'locked' ? this.lockedPaths : this.groupedPaths;
+        if (value === true) set.add(this.pathKeyOf(id));
+        else set.delete(this.pathKeyOf(id));
+        writeEditLocks(this.editLockWorld, {
+          locked: [...this.lockedPaths],
+          grouped: [...this.groupedPaths],
+        });
         this.notify();
         return;
       }
@@ -1532,12 +1631,36 @@ export class PixiAuthoringAdapter implements AuthoringAdapter {
     remove: (id, path) => this.target.remove?.(id, path),
   };
 
+  /** `id`'s label path from its world's root: each step the authored label and its place among
+   *  same-labelled siblings, so it holds across line edits and reloads (a rename drops it). */
+  private pathKeyOf(id: string): string {
+    const known = this.pathKeys.get(id);
+    if (known !== undefined) return known;
+    const labelOf = (nodeId: string): string => this.projector.object(nodeId)?.label ?? '';
+    const segments: string[] = [];
+    let current: string | null = id;
+    while (current) {
+      const node = this.projector.node(current);
+      if (!node) break;
+      const siblings = node.parentId
+        ? (this.projector.node(node.parentId)?.childIds ?? [])
+        : this.projector.roots().map((root) => root.id);
+      const label = labelOf(current);
+      const place = siblings.filter((sibling) => labelOf(sibling) === label).indexOf(current);
+      segments.unshift(`${label}#${Math.max(0, place)}`);
+      current = node.parentId ?? null;
+    }
+    const key = segments.join('/');
+    this.pathKeys.set(id, key);
+    return key;
+  }
+
   /** The outermost grouped node that contains `id`, or `id` itself when none does. */
   private groupOf(id: string): string {
     let group = id;
     let current: string | null = id;
     while (current) {
-      if (this.groupedIds.has(current)) group = current;
+      if (this.groupedPaths.has(this.pathKeyOf(current))) group = current;
       current = this.projector.node(current)?.parentId ?? null;
     }
     return group;
@@ -1546,7 +1669,7 @@ export class PixiAuthoringAdapter implements AuthoringAdapter {
   private isPickLocked(id: string): boolean {
     let current: string | null = id;
     while (current) {
-      if (this.lockedIds.has(current)) return true;
+      if (this.lockedPaths.has(this.pathKeyOf(current))) return true;
       current = this.projector.node(current)?.parentId ?? null;
     }
     return false;
@@ -1565,8 +1688,7 @@ export class PixiAuthoringAdapter implements AuthoringAdapter {
 
   dispose(): void {
     this.boxEditSessions.clear();
-    this.lockedIds.clear();
-    this.groupedIds.clear();
+    this.pathKeys.clear();
     for (const object of this.watchedForStructure) {
       object.off('childAdded', this.onStructureChanged);
       object.off('childRemoved', this.onStructureChanged);