@volter/editor-game 0.5.67 → 0.5.69

package/src/host/authoring/pixi-creatable-kinds.ts

@@ -0,0 +1,80 @@
+/**
+ * The display objects a canvas world creates, as its create dialog lists them: Pixi's own class
+ * tree (every one of them is a Container) and a line on what each is, from Pixi's API reference.
+ */
+
+import type { CreatableKind } from '@volter/editor-project/adapter';
+
+export const PIXI_CREATABLE_KINDS: readonly CreatableKind[] = [
+  {
+    kind: 'container',
+    label: 'Container',
+    description: 'A general-purpose display object that holds children, and transforms and draws them together.',
+  },
+  {
+    kind: 'sprite',
+    label: 'Sprite',
+    extends: 'container',
+    description: 'Draws one texture: an image, or a frame of a spritesheet.',
+  },
+  {
+    kind: 'animatedSprite',
+    label: 'AnimatedSprite',
+    extends: 'sprite',
+    description: 'Plays a list of textures as frames at an animation speed.',
+  },
+  {
+    kind: 'tilingSprite',
+    label: 'TilingSprite',
+    extends: 'container',
+    description: 'Repeats one texture across its width and height, scrollable by its tile position.',
+  },
+  {
+    kind: 'nineSliceSprite',
+    label: 'NineSliceSprite',
+    extends: 'container',
+    description: 'Stretches a texture without stretching its corners: the nine-slice panel of a UI.',
+  },
+  {
+    kind: 'text',
+    label: 'Text',
+    extends: 'container',
+    description: 'Draws a string with a text style (font, size, fill, wrapping).',
+  },
+  {
+    kind: 'bitmapText',
+    label: 'BitmapText',
+    extends: 'container',
+    description: 'Draws a string from a bitmap font: fast to change every frame.',
+  },
+  {
+    kind: 'htmlText',
+    label: 'HTMLText',
+    extends: 'container',
+    description: 'Draws a string of HTML and CSS markup.',
+  },
+  {
+    kind: 'graphics',
+    label: 'Graphics',
+    extends: 'container',
+    description: 'Draws vector shapes (rectangles, circles, paths) from its draw callback.',
+  },
+  {
+    kind: 'meshPlane',
+    label: 'MeshPlane',
+    extends: 'container',
+    description: 'A textured grid of vertices that can be bent and deformed.',
+  },
+  {
+    kind: 'perspectiveMesh',
+    label: 'PerspectiveMesh',
+    extends: 'meshPlane',
+    description: 'A texture drawn in perspective between four corner points.',
+  },
+  {
+    kind: 'particleContainer',
+    label: 'ParticleContainer',
+    extends: 'container',
+    description: 'Draws many lightweight particles in one batch, added from code with addParticle.',
+  },
+];

package/src/host/authoring/pixi-live-write-target.ts

@@ -30,6 +30,7 @@
  * moved, and the persistence parameter is what this unit added.
  */
 
