@vgai/editor 0.4.0 → 0.4.1

package/src/{project-operations.ts → project-tools.ts}

@@ -1,8 +1,8 @@
-import { connectOperationFileEvents } from './asset-events';
+import { connectToolFileEvents } from './asset-events';
 import { getEditorMode } from './editor-mode';
 import { onProjectChange } from './project-manager';
 
-export interface ProjectOperationCatalogEntry {
+export interface ProjectToolCatalogEntry {
   name: string;
   summary: string;
   description: string;
@@ -16,58 +16,71 @@ export interface ProjectOperationCatalogEntry {
   supportsDryRun: boolean;
   longRunning: boolean;
   permission: { risk: 'read' | 'write' | 'destructive'; summary: string };
+  contributions: ProjectToolContribution[];
 }
 
-export interface ProjectOperationCatalog {
-  operations: ProjectOperationCatalogEntry[];
+export type ToolContributionPoint =
+  | 'workspace.document'
+  | 'selection.inspector'
+  | 'workspace.utility';
+
+export interface ProjectToolContribution {
+  id: string;
+  point: ToolContributionPoint;
+  title: string;
+  entryPath: string;
+}
+
+export interface ProjectToolCatalog {
+  tools: ProjectToolCatalogEntry[];
   loadErrors: Array<{ sourcePath: string; message: string }>;
 }
 
-export type ProjectOperationOutcome =
+export type ProjectToolOutcome =
   | { ok: true; data: unknown }
   | { ok: false; error: { code: string; message: string; data?: unknown; issues?: unknown[] } };
 
-const EMPTY_CATALOG: ProjectOperationCatalog = { operations: [], loadErrors: [] };
+const EMPTY_CATALOG: ProjectToolCatalog = { tools: [], loadErrors: [] };
 let catalog = EMPTY_CATALOG;
 let version = 0;
 const listeners = new Set<() => void>();
 
-function publish(next: ProjectOperationCatalog): void {
+function publish(next: ProjectToolCatalog): void {
   catalog = next;
   version++;
   for (const listener of listeners) listener();
 }
 
-export function getProjectOperations(): ProjectOperationCatalog {
+export function getProjectTools(): ProjectToolCatalog {
   return catalog;
 }
 
-export function projectOperationsVersion(): number {
+export function projectToolsVersion(): number {
   return version;
 }
 
-export function subscribeProjectOperations(listener: () => void): () => void {
+export function subscribeProjectTools(listener: () => void): () => void {
   listeners.add(listener);
   return () => listeners.delete(listener);
 }
 
-export async function refreshProjectOperations(): Promise<ProjectOperationCatalog> {
+export async function refreshProjectTools(): Promise<ProjectToolCatalog> {
   if (getEditorMode() === 'browser') {
     publish(EMPTY_CATALOG);
     return EMPTY_CATALOG;
   }
   try {
-    const response = await fetch('/__editor/project-operations');
+    const response = await fetch('/__editor/project-tools');
     if (!response.ok) throw new Error(`catalog request failed (${response.status})`);
-    const next = (await response.json()) as ProjectOperationCatalog;
+    const next = (await response.json()) as ProjectToolCatalog;
     publish(next);
     return next;
   } catch (error) {
     const next = {
-      operations: [],
+      tools: [],
       loadErrors: [
         {
-          sourcePath: 'src/operations',
+          sourcePath: 'package.json#vgai.tools',
           message: error instanceof Error ? error.message : String(error),
         },
       ],
@@ -77,35 +90,35 @@ export async function refreshProjectOperations(): Promise<ProjectOperationCatalo
   }
 }
 
-export async function runProjectOperation(
+export async function runProjectTool(
   name: string,
   input: unknown,
   options: { confirm?: boolean } = {},
-): Promise<ProjectOperationOutcome> {
-  const response = await fetch('/__editor/project-operations/run', {
+): Promise<ProjectToolOutcome> {
+  const response = await fetch('/__editor/project-tools/run', {
     method: 'POST',
     headers: { 'Content-Type': 'application/json' },
     body: JSON.stringify({ name, input, confirm: options.confirm === true }),
   });
-  const outcome = (await response.json()) as ProjectOperationOutcome;
+  const outcome = (await response.json()) as ProjectToolOutcome;
   if (!outcome || typeof outcome !== 'object' || typeof outcome.ok !== 'boolean') {
-    throw new Error(`Operation request returned an invalid response (${response.status}).`);
+    throw new Error(`Tool request returned an invalid response (${response.status}).`);
   }
   return outcome;
 }
 
-/** Editor-init lifecycle for Node-side project operation discovery. */
-export function startProjectOperationDiscovery(): () => void {
-  void refreshProjectOperations();
-  const stopProjectWatch = onProjectChange(() => void refreshProjectOperations());
-  const stopFileWatch = connectOperationFileEvents(() => void refreshProjectOperations());
+/** Editor-init lifecycle for the Node-side registered tool catalog. */
+export function startProjectToolCatalog(): () => void {
+  void refreshProjectTools();
+  const stopProjectWatch = onProjectChange(() => void refreshProjectTools());
+  const stopFileWatch = connectToolFileEvents(() => void refreshProjectTools());
   return () => {
     stopProjectWatch();
     stopFileWatch();
   };
 }
 
-export function __resetProjectOperationsForTest(): void {
+export function __resetProjectToolsForTest(): void {
   catalog = EMPTY_CATALOG;
   version = 0;
   listeners.clear();

package/src/scene-sync.ts

@@ -14,7 +14,6 @@ import * as THREE from 'three';
 import { RGBELoader } from 'three/addons/loaders/RGBELoader.js';
 import type { BatchedRenderer, ParticleSystem } from 'three.quarks';
 import { readProjectTextFile } from './editor-api';
-import type { ShadingMode } from './editor-store';
 import { createEntityObject, disposeEntityAnimation } from './entity-factory';
 
 /**
@@ -231,7 +230,6 @@ export function unregisterParticles(
 export function buildPreview(
   doc: SceneFile,
   scene: THREE.Scene,
-  shadingMode: ShadingMode = 'solid',
   renderer?: THREE.WebGLRenderer,
   batchedRenderer?: BatchedRenderer | null,
 ): Map<string, THREE.Object3D> {
@@ -340,11 +338,6 @@ export function buildPreview(
   // Apply environment
   applyEnvironment(doc.environment, scene, renderer);
 
-  // Apply shading mode override
-  if (shadingMode !== 'solid') {
-    applyShadingOverride(scene, shadingMode);
-  }
-
   return objectMap;
 }
 
@@ -530,63 +523,3 @@ async function loadEnvTexture(
     return null;
   }
 }
-
-function asMaterialArray(m: THREE.Material | THREE.Material[]): THREE.Material[] {
-  return Array.isArray(m) ? m : [m];
-}
-
-/**
- * Apply (and revert) the viewport shading override on a single mesh.
- *
- * Reversible across all three modes so the toolbar toggle can re-shade live
- * meshes without a full scene rebuild (ED1):
- *  - solid: restore the original material(s), clear wireframe.
- *  - wireframe: restore original material(s), set wireframe on.
- *  - unlit: swap in MeshBasicMaterial(s) built from the original color.
- *
- * The original material is stashed in `userData['__shadeOrig']` the first time
- * the mesh is touched; unlit overrides are stashed in `__shadeUnlit` so they
- * can be disposed when leaving unlit.
- */
-function applyShadingToMesh(mesh: THREE.Mesh, mode: ShadingMode): void {
-  if (getUserData(mesh, '__shadeOrig') === undefined) {
-    setUserData(mesh, '__shadeOrig', mesh.material);
-  }
-  const orig = getUserData(mesh, '__shadeOrig') as THREE.Material | THREE.Material[];
-  const unlit = getUserData(mesh, '__shadeUnlit') as THREE.Material[] | undefined;
-
-  if (mode === 'unlit') {
-    if (unlit) {
-      mesh.material = Array.isArray(orig) ? unlit : unlit[0]!;
-      return;
-    }
-    const created = asMaterialArray(orig).map((m) => {
-      const color = (m as THREE.MeshStandardMaterial).color?.clone() ?? new THREE.Color(0x888888);
-      return new THREE.MeshBasicMaterial({ color });
-    });
-    setUserData(mesh, '__shadeUnlit', created);
-    mesh.material = Array.isArray(orig) ? created : created[0]!;
-    return;
-  }
-
-  // solid or wireframe: restore originals and drop any unlit override.
-  mesh.material = orig;
-  if (unlit) {
-    for (const m of unlit) m.dispose();
-    deleteUserData(mesh, '__shadeUnlit');
-  }
-  const wire = mode === 'wireframe';
-  for (const m of asMaterialArray(orig)) {
-    if ('wireframe' in m) (m as THREE.MeshStandardMaterial).wireframe = wire;
-  }
-}
-
-/** Apply viewport shading override to all entity meshes. Reversible (ED1). */
-export function applyShadingOverride(scene: THREE.Scene, mode: ShadingMode): void {
-  scene.traverse((obj) => {
-    if (getUserData(obj, 'entityId') === undefined) return;
-    const mesh = obj as THREE.Mesh;
-    if (!mesh.isMesh || !mesh.material) return;
-    applyShadingToMesh(mesh, mode);
-  });
-}

package/src/storage/handle-storage.ts

@@ -97,7 +97,11 @@ export abstract class HandleStorage implements StorageBackend {
         path: base ? `${base}/${name}` : name,
         type: isDir ? 'dir' : 'file',
       };
-      if (!isDir) entry.size = (await (child as FileSystemFileHandle).getFile()).size;
+      if (!isDir) {
+        const file = await (child as FileSystemFileHandle).getFile();
+        entry.size = file.size;
+        entry.mtime = file.lastModified;
+      }
       entries.push(entry);
     }
     // Directories first, then alphabetical — matches the server's /assets route.

package/src/storage/http-storage.ts

@@ -8,7 +8,7 @@
  * (write) routes; reads come from Vite's `/@fs/` static serving.
  *
  * Route mapping (paths are relative to `public/`):
- *   list     → GET  /__editor/assets?dir            → { entries: [{name,type,size}] }
+ *   list     → GET  /__editor/assets?dir            → { entries: [{name,type,size,mtime}] }
  *   write    → POST /__editor/save-file             ({path, content, encoding?})
  *   read     → GET  /@fs/{projectRoot}/public/{path}
  *   watch    → EventSource /__editor/events         (chokidar-backed)
@@ -27,6 +27,7 @@ interface ServerAssetEntry {
   name: string;
   type: 'file' | 'directory';
   size: number;
+  mtime: number;
 }
 
 export class HttpStorage implements StorageBackend {
@@ -69,8 +70,10 @@ export class HttpStorage implements StorageBackend {
         name: e.name,
         path: normalize(dir ? `${dir}/${e.name}` : e.name),
         type: e.type === 'directory' ? 'dir' : 'file',
+        mtime: e.mtime,
       };
       if (e.type === 'file') out.size = e.size;
+      out.mtime = e.mtime;
       return out;
     });
   }
@@ -87,7 +90,9 @@ export class HttpStorage implements StorageBackend {
       return null;
     }
     const hit = entries.find((e) => e.name === base);
-    return hit ? { path: hit.path, type: hit.type, size: hit.size ?? 0, mtime: 0 } : null;
+    return hit
+      ? { path: hit.path, type: hit.type, size: hit.size ?? 0, mtime: hit.mtime ?? 0 }
+      : null;
   }
 
   async exists(path: string): Promise<boolean> {

package/src/storage/mem-storage.ts

@@ -78,8 +78,14 @@ export class MemStorage implements StorageBackend {
     for (const [path, node] of this.nodes) {
       const [parent, base] = dirAndBase(path);
       if (parent !== dn || !base) continue;
-      const entry: DirEntry = { name: base, path, type: node.type === 'dir' ? 'dir' : 'file' };
+      const entry: DirEntry = {
+        name: base,
+        path,
+        type: node.type === 'dir' ? 'dir' : 'file',
+        mtime: node.mtime,
+      };
       if (node.type === 'file') entry.size = node.data.length;
+      entry.mtime = node.mtime;
       entries.push(entry);
     }
     entries.sort((a, b) => {

package/src/storage/types.ts

@@ -44,6 +44,8 @@ export interface DirEntry {
   type: NodeType;
   /** Byte length for files (omitted for directories). */
   size?: number;
+  /** Last-modified time, epoch ms (omitted if the backend cannot report it). */
+  mtime?: number;
 }
 
 export type WatchEventType = 'create' | 'update' | 'remove';

package/src/theme-css.ts

@@ -125,6 +125,12 @@ ${themeDeclarations}
 
 .vgai-btn {
   display: inline-flex;
+  /* Inline controls should keep their intrinsic size even when authored as
+   * direct children of a CSS grid. Grid's default align-items: stretch
+   * otherwise turns a compact action into a full-width slab. A caller that
+   * deliberately wants a wide button can still set width: 100%. */
+  width: max-content;
+  max-width: 100%;
   align-items: center;
   justify-content: center;
   gap: var(--vgai-space-2);
@@ -829,6 +835,10 @@ ${themeDeclarations}
 .vgai-tab-badge,
 .vgai-badge {
   display: inline-flex;
+  /* Badges are labels, never layout surfaces. Keep them from stretching into
+   * long capsules when a contribution places one directly in a grid. */
+  width: max-content;
+  max-width: 100%;
   min-width: 15px;
   height: 15px;
   align-items: center;
@@ -952,14 +962,14 @@ ${themeDeclarations}
 .vgai-drop-indicator[data-position='inside'] { inset: 1px; border-radius: var(--vgai-radius-sm); }
 
 .vgai-model-tree-item { text-align: left; }
-.vgai-operation-card {
-  display: block;
+.vgai-btn.vgai-project-tool-card {
+  display: grid;
   width: 100%;
-  margin-top: 10px;
-  padding: 10px;
-  border: var(--vgai-stroke-resting) solid var(--vgai-boundary-default);
-  border-radius: var(--vgai-radius-md);
-  background: var(--vgai-surface-panel);
+  height: auto;
+  align-items: start;
+  justify-content: normal;
+  gap: var(--vgai-space-2);
+  padding-block: var(--vgai-space-3);
   text-align: left;
 }