lecodes-cli 0.2.0 → 0.5.0

package/dist/index.js

@@ -3,8 +3,8 @@ import { createRequire } from "node:module";
 var __require = /* @__PURE__ */ createRequire(import.meta.url);
 
 // src/index.ts
-import { readFileSync as readFileSync9 } from "node:fs";
-import { dirname as dirname7, join as join11 } from "node:path";
+import { readFileSync as readFileSync11 } from "node:fs";
+import { dirname as dirname7, join as join12 } from "node:path";
 import { fileURLToPath as fileURLToPath3 } from "node:url";
 
 // src/commands/clone.ts
@@ -483,6 +483,14 @@ var create = async (args) => {
   info(c.dim(`  cd ${dir} — edit main.ts, then \`lecodes push -m "first commit"\` to save it`));
 };
 
+// src/commands/design.ts
+import { existsSync as existsSync7, mkdirSync as mkdirSync7, readFileSync as readFileSync7, readdirSync as readdirSync5, writeFileSync as writeFileSync7, appendFileSync } from "node:fs";
+import { basename as basename2, join as join10 } from "node:path";
+
+// src/compile/designCompile.ts
+import { readFileSync as readFileSync6 } from "node:fs";
+import { basename } from "node:path";
+
 // src/localFiles.ts
 import { readdirSync as readdirSync3, readFileSync as readFileSync4 } from "node:fs";
 import { join as join7, relative } from "node:path";
@@ -592,193 +600,352 @@ var diffLocal = (manifest, scan) => {
 };
 var hasChanges = (diff) => diff.added.length + diff.modified.length + diff.deleted.length > 0;
 
