@codecanvas-ide/engine 0.0.0-stage → 0.2.0

package/dist/index.js

@@ -0,0 +1,3928 @@
+// src/parse.ts
+import ts from "typescript";
+var PREVIEW_LINES = 6;
+var CONTAINER_PREVIEW_LINES = 3;
+var PREVIEW_WIDTH = 64;
+var internals = /* @__PURE__ */ new WeakMap();
+function parseFile(path, text) {
+  const m = parseStructure(path, text);
+  m.usages = computeUsages(m);
+  return m;
+}
+function parseStructure(path, text, prev) {
+  const kind = scriptKindOf(path);
+  const old = prev && prev.path === path ? internals.get(prev) : void 0;
+  let sf;
+  if (old && !old.reused) {
+    old.reused = true;
+    sf = ts.updateSourceFile(old.sf, text, changeRange(prev.text, text));
+  } else {
+    sf = ts.createSourceFile(path, text, ts.ScriptTarget.Latest, true, kind);
+  }
+  const b = new Builder(sf, text);
+  b.collectStatements(sf.statements, null, 0);
+  const syntax = sf.parseDiagnostics ?? [];
+  const model = {
+    path,
+    text,
+    roots: b.roots,
+    blocks: b.byId,
+    usages: [],
+    syntaxErrors: syntax.length,
+    firstErrorLine: -1,
+    diagnostics: [],
+    indentUnit: detectIndentUnit(text)
+  };
+  model.diagnostics = syntax.map((d) => toCodeDiagnostic(model, sf, d, "syntax"));
+  model.firstErrorLine = model.diagnostics[0]?.line ?? -1;
+  internals.set(model, { sf, builder: b, reused: false });
+  return model;
+}
+function blockAt(model, offset) {
+  let found = null;
+  let candidates = model.roots;
+  for (; ; ) {
+    const containing = candidates.find((b) => offset >= b.start && offset <= b.end);
+    if (!containing) return found;
+    found = containing;
+    candidates = containing.children;
+  }
+}
+function toCodeDiagnostic(model, sf, d, source) {
+  const start = d.start ?? 0;
+  return {
+    start,
+    length: d.length ?? 0,
+    line: sf.getLineAndCharacterOfPosition(Math.min(start, sf.text.length)).line + 1,
+    message: ts.flattenDiagnosticMessageText(d.messageText, "\n"),
+    source,
+    severity: d.category === ts.DiagnosticCategory.Error ? "error" : "warning",
+    blockId: blockAt(model, start)?.id ?? null
+  };
+}
+function builderOf(model) {
+  return internals.get(model)?.builder;
+}
+function computeUsages(model) {
+  const st = internals.get(model);
+  if (!st) return [];
+  if (st.reused) {
+    return parseFile(model.path, model.text).usages;
+  }
+  return st.builder.collectUsages(st.sf, createProgram(st.sf).getTypeChecker());
+}
+function changeRange(a, b) {
+  let s = 0;
+  const n = Math.min(a.length, b.length);
+  while (s < n && a.charCodeAt(s) === b.charCodeAt(s)) s++;
+  let e = 0;
+  while (e < n - s && a.charCodeAt(a.length - 1 - e) === b.charCodeAt(b.length - 1 - e)) e++;
+  return ts.createTextChangeRange(ts.createTextSpan(s, a.length - e - s), b.length - e - s);
+}
+function commonJsExportedFunction(s) {
+  if (!ts.isExpressionStatement(s) || !ts.isBinaryExpression(s.expression) || s.expression.operatorToken.kind !== ts.SyntaxKind.EqualsToken) return null;
+  const { left, right } = s.expression;
+  const fn = unwrap(right);
+  const isFunction = ts.isFunctionExpression(fn) || ts.isArrowFunction(fn);
+  if (!isFunction || !ts.isPropertyAccessExpression(left) || !ts.isIdentifier(left.name)) return null;
+  const target = left.expression.getText();
+  const isExportsObject = target === "exports" || target === "module.exports";
+  return isExportsObject ? { assignment: s.expression, exportedName: left.name, fn } : null;
+}
+function scriptKindOf(path) {
+  if (/\.[cm]?jsx?$/.test(path)) return path.endsWith("x") ? ts.ScriptKind.JSX : ts.ScriptKind.JS;
+  return path.endsWith("x") ? ts.ScriptKind.TSX : ts.ScriptKind.TS;
+}
+function createProgram(sf) {
+  const options = {
+    noLib: true,
+    noResolve: true,
+    allowJs: true,
+    target: ts.ScriptTarget.Latest,
+    jsx: ts.JsxEmit.Preserve,
+    types: []
+  };
+  const host = {
+    getSourceFile: (name) => name === sf.fileName ? sf : void 0,
+    getDefaultLibFileName: () => "lib.d.ts",
+    writeFile: () => {
+    },
+    getCurrentDirectory: () => "/",
+    getCanonicalFileName: (f) => f,
+    useCaseSensitiveFileNames: () => true,
+    getNewLine: () => "\n",
+    fileExists: (f) => f === sf.fileName,
+    readFile: () => void 0,
+    getDirectories: () => []
+  };
+  return ts.createProgram({ rootNames: [sf.fileName], options, host });
+}
+function detectIndentUnit(text) {
+  const m = /\n(\t+|[ ]{2,8})\S/.exec(text);
+  if (!m) return "  ";
+  return m[1].startsWith("	") ? "	" : m[1].length >= 4 && m[1].length % 4 === 0 ? "    " : "  ";
+}
+var Builder = class {
+  constructor(sf, text) {
+    this.sf = sf;
+    this.text = text;
+  }
+  sf;
+  text;
+  roots = [];
+  byId = /* @__PURE__ */ new Map();
+  /**
+   * Declaration node → block id, keyed by node position (see `nodeKey`) so a syntax tree parsed
+   * elsewhere from the same text (the project's language service) maps to the same blocks.
+   */
+  declToBlock = /* @__PURE__ */ new Map();
+  /** Range node → block, to find which block contains a usage. Keyed like `declToBlock`. */
+  rangeToBlock = /* @__PURE__ */ new Map();
+  /** Every name a usage could resolve to. Other identifiers skip the (slow) checker. */
+  names = /* @__PURE__ */ new Set();
+  // ---------- structure ----------
+  collectStatements(stmts, parent, depth, declarationsOnly = false) {
+    let group = [];
+    const flushGroup = () => {
+      if (!group.length) return;
+      const nodes = group;
+      group = [];
+      const first = nodes[0];
+      const firstLine = this.text.slice(first.getStart(this.sf), first.end).split("\n")[0].trim();
+      this.add(
+        {
+          kind: "statement",
+          key: "stmt:" + firstLine.slice(0, 40),
+          name: truncate(firstLine, 48),
+          detail: nodes.length > 1 ? `+${nodes.length - 1} more` : "",
+          tags: [],
+          rangeNodes: nodes,
+          declNodes: [],
+          previewRange: [nodes[0].getStart(this.sf), nodes[nodes.length - 1].end],
+          insert: null,
+          insertAt: -1
+        },
+        parent,
+        depth
+      );
+    };
+    for (let i = 0; i < stmts.length; i++) {
+      const s = stmts[i];
+      if (ts.isFunctionDeclaration(s)) {
+        flushGroup();
+        const overloads = [s];
+        while (!overloads[overloads.length - 1].body) {
+          const next = stmts[i + 1];
+          if (next && ts.isFunctionDeclaration(next) && next.name?.text === s.name?.text) {
+            overloads.push(next);
+            i++;
+          } else break;
+        }
+        this.addFunctionLike(overloads, s.name?.text ?? "default", parent, depth);
+      } else if (ts.isClassDeclaration(s)) {
+        flushGroup();
+        this.addClass(s, s, s.name?.text ?? "default", parent, depth);
+      } else if (ts.isVariableStatement(s)) {
+        flushGroup();
+        this.addVariableStatement(s, parent, depth, declarationsOnly);
+      } else if (commonJsExportedFunction(s)) {
+        flushGroup();
+        const { assignment, exportedName, fn } = commonJsExportedFunction(s);
+        const declNodes = [s, assignment, assignment.left];
+        this.addFunctionLike([fn], exportedName.text, parent, depth, { rangeNodes: [s], declNodes, extraTags: ["export"], nameNode: exportedName });
+      } else if (declarationsOnly) {
+        continue;
+      } else if (ts.isImportDeclaration(s) || ts.isImportEqualsDeclaration(s)) {
+        flushGroup();
+        this.addImport(s, parent, depth);
+      } else if (ts.isInterfaceDeclaration(s) || ts.isTypeAliasDeclaration(s) || ts.isEnumDeclaration(s)) {
+        flushGroup();
+        const keyword = ts.isInterfaceDeclaration(s) ? "interface" : ts.isEnumDeclaration(s) ? "enum" : "type";
+        const typeParams = "typeParameters" in s && s.typeParameters ? `<${s.typeParameters.map((t) => t.getText()).join(", ")}>` : "";
+        const bodyStart = ts.isTypeAliasDeclaration(s) ? s.type.getStart(this.sf) : this.text.indexOf("{", s.name.end);
+        this.add(
+          {
+            kind: "type",
+            key: s.name.text,
+            name: s.name.text,
+            detail: typeParams,
+            tags: [...modifierTags(s), keyword],
+            rangeNodes: [s],
+            declNodes: [s],
+            nameNode: s.name,
+            previewRange: bodyStart >= 0 ? [bodyStart, s.end] : null,
+            insert: null,
+            insertAt: -1
+          },
+          parent,
+          depth
+        );
+      } else if (ts.isModuleDeclaration(s) && s.body && ts.isModuleBlock(s.body)) {
+        flushGroup();
+        const body = s.body;
+        this.add(
+          {
+            kind: "namespace",
+            key: s.name.getText(),
+            name: s.name.getText(),
+            detail: "",
+            tags: [...modifierTags(s), "namespace"],
+            rangeNodes: [s],
+            declNodes: [s],
+            nameNode: s.name,
+            previewRange: [body.getStart(this.sf) + 1, body.end - 1],
+            insert: "body",
+            insertAt: body.end - 1,
+            children: (blk) => this.collectStatements(body.statements, blk, depth + 1)
+          },
+          parent,
+          depth
+        );
+      } else {
+        group.push(s);
+      }
+    }
+    flushGroup();
+  }
+  addImport(s, parent, depth) {
+    let spec;
+    let names = [];
+    if (ts.isImportDeclaration(s)) {
+      spec = s.moduleSpecifier.text;
+      const clause = s.importClause;
+      if (clause?.name) names.push(clause.name.text);
+      const nb = clause?.namedBindings;
+      if (nb && ts.isNamespaceImport(nb)) names.push("* as " + nb.name.text);
+      if (nb && ts.isNamedImports(nb)) names.push(...nb.elements.map((e) => e.name.text));
+      if (!clause) names = ["(side effect)"];
+    } else {
+      spec = s.name.text;
+      names = [s.moduleReference.getText()];
+      this.names.add(s.name.text);
+    }
+    for (const n of names) this.names.add(n.replace("* as ", ""));
+    this.add(
+      {
+        kind: "import",
+        key: "import:" + spec,
+        name: spec,
+        detail: "",
+        tags: ts.isImportDeclaration(s) && s.importClause?.isTypeOnly ? ["type"] : [],
+        rangeNodes: [s],
+        declNodes: [s],
+        previewRange: null,
+        insert: null,
+        insertAt: -1
+      },
+      parent,
+      depth,
+      wrapNames(names)
+    );
+  }
+  addFunctionLike(nodes, name, parent, depth, opts = {}) {
+    const impl = nodes[nodes.length - 1];
+    const sig = nodes.find((n) => !!n.body) ?? impl;
+    const body = impl.body;
+    let previewRange = null;
+    let insert = null;
+    let insertAt = -1;
+    if (body && ts.isBlock(body)) {
+      previewRange = [body.getStart(this.sf) + 1, body.end - 1];
+      insert = "body";
+      const last = body.statements[body.statements.length - 1];
+      insertAt = last && ts.isReturnStatement(last) ? this.lineStartOf(last.getStart(this.sf)) : body.end - 1;
+    } else if (body) {
+      previewRange = [body.getStart(this.sf), body.end];
+    }
+    const typeParams = sig.typeParameters?.length ? `<${sig.typeParameters.map((t) => t.getText()).join(", ")}>` : "";
+    const ret = sig.type ? ": " + sig.type.getText() : "";
+    const detail = squash(`${typeParams}(${sig.parameters.map((p) => p.getText()).join(", ")})${ret}`);
+    const tags = [...opts.extraTags ?? [], ...modifierTags(nodes[0])];
+    if (nodes.length > 1) tags.push(`${nodes.length - 1} overload${nodes.length > 2 ? "s" : ""}`);
+    if (impl.asteriskToken) tags.push("generator");
+    this.add(
+      {
+        kind: "function",
+        key: opts.key ?? name,
+        name,
+        detail,
+        tags,
+        rangeNodes: opts.rangeNodes ?? nodes,
+        declNodes: opts.declNodes ?? nodes,
+        nameNode: opts.nameNode ?? impl.name,
+        previewRange,
+        insert,
+        insertAt,
+        children: body && ts.isBlock(body) ? (blk) => this.collectStatements(body.statements, blk, depth + 1, true) : void 0
+      },
+      parent,
+      depth
+    );
+  }
+  addClass(cls, rangeNode, name, parent, depth, declNodes = [cls], extraTags = []) {
+    const heritage = (cls.heritageClauses ?? []).map((h) => h.getText()).join(" ");
+    const openBrace = this.text.indexOf("{", (cls.heritageClauses?.at(-1) ?? cls.typeParameters?.at(-1) ?? cls.name ?? cls).end);
+    const typeParams = cls.typeParameters?.length ? `<${cls.typeParameters.map((t) => t.getText()).join(", ")}>` : "";
+    this.add(
+      {
+        kind: "class",
+        key: name,
+        name,
+        detail: squash(typeParams + (heritage ? " " + heritage : "")),
+        tags: [...extraTags, ...modifierTags(rangeNode === cls ? cls : rangeNode)],
+        rangeNodes: [rangeNode],
+        declNodes,
+        nameNode: cls.name,
+        previewRange: openBrace >= 0 ? [openBrace + 1, cls.end - 1] : null,
+        insert: "class",
+        insertAt: cls.end - 1,
+        children: (blk) => this.collectMembers(cls.members, blk, depth + 1)
+      },
+      parent,
+      depth
+    );
+  }
+  collectMembers(members, parent, depth) {
+    for (let i = 0; i < members.length; i++) {
+      const m = members[i];
+      if (ts.isMethodDeclaration(m) || ts.isConstructorDeclaration(m)) {
+        const name = ts.isConstructorDeclaration(m) ? "constructor" : m.name.getText();
+        const overloads = [m];
+        while (!overloads[overloads.length - 1].body) {
+          const next = members[i + 1];
+          const nextName = next && (ts.isConstructorDeclaration(next) ? "constructor" : ts.isMethodDeclaration(next) ? next.name.getText() : null);
+          if (nextName === name) {
+            overloads.push(next);
+            i++;
+          } else break;
+        }
+        this.addFunctionLike(overloads, name, parent, depth);
+      } else if (ts.isGetAccessor(m) || ts.isSetAccessor(m)) {
+        const name = m.name.getText();
+        const word = ts.isGetAccessor(m) ? "get" : "set";
+        this.addFunctionLike([m], name, parent, depth, { key: `${word} ${name}`, extraTags: [word] });
+      } else if (ts.isPropertyDeclaration(m)) {
+        const name = m.name.getText();
+        const init = m.initializer && unwrap(m.initializer);
+        if (init && (ts.isArrowFunction(init) || ts.isFunctionExpression(init))) {
+          this.addFunctionLike([init], name, parent, depth, { rangeNodes: [m], declNodes: [m], extraTags: modifierTags(m), nameNode: m.name });
+        } else {
+          this.addVariable(m, m, name, m.type ? ": " + m.type.getText() : "", modifierTags(m), parent, depth, m.initializer);
+        }
+      }
+    }
+  }
+  addVariableStatement(s, parent, depth, functionsOnly) {
+    const decls = s.declarationList.declarations;
+    const keyword = s.declarationList.flags & ts.NodeFlags.Const ? "const" : s.declarationList.flags & ts.NodeFlags.Let ? "let" : "var";
+    for (const d of decls) {
+      const rangeNode = decls.length === 1 ? s : d;
+      const name = d.name.getText();
+      const tags = [...modifierTags(s), keyword];
+      const init = d.initializer && unwrap(d.initializer);
+      if (init && (ts.isArrowFunction(init) || ts.isFunctionExpression(init))) {
+        this.addFunctionLike([init], name, parent, depth, { rangeNodes: [rangeNode], declNodes: [d], extraTags: tags, nameNode: d.name });
+      } else if (init && ts.isClassExpression(init)) {
+        this.addClass(init, rangeNode, name, parent, depth, [d, init], tags);
+      } else if (!functionsOnly) {
+        this.addVariable(d, rangeNode, name, d.type ? ": " + d.type.getText() : "", tags, parent, depth, d.initializer);
+      }
+    }
+  }
+  addVariable(decl, rangeNode, name, type, tags, parent, depth, initializer) {
+    const init = initializer && unwrap(initializer);
+    const objectChildren = init && ts.isObjectLiteralExpression(init) ? init.properties.filter(
+      (p) => ts.isMethodDeclaration(p) || ts.isPropertyAssignment(p) && (ts.isArrowFunction(unwrap(p.initializer)) || ts.isFunctionExpression(unwrap(p.initializer)))
+    ) : [];
+    this.add(
+      {
+        kind: "variable",
+        key: name,
+        name,
+        detail: squash(type),
+        tags,
+        rangeNodes: [rangeNode],
+        declNodes: [decl],
+        nameNode: decl.name,
+        previewRange: initializer ? [initializer.getStart(this.sf), initializer.end] : null,
+        insert: null,
+        insertAt: -1,
+        children: objectChildren.length ? (blk) => {
+          for (const p of objectChildren) {
+            const pname = p.name.getText();
+            if (ts.isMethodDeclaration(p)) this.addFunctionLike([p], pname, blk, depth + 1);
+            else {
+              const fn = unwrap(p.initializer);
+              this.addFunctionLike([fn], pname, blk, depth + 1, { rangeNodes: [p], declNodes: [p], nameNode: p.name });
+            }
+          }
+        } : void 0
+      },
+      parent,
+      depth
+    );
+  }
+  add(p, parent, depth, presetPreview) {
+    const first = p.rangeNodes[0];
+    const last = p.rangeNodes[p.rangeNodes.length - 1];
+    const start = this.startWithComments(first);
+    const siblings = parent ? parent.children : this.roots;
+    let key = p.key;
+    if (siblings.some((s) => s.key === key)) {
+      let n = 2;
+      while (siblings.some((s) => s.key === `${p.key}#${n}`)) n++;
+      key = `${p.key}#${n}`;
+    }
+    const id = parent ? `${parent.id}/${key}` : key;
+    const block = {
+      id,
+      key,
+      kind: p.kind,
+      name: p.name,
+      detail: p.detail,
+      tags: p.tags,
+      start,
+      end: last.end,
+      nameStart: p.nameNode ? p.nameNode.getStart(this.sf) : -1,
+      preview: [],
+      previewMore: 0,
+      children: [],
+      parentId: parent?.id ?? null,
+      depth,
+      insert: p.insert,
+      insertAt: p.insertAt,
+      indent: this.indentAt(first.getStart(this.sf))
+    };
+    siblings.push(block);
+    this.byId.set(id, block);
+    this.names.add(p.name);
+    for (const n of p.rangeNodes) this.rangeToBlock.set(nodeKey(n), block);
+    for (const n of p.declNodes) this.declToBlock.set(nodeKey(n), id);
+    p.children?.(block);
+    if (presetPreview) {
+      block.preview = presetPreview;
+    } else if (p.previewRange) {
+      const max = block.children.length ? CONTAINER_PREVIEW_LINES : PREVIEW_LINES;
+      const { lines, more } = makePreview(this.text, p.previewRange, block.children, max);
+      block.preview = lines;
+      block.previewMore = more;
+    }
+    return block;
+  }
+  /** Include doc comments directly above the node (no blank line in between). */
+  startWithComments(node) {
+    let start = node.getStart(this.sf);
+    const comments = ts.getLeadingCommentRanges(this.text, node.pos) ?? [];
+    for (let i = comments.length - 1; i >= 0; i--) {
+      const gap = this.text.slice(comments[i].end, start);
+      if (/\S/.test(gap) || (gap.match(/\n/g)?.length ?? 0) > 1) break;
+      start = comments[i].pos;
+    }
+    return start;
+  }
+  lineStartOf(pos) {
+    return this.text.lastIndexOf("\n", pos - 1) + 1;
+  }
+  indentAt(pos) {
+    const ls = this.lineStartOf(pos);
+    return /^[ \t]*/.exec(this.text.slice(ls, pos))[0];
+  }
+  // ---------- usages ----------
+  blockIdForDeclaration(declaration) {
+    return this.declToBlock.get(nodeKey(declaration));
+  }
+  /**
+   * Link every name used inside a block to the block that declares it. `sf` is a tree of the same
+   * text (this builder's own, or the language service's when resolving across files).
+   */
+  collectUsages(sf, checker, otherFiles) {
+    const byPair = /* @__PURE__ */ new Map();
+    const visit = (node, current) => {
+      const blk = this.rangeToBlock.get(nodeKey(node));
+      if (blk) current = blk;
+      if (ts.isIdentifier(node) && current) this.recordUsage(node, current, checker, byPair, otherFiles);
+      ts.forEachChild(node, (c) => visit(c, current));
+    };
+    visit(sf, null);
+    return [...byPair.values()];
+  }
+  recordUsage(id, from, checker, out, otherFiles) {
+    const isKnownName = this.names.has(id.text) || !!otherFiles?.projectNames.has(id.text);
+    if (!isKnownName) return;
+    const parent = id.parent;
+    const isDeclarationName = !!parent && parent.name === id && !ts.isPropertyAccessExpression(parent) && !ts.isShorthandPropertyAssignment(parent);
+    if (isDeclarationName) return;
+    let sym;
+    try {
+      sym = parent && ts.isShorthandPropertyAssignment(parent) ? checker.getShorthandAssignmentValueSymbol(parent) : checker.getSymbolAtLocation(id);
+    } catch {
+      return;
+    }
+    if (!sym?.declarations) return;
+    const kind = usageKind(id);
+    let to;
+    let importBlockId;
+    for (const d of sym.declarations) {
+      to = this.declToBlock.get(nodeKey(d));
+      if (!to) {
+        let n = d;
+        while (n && !ts.isImportDeclaration(n) && !ts.isImportEqualsDeclaration(n) && !ts.isSourceFile(n)) n = n.parent;
+        if (n && !ts.isSourceFile(n)) importBlockId = to = this.declToBlock.get(nodeKey(n));
+      }
+      if (to) break;
+    }
+    if (otherFiles) {
+      const isImportedName = !!importBlockId && (sym.flags & ts.SymbolFlags.Alias) !== 0;
+      const target = isImportedName ? safeAliasedSymbol(checker, sym) : to ? void 0 : sym;
+      const declaredElsewhere = target?.declarations?.find((d) => d.getSourceFile() !== id.getSourceFile());
+      const external = declaredElsewhere && otherFiles.blockInOtherFile(declaredElsewhere);
+      if (external) addUsage(out, { from: from.id, to: external.id, toPath: external.path, via: importBlockId, kind, count: 1 });
+    }
+    if (!to || to === from.id) return;
+    if (from.id.startsWith(to + "/") || to.startsWith(from.id + "/")) return;
+    addUsage(out, { from: from.id, to, kind, count: 1 });
+  }
+};
+function addUsage(out, usage) {
+  const pairKey = `${usage.from}>${usage.toPath ?? ""}:${usage.to}`;
+  const existing = out.get(pairKey);
+  if (!existing) return void out.set(pairKey, usage);
+  existing.count++;
+  if (usage.kind === "call") existing.kind = "call";
+}
+function safeAliasedSymbol(checker, symbol) {
+  try {
+    return checker.getAliasedSymbol(symbol);
+  } catch {
+    return void 0;
+  }
+}
+function nodeKey(node) {
+  return `${node.kind}:${node.pos}:${node.end}`;
+}
+function usageKind(id) {
+  let n = id;
+  if (ts.isPropertyAccessExpression(n.parent) && n.parent.name === n) n = n.parent;
+  const p = n.parent;
+  if ((ts.isCallExpression(p) || ts.isNewExpression(p)) && p.expression === n) return "call";
+  if (ts.isTaggedTemplateExpression(p) && p.tag === n) return "call";
+  if (ts.isJsxOpeningLikeElement(p) && p.tagName === n) return "call";
+  if (ts.isBinaryExpression(p) && p.left === n && p.operatorToken.kind >= ts.SyntaxKind.FirstAssignment && p.operatorToken.kind <= ts.SyntaxKind.LastAssignment) return "write";
+  if ((ts.isPrefixUnaryExpression(p) || ts.isPostfixUnaryExpression(p)) && (p.operator === ts.SyntaxKind.PlusPlusToken || p.operator === ts.SyntaxKind.MinusMinusToken)) return "write";
+  if (ts.isTypeReferenceNode(p) || ts.isExpressionWithTypeArguments(p) || ts.isTypeQueryNode(p) || ts.isQualifiedName(p)) return "type";
+  return "read";
+}
+function unwrap(e) {
+  while (ts.isParenthesizedExpression(e) || ts.isAsExpression(e) || ts.isSatisfiesExpression(e) || ts.isTypeAssertionExpression(e)) e = e.expression;
+  return e;
+}
+function modifierTags(n) {
+  const mods = ts.canHaveModifiers(n) ? ts.getModifiers(n) ?? [] : [];
+  return mods.map((m) => m.getText());
+}
+function squash(s) {
+  return s.replace(/\s+/g, " ").replace(/\(\s+/g, "(").replace(/\s+\)/g, ")").replace(/,\s*\)/g, ")").trim();
+}
+function truncate(s, n) {
+  return s.length > n ? s.slice(0, n - 1) + "\u2026" : s;
+}
+function wrapNames(names) {
+  const lines = [];
+  let cur = "";
+  for (const n of names) {
+    const piece = cur ? cur + ", " + n : n;
+    if (piece.length > 40 && cur) {
+      lines.push(cur + ",");
+      cur = n;
+    } else cur = piece;
+  }
+  if (cur) lines.push(cur);
+  return lines.slice(0, PREVIEW_LINES);
+}
+function codeWithoutChildren(text, range, children) {
+  let [a, b] = range;
+  let src = "";
+  const kids = children.filter((c) => c.start >= a && c.end <= b).sort((x, y) => x.start - y.start);
+  for (const k of kids) {
+    src += text.slice(a, k.start);
+    a = k.end;
+  }
+  return src + text.slice(a, b);
+}
+function makePreview(text, range, children, max) {
+  const src = codeWithoutChildren(text, range, children);
+  const kids = children.filter((c) => c.start >= range[0] && c.end <= range[1]);
+  let lines = src.split("\n").map((l) => l.replace(/\s+$/, ""));
+  if (kids.length) lines = lines.filter((l) => !/^[\s{}[\](),;]*$/.test(l) || !l.trim());
+  lines = lines.filter((l, i) => l.trim() || i > 0 && lines[i - 1].trim());
+  while (lines.length && !lines[0].trim()) lines.shift();
+  while (lines.length && !lines[lines.length - 1].trim()) lines.pop();
+  const indents = lines.slice(lines.length > 1 && !/^\s/.test(lines[0]) ? 1 : 0).filter((l) => l.trim()).map((l) => /^[ \t]*/.exec(l)[0].length);
+  const minIndent = indents.length ? Math.min(...indents) : 0;
+  lines = lines.map((l) => (/^\s/.test(l) ? l.slice(minIndent) : l).replace(/\t/g, "  "));
+  const more = Math.max(0, lines.length - max);
+  return { lines: lines.slice(0, max).map((l) => truncate(l, PREVIEW_WIDTH)), more };
+}
+
+// src/project.ts
+import ts3 from "typescript";
+
+// src/workspace.ts
+import ts2 from "typescript";
+function parseConfig(config, projectPaths) {
+  const configFileName = "/" + config.path;
+  const json = ts2.parseConfigFileTextToJson(configFileName, config.text);
+  if (json.error || !json.config) return null;
+  const readConfig = (name) => name === configFileName ? config.text : config.extendedFiles?.[name.slice(1)];
+  const host = {
+    useCaseSensitiveFileNames: true,
+    readDirectory: (rootDir, extensions, excludes, includes) => matchingPaths(projectPaths, rootDir, extensions, excludes ?? [], includes ?? ["**/*"]),
+    fileExists: (name) => readConfig(name) !== void 0,
+    readFile: readConfig
+  };
+  const folder = config.path.slice(0, config.path.lastIndexOf("/") + 1);
+  const parsed = ts2.parseJsonConfigFileContent(json.config, host, "/" + folder, void 0, configFileName);
+  const included = new Set(parsed.fileNames.map((name) => name.slice(1)));
+  return { path: config.path, folder, options: parsed.options, includes: (projectPath) => included.has(projectPath) };
+}
+function configForFile(projectPath, configs) {
+  const above = configs.filter((config) => projectPath.startsWith(config.folder));
+  const nearestFirst = [...above].sort((a, b) => b.folder.length - a.folder.length);
+  return nearestFirst.find((config) => config.includes(projectPath)) ?? nearestFirst[0] ?? null;
+}
+function workspacePackagePaths(packageFiles, hasFile) {
+  const paths = {};
+  for (const [packagePath, text] of Object.entries(packageFiles)) {
+    const manifest = parsePackageJson(text);
+    if (!manifest?.name) continue;
+    const folder = packagePath.slice(0, packagePath.lastIndexOf("/") + 1);
+    const entry = packageEntries(manifest).flatMap((named) => [named, ...sourceOfBuildOutput(named)]).concat(["src/index.ts", "src/index.tsx", "index.ts", "index.tsx"]).map((relative) => folder + relative.replace(/^\.\//, "")).find(hasFile);
+    if (entry) paths[manifest.name] = ["/" + entry];
+    paths[manifest.name + "/*"] = ["/" + folder + "src/*", "/" + folder + "*"];
+  }
+  return paths;
+}
+function parsePackageJson(text) {
+  try {
+    const value = JSON.parse(text);
+    return value && typeof value === "object" ? value : null;
+  } catch {
+    return null;
+  }
+}
+function packageEntries(manifest) {
+  const rootExport = manifest.exports && typeof manifest.exports === "object" && "." in manifest.exports ? manifest.exports["."] : manifest.exports;
+  return [manifest.types, manifest.typings, ...exportTargets(rootExport), manifest.module, manifest.main].filter((entry) => typeof entry === "string");
+}
+function exportTargets(target) {
+  if (typeof target === "string") return [target];
+  if (Array.isArray(target)) return target.flatMap(exportTargets);
+  if (target && typeof target === "object") return Object.values(target).flatMap(exportTargets);
+  return [];
+}
+function sourceOfBuildOutput(entry) {
+  const isBuildOutput = /\.(d\.ts|d\.mts|js|mjs|cjs|jsx)$/.test(entry);
+  if (!isBuildOutput) return [];
+  const withoutExtension = entry.replace(/\.(d\.ts|d\.mts|js|mjs|cjs|jsx)$/, "");
+  const inSourceFolder = withoutExtension.replace(/(^|\/)(dist|lib|build|out|esm|cjs)\//, "$1src/");
+  return [inSourceFolder, withoutExtension].flatMap((base) => [base + ".ts", base + ".tsx"]);
+}
+function matchingPaths(projectPaths, rootDir, extensions, excludes, includes) {
+  const base = rootDir.replace(/^\//, "").replace(/\/?$/, "/").replace(/^\/$/, "");
+  const includePatterns = includes.map((spec) => configPattern(base, spec, "files"));
+  const excludePatterns = excludes.map((spec) => configPattern(base, spec, "filesAndFolders"));
+  return projectPaths.filter((path) => path.startsWith(base) && extensions.some((extension) => path.endsWith(extension))).filter((path) => includePatterns.some((pattern) => pattern.test(path)) && !excludePatterns.some((pattern) => pattern.test(path))).map((path) => "/" + path);
+}
+function configPattern(base, spec, matching) {
+  const absolute = spec.startsWith("/") ? spec.slice(1) : normalizePath(base + spec.replace(/^\.\//, ""));
+  const lastPart = absolute.slice(absolute.lastIndexOf("/") + 1);
+  const isFolder = !/[*?]/.test(lastPart) && !/\.[^.]+$/.test(lastPart);
+  const pattern = isFolder ? absolute.replace(/\/?$/, "/**/*") : absolute;
+  let source = "";
+  for (let index = 0; index < pattern.length; index++) {
+    const char = pattern[index];
+    if (pattern.startsWith("**/", index)) {
+      source += "(?:[^/]+/)*";
+      index += 2;
+    } else if (char === "*") source += "[^/]*";
+    else if (char === "?") source += "[^/]";
+    else source += char.replace(/[.+^${}()|[\]\\]/g, "\\$&");
+  }
+  return new RegExp(`^${source}${matching === "filesAndFolders" ? "(?:/.*)?" : ""}$`);
+}
+function normalizePath(path) {
+  const parts = [];
+  for (const part of path.split("/")) {
+    if (part === "..") parts.pop();
+    else if (part !== "." && part !== "") parts.push(part);
+  }
+  return parts.join("/");
+}
+
+// src/project.ts
+var LIB_DIR = "/__lib__/";
+var DEFAULT_LIB = ["lib.es2022.d.ts", "lib.dom.d.ts"];
+var NO_CONFIG = "";
+var REQUIRE_CALL = /\brequire\s*\(\s*(['"])([^'"]+)\1\s*\)/;
+var RE_EXPORT = /^export\s+(?:type\s+)?(?:\*(?:\s+as\s+[\w$]+)?|\{[^}]*\})\s*from\s*(['"])([^'"]+)\1/;
+var Project = class {
+  constructor(files = {}, projectOptions = {}) {
+    this.projectOptions = projectOptions;
+    this.configure(projectOptions);
+    for (const [path, text] of Object.entries(files)) this.setFile(path, text);
+  }
+  projectOptions;
+  files = /* @__PURE__ */ new Map();
+  projectVersion = 0;
+  libFiles = {};
+  hasLib = false;
+  libOptions = {};
+  projectNamesCache = null;
+  workspace = null;
+  configPrograms = null;
+  /** Language services by config path, created when a file of that config is first resolved. */
+  services = /* @__PURE__ */ new Map();
+  /** Shared by the services, so a file several programs include is parsed once. */
+  documentRegistry = ts3.createDocumentRegistry(true, "/");
+  /** Changes when files are added or removed, or the settings change: where imports point may change then. */
+  fileSetVersion = 0;
+  /** Load the standard library later, e.g. once it has been downloaded. Type errors show from then on. */
+  setLibFiles(libFiles) {
+    this.projectOptions = { ...this.projectOptions, libFiles };
+    this.reconfigure();
+  }
+  /** Use the folder's tsconfig.json (or none, with null). */
+  setConfigFile(config) {
+    this.setWorkspace(config ? { configFiles: [config] } : null);
+  }
+  /** Use the folder's config files and workspace packages (or none, with null). */
+  setWorkspace(workspace) {
+    this.workspace = workspace;
+    this.reconfigure();
+  }
+  reconfigure() {
+    for (const service of this.services.values()) service.dispose();
+    this.services.clear();
+    this.configure(this.projectOptions);
+    this.projectVersion++;
+    this.fileSetVersion++;
+  }
+  configure(options) {
+    this.libFiles = options.libFiles ?? {};
+    const libEntries = (options.lib ?? DEFAULT_LIB).filter((name) => name in this.libFiles);
+    this.hasLib = libEntries.length > 0;
+    this.libOptions = this.hasLib ? { lib: libEntries, noLib: false } : { noLib: true };
+  }
+  /** Options for a program: the defaults, then the config's, then `ProjectOptions.compilerOptions`. */
+  compilerOptions(configOptions, packagePaths) {
+    const paths = { ...packagePaths, ...configOptions.paths };
+    return {
+      target: ts3.ScriptTarget.ES2022,
+      module: ts3.ModuleKind.ESNext,
+      moduleResolution: ts3.ModuleResolutionKind.Bundler,
+      strict: true,
+      jsx: ts3.JsxEmit.Preserve,
+      skipLibCheck: true,
+      allowImportingTsExtensions: true,
+      ...configOptions,
+      ...Object.keys(paths).length ? { paths } : {},
+      ...this.projectOptions.compilerOptions,
+      // JavaScript files are part of the project even where a tsconfig.json leaves `allowJs` off.
+      allowJs: true,
+      // The project loads no @types packages, its standard library is the one given here, and it never emits.
+      types: [],
+      noEmit: true,
+      ...this.libOptions
+    };
+  }
+  /** Which config each file uses, and the options of each. Worked out again when files are added or removed. */
+  programs() {
+    if (this.configPrograms?.fileSetVersion === this.fileSetVersion) return this.configPrograms;
+    const projectPaths = [...this.files.keys()];
+    const packagePaths = workspacePackagePaths(this.workspace?.packageFiles ?? {}, (path) => this.files.has(path));
+    const configs = (this.workspace?.configFiles ?? []).map((config) => parseConfig(config, projectPaths)).filter((config) => !!config);
+    const optionsByConfig = /* @__PURE__ */ new Map([[NO_CONFIG, this.compilerOptions({}, packagePaths)]]);
+    for (const config of configs) optionsByConfig.set(config.path, this.compilerOptions(config.options, packagePaths));
+    const pathsByConfig = /* @__PURE__ */ new Map();
+    const configOfPath = /* @__PURE__ */ new Map();
+    for (const path of projectPaths) {
+      const configPath = configForFile(path, configs)?.path ?? NO_CONFIG;
+      configOfPath.set(path, configPath);
+      pathsByConfig.set(configPath, [...pathsByConfig.get(configPath) ?? [], path]);
+    }
+    this.configPrograms = { fileSetVersion: this.fileSetVersion, optionsByConfig, pathsByConfig, configOfPath };
+    return this.configPrograms;
+  }
+  configOf(path) {
+    return this.programs().configOfPath.get(path) ?? NO_CONFIG;
+  }
+  /** The options a file's imports resolve with: its own config's, whichever program includes it. */
+  optionsOfFile(path) {
+    const { optionsByConfig } = this.programs();
+    return optionsByConfig.get(path ? this.configOf(path) : NO_CONFIG) ?? optionsByConfig.get(NO_CONFIG);
+  }
+  serviceOf(path) {
+    return this.serviceOfConfig(this.configOf(path));
+  }
+  serviceOfConfig(configPath) {
+    let service = this.services.get(configPath);
+    if (!service) {
+      service = ts3.createLanguageService(this.createHost(configPath), this.documentRegistry);
+      this.services.set(configPath, service);
+    }
+    return service;
+  }
+  // ---------------------------------------------------------------- files (fast path)
+  /** Add or update a file. Parses only this file, incrementally from its previous version. */
+  setFile(path, text) {
+    const existing = this.files.get(path);
+    if (existing && existing.text === text) return existing.model;
+    const model = parseStructure(path, text, existing?.model);
+    this.files.set(path, { text, version: (existing?.version ?? 0) + 1, model });
+    this.projectVersion++;
+    if (!existing) this.fileSetVersion++;
+    return model;
+  }
+  removeFile(path) {
+    if (!this.files.delete(path)) return;
+    this.projectVersion++;
+    this.fileSetVersion++;
+  }
+  hasFile(path) {
+    return this.files.has(path);
+  }
+  paths() {
+    return [...this.files.keys()];
+  }
+  getModel(path) {
+    return this.files.get(path)?.model;
+  }
+  getText(path) {
+    return this.files.get(path)?.text;
+  }
+  // ---------------------------------------------------------------- resolving (when typing pauses)
+  resolve(path, { diagnostics = true } = {}) {
+    return Promise.resolve({ usages: this.usages(path), incoming: this.usagesInto(path), diagnostics: diagnostics ? this.diagnostics(path) : [] });
+  }
+  /** Usage links from this file: within the file, and to blocks in other files (`toPath`). */
+  usages(path) {
+    const file = this.files.get(path);
+    if (!file) return [];
+    if (file.usages && file.usagesProjectVersion === this.projectVersion) return file.usages;
+    const program = this.serviceOf(path).getProgram();
+    const sf = program?.getSourceFile(toFileName(path));
+    const builder = builderOf(file.model);
+    if (!program || !sf || !builder || sf.text !== file.text) return [];
+    file.usages = builder.collectUsages(sf, program.getTypeChecker(), this.otherFileResolver());
+    file.usagesProjectVersion = this.projectVersion;
+    return file.usages;
+  }
+  /** Usages in other files that point at blocks in this file. */
+  usagesInto(path) {
+    const incoming = [];
+    for (const otherPath of this.importersThroughReExports(path)) {
+      for (const usage of this.usages(otherPath)) {
+        if (usage.toPath === path) incoming.push({ ...usage, fromPath: otherPath });
+      }
+    }
+    return incoming;
+  }
+  /** Syntax errors, plus type errors when the standard library is loaded and the syntax is valid. */
+  diagnostics(path) {
+    const file = this.files.get(path);
+    if (!file) return [];
+    const hasSyntaxErrors = file.model.diagnostics.length > 0;
+    if (hasSyntaxErrors || !this.hasLib) return file.model.diagnostics;
+    const service = this.serviceOf(path);
+    const sf = service.getProgram()?.getSourceFile(toFileName(path));
+    if (!sf || sf.text !== file.text) return [];
+    return service.getSemanticDiagnostics(toFileName(path)).map((d) => toCodeDiagnostic(file.model, sf, d, "type"));
+  }
+  /**
+   * Text edits that rename a block and every usage of it, in every file of the project.
+   * Usages in other files are renamed too, including imports (no `as` aliases are added).
+   */
+  renameBlock(path, blockId, newName) {
+    const file = this.files.get(path);
+    const block = file?.model.blocks.get(blockId);
+    if (!file || !block) return { ok: false, error: "Block not found" };
+    const isRenamable2 = block.nameStart >= 0 && block.kind !== "import" && block.kind !== "statement" && block.name !== "constructor";
+    if (!isRenamable2) return { ok: false, error: `${block.name} can't be renamed` };
+    if (newName === block.name) return { ok: true, edits: {} };
+    if (!isValidIdentifier(newName)) return { ok: false, error: `"${newName}" is not a valid name` };
+    if (namesVisibleFrom(file.model, block).has(newName)) return { ok: false, error: `${newName} already exists here` };
+    if (file.model.diagnostics.length) return { ok: false, error: `Fix the syntax error on line ${file.model.firstErrorLine} first` };
+    const fileName2 = toFileName(path);
+    const info = this.serviceOf(path).getRenameInfo(fileName2, block.nameStart, { allowRenameOfImportPath: false });
+    if (!info.canRename) return { ok: false, error: info.localizedErrorMessage };
+    const edits = {};
+    const renamedLocations = /* @__PURE__ */ new Set();
+    for (const configPath of this.configsUsing(path)) {
+      const service = this.serviceOfConfig(configPath);
+      if (!service.getProgram()?.getSourceFile(fileName2)) continue;
+      const renameStarts = [{ fileName: fileName2, position: block.nameStart }];
+      const visitedStarts = /* @__PURE__ */ new Set();
+      for (let start = renameStarts.pop(); start; start = renameStarts.pop()) {
+        const startKey = `${start.fileName}:${start.position}`;
+        if (visitedStarts.has(startKey)) continue;
+        visitedStarts.add(startKey);
+        const locations = service.findRenameLocations(start.fileName, start.position, false, false, { providePrefixAndSuffixTextForRename: true }) ?? [];
+        for (const location of locations) {
+          const locationPath = fromFileName(location.fileName);
+          if (!locationPath) continue;
+          if (isAliasInSpecifier(location)) renameStarts.push({ fileName: location.fileName, position: location.textSpan.start });
+          const locationKey = `${location.fileName}:${location.textSpan.start}`;
+          if (renamedLocations.has(locationKey)) continue;
+          renamedLocations.add(locationKey);
+          const text = isAliasInSpecifier(location) ? newName : (location.prefixText ?? "") + newName + (location.suffixText ?? "");
+          (edits[locationPath] ??= []).push({ start: location.textSpan.start, end: location.textSpan.start + location.textSpan.length, text });
+        }
+      }
+    }
+    for (const fileEdits of Object.values(edits)) fileEdits.sort((a, b) => a.start - b.start);
+    return { ok: true, edits };
+  }
+  // ---------------------------------------------------------------- internals
+  /** The configs of a file and of the files that can use its blocks: its importers, also through re-exports. */
+  configsUsing(path) {
+    const owner = this.configOf(path);
+    const importerConfigs = this.importersThroughReExports(path).map((importer) => this.configOf(importer));
+    return [owner, ...new Set(importerConfigs.filter((configPath) => configPath !== owner))];
+  }
+  /** Files that import `path`, or import a file that re-exports from it (an `index.ts` of a folder or package). */
+  importersThroughReExports(path) {
+    const importers = /* @__PURE__ */ new Set();
+    const reExporters = [path];
+    for (let reExported = reExporters.pop(); reExported !== void 0; reExported = reExporters.pop()) {
+      for (const importer of this.importersOf(reExported)) {
+        if (importers.has(importer) || importer === path) continue;
+        importers.add(importer);
+        if (this.importsOf(importer).reExportedPaths.has(reExported)) reExporters.push(importer);
+      }
+    }
+    return [...importers];
+  }
+  otherFileResolver() {
+    return {
+      projectNames: this.projectNames(),
+      blockInOtherFile: (declaration) => {
+        const sf = declaration.getSourceFile();
+        const path = fromFileName(sf.fileName);
+        const file = path ? this.files.get(path) : void 0;
+        if (!path || !file || file.text !== sf.text) return null;
+        const id = builderOf(file.model)?.blockIdForDeclaration(declaration);
+        return id ? { path, id } : null;
+      }
+    };
+  }
+  projectNames() {
+    if (this.projectNamesCache?.version === this.projectVersion) return this.projectNamesCache.names;
+    const names = /* @__PURE__ */ new Set();
+    for (const file of this.files.values()) for (const name of builderOf(file.model)?.names ?? []) names.add(name);
+    this.projectNamesCache = { version: this.projectVersion, names };
+    return names;
+  }
+  /** Files whose imports resolve to `path`. */
+  importersOf(path) {
+    const importers = [];
+    for (const [otherPath, file] of this.files) {
+      if (otherPath !== path && this.importsOf(otherPath, file).importedPaths.has(path)) importers.push(otherPath);
+    }
+    return importers;
+  }
+  importsOf(path, file = this.files.get(path)) {
+    if (file.imports?.fileSetVersion === this.fileSetVersion && file.imports.fileVersion === file.version) return file.imports;
+    const importedPaths = /* @__PURE__ */ new Set();
+    const reExportedPaths = /* @__PURE__ */ new Set();
+    const host = this.moduleResolutionHost();
+    const resolve = (specifier) => {
+      const result = ts3.resolveModuleName(specifier, toFileName(path), this.optionsOfFile(path), host).resolvedModule;
+      return result ? fromFileName(result.resolvedFileName) : null;
+    };
+    for (const block of file.model.roots) {
+      const code = block.kind === "statement" || block.kind === "variable" ? file.text.slice(block.start, block.end) : "";
+      const reExportSpecifier = block.kind === "statement" ? RE_EXPORT.exec(code)?.[2] : void 0;
+      const requiredSpecifier = block.kind === "variable" ? REQUIRE_CALL.exec(code)?.[2] : void 0;
+      const specifier = block.kind === "import" ? block.name : reExportSpecifier ?? requiredSpecifier;
+      const target = specifier ? resolve(specifier) : null;
+      if (!target) continue;
+      importedPaths.add(target);
+      if (reExportSpecifier) reExportedPaths.add(target);
+    }
+    file.imports = { importedPaths, reExportedPaths, fileSetVersion: this.fileSetVersion, fileVersion: file.version };
+    return file.imports;
+  }
+  moduleResolutionHost() {
+    return {
+      fileExists: (name) => this.fileExists(name),
+      readFile: (name) => this.readFile(name),
+      directoryExists: (dir) => this.directoryExists(dir),
+      getCurrentDirectory: () => "/"
+    };
+  }
+  fileExists(name) {
+    if (name.startsWith(LIB_DIR)) return name.slice(LIB_DIR.length) in this.libFiles;
+    const path = fromFileName(name);
+    return !!path && this.files.has(path);
+  }
+  readFile(name) {
+    if (name.startsWith(LIB_DIR)) return this.libFiles[name.slice(LIB_DIR.length)];
+    const path = fromFileName(name);
+    return path ? this.files.get(path)?.text : void 0;
+  }
+  directoryExists(dir) {
+    const prefix = dir.replace(/^\//, "").replace(/\/?$/, "/");
+    if (prefix === "/") return true;
+    for (const path of this.files.keys()) if (path.startsWith(prefix)) return true;
+    return false;
+  }
+  /** The host of one config's program. Its files are those that use the config; their imports come in from the rest. */
+  createHost(configPath) {
+    return {
+      getCompilationSettings: () => this.programs().optionsByConfig.get(configPath) ?? this.programs().optionsByConfig.get(NO_CONFIG),
+      getProjectVersion: () => String(this.projectVersion),
+      getScriptFileNames: () => (this.programs().pathsByConfig.get(configPath) ?? []).map(toFileName),
+      getScriptVersion: (name) => {
+        if (name.startsWith(LIB_DIR)) return "0";
+        const path = fromFileName(name);
+        return String((path && this.files.get(path)?.version) ?? 0);
+      },
+      getScriptSnapshot: (name) => {
+        if (name.startsWith(LIB_DIR)) {
+          const text = this.libFiles[name.slice(LIB_DIR.length)];
+          return text === void 0 ? void 0 : ts3.ScriptSnapshot.fromString(text);
+        }
+        const path = fromFileName(name);
+        const file = path ? this.files.get(path) : void 0;
+        if (!file) return void 0;
+        file.snapshot ??= new TextSnapshot(file.text);
+        return file.snapshot;
+      },
+      getCurrentDirectory: () => "/",
+      // A file another package's program pulls in keeps its own package's aliases.
+      resolveModuleNameLiterals: (moduleLiterals, containingFile) => {
+        const containingPath = fromFileName(containingFile);
+        const options = this.optionsOfFile(containingPath);
+        const host = this.moduleResolutionHost();
+        return moduleLiterals.map((literal) => ts3.resolveModuleName(literal.text, containingFile, options, host));
+      },
+      getDefaultLibFileName: () => LIB_DIR + "lib.d.ts",
+      fileExists: (name) => this.fileExists(name),
+      readFile: (name) => this.readFile(name),
+      directoryExists: (dir) => this.directoryExists(dir),
+      getDirectories: () => [],
+      useCaseSensitiveFileNames: () => true
+    };
+  }
+};
+function isAliasInSpecifier(location) {
+  return /\bas\s*$/.test(location.prefixText ?? "") || /^\s*as\b/.test(location.suffixText ?? "");
+}
+var TextSnapshot = class _TextSnapshot {
+  constructor(text) {
+    this.text = text;
+  }
+  text;
+  getText(start, end) {
+    return this.text.slice(start, end);
+  }
+  getLength() {
+    return this.text.length;
+  }
+  getChangeRange(old) {
+    if (!(old instanceof _TextSnapshot)) return void 0;
+    return changedRegion(old.text, this.text);
+  }
+};
+function changedRegion(before, after) {
+  let start = 0;
+  const shorter = Math.min(before.length, after.length);
+  while (start < shorter && before.charCodeAt(start) === after.charCodeAt(start)) start++;
+  let fromEnd = 0;
+  while (fromEnd < shorter - start && before.charCodeAt(before.length - 1 - fromEnd) === after.charCodeAt(after.length - 1 - fromEnd)) fromEnd++;
+  return ts3.createTextChangeRange(ts3.createTextSpan(start, before.length - fromEnd - start), after.length - fromEnd - start);
+}
+function toFileName(path) {
+  return "/" + path;
+}
+function fromFileName(name) {
+  if (name.startsWith(LIB_DIR) || !name.startsWith("/")) return null;
+  return name.slice(1);
+}
+function namesVisibleFrom(model, block) {
+  const names = /* @__PURE__ */ new Set();
+  const siblings = block.parentId ? model.blocks.get(block.parentId).children : model.roots;
+  for (const sibling of siblings) if (sibling !== block) names.add(sibling.name);
+  let parent = block.parentId ? model.blocks.get(block.parentId) : void 0;
+  const isClassMember = parent?.insert === "class";
+  if (isClassMember) return names;
+  while (parent) {
+    const parentSiblings = parent.parentId ? model.blocks.get(parent.parentId).children : model.roots;
+    for (const scopeBlock of [...parent.children, ...parentSiblings]) if (scopeBlock !== block) names.add(scopeBlock.name);
+    parent = parent.parentId ? model.blocks.get(parent.parentId) : void 0;
+  }
+  return names;
+}
+function isValidIdentifier(name) {
+  const scanner = ts3.createScanner(ts3.ScriptTarget.Latest, true, ts3.LanguageVariant.Standard, name);
+  const token = scanner.scan();
+  const isWholeText = scanner.getTokenEnd() === name.length && name.length > 0;
+  const isNameToken = token === ts3.SyntaxKind.Identifier || token > ts3.SyntaxKind.LastReservedWord && token <= ts3.SyntaxKind.LastKeyword;
+  return isWholeText && isNameToken;
+}
+
+// src/remoteProject.ts
+var RemoteProject = class {
+  constructor(callServer) {
+    this.callServer = callServer;
+  }
+  callServer;
+  files = /* @__PURE__ */ new Map();
+  /** Load many files at once. They're parsed in the worker; here only when a canvas needs them. */
+  setFiles(files) {
+    for (const [path, text] of Object.entries(files)) this.files.set(path, { text });
+    void this.callServer("setFiles", [files]);
+  }
+  setFile(path, text) {
+    this.setFileText(path, text);
+    return this.getModel(path);
+  }
+  /** Update a file no canvas shows (e.g. typed in a text editor): no parse on this thread. */
+  setFileText(path, text) {
+    const existing = this.files.get(path);
+    if (existing?.text === text) return;
+    this.files.set(path, { text, model: existing?.model });
+    void this.callServer("setFile", [path, text]);
+  }
+  removeFile(path) {
+    if (!this.files.delete(path)) return;
+    void this.callServer("removeFile", [path]);
+  }
+  setLibFiles(libFiles) {
+    void this.callServer("setLibFiles", [libFiles]);
+  }
+  /** The folder's tsconfig.json (or none, with null). */
+  setConfigFile(config) {
+    void this.callServer("setConfigFile", [config]);
+  }
+  /** The folder's config files (one per package in a monorepo) and package.json files (or none, with null). */
+  setWorkspace(workspace) {
+    void this.callServer("setWorkspace", [workspace]);
+  }
+  getModel(path) {
+    const file = this.files.get(path);
+    if (!file) return void 0;
+    const isModelOfCurrentText = file.model?.text === file.text;
+    if (!isModelOfCurrentText) file.model = parseStructure(path, file.text, file.model);
+    return file.model;
+  }
+  getText(path) {
+    return this.files.get(path)?.text;
+  }
+  paths() {
+    return [...this.files.keys()];
+  }
+  resolve(path, options) {
+    return this.callServer("resolve", [path, options]);
+  }
+  renameBlock(path, blockId, newName) {
+    return this.callServer("renameBlock", [path, blockId, newName]);
+  }
+};
+
+// src/projectServer.ts
+var SERVER_METHODS = ["setLibFiles", "setConfigFile", "setWorkspace", "setFiles", "setFile", "removeFile", "resolve", "renameBlock"];
+var ProjectServer = class {
+  project = new Project();
+  setLibFiles(libFiles) {
+    this.project.setLibFiles(libFiles);
+  }
+  setConfigFile(config) {
+    this.project.setConfigFile(config);
+  }
+  setWorkspace(workspace) {
+    this.project.setWorkspace(workspace);
+  }
+  setFiles(files) {
+    for (const [path, text] of Object.entries(files)) this.project.setFile(path, text);
+  }
+  setFile(path, text) {
+    this.project.setFile(path, text);
+  }
+  removeFile(path) {
+    this.project.removeFile(path);
+  }
+  resolve(path, options) {
+    return this.project.resolve(path, options);
+  }
+  renameBlock(path, blockId, newName) {
+    return this.project.renameBlock(path, blockId, newName);
+  }
+};
+function callProjectServer(server, method, args) {
+  const isServerMethod = SERVER_METHODS.includes(method);
+  if (!isServerMethod) throw new Error(`Unknown project method: ${method}`);
+  return server[method](...args);
+}
+
+// src/projectWorker.ts
+function serveProject(port) {
+  const server = new ProjectServer();
+  port.addEventListener("message", async (event) => {
+    const { id, method, args } = event.data;
+    try {
+      port.postMessage({ id, result: await callProjectServer(server, method, args) });
+    } catch (error) {
+      port.postMessage({ id, error: error instanceof Error ? error.message : String(error) });
+    }
+  });
+  port.start?.();
+}
+function connectProjectWorker(port) {
+  let nextId = 0;
+  const waiting = /* @__PURE__ */ new Map();
+  port.addEventListener("message", (event) => {
+    const reply = event.data;
+    const caller = waiting.get(reply.id);
+    waiting.delete(reply.id);
+    if ("error" in reply) caller?.reject(new Error(reply.error));
+    else caller?.resolve(reply.result);
+  });
+  port.start?.();
+  return new RemoteProject((method, args) => {
+    const id = nextId++;
+    port.postMessage({ id, method, args });
+    return new Promise((resolve, reject) => waiting.set(id, { resolve, reject }));
+  });
+}
+
+// src/edits.ts
+import ts4 from "typescript";
+function applyEdit(text, e) {
+  return text.slice(0, e.start) + e.text + text.slice(e.end);
+}
+function applyEdits(text, edits) {
+  const lastFirst = [...edits].sort((a, b) => b.start - a.start);
+  return lastFirst.reduce(applyEdit, text);
+}
+function replaceBlock(model, id, code) {
+  const b = must(model, id);
+  return { start: b.start, end: b.end, text: code };
+}
+function deleteBlock(model, id) {
+  const b = must(model, id);
+  const t = model.text;
+  let start = t.lastIndexOf("\n", b.start - 1) + 1;
+  if (/\S/.test(t.slice(start, b.start))) start = b.start;
+  let end = b.end;
+  const trail = /^[ \t]*;?[ \t]*(\r?\n)?/.exec(t.slice(end));
+  end += trail[0].length;
+  const before = /(\r?\n[ \t]*)*$/.exec(t.slice(0, start))[0];
+  const after = /^([ \t]*\r?\n)*/.exec(t.slice(end))[0];
+  const blankBefore = (before.match(/\n/g) ?? []).length;
+  const blankAfter = (after.match(/\n/g) ?? []).length;
+  if (blankBefore >= 2 && blankAfter >= 1) end += after.length;
+  else if (start === 0 && blankAfter) end += after.length;
+  return { start, end, text: "" };
+}
+function uniqueName(model, parentId, base) {
+  const taken = /* @__PURE__ */ new Set();
+  const sibs = parentId ? must(model, parentId).children : model.roots;
+  for (const s of sibs) taken.add(s.name);
+  for (const r of model.roots) taken.add(r.name);
+  if (!taken.has(base)) return base;
+  let n = 2;
+  while (taken.has(base + n)) n++;
+  return base + n;
+}
+function containerFor(model, id) {
+  let b = id ? model.blocks.get(id) ?? null : null;
+  while (b && !b.insert) b = b.parentId ? model.blocks.get(b.parentId) ?? null : null;
+  return b;
+}
+function newFunction(model, parentId, base = "newFunction") {
+  const parent = containerFor(model, parentId);
+  const name = uniqueName(model, parent?.id ?? null, base);
+  const u = model.indentUnit;
+  const code = parent?.insert === "class" ? `${name}() {
+${u}
+}` : `function ${name}() {
+${u}
+}`;
+  const nameAt = code.indexOf(name);
+  return insertCode(model, parent, code, name, [nameAt, nameAt + name.length]);
+}
+function copyBlock(model, id) {
+  const b = must(model, id);
+  const parent = b.parentId ? model.blocks.get(b.parentId) : null;
+  return {
+    code: dedent(model.text.slice(b.start, b.end), b.indent),
+    name: b.name,
+    kind: b.kind,
+    fromClass: parent?.insert === "class"
+  };
+}
+function pasteBlock(model, parentId, clip) {
+  const parent = containerFor(model, parentId);
+  const toClass = parent?.insert === "class";
+  let code = clip.code;
+  if (toClass && !clip.fromClass) code = toMember(code);
+  if (!toClass && clip.fromClass) code = toTopLevel(code);
+  if (!clip.name) {
+    const r = insertCode(model, parent, code, "", [0, 0]);
+    return { ...r, id: "" };
+  }
+  const name = uniqueName(model, parent?.id ?? null, clip.name);
+  if (name !== clip.name) code = renameDeclaration(code, toClass, name);
+  return insertCode(model, parent, code, name, [0, 0]);
+}
+function insertCode(model, parent, code, name, select) {
+  const t = model.text;
+  const key = name;
+  const id = parent ? `${parent.id}/${key}` : key;
+  if (!parent) {
+    const end = t.trimEnd().length;
+    const sep = end === 0 ? "" : "\n\n";
+    return { edit: { start: end, end: t.length, text: sep + code + "\n" }, id, select };
+  }
+  const indent = parent.indent + model.indentUnit;
+  const body = reindent(code, indent);
+  const at = parent.insertAt;
+  const lineStart = t.lastIndexOf("\n", at - 1) + 1;
+  if (!/\S/.test(t.slice(lineStart, at))) {
+    const prevLineEnd = lineStart - 1;
+    const prevLineStart = t.lastIndexOf("\n", prevLineEnd - 1) + 1;
+    const prevLine = t.slice(prevLineStart, prevLineEnd);
+    const opener = /\{\s*$/.test(prevLine);
+    const lead = opener || !/\S/.test(prevLine) ? "" : "\n";
+    const trail = t[at] === "}" ? "" : "\n";
+    return { edit: { start: lineStart, end: lineStart, text: lead + indent + body + "\n" + trail }, id, select };
+  }
+  return { edit: { start: at, end: at, text: "\n" + indent + body + "\n" + parent.indent }, id, select };
+}
+function reindent(code, indent) {
+  return code.split("\n").map((l, i) => i === 0 || l === "" ? l : indent + l).join("\n");
+}
+function dedent(code, indent) {
+  if (!indent) return code;
+  return code.split("\n").map((l, i) => i > 0 && l.startsWith(indent) ? l.slice(indent.length) : l).join("\n");
+}
+function toMember(code) {
+  const fn = /^((?:\/\*[\s\S]*?\*\/|\/\/[^\n]*|\s)*)(?:export\s+)?(?:default\s+)?(async\s+)?function\s*(\*?)\s*/.exec(code);
+  if (fn) return fn[1] + (fn[2] ?? "") + fn[3] + code.slice(fn[0].length);
+  const v = /^((?:\/\*[\s\S]*?\*\/|\/\/[^\n]*|\s)*)(?:export\s+)?(?:const|let|var)\s+/.exec(code);
+  if (v) return v[1] + code.slice(v[0].length);
+  return code;
+}
+function toTopLevel(code) {
+  const m = /^((?:\/\*[\s\S]*?\*\/|\/\/[^\n]*|\s)*)((?:(?:public|private|protected|static|readonly|override|abstract)\s+)*)(async\s+)?(\*?)\s*([A-Za-z_$][\w$]*)\s*(<|\()/.exec(code);
+  if (m) return `${m[1]}${m[3] ?? ""}function${m[4] ? "*" : ""} ${m[5]}${m[6]}` + code.slice(m[0].length);
+  const p = /^((?:\/\*[\s\S]*?\*\/|\/\/[^\n]*|\s)*)((?:(?:public|private|protected|static|readonly|override)\s+)*)([A-Za-z_$][\w$]*)(\s*[:=])/.exec(code);
+  if (p) return `${p[1]}const ${p[3]}${p[4]}` + code.slice(p[0].length);
+  return code;
+}
+function renameDeclaration(code, inClass, name) {
+  const prefix = inClass ? "class __cc__ {\n" : "";
+  const src = prefix + code + (inClass ? "\n}" : "");
+  const sf = ts4.createSourceFile("snippet.ts", src, ts4.ScriptTarget.Latest, true);
+  let target;
+  const first = sf.statements[0];
+  if (inClass && first && ts4.isClassDeclaration(first)) target = first.members[0]?.name;
+  else if (first && (ts4.isFunctionDeclaration(first) || ts4.isClassDeclaration(first) || ts4.isInterfaceDeclaration(first) || ts4.isTypeAliasDeclaration(first) || ts4.isEnumDeclaration(first)))
+    target = first.name;
+  else if (first && ts4.isVariableStatement(first)) target = first.declarationList.declarations[0]?.name;
+  if (!target) return code;
+  const s = target.getStart(sf) - prefix.length;
+  return code.slice(0, s) + name + code.slice(target.end - prefix.length);
+}
+function must(model, id) {
+  const b = model.blocks.get(id);
+  if (!b) throw new Error(`No block ${id}`);
+  return b;
+}
+function clipFromText(code) {
+  const text = code.replace(/\s+$/, "");
+  const sf = ts4.createSourceFile("clip.ts", text, ts4.ScriptTarget.Latest, true);
+  const first = sf.statements[0];
+  const diags = sf.parseDiagnostics ?? [];
+  if (first && !diags.length) {
+    let name;
+    let kind = "statement";
+    if (ts4.isFunctionDeclaration(first)) name = first.name?.text, kind = "function";
+    else if (ts4.isClassDeclaration(first)) name = first.name?.text, kind = "class";
+    else if (ts4.isVariableStatement(first)) name = first.declarationList.declarations[0]?.name.getText(), kind = "variable";
+    else if (ts4.isInterfaceDeclaration(first) || ts4.isTypeAliasDeclaration(first) || ts4.isEnumDeclaration(first)) name = first.name.text, kind = "type";
+    if (name) return { code: text, name, kind, fromClass: false };
+  }
+  const wrapped = ts4.createSourceFile("clip.ts", `class __cc__ {
+${text}
+}`, ts4.ScriptTarget.Latest, true);
+  const cls = wrapped.statements[0];
+  const wd = wrapped.parseDiagnostics ?? [];
+  if (cls && ts4.isClassDeclaration(cls) && !wd.length && cls.members[0]?.name) {
+    const m = cls.members[0];
+    return { code: text, name: m.name.getText(wrapped), kind: ts4.isPropertyDeclaration(m) ? "variable" : "function", fromClass: true };
+  }
+  return { code: text, name: "", kind: "statement", fromClass: false };
+}
+
+// src/diff.ts
+function diffModels(base, current) {
+  const changes = /* @__PURE__ */ new Map();
+  for (const [id, block] of current.blocks) {
+    const baseBlock = base.blocks.get(id);
+    if (!baseBlock) changes.set(id, "added");
+    else if (sameCode(fullCode(base, baseBlock), fullCode(current, block))) changes.set(id, "unchanged");
+    else if (sameCode(ownCode(base, baseBlock), ownCode(current, block))) changes.set(id, "containsChanges");
+    else changes.set(id, "changed");
+  }
+  const removed = [...base.blocks.values()].filter((block) => {
+    const isGone = !current.blocks.has(block.id);
+    const isParentGone = !!block.parentId && !current.blocks.has(block.parentId);
+    return isGone && !isParentGone;
+  });
+  return { base, changes, removed };
+}
+function diffOwnCode(base, baseBlock, current, block) {
+  const before = baseBlock ? codeLines(ownCode(base, baseBlock)) : [];
+  return diffLines(before, codeLines(ownCode(current, block)));
+}
+function diffLines(before, after) {
+  let prefix = 0;
+  while (prefix < before.length && prefix < after.length && before[prefix] === after[prefix]) prefix++;
+  let suffix = 0;
+  while (suffix < before.length - prefix && suffix < after.length - prefix && before[before.length - 1 - suffix] === after[after.length - 1 - suffix]) suffix++;
+  const oldMiddle = before.slice(prefix, before.length - suffix);
+  const newMiddle = after.slice(prefix, after.length - suffix);
+  const common = Array.from({ length: oldMiddle.length + 1 }, () => new Uint32Array(newMiddle.length + 1));
+  for (let i2 = oldMiddle.length - 1; i2 >= 0; i2--) {
+    for (let j2 = newMiddle.length - 1; j2 >= 0; j2--) {
+      common[i2][j2] = oldMiddle[i2] === newMiddle[j2] ? common[i2 + 1][j2 + 1] + 1 : Math.max(common[i2 + 1][j2], common[i2][j2 + 1]);
+    }
+  }
+  const middle = [];
+  let i = 0;
+  let j = 0;
+  while (i < oldMiddle.length || j < newMiddle.length) {
+    if (i < oldMiddle.length && j < newMiddle.length && oldMiddle[i] === newMiddle[j]) {
+      middle.push({ kind: "same", text: newMiddle[j] });
+      i++;
+      j++;
+    } else if (i < oldMiddle.length && (j === newMiddle.length || common[i + 1][j] >= common[i][j + 1])) {
+      middle.push({ kind: "removed", text: oldMiddle[i++] });
+    } else {
+      middle.push({ kind: "added", text: newMiddle[j++] });
+    }
+  }
+  const same = (text) => ({ kind: "same", text });
+  return [...before.slice(0, prefix).map(same), ...middle, ...after.slice(after.length - suffix).map(same)];
+}
+function diffPreview(lines, max) {
+  const isNearChange = (index) => [index - 1, index, index + 1].some((near) => lines[near] && lines[near].kind !== "same");
+  const changesWithContext = lines.filter((_, index) => isNearChange(index));
+  const shown = changesWithContext.length <= max ? changesWithContext : lines.filter((line) => line.kind !== "same");
+  return { lines: shown.slice(0, max), more: Math.max(0, shown.length - max) };
+}
+function sameCode(before, after) {
+  return codeLines(before).join("\n") === codeLines(after).join("\n");
+}
+function fullCode(model, block) {
+  return model.text.slice(block.start, block.end);
+}
+function ownCode(model, block) {
+  return codeWithoutChildren(model.text, [block.start, block.end], block.children);
+}
+function codeLines(code) {
+  const lines = code.split("\n").map((line) => line.replace(/\s+$/, "").replace(/\t/g, "  ")).filter((line) => line);
+  const indents = lines.slice(1).filter((line) => line).map((line) => /^ */.exec(line)[0].length);
+  const commonIndent = indents.length ? Math.min(...indents) : 0;
+  return lines.map((line, index) => index === 0 ? line.trimStart() : line.slice(Math.min(commonIndent, /^ */.exec(line)[0].length)));
+}
+
+// src/conflicts.ts
+var CURRENT_MARKER = /^<{7}(?: (.*))?\r?$/;
+var BASE_MARKER = /^\|{7}(?: .*)?\r?$/;
+var SEPARATOR = /^={7}\r?$/;
+var INCOMING_MARKER = /^>{7}(?: (.*))?\r?$/;
+function findConflicts(text) {
+  const hunks = [];
+  let open = null;
+  let lineStart = 0;
+  while (lineStart < text.length) {
+    const newline = text.indexOf("\n", lineStart);
+    const lineEnd = newline === -1 ? text.length : newline;
+    const nextLineStart = newline === -1 ? text.length : newline + 1;
+    const line = text.slice(lineStart, lineEnd);
+    const currentMarker = CURRENT_MARKER.exec(line);
+    if (currentMarker) {
+      open = { start: lineStart, currentLabel: currentMarker[1] ?? "", currentStart: nextLineStart };
+    } else if (open && BASE_MARKER.test(line) && open.currentEnd === void 0) {
+      open.currentEnd = lineStart;
+      open.baseStart = nextLineStart;
+    } else if (open && SEPARATOR.test(line) && open.incomingStart === void 0) {
+      if (open.baseStart !== void 0) open.baseEnd = lineStart;
+      else open.currentEnd = lineStart;
+      open.incomingStart = nextLineStart;
+    } else if (open && open.incomingStart !== void 0) {
+      const incomingMarker = INCOMING_MARKER.exec(line);
+      if (incomingMarker) {
+        hunks.push({
+          start: open.start,
+          end: nextLineStart,
+          current: { start: open.currentStart, end: open.currentEnd },
+          incoming: { start: open.incomingStart, end: lineStart },
+          base: open.baseStart !== void 0 ? { start: open.baseStart, end: open.baseEnd } : void 0,
+          currentLabel: open.currentLabel,
+          incomingLabel: incomingMarker[1] ?? ""
+        });
+        open = null;
+      }
+    }
+    lineStart = nextLineStart;
+  }
+  return hunks;
+}
+function conflictSideText(text, hunks, side) {
+  const pieces = [];
+  const hunkRanges = [];
+  let sideText = "";
+  let fileOffset = 0;
+  const copy = (start, end) => {
+    pieces.push([sideText.length, start, end - start]);
+    sideText += text.slice(start, end);
+  };
+  for (const hunk of hunks) {
+    copy(fileOffset, hunk.start);
+    const code = hunk[side];
+    const rangeStart = sideText.length;
+    copy(code.start, code.end);
+    hunkRanges.push({ start: rangeStart, end: sideText.length });
+    fileOffset = hunk.end;
+  }
+  copy(fileOffset, text.length);
+  return {
+    text: sideText,
+    hunkRanges,
+    toFileOffset(offset) {
+      const piece = pieces.findLast(([sideStart]) => sideStart <= offset) ?? pieces[0];
+      return piece[1] + Math.min(offset - piece[0], piece[2]);
+    }
+  };
+}
+function resolveConflict(text, hunk, choice) {
+  const code = (side) => text.slice(side.start, side.end);
+  const resolved = choice === "both" ? code(hunk.current) + code(hunk.incoming) : code(hunk[choice]);
+  return { start: hunk.start, end: hunk.end, text: resolved };
+}
+
+// src/layoutRules.ts
+var BAND_ORDER = ["data", "types", "main", "bottom"];
+var ZONE_RULES = [
+  { zone: "left", description: "Imports on the left", matches: (block) => block.kind === "import" },
+  { zone: "data", description: "Constants and other data at the top", matches: (block) => block.kind === "variable" },
+  { zone: "types", description: "Then interfaces, types and enums", matches: (block) => block.kind === "type" },
+  { zone: "bottom", description: "Code that runs when the file loads, at the bottom", matches: (block) => block.kind === "statement" },
+  { zone: "main", description: "Functions, classes and the rest in between", matches: () => true }
+];
+var STACK_RULES = [
+  {
+    description: "A getter above its setter: getTotal / setTotal, and get total / set total",
+    pairs(blocks) {
+      const pairs = [];
+      for (const getter of blocks) {
+        const accessed = accessedName(getter, "get");
+        const setter = accessed && blocks.find((block) => block !== getter && accessedName(block, "set") === accessed);
+        if (setter) pairs.push([getter, setter]);
+      }
+      return pairs;
+    }
+  }
+];
+var RELATEDNESS_RULES = [
+  {
+    description: "One calls or uses the other",
+    score: (a, b, factsOf) => factsOf(a).uses.has(b.id) || factsOf(b).uses.has(a.id) ? 3 : 0
+  },
+  {
+    description: "They use the same things",
+    score: (a, b, factsOf) => [...factsOf(a).uses].filter((id) => factsOf(b).uses.has(id)).length
+  },
+  {
+    description: "Their names start the same way (formatPrice, formatDate)",
+    score: (a, b) => firstWord(a.name) && firstWord(a.name) === firstWord(b.name) ? 1 : 0
+  }
+];
+var PLACEMENT_RULES = [
+  {
+    description: "A getter right above its setter, a setter right below its getter",
+    spot(block, placed) {
+      const siblings = [block, ...placed.map((sibling) => sibling.block)];
+      for (const rule of STACK_RULES) {
+        for (const [top, bottom] of rule.pairs(siblings)) {
+          const placedBottom = top === block && placed.find((sibling) => sibling.block === bottom);
+          if (placedBottom) return { sibling: placedBottom, side: "above" };
+          const placedTop = bottom === block && placed.find((sibling) => sibling.block === top);
+          if (placedTop) return { sibling: placedTop, side: "below" };
+        }
+      }
+      return void 0;
+    }
+  },
+  {
+    description: "Like a newspaper: a function goes in the column right of its caller, after the function called before it",
+    spot(block, placed, factsOf) {
+      if (!isFunctionLike(block)) return void 0;
+      const caller = placed.find((sibling) => isFunctionLike(sibling.block) && factsOf(sibling.block).calls.includes(block.id));
+      if (!caller) return void 0;
+      const calls = factsOf(caller.block).calls;
+      const isInCallerColumn = (sibling) => sibling !== caller && sibling.x >= caller.x + caller.w;
+      const calledBefore = calls.slice(0, calls.indexOf(block.id)).reverse();
+      const previousInColumn = calledBefore.map((id) => placed.find((sibling) => sibling.block.id === id && isInCallerColumn(sibling))).find(Boolean);
+      return previousInColumn ? { sibling: previousInColumn, side: "below" } : { sibling: caller, side: "right" };
+    }
+  },
+  {
+    description: "An import, constant or type below the last one of its kind before it in the file",
+    spot(block, placed) {
+      const zone = zoneOf(block);
+      if (zone === "main") return void 0;
+      const sameZone = placed.filter((sibling) => zoneOf(sibling.block) === zone);
+      const lastBefore = sameZone.filter((sibling) => sibling.block.start < block.start).at(-1) ?? sameZone[0];
+      return lastBefore ? { sibling: lastBefore, side: "below" } : void 0;
+    }
+  },
+  {
+    description: "Below the block it is most related to",
+    spot(block, placed, factsOf) {
+      let best;
+      let bestScore = 0;
+      for (const sibling of placed) {
+        const score = RELATEDNESS_RULES.reduce((total, rule) => total + rule.score(block, sibling.block, factsOf), 0);
+        if (score > bestScore) {
+          best = sibling;
+          bestScore = score;
+        }
+      }
+      return best ? { sibling: best, side: "below" } : void 0;
+    }
+  }
+];
+var zoneOf = (block) => ZONE_RULES.find((rule) => rule.matches(block)).zone;
+var NEWSPAPER_DEPTH = 3;
+var isFunctionLike = (block) => block.kind === "function";
+function accessedName(block, accessor) {
+  if (block.kind !== "function") return void 0;
+  if (block.tags.includes(accessor)) return block.name;
+  const match = new RegExp(`^${accessor}([A-Z_$][\\w$]*)$`).exec(block.name);
+  return match ? match[1].charAt(0).toLowerCase() + match[1].slice(1) : void 0;
+}
+function firstWord(name) {
+  const match = /^([a-z]+)[A-Z0-9_]/.exec(name);
+  const isAccessorWord = match?.[1] === "get" || match?.[1] === "set";
+  return match && !isAccessorWord ? match[1] : void 0;
+}
+
+// src/arrange.ts
+function arrangeSiblings(blocks, sizeOf, text, gap, isFile) {
+  const factsById = siblingFacts(blocks, text);
+  const factsOf = (block) => factsById.get(block.id);
+  const units = stackedUnits(blocks);
+  const zoneUnits = (zone) => units.filter((unit) => unit.zone === zone);
+  const bands = BAND_ORDER.map((zone) => {
+    const inZone = zoneUnits(zone);
+    return zone === "main" ? orderByRelatedness(newspaperTrees(inZone, factsOf), factsOf) : inZone;
+  });
+  const positions = /* @__PURE__ */ new Map();
+  let left = 0;
+  const leftColumn = zoneUnits("left");
+  if (leftColumn.length) {
+    let y2 = 0;
+    for (const unit of leftColumn) {
+      place(unit.arrangement, 0, y2, sizeOf, gap, positions);
+      y2 += measure(unit.arrangement, sizeOf, gap).h + 12;
+    }
+    left = Math.max(...leftColumn.map((unit) => measure(unit.arrangement, sizeOf, gap).w)) + gap * 2;
+  }
+  const bandUnits = bands.flat();
+  const area = bandUnits.reduce((sum, unit) => {
+    const size = measure(unit.arrangement, sizeOf, gap);
+    return sum + (size.w + gap) * (size.h + gap);
+  }, 0);
+  const widest = Math.max(0, ...bandUnits.map((unit) => measure(unit.arrangement, sizeOf, gap).w));
+  const rowWidth = Math.max(widest, Math.sqrt(area * (isFile ? 1.7 : 2.4)));
+  let y = 0;
+  for (const band of bands.filter((band2) => band2.length)) {
+    let x = 0;
+    let rowHeight = 0;
+    for (const unit of band) {
+      const size = measure(unit.arrangement, sizeOf, gap);
+      if (x > 0 && x + size.w > rowWidth) {
+        x = 0;
+        y += rowHeight + gap;
+        rowHeight = 0;
+      }
+      place(unit.arrangement, left + x, y, sizeOf, gap, positions);
+      x += size.w + gap;
+      rowHeight = Math.max(rowHeight, size.h);
+    }
+    y += rowHeight + gap;
+  }
+  return positions;
+}
+function newBlockSpots(siblings, text) {
+  let factsById;
+  const factsOf = (sibling) => factsById.get(sibling.id);
+  return (block, placed) => {
+    factsById ??= siblingFacts(siblings, text);
+    for (const rule of PLACEMENT_RULES) {
+      const spot = rule.spot(block, placed, factsOf);
+      if (spot) return spot;
+    }
+    return void 0;
+  };
+}
+function stackedUnits(blocks) {
+  const unitOf = /* @__PURE__ */ new Map();
+  const units = blocks.map((block, order) => {
+    const unit = { members: [block], arrangement: { block: block.id }, zone: zoneOf(block), order };
+    unitOf.set(block, unit);
+    return unit;
+  });
+  for (const rule of STACK_RULES) {
+    for (const [top, bottom] of rule.pairs(blocks)) {
+      const topUnit = unitOf.get(top);
+      const bottomUnit = unitOf.get(bottom);
+      const canStack = topUnit !== bottomUnit && topUnit.members.length === 1 && bottomUnit.members.length === 1 && topUnit.zone === bottomUnit.zone;
+      if (!canStack) continue;
+      topUnit.members.push(bottom);
+      topUnit.arrangement = { column: [{ block: top.id }, { block: bottom.id }] };
+      topUnit.order = Math.min(topUnit.order, bottomUnit.order);
+      unitOf.set(bottom, topUnit);
+      units.splice(units.indexOf(bottomUnit), 1);
+    }
+  }
+  return units;
+}
+function newspaperTrees(units, factsOf) {
+  const unitOfBlock = /* @__PURE__ */ new Map();
+  for (const unit of units) for (const member of unit.members) unitOfBlock.set(member.id, unit);
+  const isFunctionUnit = (unit) => unit.members.some(isFunctionLike);
+  const calledUnits = (unit) => {
+    if (!isFunctionUnit(unit)) return [];
+    const called = [];
+    for (const member of unit.members) {
+      for (const id of factsOf(member).calls) {
+        const calledUnit = unitOfBlock.get(id);
+        if (calledUnit && calledUnit !== unit && isFunctionUnit(calledUnit) && !called.includes(calledUnit)) called.push(calledUnit);
+      }
+    }
+    return called;
+  };
+  const isCalledBySibling = new Set(units.flatMap(calledUnits));
+  const claimed = /* @__PURE__ */ new Set();
+  const tree = (unit, depth) => {
+    if (depth >= NEWSPAPER_DEPTH) return unit.arrangement;
+    const callees = calledUnits(unit).filter((callee) => !claimed.has(callee));
+    for (const callee of callees) claimed.add(callee);
+    if (!callees.length) return unit.arrangement;
+    return { row: [unit.arrangement, { column: callees.map((callee) => tree(callee, depth + 1)) }] };
+  };
+  const trees = [];
+  const starts = [...units.filter((unit) => !isCalledBySibling.has(unit)), ...units];
+  for (const unit of starts) {
+    if (claimed.has(unit)) continue;
+    claimed.add(unit);
+    const arrangement = tree(unit, 0);
+    const members = [...units].filter((other) => other === unit || claimed.has(other) && contains(arrangement, other));
+    trees.push({ ...unit, arrangement, members: members.flatMap((member) => member.members) });
+  }
+  return trees;
+}
+function orderByRelatedness(units, factsOf) {
+  const relatedness = (a, b) => a.members.reduce((sum, x) => sum + b.members.reduce((inner, y) => inner + RELATEDNESS_RULES.reduce((total, rule) => total + rule.score(x, y, factsOf), 0), 0), 0);
+  const left = [...units].sort((a, b) => a.order - b.order);
+  const ordered = [];
+  while (left.length) {
+    const last = ordered[ordered.length - 1];
+    let next = left[0];
+    if (last) {
+      let best = 0;
+      for (const candidate of left) {
+        const score = relatedness(last, candidate);
+        if (score > best) {
+          best = score;
+          next = candidate;
+        }
+      }
+    }
+    left.splice(left.indexOf(next), 1);
+    ordered.push(next);
+  }
+  return ordered;
+}
+function siblingFacts(blocks, text) {
+  const idsByName = /* @__PURE__ */ new Map();
+  for (const block of blocks) idsByName.set(block.name, [...idsByName.get(block.name) ?? [], block.id]);
+  const facts = /* @__PURE__ */ new Map();
+  for (const block of blocks) {
+    const code = codeWithoutChildren(text, [block.start, block.end], block.children);
+    const calls = [];
+    const uses = /* @__PURE__ */ new Set();
+    for (const match of code.matchAll(/[A-Za-z_$][\w$]*/g)) {
+      const ids = idsByName.get(match[0])?.filter((id) => id !== block.id);
+      if (!ids?.length) continue;
+      const isCall = /^\s*\(/.test(code.slice(match.index + match[0].length, match.index + match[0].length + 40));
+      for (const id of ids) {
+        uses.add(id);
+        if (isCall && !calls.includes(id)) calls.push(id);
+      }
+    }
+    facts.set(block.id, { calls, uses });
+  }
+  return facts;
+}
+var measured = /* @__PURE__ */ new WeakMap();
+function measure(arrangement, sizeOf, gap) {
+  if ("block" in arrangement) return sizeOf(arrangement.block);
+  const known = measured.get(arrangement);
+  if (known) return known;
+  const size = measureGroup(arrangement, sizeOf, gap);
+  measured.set(arrangement, size);
+  return size;
+}
+function measureGroup(arrangement, sizeOf, gap) {
+  const sizes = ("row" in arrangement ? arrangement.row : arrangement.column).map((item) => measure(item, sizeOf, gap));
+  const gaps = gap * (sizes.length - 1);
+  return "row" in arrangement ? { w: sizes.reduce((sum, size) => sum + size.w, 0) + gaps, h: Math.max(...sizes.map((size) => size.h)) } : { w: Math.max(...sizes.map((size) => size.w)), h: sizes.reduce((sum, size) => sum + size.h, 0) + gaps };
+}
+function place(arrangement, x, y, sizeOf, gap, positions) {
+  if ("block" in arrangement) {
+    positions.set(arrangement.block, { x: Math.round(x), y: Math.round(y) });
+    return;
+  }
+  const isRow = "row" in arrangement;
+  let offset = 0;
+  for (const item of isRow ? arrangement.row : arrangement.column) {
+    place(item, isRow ? x + offset : x, isRow ? y : y + offset, sizeOf, gap, positions);
+    const size = measure(item, sizeOf, gap);
+    offset += (isRow ? size.w : size.h) + gap;
+  }
+}
+function contains(arrangement, unit) {
+  if ("block" in arrangement) return unit.members.some((member) => member.id === arrangement.block);
+  return ("row" in arrangement ? arrangement.row : arrangement.column).some((item) => contains(item, unit));
+}
+
+// src/layout.ts
+var M = {
+  headerH: 32,
+  headerCharW: 7.9,
+  // 13px monospace
+  previewLineH: 15,
+  previewCharW: 6.7,
+  // 11px monospace
+  previewPad: 10,
+  pad: 14,
+  // inner padding of containers
+  gap: 28,
+  // spacing between sibling blocks
+  minW: 180,
+  maxW: 460,
+  miniH: 46,
+  // collapsed container: faint mini-map of children
+  fileHeader: 44,
+  filePad: 48
+};
+function emptyLayout() {
+  return { version: 1, blocks: {} };
+}
+function computeGeometry(model, layout, hints = {}, opts = {}) {
+  const resolve = opts.resolveOverlaps ?? true;
+  const geo = /* @__PURE__ */ new Map();
+  const assigned = {};
+  const collapsed = new Set(layout.collapsed ?? []);
+  const pos = (id) => layout.blocks[id] ?? assigned[id];
+  const measure2 = (b, hidden) => {
+    const isCollapsed = collapsed.has(b.id) && b.children.length > 0;
+    const kids = b.children.map((c) => measure2(c, hidden || isCollapsed));
+    placeSiblings(kids, false);
+    const head = headerChars(b);
+    const previewChars = Math.max(0, ...b.preview.map((l) => l.length));
+    const leafW = clamp(Math.ceil(Math.max(head * M.headerCharW, previewChars * M.previewCharW) + 28), M.minW, M.maxW);
+    const lines = b.preview.length + (b.previewMore ? 1 : 0);
+    const previewH = lines ? lines * M.previewLineH + M.previewPad : 4;
+    let w = leafW;
+    let h = M.headerH + previewH;
+    let contentTop = h;
+    if (kids.length && isCollapsed) {
+      h += M.miniH;
+    } else if (kids.length) {
+      contentTop = h + 6;
+      const right = Math.max(...kids.map((k) => k.x + k.w));
+      const bottom = Math.max(...kids.map((k) => k.y + k.h));
+      w = Math.max(leafW, right + M.pad * 2);
+      h = contentTop + bottom + M.pad;
+    }
+    const g = { id: b.id, block: b, x: 0, y: 0, w, h, ax: 0, ay: 0, contentTop, collapsed: isCollapsed, hidden };
+    geo.set(b.id, g);
+    return g;
+  };
+  const placeSiblings = (sibs, isFile) => {
+    if (!sibs.length) return;
+    const isNeverLaidOut = sibs.every((g) => !layout.blocks[g.id] && !hints[g.id]);
+    if (isNeverLaidOut) {
+      const sizeOf = (id) => geo.get(id);
+      const arranged = arrangeSiblings(sibs.map((g) => g.block), sizeOf, model.text, M.gap, isFile);
+      for (const g of sibs) assigned[g.id] = arranged.get(g.id);
+    }
+    const placed = [];
+    const unplaced = [];
+    for (const g of sibs) {
+      const p = pos(g.id);
+      if (p) {
+        g.x = p.x;
+        g.y = p.y;
+        placed.push(g);
+      } else unplaced.push(g);
+    }
+    const spotByRules = newBlockSpots(sibs.map((sibling) => sibling.block), model.text);
+    for (const g of unplaced) {
+      const hint = hints[g.id];
+      const ruleSpot = hint || !placed.length ? void 0 : spotByRules(g.block, placed);
+      let p;
+      if (hint) p = freeSpotNear(hint, g, placed, !isFile);
+      else if (ruleSpot?.side === "below") p = freeSpotDown(pointBeside(ruleSpot, g), g, placed, !isFile);
+      else if (ruleSpot) p = freeSpotNear(pointBeside(ruleSpot, g), g, placed, !isFile);
+      else {
+        const previousPlacedInFile = sibs.slice(0, sibs.indexOf(g)).reverse().find((sibling) => placed.includes(sibling));
+        p = findFreeSpot(g, placed, previousPlacedInFile, !isFile);
+      }
+      g.x = p.x;
+      g.y = p.y;
+      assigned[g.id] = p;
+      placed.push(g);
+    }
+    if (resolve) pushApart(sibs, assigned);
+  };
+  const roots = model.roots.map((r) => measure2(r, false));
+  placeSiblings(roots, true);
+  const order = [];
+  const place2 = (g, ox, oy) => {
+    g.ax = ox + g.x;
+    g.ay = oy + g.y;
+    order.push(g);
+    for (const c of g.block.children) place2(geo.get(c.id), g.ax + M.pad, g.ay + g.contentTop);
+  };
+  for (const r of roots) place2(r, 0, 0);
+  let minX = 0, minY = 0, maxX = 640, maxY = 360;
+  if (roots.length) {
+    minX = Math.min(...roots.map((g) => g.x));
+    minY = Math.min(...roots.map((g) => g.y));
+    maxX = Math.max(...roots.map((g) => g.x + g.w));
+    maxY = Math.max(...roots.map((g) => g.y + g.h));
+  }
+  const frame = {
+    x: minX - M.filePad,
+    y: minY - M.filePad - M.fileHeader,
+    w: Math.max(maxX - minX, 480) + M.filePad * 2,
+    h: Math.max(maxY - minY, 240) + M.filePad * 2 + M.fileHeader
+  };
+  return { geo, order, frame, assigned };
+}
+function placeGhostBlocks(ghosts, ghostGeometry, currentModel, current) {
+  const positions = /* @__PURE__ */ new Map();
+  const placedGhostsByParent = /* @__PURE__ */ new Map();
+  for (const ghost of ghosts) {
+    const ghostGeo = ghostGeometry.geo.get(ghost.id);
+    if (!ghostGeo) continue;
+    const parentId = ghost.parentId ?? null;
+    const parentGeo = parentId ? current.geo.get(parentId) : void 0;
+    if (parentId && !parentGeo) continue;
+    if (parentGeo && (parentGeo.hidden || parentGeo.collapsed)) continue;
+    const currentSiblings = parentId ? currentModel.blocks.get(parentId).children : currentModel.roots;
+    const placedGhosts = placedGhostsByParent.get(parentId) ?? [];
+    const taken = [...currentSiblings.map((sibling) => current.geo.get(sibling.id)), ...placedGhosts];
+    const spot = freeSpotNear({ x: ghostGeo.x, y: ghostGeo.y }, ghostGeo, taken, !!parentGeo);
+    placedGhosts.push({ ...spot, w: ghostGeo.w, h: ghostGeo.h });
+    placedGhostsByParent.set(parentId, placedGhosts);
+    positions.set(ghost.id, parentGeo ? { x: parentGeo.ax + M.pad + spot.x, y: parentGeo.ay + parentGeo.contentTop + spot.y } : spot);
+  }
+  return positions;
+}
+function pushApart(sibs, assigned) {
+  for (let iter = 0; iter < 100; iter++) {
+    let moved = false;
+    const sorted = [...sibs].sort((a, b) => a.y - b.y || a.x - b.x);
+    for (let i = 0; i < sorted.length; i++) {
+      for (let j = i + 1; j < sorted.length; j++) {
+        const a = sorted[i];
+        const b = sorted[j];
+        if (!overlaps(a, b, 4)) continue;
+        const down = a.y + a.h + M.gap - b.y;
+        const right = b.x > a.x ? a.x + a.w + M.gap - b.x : Infinity;
+        if (right < down) b.x += right;
+        else b.y += down;
+        assigned[b.id] = { x: Math.round(b.x), y: Math.round(b.y) };
+        moved = true;
+      }
+    }
+    if (!moved) break;
+  }
+}
+function pointBeside(spot, size) {
+  const { sibling, side } = spot;
+  if (side === "right") return { x: sibling.x + sibling.w + M.gap, y: sibling.y };
+  if (side === "below") return { x: sibling.x, y: sibling.y + sibling.h + M.gap };
+  return { x: sibling.x, y: sibling.y - size.h - M.gap };
+}
+function headerChars(b) {
+  const tags = b.tags.filter((t) => t !== "export").join(" ");
+  return 4 + b.name.length + Math.min(b.detail.length, 40) + (tags ? tags.length + 2 : 0) + 3;
+}
+function overlaps(a, b, gap = M.gap / 2) {
+  return a.x < b.x + b.w + gap && a.x + a.w + gap > b.x && a.y < b.y + b.h + gap && a.y + a.h + gap > b.y;
+}
+function fits(r, placed, clampPositive) {
+  if (clampPositive && (r.x < 0 || r.y < 0)) return false;
+  return !placed.some((p) => overlaps(r, p));
+}
+function findFreeSpot(g, placed, prev, clampPositive) {
+  if (!placed.length) return { x: 0, y: 0 };
+  const cands = [];
+  if (prev) cands.push({ x: prev.x, y: prev.y + prev.h + M.gap }, { x: prev.x + prev.w + M.gap, y: prev.y });
+  const origin = prev ?? placed[0];
+  const others = [...placed].sort((a, b) => dist(a, origin) - dist(b, origin));
+  for (const p of others) cands.push({ x: p.x, y: p.y + p.h + M.gap }, { x: p.x + p.w + M.gap, y: p.y });
+  for (const c of cands) if (fits({ ...c, w: g.w, h: g.h }, placed, clampPositive)) return c;
+  const bottom = Math.max(...placed.map((p) => p.y + p.h));
+  return { x: Math.min(...placed.map((p) => p.x)), y: bottom + M.gap };
+}
+function freeSpotNear(at, g, placed, clampPositive) {
+  const start = clampPositive ? { x: Math.max(0, at.x), y: Math.max(0, at.y) } : at;
+  const others = placed.filter((p) => p.id === void 0 || p.id !== g.id);
+  if (fits({ ...start, w: g.w, h: g.h }, others, clampPositive)) return round(start);
+  const cands = [];
+  for (const p of others) {
+    cands.push(
+      { x: p.x + p.w + M.gap, y: start.y },
+      { x: start.x, y: p.y + p.h + M.gap },
+      { x: p.x - g.w - M.gap, y: start.y },
+      { x: start.x, y: p.y - g.h - M.gap },
+      { x: p.x + p.w + M.gap, y: p.y },
+      { x: p.x, y: p.y + p.h + M.gap }
+    );
+  }
+  cands.sort((a, b) => dist(a, start) - dist(b, start));
+  for (const c of cands) if (fits({ ...c, w: g.w, h: g.h }, others, clampPositive)) return round(c);
+  const bottom = Math.max(...others.map((p) => p.y + p.h));
+  return round({ x: start.x, y: bottom + M.gap });
+}
+function freeSpotDown(at, g, placed, clampPositive) {
+  const spot = clampPositive ? { x: Math.max(0, at.x), y: Math.max(0, at.y) } : { ...at };
+  const blockCoveringSpot = () => placed.find((p) => overlaps({ x: spot.x, y: spot.y, w: g.w, h: g.h }, p));
+  for (let covering = blockCoveringSpot(); covering; covering = blockCoveringSpot()) spot.y = covering.y + covering.h + M.gap;
+  return round(spot);
+}
+function dist(a, b) {
+  return Math.hypot(a.x - b.x, a.y - b.y);
+}
+function clamp(v, lo, hi) {
+  return Math.min(hi, Math.max(lo, v));
+}
+function round(p) {
+  return { x: Math.round(p.x), y: Math.round(p.y) };
+}
+function carryRenames(prev, next, layout) {
+  if (!prev) return false;
+  const removedByParent = /* @__PURE__ */ new Map();
+  const addedByParent = /* @__PURE__ */ new Map();
+  for (const [id, b] of prev.blocks) if (!next.blocks.has(id)) push(removedByParent, b.parentId, b);
+  for (const [id, b] of next.blocks) if (!prev.blocks.has(id)) push(addedByParent, b.parentId, b);
+  let changed = false;
+  for (const [parent, added] of addedByParent) {
+    const removed = removedByParent.get(parent);
+    if (added.length !== 1 || removed?.length !== 1) continue;
+    const from = removed[0].id;
+    const to = added[0].id;
+    for (const key of Object.keys(layout.blocks)) {
+      if (key === from || key.startsWith(from + "/")) {
+        const nk = to + key.slice(from.length);
+        if (!layout.blocks[nk]) layout.blocks[nk] = layout.blocks[key];
+        changed = true;
+      }
+    }
+    if (layout.collapsed?.includes(from)) layout.collapsed.push(to);
+  }
+  return changed;
+}
+function push(m, k, v) {
+  const a = m.get(k);
+  if (a) a.push(v);
+  else m.set(k, [v]);
+}
+function serializeLayout(layout, model) {
+  const blocks = {};
+  for (const k of Object.keys(layout.blocks).sort()) {
+    if (model && !model.blocks.has(k)) continue;
+    const p = layout.blocks[k];
+    blocks[k] = { x: Math.round(p.x), y: Math.round(p.y) };
+  }
+  const out = { version: 1, blocks };
+  const collapsed = (layout.collapsed ?? []).filter((c) => !model || model.blocks.has(c)).sort();
+  if (collapsed.length) out.collapsed = [...new Set(collapsed)];
+  return JSON.stringify(out, null, 2) + "\n";
+}
+
+// src/html.ts
+var policy;
+function trustedHtmlPolicy() {
+  if (policy !== void 0) return policy;
+  const factory = globalThis.trustedTypes;
+  try {
+    policy = factory ? factory.createPolicy("codecanvas", { createHTML: (html) => html }) : null;
+  } catch {
+    policy = null;
+  }
+  return policy;
+}
+function setHTML(element, html) {
+  const htmlPolicy = trustedHtmlPolicy();
+  element.innerHTML = htmlPolicy ? htmlPolicy.createHTML(html) : html;
+}
+
+// src/styles.ts
+var CSS = (
+  /* css */
+  `
+.cc-root {
+  --cc-bg: #15171c;
+  --cc-dot: rgba(255,255,255,.07);
+  --cc-frame-bg: rgba(255,255,255,.025);
+  --cc-frame-border: rgba(255,255,255,.10);
+  --cc-text: #e8eaee;
+  --cc-muted: #9aa1ad;
+  --cc-faint: #c4cad4;
+  --cc-panel: #1f2229;
+  --cc-panel-border: rgba(255,255,255,.12);
+  --cc-accent: #7aa2ff;
+  --cc-danger: #ff6b6b;
+  --cc-shadow: 0 10px 30px rgba(0,0,0,.45);
+
+  --k-import: #6b7280;   --k-import-head: #3b3f46;  --k-import-bg: #25272c;
+  --k-class: #34b27a;    --k-class-head: #1d6b4a;   --k-class-bg: rgba(52,178,122,.08);
+  --k-function: #ec5fa5; --k-function-head: #8f2f62; --k-function-bg: rgba(236,95,165,.09);
+  --k-variable: #4b8ef7; --k-variable-head: #23508f; --k-variable-bg: rgba(75,142,247,.09);
+  --k-type: #d4a92a;     --k-type-head: #6e5714;    --k-type-bg: rgba(212,169,42,.08);
+  --k-namespace: #9b8cf8; --k-namespace-head: #4d4291; --k-namespace-bg: rgba(155,140,248,.08);
+  --k-statement: #7c8799; --k-statement-head: #39414f; --k-statement-bg: rgba(124,135,153,.08);
+
+  position: relative; overflow: hidden; width: 100%; height: 100%;
+  background-color: var(--cc-bg);
+  background-image: radial-gradient(var(--cc-dot) 1.2px, transparent 1.3px);
+  color: var(--cc-text);
+  font: 13px/1.3 ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
+  touch-action: none; user-select: none; -webkit-user-select: none; outline: none;
+  -webkit-tap-highlight-color: transparent;
+}
+.cc-root[data-theme="light"] {
+  --cc-bg: #f6f7f9; --cc-dot: rgba(0,0,0,.09);
+  --cc-frame-bg: rgba(255,255,255,.7); --cc-frame-border: rgba(0,0,0,.12);
+  --cc-text: #1d2129; --cc-muted: #5d6573; --cc-faint: #39404c;
+  --cc-panel: #ffffff; --cc-panel-border: rgba(0,0,0,.12); --cc-accent: #3366e6;
+  --cc-shadow: 0 10px 30px rgba(20,30,50,.18);
+  --k-import: #6b7280;   --k-import-head: #4b5058;  --k-import-bg: #eceef1;
+  --k-class: #1f9963;    --k-class-head: #1f9963;   --k-class-bg: rgba(31,153,99,.07);
+  --k-function: #d63e8c; --k-function-head: #d63e8c; --k-function-bg: rgba(214,62,140,.07);
+  --k-variable: #2f6fe0; --k-variable-head: #2f6fe0; --k-variable-bg: rgba(47,111,224,.07);
+  --k-type: #b58a0c;     --k-type-head: #a87f08;    --k-type-bg: rgba(181,138,12,.08);
+  --k-namespace: #6f5ce6; --k-namespace-head: #6f5ce6; --k-namespace-bg: rgba(111,92,230,.07);
+  --k-statement: #64708a; --k-statement-head: #64708a; --k-statement-bg: rgba(100,112,138,.07);
+}
+.cc-world { position: absolute; left: 0; top: 0; transform-origin: 0 0; }
+.cc-root.cc-moving .cc-world { will-change: transform; }
+.cc-frame { position: absolute; border: 1px solid var(--cc-frame-border); background: var(--cc-frame-bg); border-radius: 18px; }
+.cc-frame-title { position: absolute; left: 20px; top: 12px; font: 600 15px/20px var(--cc-font, "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace); color: var(--cc-muted); white-space: nowrap; }
+.cc-empty { position: absolute; font-size: 15px; color: var(--cc-muted); white-space: nowrap; }
+
+.cc-block {
+  position: absolute; left: 0; top: 0; box-sizing: border-box; border-radius: 10px;
+  border: 1.5px solid var(--k); background: var(--kbg); overflow: hidden; contain: layout style;
+  cursor: default;
+}
+.cc-block.k-import { --k: var(--k-import); --kh: var(--k-import-head); --kbg: var(--k-import-bg); }
+.cc-block.k-class { --k: var(--k-class); --kh: var(--k-class-head); --kbg: var(--k-class-bg); }
+.cc-block.k-function { --k: var(--k-function); --kh: var(--k-function-head); --kbg: var(--k-function-bg); }
+.cc-block.k-variable { --k: var(--k-variable); --kh: var(--k-variable-head); --kbg: var(--k-variable-bg); }
+.cc-block.k-type { --k: var(--k-type); --kh: var(--k-type-head); --kbg: var(--k-type-bg); }
+.cc-block.k-namespace { --k: var(--k-namespace); --kh: var(--k-namespace-head); --kbg: var(--k-namespace-bg); }
+.cc-block.k-statement { --k: var(--k-statement); --kh: var(--k-statement-head); --kbg: var(--k-statement-bg); }
+.cc-block.k-import, .cc-root:not([data-theme="light"]) .cc-block.k-import { border-color: #555a63; }
+
+.cc-head {
+  display: flex; align-items: center; gap: 7px; height: 32px; padding: 0 10px; box-sizing: border-box;
+  background: var(--kh); color: #fff; white-space: nowrap; overflow: hidden;
+  font: 13px/32px var(--cc-font, "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace);
+}
+.cc-kind { font-size: 10px; text-transform: uppercase; letter-spacing: .06em; opacity: .75; flex: none; }
+.cc-name { font-weight: 700; flex: none; max-width: 70%; overflow: hidden; text-overflow: ellipsis; }
+.cc-detail { opacity: .8; overflow: hidden; text-overflow: ellipsis; min-width: 0; flex: 1 1 auto; }
+.cc-tags { font-size: 10px; opacity: .7; flex: none; }
+.cc-exp { width: 6px; height: 6px; border-radius: 50%; background: #fff; opacity: .8; flex: none; }
+.cc-fold {
+  flex: none; margin-left: auto; width: 22px; height: 22px; border: 0; border-radius: 6px; padding: 0;
+  background: rgba(255,255,255,.14); color: #fff; font-size: 12px; line-height: 22px; cursor: pointer;
+}
+.cc-fold:hover { background: rgba(255,255,255,.28); }
+.cc-prev {
+  margin: 0; padding: 5px 12px 0; white-space: pre; overflow: hidden; color: var(--cc-faint); opacity: .5;
+  font: 11px/15px var(--cc-font, "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace);
+}
+.cc-more { opacity: .7; font-style: italic; }
+.cc-mini { position: relative; margin: 6px 12px 0; height: 34px; opacity: .45; }
+.cc-mini > i { position: absolute; border-radius: 2px; border: 1px solid var(--cc-faint); background: rgba(255,255,255,.06); }
+.cc-mini > i.k-class { border-color: var(--k-class); } .cc-mini > i.k-function { border-color: var(--k-function); }
+.cc-mini > i.k-variable { border-color: var(--k-variable); } .cc-mini > i.k-type { border-color: var(--k-type); }
+
+.cc-err {
+  flex: none; min-width: 18px; height: 18px; padding: 0 5px; box-sizing: border-box; border-radius: 9px;
+  background: var(--cc-danger); color: #fff; font: 700 11px/18px ui-sans-serif, system-ui, sans-serif; text-align: center;
+}
+.cc-block.cc-has-error { border-color: var(--cc-danger); }
+.cc-root.lod-2 .cc-err { min-width: 34px; height: 34px; border-radius: 17px; font-size: 22px; line-height: 34px; }
+.cc-rename {
+  font: inherit; font-weight: 700; color: #fff; background: rgba(0,0,0,.35); border: 1px solid var(--cc-accent);
+  border-radius: 4px; padding: 0 4px; height: 22px; outline: none; user-select: text; -webkit-user-select: text; max-width: 100%;
+}
+.cc-rename.invalid { border-color: var(--cc-danger); }
+.cc-name:has(.cc-rename) { max-width: none; overflow: visible; }
+
+/* merge conflicts */
+.cc-block.cc-conflict { border-color: #f0883e; box-shadow: 0 0 0 2px rgba(240, 136, 62, .35); }
+.cc-conflict-chip {
+  flex: none; min-width: 18px; height: 18px; border-radius: 9px; background: #f0883e; color: #1b1300;
+  font: 900 13px/18px ui-sans-serif, system-ui, sans-serif; text-align: center;
+}
+.cc-root.lod-2 .cc-conflict-chip { min-width: 34px; height: 34px; border-radius: 17px; font-size: 24px; line-height: 34px; }
+.cc-block.cc-conflict-incoming {
+  --k: #f0883e; --kh: #8a4a17; --kbg: rgba(240, 136, 62, .08);
+  border-style: dashed; pointer-events: none; opacity: .9;
+}
+.cc-diff-chip.incoming { background: #f0883e; }
+.cc-banner.cc-banner-conflicts { border-color: #f0883e; }
+
+/* changes against a base version (setDiffBase) */
+.cc-block.cc-diff-unchanged { filter: saturate(.3) brightness(.92); }
+.cc-diff-chip {
+  flex: none; min-width: 18px; height: 18px; padding: 0 4px; box-sizing: border-box; border-radius: 5px;
+  font: 800 13px/18px ui-sans-serif, system-ui, sans-serif; text-align: center; color: #fff;
+}
+.cc-diff-chip.added { background: #2ea043; }
+.cc-diff-chip.changed { background: #d29922; }
+.cc-diff-chip.removed { background: var(--cc-danger); }
+.cc-root.lod-2 .cc-diff-chip { min-width: 34px; height: 34px; border-radius: 8px; font-size: 24px; line-height: 34px; }
+.cc-block.cc-diff-removed {
+  --k: var(--cc-danger); --kh: #9c2f2f; --kbg: rgba(255, 107, 107, .10);
+  border-style: dashed; pointer-events: none; opacity: .9;
+}
+.cc-root[data-theme="light"] .cc-block.cc-diff-removed { --kh: #d64545; --kbg: rgba(214, 69, 69, .08); }
+.cc-prev.cc-diff-prev { opacity: .95; }
+.cc-diff-prev > span { display: block; margin: 0 -12px; padding: 0 12px; }
+.cc-diff-prev .cc-line-same { opacity: .5; }
+.cc-diff-prev .cc-line-added { background: rgba(46, 160, 67, .30); }
+.cc-diff-prev .cc-line-removed { background: rgba(248, 81, 73, .26); text-decoration: line-through; text-decoration-color: rgba(248, 81, 73, .7); }
+.cc-diff-summary { padding: 0 8px; font-size: 12px; color: var(--cc-muted); white-space: nowrap; }
+
+.cc-block.cc-sel { box-shadow: 0 0 0 2px var(--cc-bg), 0 0 0 4px var(--k); }
+.cc-block.cc-editing { box-shadow: 0 0 0 2px var(--cc-bg), 0 0 0 4px var(--cc-accent); }
+.cc-block.cc-dragging { box-shadow: var(--cc-shadow); opacity: .92; z-index: 9999 !important; }
+.cc-root.has-hl .cc-block.cc-linked { box-shadow: 0 0 0 2px var(--k); }
+
+.cc-edges { position: absolute; left: 0; top: 0; overflow: visible; pointer-events: none; }
+.cc-edge { fill: none; stroke-width: 1.5; opacity: .22; }
+.cc-edge.u-type { stroke-dasharray: 4 4; }
+.cc-root.has-hl .cc-edge { opacity: .07; }
+.cc-root.has-hl .cc-edge.hl { opacity: .95; stroke-width: 2.5; }
+
+/* level of detail when zoomed out */
+.cc-root.lod-1 .cc-tags { visibility: hidden; }
+.cc-root.lod-2 .cc-prev, .cc-root.lod-2 .cc-detail, .cc-root.lod-2 .cc-mini { visibility: hidden; }
+.cc-root.lod-2 .cc-head { font-size: 26px; }
+.cc-root.lod-2 .cc-kind, .cc-root.lod-2 .cc-fold { display: none; }
+.cc-root.lod-2 .cc-frame-title { font-size: 40px; line-height: 44px; top: -8px; }
+
+/* overlays (screen space) */
+.cc-banner {
+  position: absolute; left: 50%; top: 12px; transform: translateX(-50%); z-index: 20; display: flex; gap: 10px; align-items: center;
+  padding: 8px 12px; border-radius: 10px; background: var(--cc-panel); border: 1px solid var(--cc-danger); box-shadow: var(--cc-shadow);
+  font-size: 13px; max-width: calc(100% - 32px);
+}
+.cc-banner[hidden], .cc-bar[hidden], .cc-refs[hidden] { display: none; }
+.cc-toast {
+  position: absolute; left: 50%; bottom: 76px; transform: translateX(-50%); z-index: 30; padding: 8px 14px; border-radius: 10px;
+  background: var(--cc-panel); border: 1px solid var(--cc-panel-border); box-shadow: var(--cc-shadow); font-size: 13px;
+  transition: opacity .2s; pointer-events: none; max-width: calc(100% - 32px);
+}
+.cc-bar {
+  position: absolute; left: 50%; bottom: 16px; transform: translateX(-50%); z-index: 20; display: flex; align-items: center; gap: 4px;
+  padding: 5px; border-radius: 12px; background: var(--cc-panel); border: 1px solid var(--cc-panel-border); box-shadow: var(--cc-shadow);
+  width: max-content; max-width: calc(100% - 24px); box-sizing: border-box; flex-wrap: wrap; justify-content: center;
+}
+.cc-bar .cc-chip { padding: 0 10px 0 6px; font: 600 12px/30px var(--cc-font, "JetBrains Mono", ui-monospace, Menlo, monospace); white-space: nowrap; display: flex; align-items: center; gap: 6px; max-width: 220px; overflow: hidden; text-overflow: ellipsis; }
+.cc-bar .cc-chip i { width: 10px; height: 10px; border-radius: 3px; background: var(--k); flex: none; }
+.cc-btn {
+  border: 0; background: transparent; color: var(--cc-text); font: 500 13px/30px inherit; font-family: inherit; padding: 0 10px; border-radius: 8px;
+  cursor: pointer; white-space: nowrap; min-height: 32px;
+}
+.cc-btn:hover { background: rgba(127,127,127,.16); }
+.cc-btn.danger { color: var(--cc-danger); }
+.cc-btn.primary { background: var(--cc-accent); color: #fff; }
+.cc-sep { width: 1px; height: 20px; background: var(--cc-panel-border); margin: 0 2px; flex: none; }
+.cc-refs {
+  position: absolute; left: 50%; bottom: 64px; transform: translateX(-50%); z-index: 21; width: min(360px, calc(100% - 24px)); max-height: 45%;
+  overflow: auto; border-radius: 12px; background: var(--cc-panel); border: 1px solid var(--cc-panel-border); box-shadow: var(--cc-shadow); padding: 6px;
+}
+.cc-refs h4 { margin: 8px 8px 4px; font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: var(--cc-muted); }
+.cc-refs button {
+  display: flex; width: 100%; align-items: center; gap: 8px; border: 0; background: transparent; color: var(--cc-text); text-align: left;
+  padding: 6px 8px; border-radius: 8px; cursor: pointer; font: 12px/18px var(--cc-font, "JetBrains Mono", ui-monospace, Menlo, monospace);
+}
+.cc-refs button:hover { background: rgba(127,127,127,.16); }
+.cc-refs button i { width: 10px; height: 10px; border-radius: 3px; background: var(--k); flex: none; }
+.cc-refs button span:last-child { margin-left: auto; color: var(--cc-muted); }
+.cc-refs button:disabled { cursor: default; opacity: .7; }
+.cc-refs button:disabled:hover { background: transparent; }
+.cc-refs .cc-file { color: var(--cc-muted); }
+.cc-refs .cc-error-row { --k: var(--cc-danger); align-items: flex-start; }
+.cc-refs .cc-error-row i { border-radius: 50%; margin-top: 4px; }
+.cc-refs .cc-error-row span:nth-child(2) { white-space: pre-wrap; font-family: ui-sans-serif, system-ui, sans-serif; }
+.cc-refs .cc-error-row span:last-child { white-space: nowrap; }
+.cc-refs .none { padding: 4px 8px 8px; color: var(--cc-muted); font-size: 12px; }
+
+.cc-editor {
+  position: absolute; z-index: 25; display: flex; flex-direction: column; border-radius: 12px; overflow: hidden;
+  background: var(--cc-panel); border: 1px solid var(--cc-panel-border); box-shadow: var(--cc-shadow);
+}
+.cc-editor-head { display: flex; align-items: center; gap: 8px; padding: 4px 6px 4px 12px; border-bottom: 1px solid var(--cc-panel-border); }
+.cc-editor-head .cc-chip { flex: 1; min-width: 0; font: 600 12px/30px var(--cc-font, "JetBrains Mono", ui-monospace, Menlo, monospace); display: flex; align-items: center; gap: 6px; overflow: hidden; white-space: nowrap; }
+.cc-editor-head .cc-chip i { width: 10px; height: 10px; border-radius: 3px; background: var(--k); flex: none; }
+.cc-editor-body { flex: 1; min-height: 0; overflow: auto; user-select: text; -webkit-user-select: text; touch-action: auto; }
+.cc-editor-hint { font-size: 11px; color: var(--cc-muted); white-space: nowrap; }
+@media (max-width: 640px) { .cc-editor-hint { display: none; } }
+`
+);
+var injected = false;
+function injectStyles(doc = document) {
+  if (injected) return;
+  injected = true;
+  const s = doc.createElement("style");
+  s.dataset.codecanvas = "";
+  s.textContent = CSS;
+  doc.head.appendChild(s);
+}
+
+// src/canvas.ts
+var KIND_LABEL = {
+  import: "import",
+  class: "class",
+  function: "fn",
+  variable: "var",
+  type: "type",
+  namespace: "ns",
+  statement: "code"
+};
+var DIFF_CHIPS = {
+  added: '<span class="cc-diff-chip added" title="Added">+</span>',
+  changed: '<span class="cc-diff-chip changed" title="Changed">~</span>',
+  removed: '<span class="cc-diff-chip removed" title="Removed">\u2212</span>',
+  incoming: '<span class="cc-diff-chip incoming" title="Incoming">+</span>',
+  containsChanges: "",
+  unchanged: ""
+};
+var LABEL_TAGS = /* @__PURE__ */ new Set(["const", "let", "var", "interface", "type", "enum", "namespace", "get", "set"]);
+var MIN_SCALE = 0.04;
+var MAX_SCALE = 4;
+var CodeCanvas = class {
+  constructor(container, opts) {
+    this.opts = opts;
+    this.project = opts.project ?? new Project();
+    injectStyles(container.ownerDocument);
+    const root = this.root = el("div", "cc-root");
+    root.tabIndex = 0;
+    root.dataset.theme = opts.theme ?? "dark";
+    this.world = el("div", "cc-world");
+    this.frameEl = el("div", "cc-frame");
+    this.blocksEl = el("div", "cc-blocks");
+    this.svg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
+    this.svg.classList.add("cc-edges");
+    setHTML(this.svg, `<defs>${["import", "class", "function", "variable", "type", "namespace", "statement"].map(
+      (k) => `<marker id="cc-arrow-${k}" viewBox="0 0 10 10" refX="9" refY="5" markerWidth="7" markerHeight="7" orient="auto-start-reverse"><path d="M0 0L10 5L0 10z" fill="var(--k-${k})"/></marker>`
+    ).join("")}</defs>`);
+    this.world.append(this.frameEl, this.blocksEl, this.svg);
+    this.banner = el("div", "cc-banner");
+    this.banner.hidden = true;
+    this.toastEl = el("div", "cc-toast");
+    this.toastEl.style.opacity = "0";
+    this.bar = el("div", "cc-bar");
+    this.refsEl = el("div", "cc-refs");
+    this.refsEl.hidden = true;
+    root.append(this.world, this.banner, this.refsEl, this.bar, this.toastEl);
+    container.appendChild(root);
+    this.bindEvents();
+    this.ro = new ResizeObserver(() => this.fittedToView ? this.fit(false) : this.queueCamera());
+    this.ro.observe(root);
+    this.barObserver = new ResizeObserver(([entry]) => {
+      const barTop = entry.borderBoxSize?.[0]?.blockSize ?? this.bar.offsetHeight;
+      this.refsEl.style.bottom = barTop + 28 + "px";
+      this.toastEl.style.bottom = barTop + 40 + "px";
+    });
+    this.barObserver.observe(this.bar);
+    this.renderBar();
+  }
+  opts;
+  root;
+  world;
+  frameEl;
+  blocksEl;
+  svg;
+  bar;
+  refsEl;
+  banner;
+  toastEl;
+  path = "";
+  text = "";
+  /** Latest parse. */
+  model = null;
+  /** What's on screen: the latest parse without syntax errors. */
+  view = null;
+  layout = emptyLayout();
+  geom = null;
+  hints = {};
+  cam = { x: 0, y: 0, s: 1 };
+  camQueued = false;
+  movingTimer = 0;
+  anim = 0;
+  lod = -1;
+  /** The camera still shows the whole file as `fit` left it: resizing the view fits it again. */
+  fittedToView = false;
+  els = /* @__PURE__ */ new Map();
+  edges = [];
+  selected = null;
+  hovered = null;
+  refsOpen = false;
+  project;
+  /** Errors on screen: type errors from the last resolve, or syntax errors mapped onto the last good view. */
+  diagnostics = [];
+  incomingUsages = [];
+  /** The version changes are shown against (`setDiffBase`), and its geometry, computed once. */
+  diffBase = null;
+  diffCache = null;
+  /** Merge conflicts in the text. The canvas then shows its current side, marking the blocks they touch. */
+  conflicts = null;
+  ghostBlockEls = { removed: [], incoming: [] };
+  /** Errors from the host (`setDiagnostics`), shown instead of the project's type errors. */
+  hostDiagnostics = null;
+  renaming = null;
+  /** The layout before the last Arrange, until the next layout change: Undo arrange puts it back. */
+  layoutBeforeArrange = null;
+  /** Where the camera was before the block editor moved it out of the way, and where it moved it to. */
+  cameraBeforeEditor = null;
+  editing = null;
+  clip = null;
+  pointers = /* @__PURE__ */ new Map();
+  gesture = null;
+  lastTap = { t: 0, x: 0, y: 0, id: "" };
+  lastPointer = null;
+  toastTimer = 0;
+  ro;
+  barObserver;
+  cleanup = [];
+  // ---------------------------------------------------------------- public API
+  /** Show a file. Fits it to the view. */
+  openFile(path, text, layout) {
+    this.closeEditor();
+    this.path = path;
+    this.text = text;
+    this.layout = layout ? structuredClone(layout) : emptyLayout();
+    this.model = this.view = null;
+    this.selected = this.hovered = null;
+    this.refsOpen = false;
+    this.renaming = null;
+    this.diagnostics = [];
+    this.hostDiagnostics = null;
+    this.diffBase = null;
+    this.diffCache = null;
+    this.conflicts = null;
+    this.layoutBeforeArrange = null;
+    this.incomingUsages = [];
+    this.hints = {};
+    for (const { el: el2 } of this.els.values()) el2.remove();
+    this.els.clear();
+    this.parseNow();
+    this.fit(false);
+    this.renderBar();
+  }
+  /** The text changed outside the canvas (e.g. the text editor). */
+  setText(text) {
+    if (text === this.text) return;
+    const isEditedByOpenEditor = !!this.editing?.handle.editsFile;
+    if (isEditedByOpenEditor) this.followEditedRange(this.text, text);
+    else if (this.editing) this.closeEditor();
+    this.cancelRename();
+    this.text = text;
+    this.parseNow();
+  }
+  /**
+   * Show the changes since a base version of the file (e.g. the last commit): unchanged blocks are
+   * desaturated, added and changed ones get a chip, removed ones show in red where they were.
+   * `layout` is the base version's saved layout, for placing removed blocks. Null hides the changes.
+   */
+  setDiffBase(base) {
+    this.diffBase = base ? { model: parseStructure(this.path, base.text), layout: base.layout ?? null } : null;
+    this.diffCache = null;
+    this.render();
+    this.renderBar();
+  }
+  get isShowingChanges() {
+    return !!this.diffBase;
+  }
+  conflictsOf(hunks, current, currentModel) {
+    const incoming = conflictSideText(this.text, hunks, "incoming");
+    const incomingModel = parseStructure(this.path, incoming.text);
+    const hunksByBlock = /* @__PURE__ */ new Map();
+    const markTouched = (id, hunkIndex) => {
+      const list = hunksByBlock.get(id) ?? [];
+      if (!list.includes(hunkIndex)) list.push(hunkIndex);
+      hunksByBlock.set(id, list);
+    };
+    const incomingOnly = [];
+    hunks.forEach((_, hunkIndex) => {
+      for (const block of innermostBlocksTouching(currentModel, current.hunkRanges[hunkIndex])) markTouched(block.id, hunkIndex);
+      for (const block of innermostBlocksTouching(incomingModel, incoming.hunkRanges[hunkIndex])) {
+        let outermostNew = currentModel.blocks.has(block.id) ? void 0 : block;
+        while (outermostNew?.parentId && !currentModel.blocks.has(outermostNew.parentId)) outermostNew = incomingModel.blocks.get(outermostNew.parentId);
+        if (!outermostNew) markTouched(block.id, hunkIndex);
+        else if (!incomingOnly.includes(outermostNew)) incomingOnly.push(outermostNew);
+      }
+    });
+    return { hunks, current, incomingModel, hunksByBlock, incomingOnly };
+  }
+  /** Resolve the conflicts that touch a block: their sections become the chosen side. */
+  keepConflictSide(id, choice) {
+    const conflicts = this.conflicts;
+    const hunkIndexes = conflicts?.hunksByBlock.get(id);
+    if (!conflicts || !hunkIndexes) return;
+    const edits = hunkIndexes.map((index) => resolveConflict(this.text, conflicts.hunks[index], choice));
+    this.commit(applyEdits(this.text, edits));
+    const remaining = this.conflicts?.hunks.length ?? 0;
+    this.toast(remaining ? `Resolved. ${plural(remaining, "conflict")} left` : "All conflicts in this file are resolved");
+  }
+  /** While changes are shown: the block's code in the base version, '' if it's new. */
+  baseCodeOf(block) {
+    const diff = this.currentDiff();
+    if (!diff || !block) return void 0;
+    const baseBlock = diff.base.blocks.get(block.id);
+    return baseBlock ? diff.base.text.slice(baseBlock.start, baseBlock.end) : "";
+  }
+  /** The changes of what's on screen, while a diff base is set. */
+  currentDiff() {
+    if (!this.diffBase || !this.view) return null;
+    if (this.diffCache?.view !== this.view) this.diffCache = { view: this.view, diff: diffModels(this.diffBase.model, this.view) };
+    return this.diffCache.diff;
+  }
+  /**
+   * Errors reported by the host, e.g. VS Code's Problems. While set, the canvas shows these instead of
+   * resolving type errors itself. Pass null to go back to the project's own.
+   */
+  setDiagnostics(diagnostics) {
+    this.hostDiagnostics = diagnostics;
+    if (!this.view || this.stale || this.conflicts) return;
+    this.diagnostics = this.hostDiagnosticsOnBlocks(this.view);
+    this.updateErrorMarkers();
+    this.renderBar();
+  }
+  setLayout(layout) {
+    this.layout = structuredClone(layout);
+    this.relayout();
+  }
+  getLayout() {
+    return structuredClone(this.layout);
+  }
+  getModel() {
+    return this.model;
+  }
+  /** Re-resolve usages and errors, e.g. after other files of the project changed. */
+  refreshProject() {
+    if (this.view && !this.stale) this.scheduleUsages(this.view, true);
+  }
+  getDiagnostics() {
+    return [...this.diagnostics];
+  }
+  setTheme(theme) {
+    this.root.dataset.theme = theme;
+  }
+  get scale() {
+    return this.cam.s;
+  }
+  /** Lay the whole file out again by the layout rules (layoutRules.ts), forgetting saved positions. */
+  arrange() {
+    if (!this.view) return;
+    const before = structuredClone(this.layout);
+    this.layout = { ...emptyLayout(), collapsed: this.layout.collapsed };
+    this.hints = {};
+    this.relayout();
+    this.emitLayout("user");
+    this.layoutBeforeArrange = before;
+    this.fit();
+    this.renderBar();
+  }
+  undoArrange() {
+    const before = this.layoutBeforeArrange;
+    if (!before) return;
+    this.layout = before;
+    this.relayout();
+    this.emitLayout("user");
+    this.fit();
+    this.renderBar();
+  }
+  /** Fit the whole file in the view. */
+  fit(animate = true) {
+    if (!this.geom) return;
+    const f = this.geom.frame;
+    const { width: vw, height: vh } = this.root.getBoundingClientRect();
+    if (!vw || !vh) {
+      requestAnimationFrame(() => this.root.isConnected && this.fit(animate));
+      return;
+    }
+    const pad = 24;
+    const bottom = 64;
+    const s = clamp2(Math.min((vw - pad * 2) / f.w, (vh - pad - bottom) / f.h, 1.1), MIN_SCALE, MAX_SCALE);
+    const to = { s, x: (vw - f.w * s) / 2 - f.x * s, y: pad + (vh - pad - bottom - f.h * s) / 2 - f.y * s };
+    this.moveCamera(to, animate);
+    this.fittedToView = true;
+  }
+  zoomBy(factor) {
+    const r = this.root.getBoundingClientRect();
+    this.zoomAt({ x: r.width / 2, y: r.height / 2 }, factor, true);
+  }
+  /** Center a block and select it. */
+  reveal(id) {
+    const g = this.geom?.geo.get(id);
+    if (!g) return;
+    this.select(id);
+    const { width: vw, height: vh } = this.root.getBoundingClientRect();
+    const s = clamp2(Math.min(Math.max(this.cam.s, 0.85), (vw - 80) / g.w, (vh - 160) / g.h), MIN_SCALE, 1.4);
+    this.moveCamera({ s, x: vw / 2 - (g.ax + g.w / 2) * s, y: (vh - 60) / 2 - (g.ay + g.h / 2) * s }, true);
+  }
+  select(id) {
+    if (id === this.selected) return;
+    this.selected = id;
+    if (!id) this.refsOpen = false;
+    this.updateHighlight();
+    this.renderBar();
+    this.opts.onSelect?.(id && this.view?.blocks.get(id) || null);
+  }
+  destroy() {
+    this.closeEditor();
+    this.ro.disconnect();
+    this.barObserver.disconnect();
+    for (const c of this.cleanup) c();
+    this.root.remove();
+  }
+  // ---------------------------------------------------------------- model
+  usageTimer = 0;
+  parseNow() {
+    const hunks = this.text.includes("<<<<<<<") ? findConflicts(this.text) : [];
+    const currentSide = hunks.length ? conflictSideText(this.text, hunks, "current") : null;
+    const m = currentSide ? parseStructure(this.path, currentSide.text, this.model) : this.project.setFile(this.path, this.text);
+    this.model = m;
+    this.conflicts = currentSide ? this.conflictsOf(hunks, currentSide, m) : null;
+    const stale = m.syntaxErrors > 0 && this.view !== null;
+    if (this.conflicts) this.diagnostics = [];
+    else if (stale) this.diagnostics = this.syntaxDiagnosticsOnView(m);
+    else if (m.syntaxErrors) this.diagnostics = m.diagnostics;
+    else if (this.hostDiagnostics) this.diagnostics = this.hostDiagnosticsOnBlocks(m);
+    else this.diagnostics = this.diagnostics.filter((d) => !d.blockId || m.blocks.has(d.blockId));
+    if (!stale) {
+      if (this.view) m.usages = this.view.usages.filter((u) => m.blocks.has(u.from) && m.blocks.has(u.to));
+      if (carryRenames(this.view, m, this.layout)) this.emitLayout("automatic");
+      this.view = m;
+      if (this.selected && !m.blocks.has(this.selected)) this.selected = null;
+      if (this.editing) {
+        const b = [...m.blocks.values()].find((x) => x.start === this.editing.start);
+        this.editing.id = b?.id ?? null;
+        if (b && this.selected !== b.id) this.selected = b.id;
+      }
+      this.relayout();
+      if (!this.conflicts) this.scheduleUsages(m);
+    }
+    const isShowingConflicts = !!this.conflicts && !stale;
+    this.banner.hidden = !stale && !isShowingConflicts;
+    this.banner.classList.toggle("cc-banner-conflicts", isShowingConflicts);
+    if (isShowingConflicts) {
+      setHTML(this.banner, `<span>${plural(this.conflicts.hunks.length, "merge conflict")} in this file. Select a block marked ! to keep a side, or edit it.</span>`);
+    } else if (stale) {
+      this.updateErrorMarkers();
+      setHTML(this.banner, `<span>Syntax error on line ${m.firstErrorLine}. The diagram is paused until it's fixed.</span>`);
+      if (!this.editing) {
+        const b = button("Edit file", () => this.openRangeEditor(0, this.text.length, null), "primary");
+        this.banner.appendChild(b);
+      }
+    }
+    this.renderBar();
+  }
+  /** Usage links and type errors go through the project's language service: only once typing pauses. */
+  scheduleUsages(m, soon = false) {
+    clearTimeout(this.usageTimer);
+    const run = async () => {
+      if (this.view !== m) return;
+      const resolution = await this.project.resolve(this.path, { diagnostics: !this.hostDiagnostics });
+      if (this.view !== m) return;
+      m.usages = resolution.usages;
+      this.incomingUsages = resolution.incoming;
+      this.diagnostics = this.hostDiagnostics ? this.hostDiagnosticsOnBlocks(m) : resolution.diagnostics;
+      if (!this.geom) return;
+      this.renderEdges();
+      this.updateHighlight();
+      this.updateErrorMarkers();
+      this.renderBar();
+    };
+    const pauseMs = soon ? 0 : m.text.length < 2e4 ? 30 : 180;
+    this.usageTimer = window.setTimeout(() => void run(), pauseMs);
+  }
+  hostDiagnosticsOnBlocks(model) {
+    return (this.hostDiagnostics ?? []).map((d) => ({ ...d, blockId: blockAt(model, d.start)?.id ?? null }));
+  }
+  /** The text changed while an editor on the file is open: keep tracking the part of the file it shows. */
+  followEditedRange(before, after) {
+    const editing = this.editing;
+    const change = changedRegion2(before, after);
+    const lengthChange = after.length - before.length;
+    const isBeforeEditedRange = change.end <= editing.start && change.start < editing.start;
+    const isInsideEditedRange = change.start >= editing.start && change.start <= editing.start + editing.len;
+    if (isBeforeEditedRange) editing.start += lengthChange;
+    else if (isInsideEditedRange) editing.len = Math.max(0, editing.len + lengthChange);
+  }
+  /** While the syntax is broken the last good view stays on screen: put its errors on the closest block it still has. */
+  syntaxDiagnosticsOnView(model) {
+    const closestShownBlock = (id) => {
+      let current = id;
+      while (current && !this.view?.blocks.has(current)) current = model.blocks.get(current)?.parentId ?? null;
+      return current;
+    };
+    return model.diagnostics.map((d) => ({ ...d, blockId: closestShownBlock(d.blockId) }));
+  }
+  get stale() {
+    return !!this.model && this.model !== this.view;
+  }
+  /** Apply a text edit made on the canvas. */
+  commit(text, otherFiles) {
+    this.text = text;
+    this.opts.onTextChange(text, otherFiles);
+    this.parseNow();
+  }
+  relayout() {
+    if (!this.view) return;
+    const g = computeGeometry(this.view, this.layout, this.hints);
+    this.geom = g;
+    const assigned = Object.keys(g.assigned);
+    if (assigned.length) {
+      const isPlacedByUser = assigned.some((id) => id in this.hints);
+      for (const id of assigned) {
+        this.layout.blocks[id] = g.assigned[id];
+        delete this.hints[id];
+      }
+      this.emitLayout(isPlacedByUser ? "user" : "automatic");
+    }
+    this.render();
+  }
+  emitLayout(reason) {
+    if (reason === "user") this.layoutBeforeArrange = null;
+    this.opts.onLayoutChange(structuredClone(this.layout), reason);
+  }
+  // ---------------------------------------------------------------- rendering
+  render() {
+    const g = this.geom;
+    const view = this.view;
+    if (!g || !view) return;
+    const f = g.frame;
+    Object.assign(this.frameEl.style, { transform: `translate(${f.x}px,${f.y}px)`, width: f.w + "px", height: f.h + "px" });
+    setHTML(this.frameEl, `<div class="cc-frame-title">${esc(this.path)}</div>${view.roots.length ? "" : `<div class="cc-empty" style="left:${M.filePad}px;top:${M.filePad + M.fileHeader}px">Empty file. Double-click (or double-tap) to create a function.</div>`}`);
+    const seen = /* @__PURE__ */ new Set();
+    const diff = this.currentDiff();
+    for (const geo of g.order) {
+      const id = geo.id;
+      seen.add(id);
+      let entry = this.els.get(id);
+      if (geo.hidden) {
+        if (entry) entry.el.style.display = "none";
+        continue;
+      }
+      if (!entry) {
+        const e = el("div", "cc-block");
+        e.dataset.id = id;
+        this.blocksEl.appendChild(e);
+        entry = { el: e, sig: "", box: "" };
+        this.els.set(id, entry);
+      }
+      const b = geo.block;
+      const mini = geo.collapsed ? this.miniMap(geo) : "";
+      const change = diff?.changes.get(id);
+      const changedLines = change === "changed" ? this.changedLinesPreview(diff, b) : "";
+      const isConflicted = !!this.conflicts?.hunksByBlock.has(id);
+      const sig = `${b.kind}|${b.name}|${b.detail}|${b.tags.join()}|${b.preview.join("\n")}|${b.previewMore}|${geo.collapsed}|${b.children.length}|${mini}|${change ?? ""}|${changedLines}|${isConflicted}`;
+      if (sig !== entry.sig) {
+        entry.sig = sig;
+        entry.el.className = `cc-block k-${b.kind}${change ? ` cc-diff-${change}` : ""}${isConflicted ? " cc-conflict" : ""}`;
+        setHTML(entry.el, this.blockHTML(b, geo, mini, change, changedLines, isConflicted));
+      }
+      const box = `${geo.ax},${geo.ay},${geo.w},${geo.h},${b.depth}`;
+      if (box !== entry.box) {
+        entry.box = box;
+        const s = entry.el.style;
+        s.transform = `translate(${geo.ax}px,${geo.ay}px)`;
+        s.width = geo.w + "px";
+        s.height = geo.h + "px";
+        s.zIndex = String(b.depth + 1);
+        s.display = "";
+      }
+    }
+    for (const [id, entry] of this.els) {
+      if (!seen.has(id)) {
+        entry.el.remove();
+        this.els.delete(id);
+      }
+    }
+    this.renderRemovedBlocks(diff);
+    this.renderIncomingBlocks();
+    this.renderEdges();
+    this.updateHighlight();
+    this.updateErrorMarkers();
+  }
+  /** Blocks only the incoming side of a conflict has, drawn dashed where they would go. */
+  renderIncomingBlocks() {
+    const conflicts = this.conflicts;
+    if (!conflicts?.incomingOnly.length || !this.geom) return this.drawGhostBlocks("incoming", [], null);
+    conflicts.geometry ??= computeGeometry(conflicts.incomingModel, this.layout, {}, { resolveOverlaps: false });
+    this.drawGhostBlocks("incoming", conflicts.incomingOnly, conflicts.geometry);
+  }
+  /** A changed block's preview: its changed lines with a line of context, as many as fit. */
+  changedLinesPreview(diff, block) {
+    const lines = diffOwnCode(diff.base, diff.base.blocks.get(block.id), this.view, block);
+    const fitting = Math.max(1, block.preview.length);
+    const preview = diffPreview(lines, fitting);
+    const marker = { same: " ", added: "+", removed: "\u2212" };
+    const sharedIndent = Math.min(...preview.lines.map((line) => /^ */.exec(line.text)[0].length));
+    const rows = preview.lines.map((line) => `<span class="cc-line-${line.kind}">${marker[line.kind]} ${esc(line.text.slice(sharedIndent))}</span>`);
+    const more = preview.more ? `<span class="cc-more">\u2026 ${preview.more} more changed line${preview.more > 1 ? "s" : ""}</span>` : "";
+    return rows.join("") + more;
+  }
+  /** Removed blocks stay visible, in red, where they were in the base version. They can't be selected. */
+  renderRemovedBlocks(diff) {
+    if (!diff?.removed.length || !this.diffBase || !this.geom) return this.drawGhostBlocks("removed", [], null);
+    this.diffBase.geometry ??= computeGeometry(diff.base, this.diffBase.layout ?? this.layout, {}, { resolveOverlaps: false });
+    this.drawGhostBlocks("removed", diff.removed, this.diffBase.geometry);
+  }
+  /** Blocks of another version (removed, or incoming in a conflict): drawn, but not part of this file. */
+  drawGhostBlocks(kind, ghosts, ghostGeometry) {
+    for (const ghostEl of this.ghostBlockEls[kind]) ghostEl.remove();
+    this.ghostBlockEls[kind] = [];
+    if (!ghostGeometry || !this.geom || !this.view) return;
+    const positions = placeGhostBlocks(ghosts, ghostGeometry, this.view, this.geom);
+    for (const block of ghosts) {
+      const position = positions.get(block.id);
+      const ghostGeo = ghostGeometry.geo.get(block.id);
+      if (!position || !ghostGeo) continue;
+      const ghostEl = el("div", `cc-block k-${block.kind} ${kind === "removed" ? "cc-diff-removed" : "cc-conflict-incoming"}`);
+      setHTML(ghostEl, this.blockHTML(block, { ...ghostGeo, collapsed: true }, "", kind));
+      Object.assign(ghostEl.style, { transform: `translate(${position.x}px,${position.y}px)`, width: ghostGeo.w + "px", height: ghostGeo.h + "px", zIndex: String(block.depth + 1) });
+      ghostEl.title = kind === "removed" ? `${block.name}: removed` : `${block.name}: only in the incoming side of a merge conflict`;
+      this.blocksEl.appendChild(ghostEl);
+      this.ghostBlockEls[kind].push(ghostEl);
+    }
+  }
+  /** Diagnostics grouped by the block that shows them: the innermost visible block containing each error. */
+  diagnosticsByShownBlock() {
+    const byBlock = /* @__PURE__ */ new Map();
+    const geometry = this.geom;
+    if (!geometry) return byBlock;
+    for (const d of this.diagnostics) {
+      let geo = d.blockId ? geometry.geo.get(d.blockId) : void 0;
+      while (geo?.hidden && geo.block.parentId) geo = geometry.geo.get(geo.block.parentId);
+      if (!geo) continue;
+      const list = byBlock.get(geo.id);
+      if (list) list.push(d);
+      else byBlock.set(geo.id, [d]);
+    }
+    return byBlock;
+  }
+  updateErrorMarkers() {
+    const byBlock = this.diagnosticsByShownBlock();
+    for (const [id, { el: blockEl }] of this.els) {
+      const list = byBlock.get(id);
+      const head = blockEl.querySelector(".cc-head");
+      let badge = head?.querySelector(".cc-err") ?? null;
+      blockEl.classList.toggle("cc-has-error", !!list);
+      if (!list) {
+        badge?.remove();
+        continue;
+      }
+      if (!badge && head) {
+        badge = el("span", "cc-err");
+        head.insertBefore(badge, head.querySelector(".cc-fold"));
+      }
+      if (!badge) continue;
+      badge.textContent = String(list.length);
+      badge.title = list.map((d) => `Line ${d.line}: ${d.message}`).join("\n");
+    }
+  }
+  blockHTML(b, geo, mini, change, changedLines = "", isConflicted = false) {
+    const label = blockLabel(b);
+    const tags = b.tags.filter((t) => t !== label && t !== "export" && (b.kind === "import" || !LABEL_TAGS.has(t))).join(" ");
+    const exp = b.tags.includes("export") ? '<span class="cc-exp" title="exported"></span>' : "";
+    const isRemoved = change === "removed" || change === "incoming";
+    const fold = b.children.length && !isRemoved ? `<button class="cc-fold" title="${geo.collapsed ? "Expand" : "Collapse"}">${geo.collapsed ? "\u25B8" : "\u25BE"}</button>` : "";
+    const prev = changedLines ? `<pre class="cc-prev cc-diff-prev">${changedLines}</pre>` : b.preview.length ? `<pre class="cc-prev">${esc(b.preview.join("\n"))}${b.previewMore ? `
+<span class="cc-more">\u2026 ${b.previewMore} more line${b.previewMore > 1 ? "s" : ""}</span>` : ""}</pre>` : "";
+    const diffChip = (change ? DIFF_CHIPS[change] : "") + (isConflicted ? '<span class="cc-conflict-chip" title="Merge conflict">!</span>' : "");
+    return `<div class="cc-head"><span class="cc-kind">${esc(label)}</span>${exp}<span class="cc-name">${esc(b.name)}</span>${diffChip}<span class="cc-detail">${esc(
+      b.detail
+    )}</span>${tags ? `<span class="cc-tags">${esc(tags)}</span>` : ""}${fold}</div>${prev}${mini ? `<div class="cc-mini">${mini}</div>` : ""}`;
+  }
+  /** Faint miniature of a collapsed block's nested blocks. */
+  miniMap(geo) {
+    const kids = geo.block.children.map((c) => this.geom.geo.get(c.id));
+    const right = Math.max(...kids.map((k) => k.x + k.w));
+    const bottom = Math.max(...kids.map((k) => k.y + k.h));
+    const bw = geo.w - 24;
+    const bh = 34;
+    const s = Math.min(bw / right, bh / bottom);
+    return kids.map(
+      (k) => `<i class="k-${k.block.kind}" style="left:${(k.x * s).toFixed(1)}px;top:${(k.y * s).toFixed(1)}px;width:${Math.max(2, k.w * s).toFixed(1)}px;height:${Math.max(
+        2,
+        k.h * s
+      ).toFixed(1)}px"></i>`
+    ).join("");
+  }
+  renderEdges() {
+    const g = this.geom;
+    const view = this.view;
+    const visible = (id) => {
+      let geo = g.geo.get(id);
+      while (geo?.hidden && geo.block.parentId) geo = g.geo.get(geo.block.parentId);
+      return geo;
+    };
+    const want = /* @__PURE__ */ new Map();
+    for (const u of view.usages) {
+      if (u.toPath) continue;
+      const a = visible(u.from);
+      const b = visible(u.to);
+      if (!a || !b || a === b) continue;
+      if (a.id.startsWith(b.id + "/") || b.id.startsWith(a.id + "/")) continue;
+      const key = `${a.id}>${b.id}`;
+      if (!want.has(key)) want.set(key, { from: a, to: b, kind: b.block.kind, usage: u.kind, uf: u.from, ut: u.to });
+    }
+    const old = new Map(this.edges.map((e) => [e.key, e]));
+    const next = [];
+    for (const [key, w] of want) {
+      let e = old.get(key);
+      if (e) old.delete(key);
+      else {
+        const p = document.createElementNS("http://www.w3.org/2000/svg", "path");
+        this.svg.appendChild(p);
+        e = { key, from: w.from.id, to: w.to.id, el: p };
+      }
+      e.el.setAttribute("class", `cc-edge u-${w.usage}`);
+      e.el.setAttribute("stroke", `var(--k-${w.kind})`);
+      e.el.setAttribute("marker-end", `url(#cc-arrow-${w.kind})`);
+      e.el.setAttribute("d", edgePath(w.from, w.to));
+      next.push(e);
+    }
+    for (const e of old.values()) e.el.remove();
+    this.edges = next;
+  }
+  updateHighlight() {
+    const h = this.selected ?? this.hovered;
+    const inH = (id) => !!h && (id === h || id.startsWith(h + "/"));
+    const linked = /* @__PURE__ */ new Set();
+    for (const e of this.edges) {
+      const on = inH(e.from) || inH(e.to);
+      e.el.classList.toggle("hl", on);
+      if (on) {
+        linked.add(e.from);
+        linked.add(e.to);
+      }
+    }
+    this.root.classList.toggle("has-hl", !!h);
+    for (const [id, { el: e }] of this.els) {
+      e.classList.toggle("cc-sel", id === this.selected);
+      e.classList.toggle("cc-linked", linked.has(id) && !inH(id));
+      e.classList.toggle("cc-editing", !!this.editing && id === this.editing.id);
+    }
+    if (this.refsOpen) this.renderRefs();
+  }
+  // ---------------------------------------------------------------- camera
+  queueCamera() {
+    if (this.camQueued) return;
+    this.camQueued = true;
+    requestAnimationFrame(() => {
+      this.camQueued = false;
+      this.applyCamera();
+    });
+  }
+  applyCamera() {
+    const { x, y, s } = this.cam;
+    this.world.style.transform = `translate(${x}px,${y}px) scale(${s})`;
+    const grid = 24 * s;
+    this.root.style.backgroundSize = s < 0.25 ? "0 0" : `${grid}px ${grid}px`;
+    this.root.style.backgroundPosition = `${x}px ${y}px`;
+    const lod = s < 0.3 ? 2 : s < 0.55 ? 1 : 0;
+    if (lod !== this.lod) {
+      this.lod = lod;
+      this.root.classList.toggle("lod-1", lod >= 1);
+      this.root.classList.toggle("lod-2", lod >= 2);
+    }
+    this.root.classList.add("cc-moving");
+    clearTimeout(this.movingTimer);
+    this.movingTimer = window.setTimeout(() => this.root.classList.remove("cc-moving"), 160);
+    this.opts.onCameraChange?.(s);
+  }
+  setCamera(c) {
+    this.fittedToView = false;
+    cancelAnimationFrame(this.anim);
+    this.cam = { x: c.x, y: c.y, s: clamp2(c.s, MIN_SCALE, MAX_SCALE) };
+    this.queueCamera();
+  }
+  moveCamera(to, animate) {
+    this.fittedToView = false;
+    cancelAnimationFrame(this.anim);
+    if (!animate || matchMedia("(prefers-reduced-motion: reduce)").matches) {
+      this.setCamera(to);
+      return;
+    }
+    const from = { ...this.cam };
+    const t0 = performance.now();
+    const dur = 280;
+    const step = (now) => {
+      const k = Math.min(1, (now - t0) / dur);
+      const e = 1 - Math.pow(1 - k, 3);
+      const s = Math.exp(Math.log(from.s) + (Math.log(to.s) - Math.log(from.s)) * e);
+      this.cam = { s, x: from.x + (to.x - from.x) * e, y: from.y + (to.y - from.y) * e };
+      this.applyCamera();
+      if (k < 1) this.anim = requestAnimationFrame(step);
+    };
+    this.anim = requestAnimationFrame(step);
+  }
+  zoomAt(p, factor, animate = false) {
+    const s = clamp2(this.cam.s * factor, MIN_SCALE, MAX_SCALE);
+    const wx = (p.x - this.cam.x) / this.cam.s;
+    const wy = (p.y - this.cam.y) / this.cam.s;
+    this.moveCamera({ s, x: p.x - wx * s, y: p.y - wy * s }, animate);
+  }
+  toWorld(clientX, clientY) {
+    const r = this.root.getBoundingClientRect();
+    return { x: (clientX - r.left - this.cam.x) / this.cam.s, y: (clientY - r.top - this.cam.y) / this.cam.s };
+  }
+  local(e) {
+    const r = this.root.getBoundingClientRect();
+    return { x: e.clientX - r.left, y: e.clientY - r.top };
+  }
+  // ---------------------------------------------------------------- hit testing
+  /** What's under a world point: a block (header or leaf), or empty space inside a container/the file. */
+  hitTest(p) {
+    const g = this.geom;
+    if (!g) return { block: null, container: null };
+    let hit = null;
+    for (let i = g.order.length - 1; i >= 0; i--) {
+      const geo = g.order[i];
+      if (geo.hidden) continue;
+      if (p.x >= geo.ax && p.x <= geo.ax + geo.w && p.y >= geo.ay && p.y <= geo.ay + geo.h) {
+        if (!hit || geo.block.depth > hit.block.depth) hit = geo;
+      }
+    }
+    if (!hit) return { block: null, container: null };
+    const hasKids = hit.block.children.length > 0 && !hit.collapsed;
+    if (hasKids && p.y > hit.ay + hit.contentTop) return { block: null, container: hit.id };
+    return { block: hit.id, container: hit.block.parentId };
+  }
+  // ---------------------------------------------------------------- events
+  bindEvents() {
+    const r = this.root;
+    const on = (t, type, fn, o) => {
+      t.addEventListener(type, fn, o);
+      this.cleanup.push(() => t.removeEventListener(type, fn, o));
+    };
+    on(r, "pointerdown", (e) => this.onDown(e));
+    on(r, "pointermove", (e) => this.onMove(e));
+    on(r, "pointerup", (e) => this.onUp(e));
+    on(r, "pointercancel", (e) => this.onUp(e, true));
+    on(r, "wheel", (e) => this.onWheel(e), { passive: false });
+    on(r, "keydown", (e) => this.onKey(e));
+    on(r, "pointerover", (e) => {
+      if (e.pointerType !== "mouse" || this.gesture) return;
+      const id = e.target.closest?.(".cc-block")?.getAttribute("data-id") ?? null;
+      if (id !== this.hovered) {
+        this.hovered = id;
+        this.updateHighlight();
+      }
+    });
+    on(r, "pointerleave", () => {
+      if (this.hovered) {
+        this.hovered = null;
+        this.updateHighlight();
+      }
+    });
+    on(r, "gesturestart", (e) => e.preventDefault());
+    const doc = r.ownerDocument;
+    on(doc, "copy", (e) => this.onClipboard(e, "copy"));
+    on(doc, "cut", (e) => this.onClipboard(e, "cut"));
+    on(doc, "paste", (e) => this.onClipboard(e, "paste"));
+  }
+  isOverlay(t) {
+    return !!t?.closest?.(".cc-editor, .cc-bar, .cc-refs, .cc-banner, .cc-rename");
+  }
+  onDown(e) {
+    if (this.isOverlay(e.target)) return;
+    if (e.pointerType === "mouse" && e.button !== 0 && e.button !== 1) return;
+    this.root.focus({ preventScroll: true });
+    this.root.setPointerCapture(e.pointerId);
+    this.pointers.set(e.pointerId, this.local(e));
+    if (this.pointers.size === 2) {
+      if (this.gesture?.t === "drag") this.endDrag(false);
+      const [a, b] = [...this.pointers.values()];
+      this.gesture = { t: "pinch", d0: Math.hypot(a.x - b.x, a.y - b.y), m0: mid(a, b), cam: { ...this.cam } };
+      return;
+    }
+    if (this.pointers.size > 2) return;
+    const p = this.local(e);
+    if (e.button === 1) {
+      this.gesture = { t: "pan", id: e.pointerId, sx: p.x, sy: p.y, cam: { ...this.cam } };
+      return;
+    }
+    this.gesture = { t: "pending", id: e.pointerId, sx: p.x, sy: p.y, touch: e.pointerType !== "mouse", target: e.target };
+  }
+  onMove(e) {
+    const p = this.local(e);
+    if (e.pointerType === "mouse") this.lastPointer = this.toWorld(e.clientX, e.clientY);
+    if (!this.pointers.has(e.pointerId)) return;
+    this.pointers.set(e.pointerId, p);
+    const g = this.gesture;
+    if (!g) return;
+    if (g.t === "pinch") {
+      if (this.pointers.size < 2) return;
+      const [a, b] = [...this.pointers.values()];
+      const d = Math.hypot(a.x - b.x, a.y - b.y);
+      const m = mid(a, b);
+      const s = clamp2(g.cam.s * (d / g.d0), MIN_SCALE, MAX_SCALE);
+      const wx = (g.m0.x - g.cam.x) / g.cam.s;
+      const wy = (g.m0.y - g.cam.y) / g.cam.s;
+      this.setCamera({ s, x: m.x - wx * s, y: m.y - wy * s });
+      return;
+    }
+    if (g.id !== e.pointerId) return;
+    const dx = p.x - g.sx;
+    const dy = p.y - g.sy;
+    if (g.t === "pending") {
+      if (Math.hypot(dx, dy) < (g.touch ? 8 : 4)) return;
+      const w = this.toWorld(e.clientX - dx, e.clientY - dy);
+      const hit = g.target?.closest(".cc-fold") ? { block: null } : this.hitTest(w);
+      const geo = hit.block ? this.geom.geo.get(hit.block) : null;
+      if (geo && !this.stale) {
+        this.gesture = { t: "drag", id: g.id, sx: g.sx, sy: g.sy, block: geo.id, orig: { x: geo.x, y: geo.y }, nested: !!geo.block.parentId };
+        this.els.get(geo.id)?.el.classList.add("cc-dragging");
+        this.hovered = geo.id;
+      } else {
+        this.gesture = { t: "pan", id: g.id, sx: g.sx, sy: g.sy, cam: { ...this.cam } };
+      }
+      return this.onMove(e);
+    }
+    if (g.t === "pan") {
+      this.setCamera({ ...g.cam, x: g.cam.x + dx, y: g.cam.y + dy });
+    } else if (g.t === "drag") {
+      let x = g.orig.x + dx / this.cam.s;
+      let y = g.orig.y + dy / this.cam.s;
+      if (g.nested) x = Math.max(0, x), y = Math.max(0, y);
+      this.layout.blocks[g.block] = { x: Math.round(x), y: Math.round(y) };
+      if (!this.camQueued) this.relayoutSoon();
+    }
+  }
+  relayoutQueued = false;
+  relayoutSoon() {
+    if (this.relayoutQueued) return;
+    this.relayoutQueued = true;
+    requestAnimationFrame(() => {
+      this.relayoutQueued = false;
+      if (!this.view) return;
+      this.geom = computeGeometry(this.view, this.layout, this.hints, { resolveOverlaps: false });
+      this.render();
+    });
+  }
+  onUp(e, cancelled = false) {
+    if (!this.pointers.has(e.pointerId)) return;
+    this.pointers.delete(e.pointerId);
+    const g = this.gesture;
+    if (!g) return;
+    if (g.t === "pinch") {
+      if (this.pointers.size === 0) this.gesture = null;
+      else {
+        const [id, p] = [...this.pointers.entries()][0];
+        this.gesture = { t: "pan", id, sx: p.x, sy: p.y, cam: { ...this.cam } };
+      }
+      return;
+    }
+    if (g.id !== e.pointerId) return;
+    if (g.t === "drag") return this.endDrag(!cancelled);
+    this.gesture = null;
+    if (g.t !== "pending" || cancelled) return;
+    this.onTap(e, g.target);
+  }
+  endDrag(commit) {
+    const g = this.gesture?.t === "drag" ? this.gesture : null;
+    this.gesture = null;
+    if (!g) return;
+    this.els.get(g.block)?.el.classList.remove("cc-dragging");
+    if (!commit) {
+      this.layout.blocks[g.block] = g.orig;
+      this.relayout();
+      return;
+    }
+    const geom = computeGeometry(this.view, this.layout, this.hints, { resolveOverlaps: false });
+    const geo = geom.geo.get(g.block);
+    if (geo) {
+      const parent = geo.block.parentId;
+      const sibs = [...geom.geo.values()].filter((s) => s.block.parentId === parent && s.id !== g.block);
+      this.layout.blocks[g.block] = freeSpotNear({ x: geo.x, y: geo.y }, geo, sibs, !!parent);
+    }
+    this.relayout();
+    this.emitLayout("user");
+  }
+  onTap(e, target) {
+    const fold = target?.closest(".cc-fold");
+    const w = this.toWorld(e.clientX, e.clientY);
+    const hit = this.hitTest(w);
+    const now = performance.now();
+    const p = this.local(e);
+    const dbl = now - this.lastTap.t < 350 && Math.hypot(p.x - this.lastTap.x, p.y - this.lastTap.y) < 24 && this.lastTap.id === (hit.block ?? "@" + hit.container);
+    this.lastTap = { t: dbl ? 0 : now, x: p.x, y: p.y, id: hit.block ?? "@" + hit.container };
+    if (fold && hit.block) return this.toggleCollapse(hit.block);
+    if (hit.block) {
+      if (this.selected === hit.block && !this.editing) return this.openEditor(hit.block);
+      if (this.editing && this.editing.id !== hit.block) this.closeEditor();
+      this.select(hit.block);
+      return;
+    }
+    if (dbl) return this.createFunctionAt(w, hit.container);
+    if (this.editing) this.closeEditor();
+    this.select(hit.container);
+  }
+  onWheel(e) {
+    if (this.isOverlay(e.target)) return;
+    e.preventDefault();
+    const unit = e.deltaMode === 1 ? 16 : e.deltaMode === 2 ? 400 : 1;
+    const p = this.local(e);
+    if (e.ctrlKey || e.metaKey) {
+      this.zoomAt(p, Math.exp(-e.deltaY * unit * 25e-4));
+    } else {
+      const dx = (e.shiftKey && !e.deltaX ? e.deltaY : e.deltaX) * unit;
+      const dy = (e.shiftKey && !e.deltaX ? 0 : e.deltaY) * unit;
+      this.setCamera({ ...this.cam, x: this.cam.x - dx, y: this.cam.y - dy });
+    }
+  }
+  onKey(e) {
+    const isHandledByEditor = e.defaultPrevented;
+    if (isHandledByEditor || this.isOverlay(e.target) && e.target !== this.root) return;
+    const mod = e.metaKey || e.ctrlKey;
+    const k = e.key;
+    if (mod && k.toLowerCase() === "z") {
+      e.preventDefault();
+      return e.shiftKey ? this.opts.onRedo?.() : this.opts.onUndo?.();
+    }
+    if (mod && k.toLowerCase() === "y") {
+      e.preventDefault();
+      return this.opts.onRedo?.();
+    }
+    if (mod && k.toLowerCase() === "d" && this.selected) {
+      e.preventDefault();
+      return this.duplicate(this.selected);
+    }
+    if (mod) return;
+    if (k === "Escape") return this.editing ? this.closeEditor() : this.select(null);
+    if (k === "Enter" && this.selected) {
+      e.preventDefault();
+      return this.openEditor(this.selected);
+    }
+    if (k === "F2" && this.selected) {
+      e.preventDefault();
+      return this.startRename(this.selected);
+    }
+    if ((k === "Delete" || k === "Backspace") && this.selected) {
+      e.preventDefault();
+      return this.deleteBlock(this.selected);
+    }
+    if (k === "0" || k === "!") return this.fit();
+    if (k === "=" || k === "+") return this.zoomBy(1.25);
+    if (k === "-" || k === "_") return this.zoomBy(0.8);
+    if (k === "n" || k === "N") return this.createFunctionAtCenter();
+    if (k === "r" && this.selected) {
+      this.refsOpen = !this.refsOpen;
+      return this.renderBar();
+    }
+  }
+  onClipboard(e, type) {
+    const active = this.root.ownerDocument.activeElement;
+    if (active !== this.root) return;
+    if (type === "paste") {
+      const custom = e.clipboardData?.getData("application/x-codecanvas");
+      const textData = e.clipboardData?.getData("text/plain");
+      let clip2 = null;
+      if (custom) {
+        try {
+          clip2 = JSON.parse(custom);
+        } catch {
+        }
+      }
+      if (!clip2 && textData) clip2 = clipFromText(textData);
+      if (clip2) {
+        e.preventDefault();
+        this.paste(clip2);
+      }
+      return;
+    }
+    if (!this.selected || !this.view || this.stale) return;
+    const clip = copyBlock(this.view, this.selected);
+    this.clip = clip;
+    e.clipboardData?.setData("text/plain", clip.code);
+    e.clipboardData?.setData("application/x-codecanvas", JSON.stringify(clip));
+    e.preventDefault();
+    if (type === "cut") this.deleteBlock(this.selected);
+    else this.toast(`Copied ${clip.name || "block"}`);
+    this.renderBar();
+  }
+  // ---------------------------------------------------------------- actions
+  guard() {
+    if (this.stale || !this.view) {
+      this.toast(`Fix the syntax error on line ${this.model?.firstErrorLine} first`);
+      return false;
+    }
+    return true;
+  }
+  /** Edits that add, remove or rename blocks work on the text's structure, which conflicts break. */
+  guardStructureEdit() {
+    if (!this.guard()) return false;
+    if (this.conflicts) {
+      this.toast("Resolve the merge conflicts in this file first");
+      return false;
+    }
+    return true;
+  }
+  toggleCollapse(id) {
+    const set = new Set(this.layout.collapsed ?? []);
+    if (set.has(id)) set.delete(id);
+    else set.add(id);
+    this.layout.collapsed = [...set];
+    this.relayout();
+    this.emitLayout("user");
+  }
+  createFunctionAt(w, containerId) {
+    if (!this.guardStructureEdit()) return;
+    const view = this.view;
+    const container = containerFor(view, containerId);
+    const r = newFunction(view, container?.id ?? null);
+    this.hints[r.id] = this.relativeTo(container?.id ?? null, { x: w.x - 24, y: w.y - 16 });
+    this.applyInsert(r);
+  }
+  createFunctionAtCenter() {
+    const rect = this.root.getBoundingClientRect();
+    const w = this.toWorld(rect.left + rect.width / 2, rect.top + rect.height / 2);
+    const target = this.selected ? containerFor(this.view, this.selected)?.id ?? null : this.hitTest(w).container;
+    if (target) {
+      const g = this.geom.geo.get(target);
+      return this.createFunctionAt({ x: g.ax + M.pad + 24, y: g.ay + g.h }, target);
+    }
+    this.createFunctionAt(w, null);
+  }
+  /** Convert a world point into coordinates relative to a container's content origin. */
+  relativeTo(containerId, w) {
+    if (!containerId) return { x: Math.round(w.x), y: Math.round(w.y) };
+    const g = this.geom.geo.get(containerId);
+    return { x: Math.max(0, Math.round(w.x - g.ax - M.pad)), y: Math.max(0, Math.round(w.y - g.ay - g.contentTop)) };
+  }
+  applyInsert(r, edit = true) {
+    this.commit(applyEdit(this.text, r.edit));
+    if (r.id && this.view?.blocks.has(r.id)) {
+      this.select(r.id);
+      if (edit) this.openEditor(r.id, r.select);
+    }
+  }
+  deleteBlock(id) {
+    if (!this.guardStructureEdit()) return;
+    const b = this.view.blocks.get(id);
+    if (!b) return;
+    if (this.editing) this.closeEditor();
+    this.select(b.parentId);
+    this.commit(applyEdit(this.text, deleteBlock(this.view, id)));
+    this.toast(`Deleted ${b.name}. Undo with ${isMac() ? "\u2318" : "Ctrl"}+Z`);
+  }
+  duplicate(id) {
+    if (!this.guardStructureEdit()) return;
+    const view = this.view;
+    const b = view.blocks.get(id);
+    if (!b || b.kind === "import" || b.kind === "statement") return;
+    const clip = copyBlock(view, id);
+    const r = pasteBlock(view, b.parentId, clip);
+    const geo = this.geom.geo.get(id);
+    if (r.id) this.hints[r.id] = { x: geo.x + 24, y: geo.y + geo.h + M.gap };
+    this.applyInsert(r, false);
+  }
+  copy(id) {
+    if (!this.view || this.stale) return;
+    this.clip = copyBlock(this.view, id);
+    navigator.clipboard?.writeText(this.clip.code).catch(() => {
+    });
+    this.toast(`Copied ${this.clip.name}`);
+    this.renderBar();
+  }
+  paste(clip = this.clip) {
+    if (!clip || !this.guardStructureEdit()) return;
+    const view = this.view;
+    let target = null;
+    let at = null;
+    if (this.lastPointer) {
+      const hit = this.hitTest(this.lastPointer);
+      target = hit.block ? containerFor(view, hit.block)?.id ?? null : hit.container;
+      at = this.lastPointer;
+    } else if (this.selected) {
+      target = containerFor(view, this.selected)?.id ?? null;
+    }
+    const r = pasteBlock(view, target, clip);
+    if (r.id && at) this.hints[r.id] = this.relativeTo(target, { x: at.x - 24, y: at.y - 16 });
+    this.applyInsert(r, false);
+  }
+  // ---------------------------------------------------------------- rename
+  /** Show a name field in the block's header. Enter renames the block and its usages in every file. */
+  startRename(id) {
+    if (!this.guardStructureEdit()) return;
+    const block = this.view.blocks.get(id);
+    if (!block) return;
+    if (!isRenamable(block)) return this.toast(`${block.name} can't be renamed`);
+    if (this.editing) this.closeEditor();
+    this.cancelRename();
+    this.select(id);
+    if (this.cam.s < 0.6) this.reveal(id);
+    const nameEl = this.els.get(id)?.el.querySelector(".cc-name");
+    if (!nameEl) return;
+    const input = document.createElement("input");
+    input.className = "cc-rename";
+    input.value = block.name;
+    input.spellcheck = false;
+    input.setAttribute("aria-label", `New name for ${block.name}`);
+    const fitWidth = () => input.style.width = `${Math.max(input.value.length, 4) + 2}ch`;
+    fitWidth();
+    input.addEventListener("input", () => {
+      fitWidth();
+      input.classList.remove("invalid");
+    });
+    input.addEventListener("keydown", (e) => {
+      e.stopPropagation();
+      if (e.key === "Enter") {
+        e.preventDefault();
+        this.commitRename();
+      } else if (e.key === "Escape") {
+        e.preventDefault();
+        this.cancelRename();
+        this.root.focus({ preventScroll: true });
+      }
+    });
+    input.addEventListener("blur", () => this.cancelRename());
+    nameEl.replaceChildren(input);
+    this.renaming = { id, input };
+    input.focus({ preventScroll: true });
+    input.select();
+  }
+  cancelRename() {
+    const renaming = this.renaming;
+    if (!renaming) return;
+    this.renaming = null;
+    const name = this.view?.blocks.get(renaming.id)?.name ?? "";
+    renaming.input.parentElement?.replaceChildren(document.createTextNode(name));
+  }
+  async commitRename() {
+    const renaming = this.renaming;
+    const block = renaming && this.view?.blocks.get(renaming.id);
+    if (!renaming || !block) return this.cancelRename();
+    if (renaming.isApplying) return;
+    const newName = renaming.input.value.trim();
+    if (newName === block.name) {
+      this.cancelRename();
+      return this.root.focus({ preventScroll: true });
+    }
+    renaming.isApplying = true;
+    const textAtRequest = this.text;
+    const result = await this.project.renameBlock(this.path, block.id, newName);
+    renaming.isApplying = false;
+    if (this.renaming !== renaming) return;
+    if (this.text !== textAtRequest) {
+      renaming.input.classList.add("invalid");
+      return this.toast("The file changed. Press Enter to rename again");
+    }
+    if (!result.ok) {
+      renaming.input.classList.add("invalid");
+      return this.toast(result.error);
+    }
+    this.renaming = null;
+    const ownEdits = result.edits[this.path] ?? [];
+    const shiftBeforeBlock = ownEdits.filter((e) => e.end <= block.start).reduce((sum, e) => sum + e.text.length - (e.end - e.start), 0);
+    const otherPaths = Object.keys(result.edits).filter((path) => path !== this.path);
+    const otherFiles = otherPaths.map((path) => {
+      const previousModel = this.project.getModel(path);
+      const before = this.project.getText(path) ?? "";
+      const after = applyEdits(before, result.edits[path]);
+      this.project.setFile(path, after);
+      return { path, before, after, previousModel };
+    });
+    this.commit(applyEdits(this.text, ownEdits), otherFiles.length ? otherFiles : void 0);
+    const renamed = [...this.view?.blocks.values() ?? []].find((b) => b.start === block.start + shiftBeforeBlock && b.name === newName);
+    if (renamed) this.select(renamed.id);
+    this.root.focus({ preventScroll: true });
+    this.toast(otherPaths.length ? `Renamed to ${newName} in ${otherPaths.length + 1} files` : `Renamed to ${newName}`);
+  }
+  // ---------------------------------------------------------------- inline editor
+  openEditor(id, selection) {
+    if (!this.guard()) return;
+    const b = this.view.blocks.get(id);
+    if (!b) return;
+    if (this.conflicts) {
+      const touching = (this.conflicts.hunksByBlock.get(id) ?? []).map((index) => this.conflicts.hunks[index]);
+      const start = Math.min(this.conflicts.current.toFileOffset(b.start), ...touching.map((hunk) => hunk.start));
+      const end = Math.max(this.conflicts.current.toFileOffset(b.end), ...touching.map((hunk) => hunk.end));
+      return this.openRangeEditor(start, end, b);
+    }
+    this.openRangeEditor(b.start, b.end, b, selection);
+  }
+  openRangeEditor(start, end, b, selection) {
+    this.closeEditor({ restoreCamera: false });
+    this.refsOpen = false;
+    const panel = el("div", "cc-editor");
+    const head = el("div", "cc-editor-head");
+    const chip = el("div", "cc-chip");
+    chip.classList.add(`k-${b?.kind ?? "statement"}`);
+    chip.style.setProperty("--k", `var(--k-${b?.kind ?? "statement"})`);
+    setHTML(chip, `<i></i><span>${esc(b ? b.name : this.path)}</span>`);
+    const hint = el("span", "cc-editor-hint");
+    hint.textContent = "Esc to close";
+    head.append(chip, hint, button("Done", () => this.closeEditor(), "primary"));
+    const body = el("div", "cc-editor-body");
+    panel.append(head, body);
+    this.root.appendChild(panel);
+    const code = this.text.slice(start, end);
+    const lines = code.split("\n").length;
+    const { width: vw, height: vh } = this.root.getBoundingClientRect();
+    const mobile = vw < 700;
+    if (mobile) {
+      Object.assign(panel.style, { left: "0", right: "0", bottom: "0", height: Math.round(vh * 0.52) + "px", borderRadius: "14px 14px 0 0" });
+    } else {
+      const w = Math.min(640, vw - 32);
+      const h = Math.min(vh - 32, Math.max(160, lines * 19 + 70));
+      Object.assign(panel.style, { right: "16px", top: "16px", width: w + "px", height: h + "px" });
+    }
+    if (b) {
+      const g = this.geom?.geo.get(b.id);
+      if (g) {
+        const s = this.cam.s;
+        const sx = g.ax * s + this.cam.x;
+        const sy = g.ay * s + this.cam.y;
+        let dx = 0, dy = 0;
+        if (mobile) {
+          const avail = vh * 0.48;
+          if (sy < 12 || sy > avail - 60) dy = 24 - sy;
+          if (sx < 12 || sx + Math.min(g.w * s, vw) > vw) dx = 16 - sx;
+        } else {
+          const right = vw - Math.min(640, vw - 32) - 32;
+          if (sx + g.w * s > right) dx = Math.max(right - (sx + g.w * s), 24 - sx);
+          if (sx + dx < 12) dx = 24 - sx;
+          if (sy < 12 || sy > vh - 80) dy = 40 - sy;
+        }
+        if (dx || dy) {
+          const shifted = { ...this.cam, x: this.cam.x + dx, y: this.cam.y + dy };
+          this.cameraBeforeEditor = { before: this.cameraBeforeEditor?.before ?? { ...this.cam }, shifted };
+          this.moveCamera(shifted, true);
+        }
+      }
+    }
+    const handle = this.opts.createEditor({
+      parent: body,
+      text: code,
+      start,
+      end,
+      selection,
+      diffBase: this.conflicts ? void 0 : this.baseCodeOf(b),
+      onChange: (t) => this.onEditorChange(t),
+      onClose: () => {
+        this.closeEditor();
+        this.root.focus({ preventScroll: true });
+      }
+    });
+    this.editing = { start, len: code.length, id: b?.id ?? null, handle, el: panel };
+    if (b) this.selected = b.id;
+    this.banner.querySelector("button")?.remove();
+    this.updateHighlight();
+    this.renderBar();
+    handle.focus();
+  }
+  onEditorChange(code) {
+    const ed = this.editing;
+    if (!ed) return;
+    const text = this.text.slice(0, ed.start) + code + this.text.slice(ed.start + ed.len);
+    ed.len = code.length;
+    this.commit(text);
+  }
+  closeEditor({ restoreCamera = true } = {}) {
+    const ed = this.editing;
+    if (!ed) return;
+    this.editing = null;
+    const cameraBeforeEditor = this.cameraBeforeEditor;
+    if (restoreCamera) {
+      this.cameraBeforeEditor = null;
+      const isStillWhereEditorPutIt = !!cameraBeforeEditor && Math.abs(this.cam.x - cameraBeforeEditor.shifted.x) < 1 && Math.abs(this.cam.y - cameraBeforeEditor.shifted.y) < 1 && this.cam.s === cameraBeforeEditor.shifted.s;
+      if (isStillWhereEditorPutIt) this.moveCamera(cameraBeforeEditor.before, true);
+    }
+    ed.handle.destroy();
+    ed.el.remove();
+    if (this.stale) this.parseNow();
+    this.updateHighlight();
+    this.renderBar();
+  }
+  // ---------------------------------------------------------------- toolbar & references
+  renderBar() {
+    const bar = this.bar;
+    bar.replaceChildren();
+    bar.hidden = !!this.editing;
+    const b = this.selected ? this.view?.blocks.get(this.selected) : null;
+    if (b) {
+      const chip = el("div", "cc-chip");
+      chip.style.setProperty("--k", `var(--k-${b.kind})`);
+      setHTML(chip, `<i></i>${esc(b.name)}`);
+      const refs = this.refsFor(b.id);
+      const errors = this.diagnosticsInside(b.id);
+      if (this.conflicts) {
+        const isConflicted = this.conflicts.hunksByBlock.has(b.id);
+        const firstHunk = isConflicted ? this.conflicts.hunks[this.conflicts.hunksByBlock.get(b.id)[0]] : void 0;
+        const keep = (label, choice, side) => {
+          const keepButton = button(label, () => this.keepConflictSide(b.id, choice), choice === "current" ? "primary" : void 0);
+          if (side) keepButton.title = side;
+          return keepButton;
+        };
+        bar.append(
+          chip,
+          el("div", "cc-sep"),
+          ...firstHunk ? [keep("Keep current", "current", firstHunk.currentLabel), keep("Keep incoming", "incoming", firstHunk.incomingLabel), keep("Keep both", "both"), el("div", "cc-sep")] : [],
+          button("Edit", () => this.openEditor(b.id)),
+          button("Copy", () => this.copy(b.id))
+        );
+        return this.renderRefs();
+      }
+      bar.append(
+        chip,
+        el("div", "cc-sep"),
+        ...errors.length ? [button(plural(errors.length, "error"), () => this.toggleRefs(), "danger")] : [],
+        button("Edit", () => this.openEditor(b.id)),
+        ...isRenamable(b) ? [button("Rename", () => this.startRename(b.id))] : [],
+        button(`Refs ${refs.incoming.length + refs.outgoing.length}`, () => this.toggleRefs()),
+        button("Copy", () => this.copy(b.id)),
+        ...b.kind !== "import" && b.kind !== "statement" ? [button("Duplicate", () => this.duplicate(b.id))] : [],
+        ...b.insert ? [button("+ Inside", () => this.createFunctionAtCenter())] : [],
+        button("Delete", () => this.deleteBlock(b.id), "danger")
+      );
+    } else {
+      const firstErrorBlock = this.diagnostics.find((d) => d.blockId)?.blockId;
+      if (firstErrorBlock) bar.append(button(plural(this.diagnostics.length, "error"), () => this.showErrorsOf(firstErrorBlock), "danger"));
+      const diff = this.currentDiff();
+      if (diff) bar.append(changesSummary(diff), el("div", "cc-sep"));
+      bar.append(button("+ Function", () => this.createFunctionAtCenter()));
+      if (this.clip) bar.append(button("Paste", () => (this.lastPointer = null, this.paste())));
+      bar.append(
+        this.layoutBeforeArrange ? button("Undo arrange", () => this.undoArrange()) : button("Arrange", () => this.arrange()),
+        el("div", "cc-sep"),
+        button("Fit", () => this.fit()),
+        button("\u2212", () => this.zoomBy(0.8)),
+        button("+", () => this.zoomBy(1.25))
+      );
+    }
+    this.renderRefs();
+  }
+  toggleRefs() {
+    this.refsOpen = !this.refsOpen;
+    this.renderBar();
+  }
+  showErrorsOf(id) {
+    this.reveal(id);
+    this.refsOpen = true;
+    this.renderBar();
+  }
+  diagnosticsInside(id) {
+    return this.diagnostics.filter((d) => d.blockId === id || !!d.blockId?.startsWith(id + "/"));
+  }
+  refsFor(id) {
+    const usages = this.view?.usages ?? [];
+    const inside = (x) => x === id || x.startsWith(id + "/");
+    const importsReachedElsewhere = new Set(usages.filter((u) => u.toPath && u.via).map((u) => `${u.from}>${u.via}`));
+    const isImportLinkWithTargets = (u) => !u.toPath && importsReachedElsewhere.has(`${u.from}>${u.to}`);
+    return {
+      incoming: [...usages.filter((u) => !u.toPath && inside(u.to) && !inside(u.from)), ...this.incomingUsages.filter((u) => inside(u.to))],
+      outgoing: usages.filter((u) => inside(u.from) && (u.toPath || !inside(u.to)) && !isImportLinkWithTargets(u))
+    };
+  }
+  renderRefs() {
+    const panel = this.refsEl;
+    const selected = this.selected ? this.view?.blocks.get(this.selected) : null;
+    panel.hidden = !this.refsOpen || !selected || !!this.editing;
+    if (panel.hidden || !selected) return;
+    const { incoming, outgoing } = this.refsFor(selected.id);
+    const errors = this.diagnosticsInside(selected.id);
+    const heading = (text) => Object.assign(el("h4"), { textContent: text });
+    const note = (text) => Object.assign(el("div", "none"), { textContent: text });
+    const row = (path, blockId, usage) => {
+      const isOtherFile = !!path && path !== this.path;
+      const model = isOtherFile ? this.project.getModel(path) : this.view;
+      const block = model?.blocks.get(blockId);
+      const btn = keepsCanvasFocus(document.createElement("button"));
+      btn.style.setProperty("--k", `var(--k-${block?.kind ?? "statement"})`);
+      const name = block && model ? displayName(model, block) : blockId;
+      const label = isOtherFile ? `<span class="cc-file">${esc(fileName(path))} \u203A</span> ${esc(name)}` : esc(name);
+      setHTML(btn, `<i></i><span>${label}</span><span>${usage.kind}${usage.count > 1 ? " \xD7" + usage.count : ""}</span>`);
+      btn.onclick = () => isOtherFile ? this.opts.onOpenBlock?.(path, blockId) : this.reveal(blockId);
+      btn.disabled = isOtherFile && !this.opts.onOpenBlock;
+      return btn;
+    };
+    panel.replaceChildren();
+    if (errors.length) {
+      panel.append(heading(`Errors (${errors.length})`));
+      for (const d of errors) {
+        const btn = keepsCanvasFocus(document.createElement("button"));
+        btn.className = "cc-error-row";
+        setHTML(btn, `<i></i><span>${esc(d.message)}</span><span>line ${d.line}</span>`);
+        btn.onclick = () => this.openEditorAtDiagnostic(d);
+        panel.append(btn);
+      }
+    }
+    panel.append(heading(`Used by (${incoming.length})`));
+    if (incoming.length) for (const u of incoming) panel.append(row("fromPath" in u ? u.fromPath : void 0, u.from, u));
+    else panel.append(note("Not used anywhere"));
+    panel.append(heading(`Uses (${outgoing.length})`));
+    if (outgoing.length) for (const u of outgoing) panel.append(row(u.toPath, u.to, u));
+    else panel.append(note("Uses nothing from this project"));
+  }
+  openEditorAtDiagnostic(d) {
+    if (this.stale) return this.openRangeEditor(0, this.text.length, null, [d.start, d.start + d.length]);
+    const block = d.blockId ? this.view?.blocks.get(d.blockId) : void 0;
+    if (!block) return;
+    const offset = d.start - block.start;
+    this.openEditor(block.id, [offset, offset + d.length]);
+  }
+  toast(msg) {
+    this.toastEl.textContent = msg;
+    this.toastEl.style.opacity = "1";
+    clearTimeout(this.toastTimer);
+    this.toastTimer = window.setTimeout(() => this.toastEl.style.opacity = "0", 2200);
+  }
+};
+function blockLabel(b) {
+  if (b.kind === "function") return b.tags.find((t) => t === "get" || t === "set") ?? "fn";
+  if (b.kind === "variable" || b.kind === "type") return b.tags.find((t) => LABEL_TAGS.has(t)) ?? KIND_LABEL[b.kind];
+  return KIND_LABEL[b.kind];
+}
+function innermostBlocksTouching(model, range) {
+  const touches = (block) => range.start === range.end ? block.start < range.start && range.start < block.end : block.start < range.end && range.start < block.end;
+  const found = [];
+  const visit = (blocks) => {
+    for (const block of blocks.filter(touches)) {
+      const touchingChildren = block.children.filter(touches);
+      if (touchingChildren.length) visit(block.children);
+      else found.push(block);
+    }
+  };
+  visit(model.roots);
+  return found;
+}
+function changedRegion2(before, after) {
+  let start = 0;
+  const shorter = Math.min(before.length, after.length);
+  while (start < shorter && before.charCodeAt(start) === after.charCodeAt(start)) start++;
+  let fromEnd = 0;
+  while (fromEnd < shorter - start && before.charCodeAt(before.length - 1 - fromEnd) === after.charCodeAt(after.length - 1 - fromEnd)) fromEnd++;
+  return { start, end: before.length - fromEnd };
+}
+function isRenamable(b) {
+  return b.nameStart >= 0 && b.kind !== "import" && b.kind !== "statement" && b.name !== "constructor";
+}
+function displayName(model, b) {
+  if (b.kind === "import") return "import " + b.name;
+  const names = [b.name];
+  let parent = b.parentId ? model.blocks.get(b.parentId) : null;
+  while (parent) {
+    names.unshift(parent.name);
+    parent = parent.parentId ? model.blocks.get(parent.parentId) : null;
+  }
+  return names.join(".");
+}
+function fileName(path) {
+  return path.slice(path.lastIndexOf("/") + 1);
+}
+function changesSummary(diff) {
+  const changes = [...diff.changes.values()];
+  const counts = [
+    [changes.filter((change) => change === "changed").length, "changed"],
+    [changes.filter((change) => change === "added").length, "added"],
+    [diff.removed.length, "removed"]
+  ];
+  const parts = counts.filter(([count]) => count > 0).map(([count, word]) => `${count} ${word}`);
+  return Object.assign(el("span", "cc-diff-summary"), { textContent: parts.length ? parts.join(" \xB7 ") : "No changes" });
+}
+function plural(count, word) {
+  return `${count} ${word}${count === 1 ? "" : "s"}`;
+}
+function edgePath(a, b) {
+  const ay = a.ay + Math.min(a.h / 2, 16);
+  const by = b.ay + Math.min(b.h / 2, 16);
+  if (b.ax >= a.ax + a.w + 8) return curveH(a.ax + a.w, ay, b.ax, by);
+  if (b.ax + b.w <= a.ax - 8) return curveH(a.ax, ay, b.ax + b.w, by);
+  const ax = a.ax + a.w / 2;
+  const bx = b.ax + b.w / 2;
+  if (b.ay > a.ay) return curveV(ax, a.ay + a.h, bx, b.ay);
+  return curveV(ax, a.ay, bx, b.ay + b.h);
+}
+function curveH(x1, y1, x2, y2) {
+  const c = Math.max(30, Math.abs(x2 - x1) * 0.5) * Math.sign(x2 - x1 || 1);
+  return `M${x1} ${y1}C${x1 + c} ${y1} ${x2 - c} ${y2} ${x2} ${y2}`;
+}
+function curveV(x1, y1, x2, y2) {
+  const c = Math.max(30, Math.abs(y2 - y1) * 0.5) * Math.sign(y2 - y1 || 1);
+  return `M${x1} ${y1}C${x1} ${y1 + c} ${x2} ${y2 - c} ${x2} ${y2}`;
+}
+function el(tag, cls) {
+  const e = document.createElement(tag);
+  if (cls) e.className = cls;
+  return e;
+}
+function button(label, onClick, variant) {
+  const b = keepsCanvasFocus(document.createElement("button"));
+  b.className = "cc-btn" + (variant ? " " + variant : "");
+  b.textContent = label;
+  b.addEventListener("click", (e) => {
+    e.stopPropagation();
+    onClick();
+  });
+  return b;
+}
+function keepsCanvasFocus(element) {
+  element.addEventListener("pointerdown", (e) => e.preventDefault());
+  return element;
+}
+function esc(s) {
+  return s.replace(/[&<>"]/g, (c) => ({ "&": "&amp;", "<": "&lt;", ">": "&gt;", '"': "&quot;" })[c]);
+}
+function clamp2(v, lo, hi) {
+  return Math.min(hi, Math.max(lo, v));
+}
+function mid(a, b) {
+  return { x: (a.x + b.x) / 2, y: (a.y + b.y) / 2 };
+}
+function isMac() {
+  return /Mac|iPhone|iPad/.test(navigator.platform || navigator.userAgent);
+}
+export {
+  CodeCanvas,
+  M,
+  Project,
+  ProjectServer,
+  RemoteProject,
+  applyEdit,
+  applyEdits,
+  blockAt,
+  callProjectServer,
+  carryRenames,
+  clipFromText,
+  computeGeometry,
+  conflictSideText,
+  connectProjectWorker,
+  containerFor,
+  copyBlock,
+  deleteBlock,
+  detectIndentUnit,
+  diffLines,
+  diffModels,
+  diffOwnCode,
+  diffPreview,
+  emptyLayout,
+  findConflicts,
+  freeSpotNear,
+  injectStyles,
+  newFunction,
+  parseFile,
+  pasteBlock,
+  replaceBlock,
+  resolveConflict,
+  serializeLayout,
+  serveProject,
+  uniqueName
+};
+//# sourceMappingURL=index.js.map