+import { physicsOwnerOf } from '@volter/editor-project/adapter';
 import type {
   AuthoringAdapter2D,
   Overlay2D,
@@ -554,7 +555,7 @@ export function createLiveCanvasWriteTarget(
    * `literalsFor` is what a rendering one needs. A revert or an apply is a
    * deliberate act with somewhere to await, so it must not silently do nothing
    * merely because nothing happened to have described this node first (an agent
-   * driving the provider through `vgai eval` never does).
+   * driving the provider through `volter-game-editor eval` never does).
    */
   const literalsNow = async (
     id: string,
@@ -807,7 +808,7 @@ export function createLiveCanvasWriteTarget(
     beginTransformEdit(id: string): void {
       historyResource?.assertCanMutate();
       const display = a2d.displayObject(id);
-      if (display && physics.ownerOf(display) === 'physics') physics.freeze(display);
+      if (display && physicsOwnerOf(physics, display) === 'physics') physics.freeze(display);
       editStartState = captureHistoryState();
       editBaseline = persist ? (a2d.getTransform(id) ?? undefined) : undefined;
       editMovedOrigin = false;
@@ -816,7 +817,7 @@ export function createLiveCanvasWriteTarget(
     writeTransform(id: string, next: Transform2DValue): void {
       historyResource?.assertCanMutate();
       const display = a2d.displayObject(id);
-      if (display && physics.ownerOf(display) === 'physics') {
+      if (display && physicsOwnerOf(physics, display) === 'physics') {
         physics.commit(display, next.position, next.rotation);
       }
       a2d.setTransform(id, next);
@@ -829,7 +830,7 @@ export function createLiveCanvasWriteTarget(
     // source write is attempted.
     endTransformEdit(id: string): void | Promise<WriteAck> {
       const display = a2d.displayObject(id);
-      if (display && physics.ownerOf(display) === 'physics') physics.unfreeze(display);
+      if (display && physicsOwnerOf(physics, display) === 'physics') physics.unfreeze(display);
       const label = `Transform ${labelOf(id)}`;
       const before = editStartState;
       const baseline = editBaseline;
@@ -907,7 +908,7 @@ export function createLiveCanvasWriteTarget(
      * channel a refused transform does: they asked for source writes, so each
      * one that did not land matters individually. Unarmed, the first structural
      * edit of the session raises the warning that reaches the product's own
-     * doors (`vgai status`, the session journal, one ack to clear) — a whole
+     * doors (`volter-game-editor status`, the session journal, one ack to clear) — a whole
      * class of this author's edits will not be saved, which is exactly what an
      * unresolved warning is for — and every later op logs, because repeating an
      * ack-requiring entry per created node would flood the set with the lane

package/src/host/authoring/pixi-source-write-target.ts

@@ -42,6 +42,7 @@ import {
   transform2DChanged,
 } from './pixi-transform-channels';
 import { createStructWritePipe, type StructOpOptions } from './struct-write-pipe';
+import { PIXI_CREATABLE_KINDS } from './pixi-creatable-kinds';
 import {
   clipboardOutcome,
   LIVE_ONLY_ACK,
@@ -102,6 +103,7 @@ const PANEL_OWNED_PROPS = new Set([
   'scale-y',
   'label',
   'visible',
+  'skew',
 ]);
 /** Props the drop snippet writes itself. */
 const DROP_SNIPPET_PROPS = new Set(['x', 'y', 'name', 'children']);
@@ -112,16 +114,20 @@ const CREATE_SNIPPETS: Readonly<Record<string, string>> = {
   sprite: '<pixiSprite label="Sprite" />',
   text: '<pixiText label="Text" text="Text" />',
   graphics: '<pixiGraphics label="Graphics" />',
+  animatedSprite: '<pixiAnimatedSprite label="AnimatedSprite" textures={[Texture.WHITE]} width={64} height={64} />',
+  tilingSprite: '<pixiTilingSprite label="TilingSprite" texture={Texture.WHITE} width={100} height={100} />',
+  nineSliceSprite: '<pixiNineSliceSprite label="NineSliceSprite" texture={Texture.WHITE} width={100} height={100} />',
+  bitmapText: '<pixiBitmapText label="BitmapText" text="BitmapText" />',
+  htmlText: '<pixiHTMLText label="HTMLText" text="HTMLText" />',
+  meshPlane: '<pixiMeshPlane label="MeshPlane" texture={Texture.WHITE} width={100} height={100} />',
+  perspectiveMesh: '<pixiPerspectiveMesh label="PerspectiveMesh" texture={Texture.WHITE} width={100} height={100} />',
+  particleContainer: '<pixiParticleContainer label="ParticleContainer" />',
 };
-const CREATE_LABELS: Readonly<Record<string, string>> = {
-  container: 'Container',
-  sprite: 'Sprite',
-  text: 'Text',
-  graphics: 'Graphics',
-};
+/** A kind whose snippet names Pixi's `Texture`, which the file must then import. */
+const TEXTURE_SNIPPET_KINDS = new Set(['animatedSprite', 'tilingSprite', 'nineSliceSprite', 'meshPlane', 'perspectiveMesh']);
 
 function isHiddenProp(name: string): boolean {
-  return HIDDEN_PROPS.has(name) || /^on[A-Z]/.test(name) || name.startsWith('__vgai');
+  return HIDDEN_PROPS.has(name) || /^on[A-Z]/.test(name) || name.startsWith('__volter');
 }
 
 /** Present a source identifier the way native engine inspectors present
@@ -217,6 +223,10 @@ export function createSourceCanvasWriteTarget(
   const dynamicPaths = new Set<string>();
   /** Pre-gesture 2D poses, one per id currently under a drag. */
   const editStarts = new Map<string, Transform2DValue>();
+  const pendingOrigins = new Map<
+    string,
+    { kind: 'pivot' | 'anchor'; value: readonly [number, number]; before: readonly [number, number] }
+  >();
   let commitQueue = Promise.resolve();
 
   const oidOf = (id: string): string | null => {
@@ -464,10 +474,16 @@ export function createSourceCanvasWriteTarget(
     const channels = (['position', 'rotation', 'scale'] as const).filter((channel) =>
       transform2DChanged(channel, before, after),
     );
-    if (channels.length === 0) return false;
-
-    const revert = (channel: TransformChannel): void => {
-      if (channel === 'position') a2d.setTransform(id, { position: before.position });
+    // A moved origin (pivot or anchor) is written with the position that compensates it.
+    const origin = pendingOrigins.get(id);
+    pendingOrigins.delete(id);
+    if (channels.length === 0 && !origin) return false;
+
+    const revert = (channel: TransformChannel | 'origin'): void => {
+      if (channel === 'origin') {
+        const display = a2d.displayObject(id) as (Container & Record<string, unknown>) | null;
+        if (display && origin) display[origin.kind] = { x: origin.before[0], y: origin.before[1] };
+      } else if (channel === 'position') a2d.setTransform(id, { position: before.position });
       else if (channel === 'rotation') a2d.setTransform(id, { rotation: before.rotation });
       else a2d.setTransform(id, { scale: before.scale });
       notify();
@@ -495,7 +511,7 @@ export function createSourceCanvasWriteTarget(
     const instance = componentIdentityOf(id);
     const channelBlocked = (channel: TransformChannel): boolean =>
       componentOwnedChannel(id, channel, attrs, after);
-    const writes: Array<{ channel: TransformChannel; prop: string; value: string }> = [];
+    const writes: Array<{ channel: TransformChannel | 'origin'; prop: string; value: string }> = [];
     for (const channel of channels) {
       if (channelBlocked(channel)) {
         dynamicPaths.add(`${id}|${channel}`);
@@ -532,6 +548,16 @@ export function createSourceCanvasWriteTarget(
       }
       for (const write of plan.writes) writes.push({ channel, ...write });
     }
+    if (origin) {
+      if (instance && channelBlocked('position')) revert('origin');
+      else {
+        writes.push({
+          channel: 'origin',
+          prop: origin.kind,
+          value: `{ x: ${formatSourceNumber(origin.value[0])}, y: ${formatSourceNumber(origin.value[1])} }`,
+        });
+      }
+    }
     if (writes.length === 0) return false;
 
     let persisted = false;
@@ -543,7 +569,8 @@ export function createSourceCanvasWriteTarget(
           // must not need a trip to the text editor.
           addIfMissing: true,
           // `scale={1.5}` becomes `scale={{ x, y }}` when a gesture makes it non-uniform.
-          ...(write.prop === 'scale' ? { allowShapeUpgrade: true } : {}),
+          // The same for an origin authored as one number (`pivot={60}`).
+          ...(write.prop === 'scale' || write.channel === 'origin' ? { allowShapeUpgrade: true } : {}),
         });
         if (res.changed) {
           persisted = true;
@@ -595,6 +622,38 @@ export function createSourceCanvasWriteTarget(
 
   /** One prop edit. Answers whether a byte reached the entry TSX; every
    *  refusal has already named itself on the console before it returns. */
+  /** Godot's Node2D Skew, one axis in degrees: Pixi's `skew` point in radians, written whole. */
+  const writeSkew = async (id: string, axis: 'x' | 'y', degrees: number): Promise<boolean> => {
+    const display = a2d.displayObject(id);
+    const oid = oidOf(id);
+    if (!display || !oid || !backend?.writeProp || !Number.isFinite(degrees)) return false;
+    const before = { x: display.skew.x, y: display.skew.y };
+    const radians = (degrees * Math.PI) / 180;
+    const next = { x: axis === 'x' ? radians : before.x, y: axis === 'y' ? radians : before.y };
+    display.skew.set(next.x, next.y);
+    notify();
+    const res = await backend.writeProp(
+      oid,
+      'skew',
+      // Radians to six places, so a typed angle reads back as typed (four places lose 0.003°).
+      `{ x: ${String(Number(next.x.toFixed(6)))}, y: ${String(Number(next.y.toFixed(6)))} }`,
+      { addIfMissing: true, allowShapeUpgrade: true },
+    );
+    if (!res.changed && (res.dynamic || res.error)) {
+      display.skew.set(before.x, before.y);
+      notify();
+      // biome-ignore lint/suspicious/noConsole: a refused write must say why
+      console.warn(
+        `[canvas-source ${entryPath}] skew write refused for oid "${oid}": ` +
+          `${res.dynamic ? 'dynamic expression (guarded)' : res.error} — reverting.`,
+      );
+      return false;
+    }
+    await refreshSourceState();
+    notify();
+    return res.changed;
+  };
+
   const writeJsxProp = async (
     id: string,
     path: string,
@@ -1130,12 +1189,20 @@ export function createSourceCanvasWriteTarget(
     // The new element's oid is minted server-side on the remount, so the id
     // half is '' and the ack half is this creation's own piped write — handed
     // back rather than fired `void` (see `StructuralIdWrite`).
-    create: (kind, parentId) => {
-      const snippet = CREATE_SNIPPETS[kind];
+    create: (kind, parentId, at) => {
+      // `at` arrives in the new node's parent's own space (the adapter converts it).
+      const base = CREATE_SNIPPETS[kind];
+      const snippet =
+        base && at
+          ? base.replace(/\s*\/>$/, ` x={${formatSourceNumber(at.x)}} y={${formatSourceNumber(at.y)}} />`)
+          : base;
       // Nothing was attempted (the palette is empty in both cases), so there is
       // no write to ack.
       if (!snippet || !backend?.writeStruct) return { id: '', ack: undefined };
-      if (parentId) return { id: '', ack: structOp(parentId, 'create', { snippet }) };
+      const options = TEXTURE_SNIPPET_KINDS.has(kind)
+        ? { snippet, ensureImport: { name: 'Texture', module: 'pixi.js' } }
+        : { snippet };
+      if (parentId) return { id: '', ack: structOp(parentId, 'create', options) };
       const lastRoot = a2d.roots().at(-1);
       if (!lastRoot) {
         return {
@@ -1145,15 +1212,14 @@ export function createSourceCanvasWriteTarget(
           ),
         };
       }
-      return { id: '', ack: structOp(lastRoot.id, 'create-sibling', { snippet }) };
+      return { id: '', ack: structOp(lastRoot.id, 'create-sibling', options) };
     },
     creatableKinds: (parentId) => {
       if (!backend?.writeStruct) return [];
       if (parentId && !oidOf(parentId)) return [];
       if (!parentId && a2d.roots().length === 0) return [];
-      return Object.keys(CREATE_SNIPPETS).map((kind) => ({
-        kind,
-        label: CREATE_LABELS[kind] ?? kind,
+      return PIXI_CREATABLE_KINDS.filter((entry) => CREATE_SNIPPETS[entry.kind] !== undefined).map((entry) => ({
+        ...entry,
       }));
     },
     // Returns the promise (never `void structOp(…)`): `deleteSelection`
@@ -1469,6 +1535,21 @@ export function createSourceCanvasWriteTarget(
       if (!editStarts.has(id)) editStarts.set(id, read2D(id));
     },
 
+    /**
+     * Mid-gesture origin write — see {@link CanvasWriteTarget.writeOrigin}. The live object moves
+     * now; the `pivot`/`anchor` prop is written at `endTransformEdit`, in the same gesture as the
+     * position that compensates it.
+     */
+    writeOrigin(id: string, kind: 'pivot' | 'anchor', value: readonly [number, number]): void {
+      const display = a2d.displayObject(id) as (Container & Record<string, unknown>) | null;
+      const current = display?.[kind] as { x?: unknown; y?: unknown } | undefined;
+      if (!display || typeof current?.x !== 'number' || typeof current.y !== 'number') return;
+      const before = pendingOrigins.get(id)?.before ?? ([current.x, current.y] as const);
+      display[kind] = { x: value[0], y: value[1] };
+      pendingOrigins.set(id, { kind, value, before });
+      notify();
+    },
+
     writeTransform(id: string, next: Transform2DValue): void {
       // The live tree moves first so the paused frame follows the gesture; the
       // source write happens once, at the end.
@@ -1535,6 +1616,13 @@ export function createSourceCanvasWriteTarget(
         { path: 'visible', label: 'Visible', type: 'boolean', group: 'Visibility' },
       ];
       const attrs = attrsOf(id) ?? [];
+      // Godot's Node2D Skew, in its Transform group; a skew the source computes is shown, not edited.
+      const skewAttr = attrs.find((attr) => attr.name === 'skew');
+      const skewFixed = skewAttr ? !skewAttr.isLiteral : false;
+      props.push(
+        { path: 'skew.x', label: 'Skew X (deg)', type: 'number', group: 'Transform', readonly: skewFixed },
+        { path: 'skew.y', label: 'Skew Y (deg)', type: 'number', group: 'Transform', readonly: skewFixed },
+      );
       const declared = declaredPropsOf(id);
       const attrByName = new Map(attrs.map((attr) => [attr.name, attr]));
       const names = [
@@ -1573,6 +1661,9 @@ export function createSourceCanvasWriteTarget(
       if (echoed !== undefined) return echoed;
       if (path === 'name') return display.label ?? '';
       if (path === 'visible') return display.visible;
+      if (path === 'skew.x' || path === 'skew.y') {
+        return Number((((path === 'skew.x' ? display.skew.x : display.skew.y) * 180) / Math.PI).toFixed(4));
+      }
       if (!path.startsWith('jsx.')) return undefined;
       return propValue(attrsOf(id), declaredPropsOf(id), path.slice(4));
     },
@@ -1581,6 +1672,13 @@ export function createSourceCanvasWriteTarget(
     // edit, awaited. A path this target owns no prop for performed no write and
     // returns nothing.
     set(id: string, path: string, value: unknown): void | Promise<WriteAck> {
+      if (path === 'skew.x' || path === 'skew.y') {
+        return piped(
+          () => writeSkew(id, path === 'skew.x' ? 'x' : 'y', Number(value)),
+          undefined,
+          destinationOf(id),
+        );
+      }
       const prop =
         path === 'name'
           ? 'label'

package/src/host/authoring/pixi-structure-history.ts

@@ -42,7 +42,7 @@ const ROOT_UID = '#root';
  *  `AuthoringAdapter2D` uses for `__authId`, for the same reason (there is no
  *  side table that survives the object outliving one walk). */
 interface StructureStamped {
-  __vgaiStructUid?: string;
+  __volterStructUid?: string;
 }
 
 /** A node's own local pose, as plain numbers. Recorded because `reparent`
@@ -185,10 +185,10 @@ export class CanvasStructureHistory {
   private uidOf(object: Container): string {
     if (object === this.root) return ROOT_UID;
     const stamped = object as Container & StructureStamped;
-    const existing = stamped.__vgaiStructUid;
+    const existing = stamped.__volterStructUid;
     if (existing && this.byUid.get(existing) === object) return existing;
     const uid = existing ?? `s${crypto.randomUUID()}`;
-    stamped.__vgaiStructUid = uid;
+    stamped.__volterStructUid = uid;
     this.byUid.set(uid, object);
     return uid;
   }

package/src/host/binding-resolver.ts

@@ -4,7 +4,7 @@
  *
  * A game is a native program plus a declaration of itself; the editor is a
  * universal client of that declaration. This module is where the declaration
- * is READ: the manifest root, the project's parsed `vgai.adapter.ts`, and the
+ * is READ: the manifest root, the project's parsed `volter.adapter.ts`, and the
  * entry module's own static surface, resolved against ONE realm
  * (`realm-services.ts` — dev or packaged).
  *
@@ -85,7 +85,7 @@ export interface ResolveRootBindingOptions {
  * Resolve one manifest root against one realm.
  *
  * `adapterDef` is an INPUT, never something this function goes and fetches:
- * `vgai.adapter.ts` loading stays in `project-adapter.ts`, and the binding is
+ * `volter.adapter.ts` loading stays in `project-adapter.ts`, and the binding is
  * the hand-off's shape rather than a second loader.
  */
 export async function resolveRootBinding(
@@ -252,7 +252,7 @@ function rejectCapturedIngestAsRootAdapter(root: ResolvedAdapterRoot): never {
 export interface ResolveAllRootEntriesOptions {
   /**
    * Remount the named region's entrypoint at this swap-slot key. Only that
-   * world's entry URL carries the override; siblings share `?vgai-mount=`
+   * world's entry URL carries the override; siblings share `?volter-mount=`
    * alone so the module graph stays one instance.
    */
   readonly selectionOverride?:
@@ -276,7 +276,7 @@ interface ResolvedComposition {
  * resolvers would give each root its own generation, which is the defect.
  *
  * The COMPOSITION level is likewise where the project's two ambient inputs are
- * fetched — the realm's services and the parsed `vgai.adapter.ts` — because
+ * fetched — the realm's services and the parsed `volter.adapter.ts` — because
  * both are properties of the open project rather than of any one root, and
  * asking once per composition is what keeps every root of a game bound to the
  * same declaration. `resolveRootBinding` itself still fetches neither: it is
@@ -302,7 +302,7 @@ async function resolveComposition(
     out.push({ world, resolved });
   }
   // Stringified because that is the form the id travels in everywhere else:
-  // the entry url's `?vgai-mount=` value, and therefore the key
+  // the entry url's `?volter-mount=` value, and therefore the key
   // `gated-globals.ts` reads back off a module url.
   return { roots: out, mountId: String(epoch) };
 }
@@ -351,7 +351,7 @@ export async function resolveAllRoots(
  *
  * It also returns this composition's `mountId` — the identity the whole
  * isolation layer is keyed by. It is minted here (one epoch per composition),
- * rides every project module url as `?vgai-mount=`, and is what
+ * rides every project module url as `?volter-mount=`, and is what
  * `gated-globals.ts` resolves a realm and an input gate under.
  *
  * It does NOT return the entry modules' harvested `debug`/`systems` bindings.

package/src/host/browser-transpile.ts

@@ -174,7 +174,7 @@ export function registerRuntimeModules(modules: Record<string, ModuleNamespace>)
   }
   // Exposed on globalThis so shim modules (which run in their own module scope)
   // can reach the live namespaces by specifier.
-  (globalThis as Record<string, unknown>)['__vgaiModules'] = Object.fromEntries(runtimeModules);
+  (globalThis as Record<string, unknown>)['__volterModules'] = Object.fromEntries(runtimeModules);
 }
 
 /**
@@ -259,7 +259,7 @@ function loadRuntimeModule(spec: string): Promise<void> {
 
 /**
  * The call-time half of a literal dynamic import in project code. The rewrite
- * turns `import('tone')` into `globalThis.__vgaiImportRuntimeModule('tone')`,
+ * turns `import('tone')` into `globalThis.__volterImportRuntimeModule('tone')`,
  * so the load — and the wall, if the browser editor does not ship it — happens
  * exactly when the project's own code executes the import, never earlier.
  */
@@ -267,7 +267,7 @@ export async function importRuntimeModule(spec: string): Promise<ModuleNamespace
   if (!runtimeModules.has(spec)) await loadRuntimeModule(spec);
   return runtimeModules.get(spec) as ModuleNamespace;
 }
-(globalThis as Record<string, unknown>)['__vgaiImportRuntimeModule'] = importRuntimeModule;
+(globalThis as Record<string, unknown>)['__volterImportRuntimeModule'] = importRuntimeModule;
 
 /**
  * Bring every static bare import live, then rewrite by the lexer's own byte
@@ -304,7 +304,7 @@ export async function resolveAndRewriteBareImports(code: string): Promise<string
       out = `${out.slice(0, record.s)}${shimUrlFor(record.n)}${out.slice(record.e)}`;
     } else if (record.d >= 0) {
       // Literal dynamic import: swap the whole `import(...)` expression.
-      out = `${out.slice(0, record.ss)}globalThis.__vgaiImportRuntimeModule(${JSON.stringify(
+      out = `${out.slice(0, record.ss)}globalThis.__volterImportRuntimeModule(${JSON.stringify(
         record.n,
       )})${out.slice(record.se)}`;
     }
@@ -379,7 +379,7 @@ function shimUrlFor(spec: string): string {
   // `registerRuntimeModules` user) — the same wall, said the same way.
   if (!ns) throw unregisteredRuntimeModules([spec]);
 
-  const lines = [`const __m = globalThis.__vgaiModules[${JSON.stringify(spec)}];`];
+  const lines = [`const __m = globalThis.__volterModules[${JSON.stringify(spec)}];`];
   for (const key of Object.keys(ns)) {
     if (key === 'default' || !IDENT_RE.test(key) || RESERVED_WORDS.has(key)) continue;
     lines.push(`export const ${key} = __m[${JSON.stringify(key)}];`);
@@ -432,7 +432,7 @@ export async function transpileToModuleUrl(
 
 /**
  * Prepend the game-globals lexical shadow to project source — the browser-side
- * analogue of the dev server's `vgai-game-globals` Vite plugin
+ * analogue of the dev server's `volter-game-globals` Vite plugin
  * (`server/dev.ts` + `shouldShadowGameGlobals`). The server shadows per-module
  * because Vite transforms EVERY module indiscriminately and must be told which
  * ones are game code; the browser has no such firehose — {@link importFromSource}
@@ -541,7 +541,7 @@ export function loaderFor(path: string): esbuild.Loader {
 function resolveServedModulePath(importer: string, specifier: string): string {
   if (specifier.startsWith('/')) return specifier;
   if (/^(?:https?:|blob:|data:)/.test(specifier)) return specifier;
-  const origin = globalThis.location?.origin ?? 'https://vgai.invalid';
+  const origin = globalThis.location?.origin ?? 'https://volter.invalid';
   const resolved = new URL(specifier, new URL(importer, origin));
   return resolved.origin === origin
     ? `${resolved.pathname}${resolved.search}${resolved.hash}`
@@ -572,7 +572,7 @@ export async function bundleServedModule(
     define: PROJECT_MODULE_DEFINES,
     plugins: [
       {
-        name: 'vgai-served-module',
+        name: 'volter-served-module',
         setup(build) {
           build.onResolve({ filter: /.*/ }, (args) => {
             if (
@@ -586,9 +586,9 @@ export async function bundleServedModule(
               args.kind === 'entry-point'
                 ? args.path
                 : resolveServedModulePath(args.importer, args.path);
-            return { path, namespace: 'vgai-served' };
+            return { path, namespace: 'volter-served' };
           });
-          build.onLoad({ filter: /.*/, namespace: 'vgai-served' }, async (args) => {
+          build.onLoad({ filter: /.*/, namespace: 'volter-served' }, async (args) => {
             const response = await fetchImpl(args.path);
             if (!response.ok) {
               throw new Error(

package/src/host/canvas-preview-frames.ts

@@ -17,7 +17,7 @@
  * five callers never had a story in hand (`authoring/canvas-design-mount.ts`,
  * `authoring/pixi-still-presentation.ts`, `components/world-root-stage.ts`,
  * `live-canvas-frame.ts`, and the ingest lane's canvas mount); moving it out is
- * the part of the CSF estate's exit to `@vgai/game` (WORK.md §The open-source
+ * the part of the CSF estate's exit to `@volter/game` (WORK.md §The open-source
  * launch, phase 1 unit 3) that does not wait on anything else.
  */
 

package/src/host/components/CameraAuthoringOverlay.tsx

@@ -56,13 +56,13 @@ function CameraPreview({ previewRef }: CameraAuthoringOverlayProps) {
       : 16 / 9;
 
   return (
-    <div className="vgai-camera-preview" data-testid="camera-preview">
-      <Inline className="vgai-camera-preview-header" gap={4} align="center">
+    <div className="volter-camera-preview" data-testid="camera-preview">
+      <Inline className="volter-camera-preview-header" gap={4} align="center">
         <EditorIcon icon={faCamera} size="sm" />
         <Text
           variant="label"
           truncate
-          className="vgai-camera-preview-title"
+          className="volter-camera-preview-title"
           title={`${preview.name} · ${preview.lens}`}
         >
           {preview.name}
@@ -77,7 +77,7 @@ function CameraPreview({ previewRef }: CameraAuthoringOverlayProps) {
             <EditorIcon icon={faThumbtack} size="sm" />
           </IconButton>
         </Tooltip>
-        <div ref={menuRef} className="vgai-camera-preview-menu-anchor">
+        <div ref={menuRef} className="volter-camera-preview-menu-anchor">
           <Tooltip text="Camera actions">
             <IconButton
               aria-label="Camera actions"
@@ -89,7 +89,7 @@ function CameraPreview({ previewRef }: CameraAuthoringOverlayProps) {
             </IconButton>
           </Tooltip>
           {menuOpen ? (
-            <EditorPopover className="vgai-camera-preview-menu">
+            <EditorPopover className="volter-camera-preview-menu">
               <Button
                 variant="ghost"
                 size="compact"
@@ -130,7 +130,7 @@ function CameraPreview({ previewRef }: CameraAuthoringOverlayProps) {
       </Inline>
       <div
         ref={previewRef}
-        className="vgai-camera-preview-image"
+        className="volter-camera-preview-image"
         style={{ aspectRatio: String(Math.max(0.5, Math.min(3, aspect))) }}
         role="img"
         aria-label={`Live view through ${preview.name}`}
@@ -142,13 +142,13 @@ function CameraPreview({ previewRef }: CameraAuthoringOverlayProps) {
 
 function CompositionGuides() {
   return (
-    <div className="vgai-camera-guides" aria-hidden="true">
-      <div className="vgai-camera-guide vgai-camera-guide-v1" />
-      <div className="vgai-camera-guide vgai-camera-guide-v2" />
-      <div className="vgai-camera-guide vgai-camera-guide-h1" />
-      <div className="vgai-camera-guide vgai-camera-guide-h2" />
-      <div className="vgai-camera-safe-frame" />
-      <div className="vgai-camera-center-mark" />
+    <div className="volter-camera-guides" aria-hidden="true">
+      <div className="volter-camera-guide volter-camera-guide-v1" />
+      <div className="volter-camera-guide volter-camera-guide-v2" />
+      <div className="volter-camera-guide volter-camera-guide-h1" />
+      <div className="volter-camera-guide volter-camera-guide-h2" />
+      <div className="volter-camera-safe-frame" />
+      <div className="volter-camera-center-mark" />
     </div>
   );
 }
@@ -163,7 +163,7 @@ function CameraViewBanner() {
       <EditorSurface
         variant="overlay"
         border
-        className="vgai-camera-view-banner vgai-chrome-island vgai-glass-island"
+        className="volter-camera-view-banner volter-chrome-island volter-glass-island"
         data-testid="camera-view-banner"
       >
         <Inline gap={6} align="center">