-// src/serverDiff.ts
-import { readFileSync as readFileSync5 } from "node:fs";
-import { basename } from "node:path";
-var isTextAsset = (t) => t === "text" || t === "shader" || t === "scene";
-var computeServerDiff = (project, scan) => {
-  const pathById = buildPaths(project.assets);
-  const serverByPath = new Map;
-  for (const asset of project.assets) {
-    if (asset.type === "folder")
-      continue;
-    serverByPath.set(pathById.get(asset.id), asset);
-  }
-  const localByPath = new Map(scan.files.map((f) => [f.path, f]));
-  const entries = [];
-  const paths = new Set([...serverByPath.keys(), ...localByPath.keys()]);
-  for (const path of [...paths].sort()) {
-    const server = serverByPath.get(path);
-    const local = localByPath.get(path);
-    if (local && !server) {
-      const text = isTextKind(classifyKind(basename(path)));
-      entries.push({ path, status: "added", binary: !text, serverText: "", localText: text ? readFileSync5(local.absPath, "utf8") : undefined });
-      continue;
-    }
-    if (server && !local) {
-      const text = isTextAsset(server.type);
-      entries.push({ path, status: "removed", binary: !text, serverText: text ? server.text ?? "" : undefined, localText: "" });
-      continue;
-    }
-    if (server && local) {
-      if (isTextAsset(server.type)) {
-        const serverText = server.text ?? "";
-        const localText = readFileSync5(local.absPath, "utf8");
-        if (serverText !== localText)
-          entries.push({ path, status: "modified", binary: false, serverText, localText });
-      } else {
-        const serverSize = server.file?.size;
-        const localSize = Buffer.byteLength(readFileSync5(local.absPath));
-        if (serverSize !== undefined && serverSize !== localSize) {
-          entries.push({ path, status: "modified", binary: true });
-        }
-      }
+// src/compile/projectCompile.ts
+import { existsSync as existsSync6 } from "node:fs";
+import { createRequire as createRequire3 } from "node:module";
+import { dirname as dirname5, join as join9 } from "node:path";
+import { fileURLToPath as fileURLToPath2 } from "node:url";
+// ../sdk/src/compile/bundler.ts
+import { existsSync as existsSync5, readdirSync as readdirSync4, readFileSync as readFileSync5, statSync } from "node:fs";
+import { spawnSync } from "node:child_process";
+import { createRequire as createRequire2 } from "node:module";
+import { dirname as dirname4, join as join8, relative as relative2 } from "node:path";
+import { fileURLToPath } from "node:url";
+
+// ../sdk/src/compile/assetMacro.ts
+var ASSET_RE = /\basset\(\s*(["'])((?:[^"'\\]|\\.)*)\1\s*\)/g;
+var hasAssetMacro = (src) => src.includes("asset(");
+var desugarAssetMacros = (src, filePath) => {
+  const byPath = new Map;
+  let i = 0;
+  const out = src.replace(ASSET_RE, (_match, _quote, path) => {
+    let name = byPath.get(path);
+    if (!name) {
+      name = `__asset_${i++}`;
+      byPath.set(path, name);
     }
+    return name;
+  });
+  if (/\basset\(/.test(out)) {
+    throw new Error(`asset() expects a string literal, found a dynamic argument in: ${filePath}`);
   }
-  return entries;
+  if (byPath.size === 0)
+    return src;
+  const imports = [...byPath].map(([path, name]) => `import ${name} from ${JSON.stringify(path)};`).join(`
+`);
+  return out + `
+` + imports;
 };
 
-// src/textDiff.ts
-var MAX_LINES = 4000;
-var lcsDiff = (a, b) => {
-  const n = a.length, m = b.length;
-  const dp = Array.from({ length: n + 1 }, () => new Array(m + 1).fill(0));
-  for (let i2 = n - 1;i2 >= 0; i2--) {
-    for (let j2 = m - 1;j2 >= 0; j2--) {
-      dp[i2][j2] = a[i2] === b[j2] ? dp[i2 + 1][j2 + 1] + 1 : Math.max(dp[i2 + 1][j2], dp[i2][j2 + 1]);
+// ../sdk/src/compile/aspectMacro.ts
+var ASPECT_RE = /\bclass\s+\w+\s+extends\s+Aspect\s*<\s*(["'])((?:[^"'\\]|\\.)*)\1[^{};]*>\s*\{/g;
+var hasAspectExtends = (src) => /\bextends\s+Aspect\s*</.test(src);
+var injectAspectNames = (src) => {
+  let out = "";
+  let last = 0;
+  ASPECT_RE.lastIndex = 0;
+  let m;
+  while ((m = ASPECT_RE.exec(src)) !== null) {
+    const braceEnd = m.index + m[0].length;
+    if (!classBodyDeclaresAspect(src, braceEnd)) {
+      out += src.slice(last, braceEnd) + ` static aspect = ${JSON.stringify(m[2])};`;
+      last = braceEnd;
     }
   }
-  const ops = [];
-  let i = 0, j = 0;
-  while (i < n && j < m) {
-    if (a[i] === b[j]) {
-      ops.push({ tag: " ", line: a[i] });
-      i++;
-      j++;
-    } else if (dp[i + 1][j] >= dp[i][j + 1]) {
-      ops.push({ tag: "-", line: a[i] });
-      i++;
-    } else {
-      ops.push({ tag: "+", line: b[j] });
-      j++;
-    }
+  return last === 0 ? src : out + src.slice(last);
+};
+var classBodyDeclaresAspect = (src, from) => {
+  let depth = 1;
+  let i = from;
+  for (;i < src.length && depth > 0; i++) {
+    const c2 = src[i];
+    if (c2 === "{")
+      depth++;
+    else if (c2 === "}")
+      depth--;
   }
-  while (i < n)
-    ops.push({ tag: "-", line: a[i++] });
-  while (j < m)
-    ops.push({ tag: "+", line: b[j++] });
-  return ops;
+  return /\bstatic\b[^;{}()=]*\baspect\b/.test(src.slice(from, i));
 };
-var splitLines = (text) => {
-  if (text === "")
-    return [];
-  const lines = text.split(`
-`);
-  if (lines[lines.length - 1] === "")
-    lines.pop();
-  return lines;
+
+// ../sdk/src/compile/bundler.ts
+var resolveInject = () => {
+  const override = process.env.LECODES_SDK_INJECT;
+  if (override && existsSync5(override))
+    return override;
+  const here = dirname4(fileURLToPath(import.meta.url));
+  const src = join8(here, "..", "inject.ts");
+  if (existsSync5(src))
+    return src;
+  throw new Error("sdk: could not locate the inject source (LECODES_SDK_INJECT / src/inject.ts)");
 };
-var unifiedDiff = (oldText, newText, oldLabel, newLabel, context = 3) => {
-  if (oldText === newText)
-    return "";
-  const a = splitLines(oldText);
-  const b = splitLines(newText);
-  if (a.length + b.length > MAX_LINES) {
-    return c.dim(`  (large file — ${a.length} → ${b.length} lines, diff omitted)`);
-  }
-  const ops = lcsDiff(a, b);
-  const hunks = [];
-  let aLine = 0, bLine = 0;
-  let cur = null;
-  let trailingContext = 0;
-  for (let k = 0;k < ops.length; k++) {
-    const op = ops[k];
-    const isChange = op.tag !== " ";
-    if (isChange) {
-      if (!cur) {
-        const back = [];
-        let bi = k - 1;
-        while (bi >= 0 && ops[bi].tag === " " && back.length < context) {
-          back.unshift(ops[bi]);
-          bi--;
-        }
-        cur = { aStart: aLine - back.length, bStart: bLine - back.length, lines: [...back] };
-      }
-      cur.lines.push(op);
-      trailingContext = 0;
-    } else if (cur) {
-      cur.lines.push(op);
-      if (++trailingContext >= context * 2) {
-        cur.lines.length -= trailingContext - context;
-        hunks.push(cur);
-        cur = null;
-        trailingContext = 0;
-      }
-    }
-    if (op.tag !== "+")
-      aLine++;
-    if (op.tag !== "-")
-      bLine++;
+var normalize = (path) => {
+  const parts = [];
+  for (const part of path.split("/")) {
+    if (!part || part === ".")
+      continue;
+    if (part === "..")
+      parts.pop();
+    else
+      parts.push(part);
   }
-  if (cur) {
-    if (trailingContext > context)
-      cur.lines.length -= trailingContext - context;
-    hunks.push(cur);
+  return "/" + parts.join("/");
+};
+var CHISEL_DEFINE = { RAD2DEG: "57.29577951308232", DEG2RAD: "0.017453292519943295" };
+var CHISEL_KEEP = ["_*"];
+var resolveSdkSrc = () => {
+  const inject = resolveInject();
+  if (!inject.endsWith("inject.ts")) {
+    throw new Error(`chisel needs the SDK source tree (src/inject.ts); got ${inject}. Set LECODES_SDK_INJECT to the source.`);
   }
-  const out = [c.bold(`--- ${oldLabel}`), c.bold(`+++ ${newLabel}`)];
-  for (const h of hunks) {
-    const aCount = h.lines.filter((o) => o.tag !== "+").length;
-    const bCount = h.lines.filter((o) => o.tag !== "-").length;
-    out.push(c.cyan(`@@ -${h.aStart + 1},${aCount} +${h.bStart + 1},${bCount} @@`));
-    for (const o of h.lines) {
-      if (o.tag === "+")
-        out.push(c.green("+" + o.line));
-      else if (o.tag === "-")
-        out.push(c.red("-" + o.line));
-      else
-        out.push(c.dim(" " + o.line));
+  return dirname4(inject);
+};
+var isSdkSource = (path) => /\.[tj]s$/.test(path) && !path.endsWith(".d.ts") && !path.includes("/compile/") && !path.includes("/tests/") && !path.includes("/__tests__/");
+var sdkFilesCache = new Map;
+var collectSdkFiles = (sdkSrc) => {
+  const cached = sdkFilesCache.get(sdkSrc);
+  if (cached)
+    return cached;
+  const out = {};
+  const walk = (dir) => {
+    for (const name of readdirSync4(dir)) {
+      const p = join8(dir, name);
+      if (statSync(p).isDirectory())
+        walk(p);
+      else if (isSdkSource(p))
+        out["/__sdk/" + relative2(sdkSrc, p).split("\\").join("/")] = readFileSync5(p, "utf8");
     }
+  };
+  walk(sdkSrc);
+  sdkFilesCache.set(sdkSrc, out);
+  return out;
+};
+var resolveChiselBin = () => {
+  const override = process.env.LECODES_CHISEL_BIN;
+  if (override) {
+    if (existsSync5(override))
+      return override;
+    throw new Error(`LECODES_CHISEL_BIN points at a missing file: ${override}`);
   }
-  return out.join(`
-`);
+  try {
+    const bin = createRequire2(import.meta.url)("@letary/chisel").binaryPath();
+    if (bin && existsSync5(bin))
+      return bin;
+  } catch {}
+  throw new Error("chisel binary not found. Install @letary/chisel, or set LECODES_CHISEL_BIN.");
 };
-
-// src/commands/diff.ts
-var diff = async (args) => {
-  const root = findProjectRoot(process.cwd());
-  const manifest = readManifest(root);
-  const config = loadConfig();
-  const apiUrl = requireApiUrl(config);
-  const token = requireToken(config);
-  info(c.dim("Comparing with the server…"));
-  const project = await getProject(apiUrl, token, manifest.uuid);
-  const scan = scanProject(root, manifest);
-  let entries = computeServerDiff(project, scan);
-  if (args._.length > 0) {
-    const keys = args._.map(toKey);
-    entries = entries.filter((e) => keys.some((k) => e.path === k || e.path.startsWith(k + "/")));
+var bundleProjectChisel = async (entrypoint, files, format, sourcemap) => {
+  const entry = normalize(entrypoint);
+  const projFiles = {};
+  for (const [k, v] of Object.entries(files)) {
+    const path = normalize(k);
+    let src = v;
+    if (/\.[tj]sx?$/.test(path)) {
+      if (hasAssetMacro(src))
+        src = desugarAssetMacros(src, path);
+      if (hasAspectExtends(src))
+        src = injectAspectNames(src);
+    }
+    projFiles[path] = src;
   }
-  if (entries.length === 0) {
-    info(c.dim("No differences between local and server."));
-    return;
+  if (!projFiles[entry])
+    throw new Error(`Entrypoint not found: ${entry}`);
+  const sdkFiles = collectSdkFiles(resolveSdkSrc());
+  const minify = process.env.LECODES_CHISEL_MINIFY !== "0";
+  const input = JSON.stringify({
+    files: { ...sdkFiles, ...projFiles },
+    entry,
+    inject: ["/__sdk/inject.ts"],
+    format,
+    minify,
+    fuse: process.env.LECODES_CHISEL_FUSE === "1",
+    define: CHISEL_DEFINE,
+    keep: CHISEL_KEEP,
+    sourcemap,
+    reactive_ui: process.env.LECODES_CHISEL_REACTIVE_UI !== "0"
+  });
+  const bin = resolveChiselBin();
+  const r = spawnSync(bin, [], { input, encoding: "utf8", maxBuffer: 256 * 1024 * 1024 });
+  if (r.status === 2 || r.error) {
+    throw new Error(`chisel failed: ${r.error?.message ?? r.stderr ?? "unknown error"}`);
   }
-  if (flagBool(args, "name-only")) {
-    for (const e of entries)
-      log(statusLabel(e) + e.path + (e.binary ? c.dim(" (binary)") : ""));
-    return;
+  let parsed;
+  try {
+    parsed = JSON.parse(r.stdout || "{}");
+  } catch {
+    throw new Error(`chisel produced invalid output: ${(r.stdout || r.stderr || "").slice(0, 200)}`);
+  }
+  if (parsed.error)
+    throw new Error(`chisel: ${parsed.error}`);
+  if (parsed.code == null)
+    throw new Error("chisel produced no code");
+  return { code: parsed.code, map: parsed.map ?? null };
+};
+var bundleProjectWithMap = async (entrypoint, files, format = "esm") => bundleProjectChisel(entrypoint, files, format, true);
+
+// ../sdk/src/compile/header.ts
+var buildHeader = (name, code, opts = {}) => {
+  let header = `// name: ${name.slice(0, 20)}
+`;
+  if (opts.icon)
+    header += `// icon: ${opts.icon}
+`;
+  header += `// last-updated: ${new Date().toISOString()}
+`;
+  const localAssets = new Set;
+  for (const m of code.matchAll(/_creatorUtils\.fetchLocal\((.+?)\)/g)) {
+    localAssets.add(m[1].replaceAll(/['"]/g, "").trim());
   }
+  if (/_creator\.createGlb/.test(code))
+    localAssets.add("uberarchive");
+  if (/_creator\.captureImage/.test(code))
+    localAssets.add("capture");
+  if (localAssets.size > 0)
+    header += `// preload: ${[...localAssets].join(";")}
+`;
+  if (!code.includes("_creator.createScene") && !code.includes("_creator.createEntity"))
+    header += `// gl: disable
+`;
+  else if (code.includes("_creator.createEngine"))
+    header += `// gl: defer
+`;
+  if (code.includes("_creator2d."))
+    header += `// 2d: enable
+`;
+  if (code.includes("_creator.createARController"))
+    header += "// ar: enable";
+  header += `
+`;
+  return header;
+};
+
+// ../sdk/src/compile/sourcemap.ts
+var offsetSourceMap = (mapJson, lines) => {
+  if (lines <= 0)
+    return mapJson;
+  const map = JSON.parse(mapJson);
+  map.mappings = ";".repeat(lines) + map.mappings;
+  return JSON.stringify(map);
+};
+var inlineSourceMapComment = (mapJson) => {
+  const b64 = Buffer.from(mapJson, "utf8").toString("base64");
+  return `//# lecodesMap=data:application/json;charset=utf-8;base64,${b64}`;
+};
+
+// ../sdk/src/compile/compileProject.ts
+var detectEntry = (entries) => {
+  let entry = "";
+  let max = -1;
   for (const e of entries) {
-    if (e.binary) {
-      log(statusLabel(e) + e.path + c.dim(" (binary — content not shown)"));
-      continue;
+    const ext2 = e.path.split(".").at(-1)?.toLowerCase();
+    if (e.type === "text" && e.text !== undefined && !e.text.includes("export") && (ext2 === "ts" || ext2 === "js")) {
+      if (e.text.length > max) {
+        entry = e.path;
+        max = e.text.length;
+      }
     }
-    const d = unifiedDiff(e.serverText ?? "", e.localText ?? "", `server${e.path}`, `local${e.path}`);
-    if (d)
-      log(`
-` + d);
   }
+  return entry;
+};
+var compileProject = async (opts) => {
+  const entry = opts.entryOverride ?? detectEntry(opts.entries);
+  if (!entry) {
+    throw new Error("Couldn't find an entrypoint (a top-level .ts/.js file with no `export`). Pass entryOverride.");
+  }
+  const files = {};
+  for (const e of opts.entries) {
+    if (e.type === "resource") {
+      files[e.path] = `export default "${opts.publicUrl}${e.fileSrc ?? ""}"`;
+    } else if (e.type === "shader") {
+      const shaders = e.shaders ?? [];
+      if (shaders.length > 2) {
+        files[e.path] = `export default \`${opts.publicUrl}${shaders[0].src.replace("_opengl", "_${_creator.subBackend ?? _creator.backend}")}\``;
+      } else if (shaders.length > 0) {
+        files[e.path] = `export default \`${opts.publicUrl}${shaders[0].src.replace("_opengl", "_${_creator.backend}")}\``;
+      } else {
+        files[e.path] = `export default ""`;
+      }
+    } else if (e.path.toLowerCase().endsWith(".svg")) {
+      files[e.path] = `export default SvgSource(\`${e.text ?? ""}\`)`;
+    } else {
+      files[e.path] = e.text ?? "";
+    }
+  }
+  const { code, map } = await bundleProjectWithMap(entry, files, opts.format ?? "esm");
+  if (opts.header === false) {
+    return map ? `${code}
+${inlineSourceMapComment(map)}` : code;
+  }
+  const header = buildHeader(opts.name, code, { icon: opts.icon });
+  if (!map)
+    return header + code;
+  const headerLines = (header.match(/\n/g) ?? []).length;
+  return `${header}${code}
+${inlineSourceMapComment(offsetSourceMap(map, headerLines))}`;
+};
+// src/compile/projectCompile.ts
+var here = dirname5(fileURLToPath2(import.meta.url));
+var vendoredInject = join9(here, "..", "runtime", "sdk", "inject.ts");
+if (existsSync6(vendoredInject))
+  process.env.LECODES_SDK_INJECT = vendoredInject;
+var resolveChiselBin2 = () => {
+  if (process.env.LECODES_CHISEL_BIN)
+    return process.env.LECODES_CHISEL_BIN;
+  try {
+    return createRequire3(import.meta.url)("@letary/chisel").binaryPath() ?? null;
+  } catch {
+    return null;
+  }
+};
+var chiselBin = resolveChiselBin2();
+if (chiselBin)
+  process.env.LECODES_CHISEL_BIN = chiselBin;
+var compileProject2 = (opts) => compileProject({
+  entries: opts.entries.map((e) => ({ path: e.path, type: e.type, text: e.text, fileSrc: e.fileSrc, shaders: e.shaders })),
+  name: opts.name,
+  publicUrl: opts.publicUrl,
+  entryOverride: opts.entryOverride,
+  header: opts.header,
+  format: opts.format
+});
+
+// src/compile/designCompile.ts
+var LOCAL_ASSET_SCHEME = "lecodesfile://";
+var compileDesignScreen = async (opts) => {
+  const { root, manifest, designKey, screenId } = opts;
+  const entries = [];
+  const scan = scanLocal(root, { ignore: loadIgnore(root), tracked: new Set(Object.keys(manifest?.files ?? {})) });
+  for (const file of scan.files) {
+    const type = manifest?.files[file.path]?.type ?? classifyKind(basename(file.path));
+    if (type === "resource") {
+      entries.push({
+        path: file.path,
+        type,
+        fileSrc: opts.assets === "disk" ? encodeURIComponent(file.absPath) : encodeURI(file.path),
+        absPath: file.absPath
+      });
+    } else if (type === "shader") {
+      entries.push({ path: file.path, type, shaders: [] });
+    } else {
+      entries.push({ path: file.path, type, text: readFileSync6(file.absPath, "utf8") });
+    }
+  }
+  const entryPath = `${designKey}/.screen-entry.ts`;
+  entries.push({
+    path: entryPath,
+    type: "text",
+    text: `import screen from "./screens/${screenId}"
+screen.open()
+`
+  });
+  return compileProject2({
+    entries,
+    name: opts.name,
+    publicUrl: opts.assets === "disk" ? LOCAL_ASSET_SCHEME : "/project",
+    entryOverride: entryPath,
+    header: false,
+    format: "iife"
+  });
 };
-var statusLabel = (e) => e.status === "added" ? c.green("  added    ") : e.status === "removed" ? c.red("  removed  ") : c.yellow("  modified ");
 
 // src/browserAuth.ts
 import { createServer } from "node:http";
@@ -858,359 +1025,556 @@ var browserLogin = async (webBase, timeoutMs = 5 * 60 * 1000, open = openBrowser
   }
 };
 
-// src/commands/login.ts
-var login = async (args) => {
-  const config = loadConfig();
-  const apiUrl = normalizeApiUrl(flagStr(args, "api") ?? config.apiUrl ?? DEFAULT_API);
-  const webBase = normalizeApiUrl(flagStr(args, "web") ?? apiUrl);
-  const token = flagStr(args, "token") ?? await browserLogin(webBase);
-  const account = await getAccount(apiUrl, token);
-  saveConfig({ apiUrl, token });
-  success(`Logged in as ${c.bold(account.email)} on ${apiUrl}`);
-};
+// src/commands/designTemplates.ts
+var META_JSON = `{
+  "screens": {
+    "home": { "pos": [0, 0], "desc": "Example screen — replace me" }
+  },
+  "edges": []
+}
+`;
+var TOKENS_TS = `// Design tokens shared by every screen. Colors are hex strings (the engine parses hex only).
+export const colors = {
+  bg: "#101114",
+  card: "#1c1e24",
+  text: "#f2f3f5",
+  muted: "#8a919e",
+  accent: "#5b8cff",
+  danger: "#e5484d",
+}
 
-// src/commands/preview.ts
-import { writeFileSync as writeFileSync7 } from "node:fs";
-import { resolve as resolve3 } from "node:path";
+export const spacing = { xs: 4, sm: 8, md: 16, lg: 24 }
 
-// src/compile/collect.ts
-import { readFileSync as readFileSync6 } from "node:fs";
-import { basename as basename2 } from "node:path";
-var collectEntries = (root, manifest, project) => {
-  const pathById = buildPaths(project.assets);
-  const serverByPath = new Map;
-  for (const asset of project.assets) {
-    if (asset.type === "folder")
-      continue;
-    serverByPath.set(pathById.get(asset.id), { fileSrc: asset.file?.src ?? undefined, shaders: asset.shaders ?? [] });
-  }
-  const entries = [];
-  const warnings = [];
-  for (const file of scanLocal(root).files) {
-    const type = manifest.files[file.path]?.type ?? classifyKind(basename2(file.path));
-    if (type === "resource") {
-      const src = serverByPath.get(file.path)?.fileSrc;
-      if (!src)
-        warnings.push(`No server URL for ${file.path} — push it so its URL resolves.`);
-      entries.push({ path: file.path, type, fileSrc: src, absPath: file.absPath });
-    } else if (type === "shader") {
-      const shaders = serverByPath.get(file.path)?.shaders;
-      if (!shaders?.length)
-        warnings.push(`No compiled shader for ${file.path} — push it to compile the shader.`);
-      entries.push({ path: file.path, type, shaders });
-    } else {
-      entries.push({ path: file.path, type, text: readFileSync6(file.absPath, "utf8") });
-    }
-  }
-  return { entries, warnings };
-};
+export const radius = { sm: 8, md: 12, lg: 20 }
+`;
+var HOME_SCREEN_TS = `import { colors, spacing, radius } from "../shared/tokens"
 
-// src/compile/projectCompile.ts
-import { existsSync as existsSync6 } from "node:fs";
-import { createRequire as createRequire3 } from "node:module";
-import { dirname as dirname5, join as join9 } from "node:path";
-import { fileURLToPath as fileURLToPath2 } from "node:url";
-// ../sdk/src/compile/bundler.ts
-import { existsSync as existsSync5, readdirSync as readdirSync4, readFileSync as readFileSync7, statSync } from "node:fs";
-import { spawnSync } from "node:child_process";
-import { createRequire as createRequire2 } from "node:module";
-import { dirname as dirname4, join as join8, relative as relative2 } from "node:path";
-import { fileURLToPath } from "node:url";
+// Mock data: the domain shown on realistic values. Inline, per screen.
+const items = [
+  { title: "Design the home screen", done: true },
+  { title: "Sketch the flow on the canvas", done: false },
+  { title: "Ask Claude to add a details screen", done: false },
+]
 
-// ../sdk/src/compile/assetMacro.ts
-var ASSET_RE = /\basset\(\s*(["'])((?:[^"'\\]|\\.)*)\1\s*\)/g;
-var hasAssetMacro = (src) => src.includes("asset(");
-var desugarAssetMacros = (src, filePath) => {
-  const byPath = new Map;
-  let i = 0;
-  const out = src.replace(ASSET_RE, (_match, _quote, path) => {
-    let name = byPath.get(path);
-    if (!name) {
-      name = `__asset_${i++}`;
-      byPath.set(path, name);
-    }
-    return name;
-  });
-  if (/\basset\(/.test(out)) {
-    throw new Error(`asset() expects a string literal, found a dynamic argument in: ${filePath}`);
+export default UIScreen([
+  UIText("Today").style({ fontSize: 28, fontWeight: 700, color: colors.text, mt: spacing.lg }),
+  UIText("3 tasks").style({ fontSize: 14, color: colors.muted, mt: spacing.xs }),
+  UIColumn(items.map((item) =>
+    UIRow([
+      UIColumn(item.done ? [ UIText("✓").style({ fontSize: 12, color: colors.text }) ] : []).style({
+        width: 22,
+        height: 22,
+        borderRadius: 11,
+        justifyContent: "center",
+        alignItems: "center",
+        border: item.done ? undefined : \`2px solid \${colors.muted}\`,
+        bgColor: item.done ? colors.accent : undefined,
+      }),
+      UIText(item.title).style({ fontSize: 16, color: item.done ? colors.muted : colors.text, flexGrow: 1 }),
+    ]).style({
+      bgColor: colors.card,
+      borderRadius: radius.md,
+      p: spacing.md,
+      gap: spacing.md,
+      alignItems: "center",
+    }),
+  )).style({ gap: spacing.sm, mt: spacing.lg }),
+  UISpacer(),
+  UIButton([
+    UIText("Add task").style({ fontSize: 16, fontWeight: 600, color: colors.text }),
+  ]).style({
+    name: "add-task",
+    bgColor: colors.accent,
+    borderRadius: radius.lg,
+    p: spacing.md,
+    mb: spacing.lg,
+  }),
+]).style({ bgColor: colors.bg, p: spacing.md, pt: "safe-top" })
+`;
+var CLAUDE_MD = `# LeCodes Design — screen prototyping canvas
+
+This folder is a **design canvas** for a LeCodes app: each file in \`screens/\` is one live,
+executable screen shown on a spatial canvas in the browser (\`lecodes design\` runs the dev server).
+You (Claude) write the screens; the developer views them on the canvas and gives feedback.
+This is an intent-capture stage — screens run on inline mock data, before any backend exists.
+
+## Read this first, then meta.json
+
+\`meta.json\` is the app map: every screen (position, description) and the edges between them
+(navigation intent). **Read it before opening any screen file.** It is the human's file — the
+canvas and the developer own positions and descriptions. You MAY add entries for new screens you
+create (pick a free position: screens are 390×844, leave ~160px gaps) and add edges when the flow
+is clear, but never reposition or rewrite existing human-authored descriptions.
+
+\`\`\`json
+{
+  "screens": { "login": { "pos": [0, 0], "desc": "Phone login" } },
+  "edges": [ { "from": "login", "to": "code", "label": "after phone entry", "activator": "submit" } ]
+}
+\`\`\`
+
+- An edge's optional \`activator\` names the element (its \`name\` style option) that triggers the
+  transition. Give a \`name\` to interactive elements an edge refers to — nothing else needs names.
+
+## Screen rules
+
+- **One file = one screen.** \`screens/<id>.ts\` default-exports an already-computed screen:
+  \`export default UIScreen([ … ]).style({ … })\`. The filename is the screen's identity.
+- **Styles go through the chained \`.style({ … })\` method** — e.g.
+  \`UIText("Today").style({ fontSize: 28, fontWeight: 700 })\`. Passing a style object as the
+  first argument is a legacy form.
+- **Screens are islands.** A screen file imports ONLY from \`../shared/\` — never from another
+  screen, and screens take no props. All relational info lives in meta.json.
+- **Mock data is the domain.** Put realistic inline mock data at the top of the screen file
+  (entities + fields ARE the future schema — make them meaningful, not "Lorem ipsum").
+- **Reuse via shared/.** Design tokens and reusable components live in \`shared/\`. Use them in
+  every screen. Promoting a repeated pattern into \`shared/\` is an explicit, deliberate step.
+- The LeCodes UI API (\`UIScreen\`, \`UIColumn\`, \`UIRow\`, \`UIBox\`, \`UIText\`, \`UIImage\`,
+  \`UIButton\`, \`UIInput\`, \`UISpacer\`, \`UIScrollable\`, …) is **global** — no imports needed.
+  Colors must be hex strings.
+
+## See what you built
+
+The developer watches the canvas live (screens hot-reload on save). To see a screen yourself:
+
+\`\`\`sh
+lecodes design snapshot <id>          # semantic JSON of the laid-out screen → stdout
+lecodes design snapshot <id> --png    # + PNG screenshot → design/.snapshots/<id>.png
+lecodes design snapshot               # all screens → design/.snapshots/
+\`\`\`
+
+Snapshot after every screen you create or change, and fix what looks wrong (overflow, overlap,
+unreadable contrast, off-screen content) before reporting back.
+
+## Workflow
+
+1. Read \`meta.json\`, then the \`shared/\` signatures, then only the screens you need.
+2. Create/edit screen files; register new screens (and clear edges) in \`meta.json\`.
+3. Snapshot → verify → fix.
+4. When the developer edits a description or the flow on the canvas, treat meta.json as the
+   updated spec.
+`;
+var README_HINT = `# design/
+
+LeCodes Design canvas — run \`lecodes design\` here and open the printed URL.
+See CLAUDE.md for the conventions (it's written for AI assistants, but it's the spec).
+`;
+
+// src/commands/design.ts
+var DEFAULT_DIR = "design";
+var DEFAULT_PORT = 4477;
+var getContext = (args) => {
+  let root;
+  let manifest;
+  try {
+    root = findProjectRoot(process.cwd());
+    manifest = readManifest(root);
+  } catch {
+    root = process.cwd();
+    manifest = null;
   }
-  if (byPath.size === 0)
-    return src;
-  const header = [...byPath].map(([path, name]) => `import ${name} from ${JSON.stringify(path)};`).join(`
-`);
-  return header + `
-` + out;
+  const dirName = (flagStr(args, "dir") ?? DEFAULT_DIR).replace(/[/\\]+$/, "");
+  return {
+    root,
+    manifest,
+    name: manifest?.name ?? basename2(root),
+    dirName,
+    designDir: join10(root, dirName),
+    designKey: "/" + dirName.replace(/\\/g, "/")
+  };
 };
-
-// ../sdk/src/compile/aspectMacro.ts
-var ASPECT_RE = /\bclass\s+\w+\s+extends\s+Aspect\s*<\s*(["'])((?:[^"'\\]|\\.)*)\1[^{};]*>\s*\{/g;
-var hasAspectExtends = (src) => /\bextends\s+Aspect\s*</.test(src);
-var injectAspectNames = (src) => {
-  let out = "";
-  let last = 0;
-  ASPECT_RE.lastIndex = 0;
-  let m;
-  while ((m = ASPECT_RE.exec(src)) !== null) {
-    const braceEnd = m.index + m[0].length;
-    if (!classBodyDeclaresAspect(src, braceEnd)) {
-      out += src.slice(last, braceEnd) + ` static aspect = ${JSON.stringify(m[2])};`;
-      last = braceEnd;
+var listScreens = (designDir) => {
+  const dir = join10(designDir, "screens");
+  if (!existsSync7(dir))
+    return [];
+  return readdirSync5(dir).filter((f) => f.endsWith(".ts") && !f.startsWith(".")).map((f) => f.slice(0, -3)).sort();
+};
+var readMetaSizes = (designDir) => {
+  try {
+    const meta = JSON.parse(readFileSync7(join10(designDir, "meta.json"), "utf8"));
+    return meta?.screens ?? {};
+  } catch {
+    return {};
+  }
+};
+var init = async (ctx) => {
+  const files = [
+    ["meta.json", META_JSON],
+    ["README.md", README_HINT],
+    ["CLAUDE.md", CLAUDE_MD],
+    [join10("shared", "tokens.ts"), TOKENS_TS],
+    [join10("screens", "home.ts"), HOME_SCREEN_TS]
+  ];
+  mkdirSync7(join10(ctx.designDir, "screens"), { recursive: true });
+  mkdirSync7(join10(ctx.designDir, "shared"), { recursive: true });
+  let created = 0;
+  for (const [rel, content] of files) {
+    const abs = join10(ctx.designDir, rel);
+    if (existsSync7(abs)) {
+      note(`kept      ${ctx.dirName}/${rel.replace(/\\/g, "/")}`);
+      continue;
+    }
+    writeFileSync7(abs, content);
+    log(`${c.green("created")}   ${ctx.dirName}/${rel.replace(/\\/g, "/")}`);
+    created++;
+  }
+  const ignorePath = join10(ctx.root, ".lecodesignore");
+  const ignoreLine = `${ctx.dirName}/.snapshots/`;
+  const current = existsSync7(ignorePath) ? readFileSync7(ignorePath, "utf8") : "";
+  if (!current.split(/\r?\n/).includes(ignoreLine)) {
+    appendFileSync(ignorePath, (current && !current.endsWith(`
+`) ? `
+` : "") + ignoreLine + `
+`);
+    log(`${c.green("ignored")}   ${ignoreLine} (in .lecodesignore)`);
+  }
+  log("");
+  log(created ? "Design canvas ready." : "Design canvas already initialized.");
+  log(`  ${c.bold("lecodes design")}                start the canvas (browser)`);
+  log(`  ${c.bold("lecodes design snapshot")}       render screens headless (for AI feedback)`);
+  log(`  Point Claude Code at ${c.bold(ctx.dirName + "/CLAUDE.md")} — it documents the conventions.`);
+};
+var snapshot = async (ctx, args) => {
+  const all = listScreens(ctx.designDir);
+  if (all.length === 0)
+    throw new CliError(`No screens in ${ctx.dirName}/screens/ — run "lecodes design init" first.`);
+  const requested = args._.slice(1);
+  for (const id of requested) {
+    if (!all.includes(id))
+      throw new CliError(`No screen "${id}" (have: ${all.join(", ")}).`);
+  }
+  const targets = requested.length ? requested : all;
+  let renderer;
+  try {
+    renderer = await import("lecodes-renderer/headless");
+  } catch {
+    throw new CliError("The renderer isn't installed. Run:  npm i -D lecodes-renderer");
+  }
+  const killer = setTimeout(() => {
+    warnErr("Snapshot timed out after 120s.");
+    process.exit(1);
+  }, 120000);
+  killer.unref?.();
+  const png = flagBool(args, "png") || flagStr(args, "png") !== undefined;
+  const sizes = readMetaSizes(ctx.designDir);
+  const outDir = flagStr(args, "out-dir") ?? join10(ctx.designDir, ".snapshots");
+  const single = targets.length === 1 && requested.length === 1 && !png && !flagStr(args, "out-dir");
+  const onConsole = flagBool(args, "logs") ? (level, text) => logErr(`${c.dim(`[${level}]`)} ${text}`) : undefined;
+  if (!single)
+    mkdirSync7(outDir, { recursive: true });
+  for (const id of targets) {
+    note(`Rendering ${id}…`);
+    const js = await compileDesignScreen({
+      root: ctx.root,
+      manifest: ctx.manifest,
+      name: ctx.name,
+      designKey: ctx.designKey,
+      screenId: id,
+      assets: "disk"
+    });
+    const [width, height] = sizes[id]?.size ?? [390, 844];
+    const result = await renderer.renderToJson(js, { width, height, localAssets: true, onConsole });
+    for (const w of result.warnings)
+      warnErr(`${id}: ${w}`);
+    if (single) {
+      const text = result.text.endsWith(`
+`) ? result.text : result.text + `
+`;
+      process.stdout.write(text);
+      return;
+    }
+    writeFileSync7(join10(outDir, `${id}.json`), result.text);
+    log(`${c.green("✓")} ${id} → ${join10(outDir, `${id}.json`)}`);
+    if (png) {
+      const pngResult = await renderer.renderToPng(js, { width, height, localAssets: true, scale: 2, onConsole });
+      for (const w of pngResult.warnings)
+        warnErr(`${id}: ${w}`);
+      writeFileSync7(join10(outDir, `${id}.png`), pngResult.png);
+      log(`${c.green("✓")} ${id} → ${join10(outDir, `${id}.png`)}`);
     }
   }
-  return last === 0 ? src : out + src.slice(last);
 };
-var classBodyDeclaresAspect = (src, from) => {
-  let depth = 1;
-  let i = from;
-  for (;i < src.length && depth > 0; i++) {
-    const c2 = src[i];
-    if (c2 === "{")
-      depth++;
-    else if (c2 === "}")
-      depth--;
+var serve = async (ctx, args) => {
+  if (!existsSync7(ctx.designDir)) {
+    throw new CliError(`No ${ctx.dirName}/ folder here. Run "lecodes design init" to scaffold it.`);
   }
-  return /\bstatic\b[^;{}()=]*\baspect\b/.test(src.slice(from, i));
+  let designServer;
+  try {
+    designServer = await import("lecodes-design/server");
+  } catch {
+    throw new CliError("The design canvas isn't installed. Run:  npm i -D lecodes-design");
+  }
+  const port = Number(flagStr(args, "port")) || DEFAULT_PORT;
+  const server = await designServer.startDesignServer({
+    root: ctx.root,
+    designDir: ctx.designDir,
+    name: ctx.name,
+    port,
+    log: note,
+    compileScreen: async (id) => ({
+      js: await compileDesignScreen({
+        root: ctx.root,
+        manifest: ctx.manifest,
+        name: ctx.name,
+        designKey: ctx.designKey,
+        screenId: id,
+        assets: "server"
+      }),
+      warnings: []
+    })
+  });
+  log(`${c.bold("LeCodes Design")} — ${ctx.name}`);
+  log(`Canvas:   ${c.bold(server.url)}`);
+  log(`Watching: ${ctx.dirName}/  (screens hot-reload on save; Ctrl+C to stop)`);
+  if (!flagBool(args, "no-open"))
+    openBrowser(server.url);
+};
+var design = async (args) => {
+  const sub = args._[0] ?? "serve";
+  const ctx = getContext(args);
+  if (sub === "serve")
+    return serve(ctx, args);
+  if (sub === "init")
+    return init(ctx);
+  if (sub === "snapshot")
+    return snapshot(ctx, args);
+  throw new CliError(`Unknown design subcommand "${sub}" (serve | init | snapshot).`);
 };
 
-// ../sdk/src/compile/bundler.ts
-var resolveInject = () => {
-  const override = process.env.LECODES_SDK_INJECT;
-  if (override && existsSync5(override))
-    return override;
-  const here = dirname4(fileURLToPath(import.meta.url));
-  const src = join8(here, "..", "inject.ts");
-  if (existsSync5(src))
-    return src;
-  throw new Error("sdk: could not locate the inject source (LECODES_SDK_INJECT / src/inject.ts)");
-};
-var normalize = (path) => {
-  const parts = [];
-  for (const part of path.split("/")) {
-    if (!part || part === ".")
+// src/serverDiff.ts
+import { readFileSync as readFileSync8 } from "node:fs";
+import { basename as basename3 } from "node:path";
+var isTextAsset = (t) => t === "text" || t === "shader" || t === "scene";
+var computeServerDiff = (project, scan) => {
+  const pathById = buildPaths(project.assets);
+  const serverByPath = new Map;
+  for (const asset of project.assets) {
+    if (asset.type === "folder")
       continue;
-    if (part === "..")
-      parts.pop();
-    else
-      parts.push(part);
+    serverByPath.set(pathById.get(asset.id), asset);
   }
-  return "/" + parts.join("/");
-};
-var CHISEL_DEFINE = { RAD2DEG: "57.29577951308232", DEG2RAD: "0.017453292519943295" };
-var CHISEL_KEEP = ["_*"];
-var resolveSdkSrc = () => {
-  const inject = resolveInject();
-  if (!inject.endsWith("inject.ts")) {
-    throw new Error(`chisel needs the SDK source tree (src/inject.ts); got ${inject}. Set LECODES_SDK_INJECT to the source.`);
+  const localByPath = new Map(scan.files.map((f) => [f.path, f]));
+  const entries = [];
+  const paths = new Set([...serverByPath.keys(), ...localByPath.keys()]);
+  for (const path of [...paths].sort()) {
+    const server = serverByPath.get(path);
+    const local = localByPath.get(path);
+    if (local && !server) {
+      const text = isTextKind(classifyKind(basename3(path)));
+      entries.push({ path, status: "added", binary: !text, serverText: "", localText: text ? readFileSync8(local.absPath, "utf8") : undefined });
+      continue;
+    }
+    if (server && !local) {
+      const text = isTextAsset(server.type);
+      entries.push({ path, status: "removed", binary: !text, serverText: text ? server.text ?? "" : undefined, localText: "" });
+      continue;
+    }
+    if (server && local) {
+      if (isTextAsset(server.type)) {
+        const serverText = server.text ?? "";
+        const localText = readFileSync8(local.absPath, "utf8");
+        if (serverText !== localText)
+          entries.push({ path, status: "modified", binary: false, serverText, localText });
+      } else {
+        const serverSize = server.file?.size;
+        const localSize = Buffer.byteLength(readFileSync8(local.absPath));
+        if (serverSize !== undefined && serverSize !== localSize) {
+          entries.push({ path, status: "modified", binary: true });
+        }
+      }
+    }
   }
-  return dirname4(inject);
+  return entries;
 };
-var isSdkSource = (path) => /\.[tj]s$/.test(path) && !path.endsWith(".d.ts") && !path.includes("/compile/") && !path.includes("/tests/") && !path.includes("/__tests__/");
-var sdkFilesCache = new Map;
-var collectSdkFiles = (sdkSrc) => {
-  const cached = sdkFilesCache.get(sdkSrc);
-  if (cached)
-    return cached;
-  const out = {};
-  const walk = (dir) => {
-    for (const name of readdirSync4(dir)) {
-      const p = join8(dir, name);
-      if (statSync(p).isDirectory())
-        walk(p);
-      else if (isSdkSource(p))
-        out["/__sdk/" + relative2(sdkSrc, p).split("\\").join("/")] = readFileSync7(p, "utf8");
+
+// src/textDiff.ts
+var MAX_LINES = 4000;
+var lcsDiff = (a, b) => {
+  const n = a.length, m = b.length;
+  const dp = Array.from({ length: n + 1 }, () => new Array(m + 1).fill(0));
+  for (let i2 = n - 1;i2 >= 0; i2--) {
+    for (let j2 = m - 1;j2 >= 0; j2--) {
+      dp[i2][j2] = a[i2] === b[j2] ? dp[i2 + 1][j2 + 1] + 1 : Math.max(dp[i2 + 1][j2], dp[i2][j2 + 1]);
     }
-  };
-  walk(sdkSrc);
-  sdkFilesCache.set(sdkSrc, out);
-  return out;
-};
-var resolveChiselBin = () => {
-  const override = process.env.LECODES_CHISEL_BIN;
-  if (override) {
-    if (existsSync5(override))
-      return override;
-    throw new Error(`LECODES_CHISEL_BIN points at a missing file: ${override}`);
   }
-  try {
-    const bin = createRequire2(import.meta.url)("@letary/chisel").binaryPath();
-    if (bin && existsSync5(bin))
-      return bin;
-  } catch {}
-  throw new Error("chisel binary not found. Install @letary/chisel, or set LECODES_CHISEL_BIN.");
+  const ops = [];
+  let i = 0, j = 0;
+  while (i < n && j < m) {
+    if (a[i] === b[j]) {
+      ops.push({ tag: " ", line: a[i] });
+      i++;
+      j++;
+    } else if (dp[i + 1][j] >= dp[i][j + 1]) {
+      ops.push({ tag: "-", line: a[i] });
+      i++;
+    } else {
+      ops.push({ tag: "+", line: b[j] });
+      j++;
+    }
+  }
+  while (i < n)
+    ops.push({ tag: "-", line: a[i++] });
+  while (j < m)
+    ops.push({ tag: "+", line: b[j++] });
+  return ops;
 };
-var bundleProjectChisel = async (entrypoint, files, format, sourcemap) => {
-  const entry = normalize(entrypoint);
-  const projFiles = {};
-  for (const [k, v] of Object.entries(files)) {
-    const path = normalize(k);
-    let src = v;
-    if (/\.[tj]sx?$/.test(path)) {
-      if (hasAssetMacro(src))
-        src = desugarAssetMacros(src, path);
-      if (hasAspectExtends(src))
-        src = injectAspectNames(src);
+var splitLines = (text) => {
+  if (text === "")
+    return [];
+  const lines = text.split(`
+`);
+  if (lines[lines.length - 1] === "")
+    lines.pop();
+  return lines;
+};
+var unifiedDiff = (oldText, newText, oldLabel, newLabel, context = 3) => {
+  if (oldText === newText)
+    return "";
+  const a = splitLines(oldText);
+  const b = splitLines(newText);
+  if (a.length + b.length > MAX_LINES) {
+    return c.dim(`  (large file — ${a.length} → ${b.length} lines, diff omitted)`);
+  }
+  const ops = lcsDiff(a, b);
+  const hunks = [];
+  let aLine = 0, bLine = 0;
+  let cur = null;
+  let trailingContext = 0;
+  for (let k = 0;k < ops.length; k++) {
+    const op = ops[k];
+    const isChange = op.tag !== " ";
+    if (isChange) {
+      if (!cur) {
+        const back = [];
+        let bi = k - 1;
+        while (bi >= 0 && ops[bi].tag === " " && back.length < context) {
+          back.unshift(ops[bi]);
+          bi--;
+        }
+        cur = { aStart: aLine - back.length, bStart: bLine - back.length, lines: [...back] };
+      }
+      cur.lines.push(op);
+      trailingContext = 0;
+    } else if (cur) {
+      cur.lines.push(op);
+      if (++trailingContext >= context * 2) {
+        cur.lines.length -= trailingContext - context;
+        hunks.push(cur);
+        cur = null;
+        trailingContext = 0;
+      }
     }
-    projFiles[path] = src;
+    if (op.tag !== "+")
+      aLine++;
+    if (op.tag !== "-")
+      bLine++;
   }
-  if (!projFiles[entry])
-    throw new Error(`Entrypoint not found: ${entry}`);
-  const sdkFiles = collectSdkFiles(resolveSdkSrc());
-  const minify = process.env.LECODES_CHISEL_MINIFY !== "0";
-  const input = JSON.stringify({
-    files: { ...sdkFiles, ...projFiles },
-    entry,
-    inject: ["/__sdk/inject.ts"],
-    format,
-    minify,
-    fuse: process.env.LECODES_CHISEL_FUSE === "1",
-    define: CHISEL_DEFINE,
-    keep: CHISEL_KEEP,
-    sourcemap
-  });
-  const bin = resolveChiselBin();
-  const r = spawnSync(bin, [], { input, encoding: "utf8", maxBuffer: 256 * 1024 * 1024 });
-  if (r.status === 2 || r.error) {
-    throw new Error(`chisel failed: ${r.error?.message ?? r.stderr ?? "unknown error"}`);
+  if (cur) {
+    if (trailingContext > context)
+      cur.lines.length -= trailingContext - context;
+    hunks.push(cur);
   }
-  let parsed;
-  try {
-    parsed = JSON.parse(r.stdout || "{}");
-  } catch {
-    throw new Error(`chisel produced invalid output: ${(r.stdout || r.stderr || "").slice(0, 200)}`);
+  const out = [c.bold(`--- ${oldLabel}`), c.bold(`+++ ${newLabel}`)];
+  for (const h of hunks) {
+    const aCount = h.lines.filter((o) => o.tag !== "+").length;
+    const bCount = h.lines.filter((o) => o.tag !== "-").length;
+    out.push(c.cyan(`@@ -${h.aStart + 1},${aCount} +${h.bStart + 1},${bCount} @@`));
+    for (const o of h.lines) {
+      if (o.tag === "+")
+        out.push(c.green("+" + o.line));
+      else if (o.tag === "-")
+        out.push(c.red("-" + o.line));
+      else
+        out.push(c.dim(" " + o.line));
+    }
   }
-  if (parsed.error)
-    throw new Error(`chisel: ${parsed.error}`);
-  if (parsed.code == null)
-    throw new Error("chisel produced no code");
-  return { code: parsed.code, map: parsed.map ?? null };
+  return out.join(`
+`);
 };
-var bundleProjectWithMap = async (entrypoint, files, format = "esm") => bundleProjectChisel(entrypoint, files, format, true);
 
-// ../sdk/src/compile/header.ts
-var buildHeader = (name, code, opts = {}) => {
-  let header = `// name: ${name.slice(0, 20)}
-`;
-  if (opts.icon)
-    header += `// icon: ${opts.icon}
-`;
-  header += `// last-updated: ${new Date().toISOString()}
-`;
-  const localAssets = new Set;
-  for (const m of code.matchAll(/_creatorUtils\.fetchLocal\((.+?)\)/g)) {
-    localAssets.add(m[1].replaceAll(/['"]/g, "").trim());
+// src/commands/diff.ts
+var diff = async (args) => {
+  const root = findProjectRoot(process.cwd());
+  const manifest = readManifest(root);
+  const config = loadConfig();
+  const apiUrl = requireApiUrl(config);
+  const token = requireToken(config);
+  info(c.dim("Comparing with the server…"));
+  const project = await getProject(apiUrl, token, manifest.uuid);
+  const scan = scanProject(root, manifest);
+  let entries = computeServerDiff(project, scan);
+  if (args._.length > 0) {
+    const keys = args._.map(toKey);
+    entries = entries.filter((e) => keys.some((k) => e.path === k || e.path.startsWith(k + "/")));
+  }
+  if (entries.length === 0) {
+    info(c.dim("No differences between local and server."));
+    return;
+  }
+  if (flagBool(args, "name-only")) {
+    for (const e of entries)
+      log(statusLabel(e) + e.path + (e.binary ? c.dim(" (binary)") : ""));
+    return;
   }
-  if (/_creator\.createGlb/.test(code))
-    localAssets.add("uberarchive");
-  if (/_creator\.captureImage/.test(code))
-    localAssets.add("capture");
-  if (localAssets.size > 0)
-    header += `// preload: ${[...localAssets].join(";")}
-`;
-  if (!code.includes("_creator.createScene") && !code.includes("_creator.createEntity"))
-    header += `// gl: disable
-`;
-  else if (code.includes("_creator.createEngine"))
-    header += `// gl: defer
-`;
-  if (code.includes("_creator2d."))
-    header += `// 2d: enable
-`;
-  if (code.includes("_creator.createARController"))
-    header += "// ar: enable";
-  header += `
-`;
-  return header;
-};
-
-// ../sdk/src/compile/sourcemap.ts
-var offsetSourceMap = (mapJson, lines) => {
-  if (lines <= 0)
-    return mapJson;
-  const map = JSON.parse(mapJson);
-  map.mappings = ";".repeat(lines) + map.mappings;
-  return JSON.stringify(map);
-};
-var inlineSourceMapComment = (mapJson) => {
-  const b64 = Buffer.from(mapJson, "utf8").toString("base64");
-  return `//# lecodesMap=data:application/json;charset=utf-8;base64,${b64}`;
-};
-
-// ../sdk/src/compile/compileProject.ts
-var detectEntry = (entries) => {
-  let entry = "";
-  let max = -1;
   for (const e of entries) {
-    const ext2 = e.path.split(".").at(-1)?.toLowerCase();
-    if (e.type === "text" && e.text !== undefined && !e.text.includes("export") && (ext2 === "ts" || ext2 === "js")) {
-      if (e.text.length > max) {
-        entry = e.path;
-        max = e.text.length;
-      }
+    if (e.binary) {
+      log(statusLabel(e) + e.path + c.dim(" (binary — content not shown)"));
+      continue;
     }
+    const d = unifiedDiff(e.serverText ?? "", e.localText ?? "", `server${e.path}`, `local${e.path}`);
+    if (d)
+      log(`
+` + d);
   }
-  return entry;
 };
-var compileProject = async (opts) => {
-  const entry = opts.entryOverride ?? detectEntry(opts.entries);
-  if (!entry) {
-    throw new Error("Couldn't find an entrypoint (a top-level .ts/.js file with no `export`). Pass entryOverride.");
+var statusLabel = (e) => e.status === "added" ? c.green("  added    ") : e.status === "removed" ? c.red("  removed  ") : c.yellow("  modified ");
+
+// src/commands/login.ts
+var login = async (args) => {
+  const config = loadConfig();
+  const apiUrl = normalizeApiUrl(flagStr(args, "api") ?? config.apiUrl ?? DEFAULT_API);
+  const webBase = normalizeApiUrl(flagStr(args, "web") ?? apiUrl);
+  const token = flagStr(args, "token") ?? await browserLogin(webBase);
+  const account = await getAccount(apiUrl, token);
+  saveConfig({ apiUrl, token });
+  success(`Logged in as ${c.bold(account.email)} on ${apiUrl}`);
+};
+
+// src/commands/preview.ts
+import { writeFileSync as writeFileSync8 } from "node:fs";
+import { resolve as resolve3 } from "node:path";
+
+// src/compile/collect.ts
+import { readFileSync as readFileSync9 } from "node:fs";
+import { basename as basename4 } from "node:path";
+var collectEntries = (root, manifest, project) => {
+  const pathById = buildPaths(project.assets);
+  const serverByPath = new Map;
+  for (const asset of project.assets) {
+    if (asset.type === "folder")
+      continue;
+    serverByPath.set(pathById.get(asset.id), { fileSrc: asset.file?.src ?? undefined, shaders: asset.shaders ?? [] });
   }
-  const files = {};
-  for (const e of opts.entries) {
-    if (e.type === "resource") {
-      files[e.path] = `export default "${opts.publicUrl}${e.fileSrc ?? ""}"`;
-    } else if (e.type === "shader") {
-      const shaders = e.shaders ?? [];
-      if (shaders.length > 2) {
-        files[e.path] = `export default \`${opts.publicUrl}${shaders[0].src.replace("_opengl", "_${_creator.subBackend ?? _creator.backend}")}\``;
-      } else if (shaders.length > 0) {
-        files[e.path] = `export default \`${opts.publicUrl}${shaders[0].src.replace("_opengl", "_${_creator.backend}")}\``;
-      } else {
-        files[e.path] = `export default ""`;
-      }
-    } else if (e.path.toLowerCase().endsWith(".svg")) {
-      files[e.path] = `export default SvgSource(\`${e.text ?? ""}\`)`;
+  const entries = [];
+  const warnings = [];
+  for (const file of scanLocal(root).files) {
+    const type = manifest.files[file.path]?.type ?? classifyKind(basename4(file.path));
+    if (type === "resource") {
+      const src = serverByPath.get(file.path)?.fileSrc;
+      if (!src)
+        warnings.push(`No server URL for ${file.path} — push it so its URL resolves.`);
+      entries.push({ path: file.path, type, fileSrc: src, absPath: file.absPath });
+    } else if (type === "shader") {
+      const shaders = serverByPath.get(file.path)?.shaders;
+      if (!shaders?.length)
+        warnings.push(`No compiled shader for ${file.path} — push it to compile the shader.`);
+      entries.push({ path: file.path, type, shaders });
     } else {
-      files[e.path] = e.text ?? "";
+      entries.push({ path: file.path, type, text: readFileSync9(file.absPath, "utf8") });
     }
   }
-  const { code, map } = await bundleProjectWithMap(entry, files, opts.format ?? "esm");
-  if (opts.header === false) {
-    return map ? `${code}
-${inlineSourceMapComment(map)}` : code;
-  }
-  const header = buildHeader(opts.name, code, { icon: opts.icon });
-  if (!map)
-    return header + code;
-  const headerLines = (header.match(/\n/g) ?? []).length;
-  return `${header}${code}
-${inlineSourceMapComment(offsetSourceMap(map, headerLines))}`;
-};
-// src/compile/projectCompile.ts
-var here = dirname5(fileURLToPath2(import.meta.url));
-var vendoredInject = join9(here, "..", "runtime", "sdk", "inject.ts");
-if (existsSync6(vendoredInject))
-  process.env.LECODES_SDK_INJECT = vendoredInject;
-var resolveChiselBin2 = () => {
-  if (process.env.LECODES_CHISEL_BIN)
-    return process.env.LECODES_CHISEL_BIN;
-  try {
-    return createRequire3(import.meta.url)("@letary/chisel").binaryPath() ?? null;
-  } catch {
-    return null;
-  }
+  return { entries, warnings };
 };
-var chiselBin = resolveChiselBin2();
-if (chiselBin)
-  process.env.LECODES_CHISEL_BIN = chiselBin;
-var compileProject2 = (opts) => compileProject({
-  entries: opts.entries.map((e) => ({ path: e.path, type: e.type, text: e.text, fileSrc: e.fileSrc, shaders: e.shaders })),
-  name: opts.name,
-  publicUrl: opts.publicUrl,
-  entryOverride: opts.entryOverride,
-  header: opts.header,
-  format: opts.format
-});
 
 // src/commands/preview.ts
 var preview = async (args) => {
@@ -1236,7 +1600,7 @@ var preview = async (args) => {
   if (out && isNullSink(out)) {
     note(`Discarded output (${out})`);
   } else if (out) {
-    writeFileSync7(resolve3(out), js);
+    writeFileSync8(resolve3(out), js);
     note(`Wrote ${out} (${js.length} bytes)`);
   } else {
     process.stdout.write(js);
@@ -1248,9 +1612,9 @@ var preview = async (args) => {
 };
 
 // src/commands/render.ts
-import { writeFileSync as writeFileSync8 } from "node:fs";
+import { writeFileSync as writeFileSync9 } from "node:fs";
 import { resolve as resolve4 } from "node:path";
-var LOCAL_ASSET_SCHEME = "lecodesfile://";
+var LOCAL_ASSET_SCHEME2 = "lecodesfile://";
 var DEVICE_SAFE_AREA = {
   none: [0, 0, 0, 0],
   iphone: [47, 0, 34, 0],
@@ -1296,7 +1660,7 @@ var render = async (args) => {
   const js = await compileProject2({
     entries: compileEntries,
     name: manifest.name,
-    publicUrl: useLocalAssets ? LOCAL_ASSET_SCHEME : publicUrlFlag ?? apiUrl,
+    publicUrl: useLocalAssets ? LOCAL_ASSET_SCHEME2 : publicUrlFlag ?? apiUrl,
     entryOverride: flagStr(args, "entry"),
     header: false,
     format: "iife"
@@ -1345,7 +1709,7 @@ var render = async (args) => {
     if (isNullSink(pngFlag)) {
       note(`Discarded PNG (${pngFlag})`);
     } else {
-      writeFileSync8(resolve4(pngFlag), png);
+      writeFileSync9(resolve4(pngFlag), png);
       note(`Wrote ${pngFlag} (${png.length} bytes, ${width}x${height})`);
     }
     return done((cb) => cb());
@@ -1360,7 +1724,7 @@ var render = async (args) => {
     return done((cb) => cb());
   }
   if (out) {
-    writeFileSync8(resolve4(out), result.text);
+    writeFileSync9(resolve4(out), result.text);
     note(`Wrote ${out} (${result.text.length} bytes)`);
     return done((cb) => cb());
   }
@@ -1371,8 +1735,8 @@ var render = async (args) => {
 };
 
 // src/commands/pull.ts
-import { existsSync as existsSync7, mkdirSync as mkdirSync7, rmSync, writeFileSync as writeFileSync9 } from "node:fs";
-import { dirname as dirname6, join as join10 } from "node:path";
+import { existsSync as existsSync8, mkdirSync as mkdirSync8, rmSync, writeFileSync as writeFileSync10 } from "node:fs";
+import { dirname as dirname6, join as join11 } from "node:path";
 var pull = async (args) => {
   const root = findProjectRoot(process.cwd());
   const manifest = readManifest(root);
@@ -1392,8 +1756,8 @@ var pull = async (args) => {
   const remotePaths = new Set([...buildPaths(project.assets).entries()].filter(([id]) => project.assets.find((a) => a.id === id)?.type !== "folder").map(([, path]) => path));
   for (const path of Object.keys(manifest.files)) {
     if (!remotePaths.has(path)) {
-      const abs = join10(root, ...path.replace(/^\//, "").split("/"));
-      if (existsSync7(abs))
+      const abs = join11(root, ...path.replace(/^\//, "").split("/"));
+      if (existsSync8(abs))
         rmSync(abs);
     }
   }
@@ -1431,18 +1795,18 @@ var pullPaths = async (root, manifest, project, paths, apiUrl, token) => {
   const files = { ...manifest.files };
   for (const asset of targets) {
     const key = pathById.get(asset.id);
-    const abs = join10(root, ...key.replace(/^\//, "").split("/"));
-    mkdirSync7(dirname6(abs), { recursive: true });
+    const abs = join11(root, ...key.replace(/^\//, "").split("/"));
+    mkdirSync8(dirname6(abs), { recursive: true });
     let sha;
     if (asset.type === "file") {
       if (!asset.file?.src)
         continue;
       const bytes = await downloadBlob(apiUrl, asset.file.src);
-      writeFileSync9(abs, bytes);
+      writeFileSync10(abs, bytes);
       sha = sha256(bytes);
     } else {
       const text = asset.text ?? "";
-      writeFileSync9(abs, text);
+      writeFileSync10(abs, text);
       sha = sha256(text);
     }
     files[key] = { id: asset.id, type: kindOf2(asset.type), sha };
@@ -1454,8 +1818,8 @@ var pullPaths = async (root, manifest, project, paths, apiUrl, token) => {
 };
 
 // src/commands/push.ts
-import { basename as basename3 } from "node:path";
-import { readFileSync as readFileSync8 } from "node:fs";
+import { basename as basename5 } from "node:path";
+import { readFileSync as readFileSync10 } from "node:fs";
 var push = async (args) => {
   const root = findProjectRoot(process.cwd());
   const manifest = readManifest(root);
@@ -1509,14 +1873,14 @@ var push = async (args) => {
   let uploaded = 0;
   for (const file of scan.files) {
     const source = sourceFor(file.path);
-    const kind = source?.type ?? classifyKind(basename3(file.path));
+    const kind = source?.type ?? classifyKind(basename5(file.path));
     const entry = { path: file.path, type: kind };
     if (source)
       entry.assetId = source.id;
     if (isTextKind(kind)) {
-      entry.text = readFileSync8(file.absPath, "utf8");
+      entry.text = readFileSync10(file.absPath, "utf8");
     } else if (!source || source.sha !== file.sha) {
-      const blob = await uploadBlob(apiUrl, token, manifest.uuid, basename3(file.path), readFileSync8(file.absPath));
+      const blob = await uploadBlob(apiUrl, token, manifest.uuid, basename5(file.path), readFileSync10(file.absPath));
       entry.blobFileId = blob.id;
       uploaded++;
     }
@@ -1640,13 +2004,25 @@ ${c.bold("Commands:")}
                                   --settle <ms>      wait for promises/timers/fetch before snapshot
                                   --wait-network     let data fetches hit the real network
                                   --logs             forward the app's console output (to stderr)
+  design [serve]                LeCodes Design — a live canvas of screens for AI-driven prototyping
+                                  (needs the optional 'lecodes-design' package; works inside a
+                                   cloned project or standalone in any folder)
+                                  --port <n>         dev-server port (default 4477)
+                                  --dir <folder>     design folder (default design/)
+                                  --no-open          don't open the browser
+  design init                   Scaffold the design folder (screens/, shared/, meta.json, CLAUDE.md)
+  design snapshot [screen…]     Render design screens headless (needs 'lecodes-renderer')
+                                  one screen → JSON to stdout; else files in design/.snapshots/
+                                  --png              also rasterize PNGs (needs @napi-rs/canvas)
+                                  --out-dir <dir>    output folder override
+                                  --logs             forward the screens' console output (to stderr)
 
 Config lives in ~/.lecodes/config.json (override with LECODES_API / LECODES_TOKEN).`;
-var commands = { login, create, clone, status, diff, pull, push, preview, render };
+var commands = { login, create, clone, status, diff, pull, push, preview, render, design };
 var readVersion = () => {
   try {
     const here2 = dirname7(fileURLToPath3(import.meta.url));
-    return JSON.parse(readFileSync9(join11(here2, "..", "package.json"), "utf8")).version ?? "unknown";
+    return JSON.parse(readFileSync11(join12(here2, "..", "package.json"), "utf8")).version ?? "unknown";
   } catch {
     return "unknown";
   }