@hydranium/cli 1.0.0-next.37 → 1.0.0-next.370

package/lib/commands/init-templates.js

@@ -21,6 +21,12 @@
  *   `bin` key, the DI module filename, and the data-server port command.
  * - `__CONFIG_ROOT_CONST__` — SCREAMING_SNAKE project id, naming the
  *   `lsp.configurationRoot` constant a multi-grammar project binds.
+ * - `__PROTOCOL_PACKAGE__` — the protocol member's package name, scope
+ *   included, which the server and every client import ids and wire types
+ *   from.
+ * - `__SERVER_PACKAGE__` / `__CLIENT_PACKAGE__` — the server and client
+ *   members' package names, which a host imports the language and the diagram
+ *   definition from.
  *
  * GRAMMAR tokens, substituted once per grammar:
  *
@@ -28,6 +34,10 @@
  *   Drives the PER-LANGUAGE generated symbols (`<grammar>GeneratedModule`,
  *   `<grammar>LanguageMetaData`).
  * - `__GRAMMAR_ID__` — kebab grammar id: the `.langium` filename.
+ * - `__GRAMMAR_ID_CONST__` — SCREAMING_SNAKE grammar id, prefixing the
+ *   diagram's type-id constants.
+ * - `__GRAMMAR_CAMEL__` — lowerCamelCase grammar name, naming the client's
+ *   diagram module constant.
  * - `__LANGUAGE_ID__` — kebab routing key: the `langium-config` entry id and
  *   its TextMate output.
  * - `__EXTENSION__` — the grammar's FIRST file extension, without the dot.
@@ -48,10 +58,22 @@
  * generator emits `interface <projectName>Element` as the base type every rule
  * extends, which a rule of that name would collide with.
  *
- * Kept as in-source strings (not on-disk assets) so no build-time copy step
- * is needed and the substitution is unit-testable. The `.ts` / `.langium` / JSON
- * templates are derived from the in-repo reference example so the generated project
- * compiles against the real `@hydranium/*` API once `langium generate` has run.
+ * The project is its packages and a starter workspace, each in its own
+ * directory: `server/` (the grammar, the language and its heads), `protocol/`
+ * (what the server and its clients both import, so a client never installs
+ * Langium), `client/` with a diagram (its host-neutral client side),
+ * `host-<name>/` per host, `vscode-servers/` with the VS Code host (the server
+ * launch it shares with a Theia app), and `workspace/` (starter model files
+ * every host and the CLI open). A standalone project adds a root manifest
+ * naming them as npm workspaces; a workspace member joins the surrounding root
+ * instead.
+ *
+ * A file that is fixed text with tokens lives in the `templates/` tree the
+ * package ships beside `lib`, at the path it is emitted at, tokens included
+ * (each ignore file without its dot); one computed from the composition is
+ * built here. The tree is read synchronously, so `runInit` stays synchronous,
+ * and it is neither formatted with the repo's settings nor given a license
+ * header, since either would change what `init` emits.
  *
  * Two conventions the templates follow deliberately:
  *
@@ -70,16 +92,10 @@
  *   is what the detection cannot fix. A very long `--name` can still push a line
  *   over; the adopter's own formatter settles it.
  */
+import { readFileSync } from 'node:fs';
 import { readCliVersion } from '../cli-version.js';
-/**
- * The version every framework package carries before the first release.
- *
- * A scaffold made by a CLI still at this version pins a range the registry
- * cannot serve, so the emitted README keeps its yalc note and `init` keeps its
- * install warning while — and only while — it holds: from a published CLI the
- * derived pins resolve and either note would be false as printed.
- */
-export const UNPUBLISHED_FRAMEWORK_VERSION = '0.0.0';
+import { initMembers } from './init.js';
+import { isTheiaHost } from './init-hosts.js';
 /**
  * The version `init` pins every `@hydranium/*` dependency at: the scaffolding
  * CLI's own.
@@ -107,12 +123,52 @@ function frameworkPin(composition) {
 function screamingSnake(projectId) {
     return projectId.replace(/-/g, '_').toUpperCase();
 }
+const VSCODE_EXTENSION_MEMBERS = ['vscode-servers', 'host-vscode'];
+/**
+ * A member's package name: `<id>-<member>`, under the scope when there is one,
+ * except for the VS Code extensions, whose scoped name `vsce` refuses to
+ * package.
+ *
+ * Suffixed even for the server, because a project of several packages has no
+ * member entitled to the bare id, and a later client or host would otherwise
+ * read as a part of the server.
+ */
+export function memberPackageName(composition, member) {
+    const { scope } = composition.packaging;
+    const name = `${composition.projectId}-${member}`;
+    return scope === undefined || VSCODE_EXTENSION_MEMBERS.includes(member) ? name : `${scope}/${name}`;
+}
+/**
+ * The composition as one member sees it: inside a workspace, its placement
+ * sits one directory below the project's, so its `extends` and its lint
+ * config path reach one level further up.
+ */
+function forMember(composition, member) {
+    const workspace = composition.packaging.workspace;
+    if (workspace === undefined) {
+        return composition;
+    }
+    return {
+        ...composition,
+        packaging: {
+            ...composition.packaging,
+            workspace: {
+                ...workspace,
+                targetPath: `${workspace.targetPath}/${member}`,
+                baseTsconfig: workspace.baseTsconfig === undefined ? undefined : `../${workspace.baseTsconfig}`
+            }
+        }
+    };
+}
 /** Substitute the project-tier tokens. */
 function project(text, composition) {
     return text
         .replace(/__NAME__/g, composition.name)
         .replace(/__PROJECT_ID__/g, composition.projectId)
-        .replace(/__CONFIG_ROOT_CONST__/g, screamingSnake(composition.projectId));
+        .replace(/__CONFIG_ROOT_CONST__/g, screamingSnake(composition.projectId))
+        .replace(/__PROTOCOL_PACKAGE__/g, memberPackageName(composition, 'protocol'))
+        .replace(/__SERVER_PACKAGE__/g, memberPackageName(composition, 'server'))
+        .replace(/__CLIENT_PACKAGE__/g, memberPackageName(composition, 'client'));
 }
 /**
  * Substitute the grammar-tier tokens for ONE grammar.
@@ -124,7 +180,9 @@ function project(text, composition) {
  */
 function grammarTier(text, grammar) {
     return text
+        .replace(/__GRAMMAR_ID_CONST__/g, screamingSnake(grammar.grammarId))
         .replace(/__GRAMMAR_ID__/g, grammar.grammarId)
+        .replace(/__GRAMMAR_CAMEL__/g, grammar.grammar.charAt(0).toLowerCase() + grammar.grammar.slice(1))
         .replace(/__GRAMMAR__/g, grammar.grammar)
         .replace(/__LANGUAGE_ID__/g, grammar.languageId)
         .replace(/__EXTENSION__/g, grammar.extensions[0])
@@ -135,6 +193,25 @@ function grammarTier(text, grammar) {
 function render(text, composition, grammar) {
     return grammarTier(project(text, composition), grammar);
 }
+/** The template tree, the same two levels up from `src/commands` and `lib/commands`. */
+const TEMPLATES = new URL('../../templates/', import.meta.url);
+/** One template file's text. */
+function template(path) {
+    return readFileSync(new URL(path, TEMPLATES), 'utf-8');
+}
+/** A template emitted once per project at its own path, rendered with the project tokens. */
+function projectTemplate(path, composition) {
+    return { path, content: project(template(path), composition) };
+}
+/** A template emitted once per grammar, its path rendered like its content. */
+function grammarTemplate(path, composition, grammar) {
+    return { path: render(path, composition, grammar), content: render(template(path), composition, grammar) };
+}
+/** An ignore file, stored without its dot because `npm pack` drops a nested `.gitignore` and applies it as an ignore file. */
+function ignoreFile(directory) {
+    const prefix = directory === '' ? '' : `${directory}/`;
+    return { path: `${prefix}.gitignore`, content: template(`${prefix}gitignore`) };
+}
 /** A comma-separated list of single-quoted TypeScript/JS string literals. */
 function quotedList(values) {
     return values.map(value => `'${value}'`).join(', ');
@@ -142,21 +219,22 @@ function quotedList(values) {
 /**
  * The column budget the emitted sources wrap at when nothing better is known.
  *
- * **Not "prettier's default"** — that is 80. 120 is a choice, and stating it as
- * a default was wrong in a way that mattered: no single width is stable for an
+ * **Not "prettier's default"** — that is 80. No single width is stable for an
  * unknown repo, so emitted code only passes a formatter check relative to a
  * config. A workspace scaffold detects the surrounding repo's `printWidth` and
  * uses it (see {@link columnsFor}); a standalone one has no config to read and
- * falls back here.
+ * falls back here. It is the framework's own width, so a fixed template, which
+ * wraps at no budget, reads the same in a standalone scaffold as in the
+ * examples this repo formats.
  */
-const DEFAULT_COLUMNS = 120;
+const DEFAULT_COLUMNS = 140;
 /** The width THIS composition wraps at: the detected workspace one, else {@link DEFAULT_COLUMNS}. */
 function columnsFor(composition) {
     return composition.packaging.workspace?.printWidth ?? DEFAULT_COLUMNS;
 }
 /**
  * A named import on one line while it fits the column budget, else one symbol
- * per line. Emitted files are supposed to pass a prettier check as-is, and the
+ * per line. Emitted files are supposed to pass a format check as-is, and the
  * generated-module import grows by one symbol per grammar.
  */
 function importList(symbols, from, columns, typeOnly = false) {
@@ -175,9 +253,13 @@ function arrayLiteral(elements, indent, columns) {
  * The FRAMEWORK packages each head adds, carrying no version: every
  * `@hydranium/*` pin is derived at scaffold time from {@link frameworkPin}, so
  * none of them can name a version its siblings were not published at.
+ *
+ * `base` is every head set's: the services every head serves from are composed
+ * the same with or without an LSP head.
  */
 const HEAD_FRAMEWORK_DEPENDENCIES = {
-    lsp: ['@hydranium/core', '@hydranium/langium', '@hydranium/protocol'],
+    base: ['@hydranium/core', '@hydranium/langium', '@hydranium/protocol'],
+    lsp: [],
     data: ['@hydranium/data-server'],
     glsp: ['@hydranium/glsp-server']
 };
@@ -197,15 +279,24 @@ const HEAD_FRAMEWORK_DEPENDENCIES = {
  * `overrides` block exists to prevent — so a repo gate holds each entry here
  * against the manifest that declares it.
  *
- * `langium` is required by `lsp` even though hand-written code goes through the
+ * `langium` is required even though hand-written code goes through the
  * `@hydranium/langium` chokepoint, because `langium-cli` emits direct imports
- * into the generated files and regenerates them on every build.
+ * into the generated files and regenerates them on every build. The `vscode-*`
+ * packages are required peers of `@hydranium/core`, so they are `base` too.
  */
 const HEAD_THIRD_PARTY_DEPENDENCIES = {
-    lsp: {
+    base: {
         langium: '4.3.1',
-        'vscode-languageserver': '~10.0.1'
+        // Exact, as are the protocol and transport it pins, so Langium and the
+        // framework share their copies; across copies, an error a handler throws
+        // or returns loses its code, and a later patch can pin another protocol.
+        'vscode-languageserver': '10.0.1',
+        'vscode-jsonrpc': '9.0.0',
+        'vscode-languageserver-protocol': '3.18.1',
+        // The copy that protocol pins; a root without it takes the one Theia pins.
+        'vscode-languageserver-types': '3.18.0'
     },
+    lsp: {},
     data: {},
     glsp: {
         '@eclipse-glsp/graph': '2.7.0',
@@ -216,25 +307,171 @@ const HEAD_THIRD_PARTY_DEPENDENCIES = {
         'reflect-metadata': '~0.2.2'
     }
 };
-/** The dependency block for a head set, merged and sorted as npm writes it. */
+/**
+ * What each head adds to the protocol member, which carries only what a
+ * client may install. Keyed by head because the `glsp` head implies a diagram,
+ * whose element ids extend GLSP's default type names.
+ */
+const PROTOCOL_THIRD_PARTY_DEPENDENCIES = {
+    lsp: {},
+    data: {},
+    glsp: { '@eclipse-glsp/protocol': '2.7.0' }
+};
+/** The client member's packages: the diagram definition and what it registers its elements with. */
+const CLIENT_FRAMEWORK_DEPENDENCIES = ['@hydranium/glsp-client'];
+const CLIENT_THIRD_PARTY_DEPENDENCIES = {
+    '@eclipse-glsp/client': '2.7.0',
+    // GLSP's client imports this package's stylesheet without declaring it, so
+    // a page bundling the diagram does not build without it.
+    '@vscode/codicons': '0.0.45',
+    inversify: '^6.1.3'
+};
+/**
+ * What each head adds to the browser host, which bundles the server into its
+ * worker and the head's client into its page. `base` is what every page needs.
+ *
+ * `monaco-editor-core` is exact for the reason `langium` is: Monaco's models
+ * live in one copy, and `@hydranium/client-browser` must reach the page's.
+ */
+const HOST_BROWSER_FRAMEWORK_DEPENDENCIES = {
+    base: ['@hydranium/client-browser', '@hydranium/core', '@hydranium/protocol'],
+    lsp: [],
+    data: ['@hydranium/data-server'],
+    glsp: ['@hydranium/glsp-client', '@hydranium/glsp-server']
+};
+const HOST_BROWSER_THIRD_PARTY_DEPENDENCIES = {
+    base: { 'vscode-jsonrpc': '9.0.0', 'vscode-languageserver-protocol': '3.18.1' },
+    lsp: { 'monaco-editor-core': '0.56.0' },
+    data: {},
+    glsp: { '@eclipse-glsp/server': '2.7.0', 'reflect-metadata': '~0.2.2' }
+};
+/** The browser host's tools: the bundler, the smoke tier and the type check. */
+const HOST_BROWSER_DEV_DEPENDENCIES = {
+    '@playwright/test': '^1.55.0',
+    '@types/node': '^22.0.0',
+    esbuild: '^0.28.0',
+    rimraf: '^5.0.0',
+    typescript: '^7.0.2'
+};
+/** The language client both VS Code extensions start the server with. */
+const VSCODE_LANGUAGE_CLIENT = { 'vscode-languageclient': '^9.0.1' };
+/** The VS Code API's types, at the oldest VS Code both extensions run in, which `engines` names too. */
+const VSCODE_ENGINE = '^1.101.0';
+/**
+ * What the GLSP head adds to the VS Code extension: the connector in the
+ * extension host and the diagram webview's starter, which bundles the client
+ * member.
+ */
+const HOST_VSCODE_GLSP_FRAMEWORK_DEPENDENCIES = [
+    '@hydranium/client-vscode',
+    '@hydranium/glsp-client',
+    '@hydranium/glsp-client-vscode',
+    '@hydranium/protocol'
+];
+const HOST_VSCODE_GLSP_THIRD_PARTY_DEPENDENCIES = {
+    '@eclipse-glsp/client': '2.7.0',
+    '@eclipse-glsp/vscode-integration': '2.7.0',
+    '@eclipse-glsp/vscode-integration-webview': '2.7.0',
+    inversify: '^6.1.3',
+    'vscode-jsonrpc': '9.0.0'
+};
+/** What the data head adds to the VS Code extension: the Show Model command's socket to it. */
+const HOST_VSCODE_DATA_FRAMEWORK_DEPENDENCIES = [
+    '@hydranium/client-vscode',
+    '@hydranium/data-client-vscode',
+    '@hydranium/protocol'
+];
+// Exact, as the server's is: the socket's connection and the framework's must be one copy.
+const HOST_VSCODE_DATA_THIRD_PARTY_DEPENDENCIES = { 'vscode-jsonrpc': '9.0.0' };
+/** The VS Code extension's tools: the smoke tier, the download it runs in, the type check and the watch. */
+const HOST_VSCODE_DEV_DEPENDENCIES = {
+    '@playwright/test': '^1.55.0',
+    '@types/node': '^22.0.0',
+    '@types/vscode': VSCODE_ENGINE,
+    '@vscode/test-electron': '^3.1.0',
+    concurrently: '^9.0.0',
+    rimraf: '^5.0.0',
+    typescript: '^7.0.2'
+};
+/**
+ * The Node major a standalone scaffold's `.nvmrc` and printed steps name.
+ * `langium generate` from the pinned `langium-cli` fails on Node 24.20 and
+ * later, which `engines` still admits.
+ */
+export const SCAFFOLD_NODE_MAJOR = '22';
+/**
+ * The exact pins of every member the composition emits, for a workspace root
+ * to declare too. npm installs a root's own dependencies at the top of the
+ * tree, so another member's version of one nests beneath that member instead of
+ * taking the place of the copy this package shares with the framework.
+ */
+export function workspaceRootPins(composition) {
+    const { heads } = composition;
+    const members = initMembers(heads, composition.hosts);
+    const pins = new Map([
+        ...Object.entries(HEAD_THIRD_PARTY_DEPENDENCIES.base),
+        ...heads.flatMap(head => [
+            ...Object.entries(HEAD_THIRD_PARTY_DEPENDENCIES[head]),
+            ...Object.entries(PROTOCOL_THIRD_PARTY_DEPENDENCIES[head])
+        ]),
+        ...(members.includes('client') ? Object.entries(CLIENT_THIRD_PARTY_DEPENDENCIES) : []),
+        ...(members.includes('host-browser')
+            ? ['base', ...heads].flatMap(head => Object.entries(HOST_BROWSER_THIRD_PARTY_DEPENDENCIES[head]))
+            : []),
+        ...(members.includes('host-vscode') && heads.includes('glsp') ? Object.entries(HOST_VSCODE_GLSP_THIRD_PARTY_DEPENDENCIES) : []),
+        ...(members.includes('host-vscode') && heads.includes('data') ? Object.entries(HOST_VSCODE_DATA_THIRD_PARTY_DEPENDENCIES) : []),
+        ...(members.includes('theia') ? theiaThirdPartyDependencies(heads) : []),
+        ...(members.includes('host-theia-browser') ? hostTheiaBrowserTheiaDependencies() : []),
+        ...(members.includes('host-theia-electron') ? hostTheiaElectronPins() : [])
+    ]);
+    return [...pins].filter(([, version]) => /^\d+\.\d+\.\d+$/.test(version)).sort(([left], [right]) => left.localeCompare(right));
+}
+/** Whether an npm version is 11.6.0 or later, the first that installs `vitest` 4.1's peer set; `11.6.0-rc.1` is earlier. */
+function installsVitest41(npmVersion) {
+    const [release, prerelease] = (npmVersion ?? '0.0.0').split('-', 2);
+    const [major, minor, patch] = release.split('.').map(Number);
+    return major > 11 || (major === 11 && (minor > 6 || (minor === 6 && (patch > 0 || prerelease === undefined))));
+}
+/**
+ * Whether the scaffold holds `vitest` below 4.1, whose peer set crashes npm
+ * before 11.6 (every npm a Node 22 release bundles) on the first install. Only a
+ * workspace root declaring a newer npm lifts it, and only when `init` runs under
+ * an npm known to be newer: npm does not enforce `packageManager`.
+ */
+function pinsVitest(composition) {
+    const workspace = composition.packaging.workspace;
+    return !(installsVitest41(workspace?.packageManagerNpm) && installsVitest41(workspace?.npmVersion));
+}
+/**
+ * The version a member pins a sibling member at: exact, at the version every
+ * member starts with. npm links a sibling only when the range admits its local
+ * version, and otherwise looks for it in the registry, where it was never
+ * published.
+ */
+const MEMBER_PIN = '0.0.0';
+/** A dependency block, sorted as npm writes it. */
+function sortedBlock(dependencies, indent) {
+    return Object.keys(dependencies)
+        .sort()
+        .map(name => `${indent}"${name}": "${dependencies[name]}"`)
+        .join(',\n');
+}
+/** The server's dependency block: the base and head set's packages and the protocol member. */
 function dependencyBlock(composition, indent) {
-    const merged = {};
-    for (const head of composition.heads) {
+    const merged = { [memberPackageName(composition, 'protocol')]: MEMBER_PIN };
+    for (const head of ['base', ...composition.heads]) {
         Object.assign(merged, HEAD_THIRD_PARTY_DEPENDENCIES[head]);
         for (const framework of HEAD_FRAMEWORK_DEPENDENCIES[head]) {
             merged[framework] = frameworkPin(composition);
         }
     }
-    return Object.keys(merged)
-        .sort()
-        .map(name => `${indent}"${name}": "${merged[name]}"`)
-        .join(',\n');
+    return sortedBlock(merged, indent);
 }
 // JSON at two-space indent, not the three the `.ts` templates use: that is the
 // npm convention, and `npm install` rewrites `package.json` at two spaces
 // regardless — so three would not survive the adopter's first install.
 //
-// The KEY ORDER is `prettier-plugin-packagejson`'s canonical one, `private`
+// The KEY ORDER is the one Oxfmt's `sortPackageJson` canonicalises to, `private`
 // before `license` included. Any other order is rewritten by the scaffolded
 // project's own first `format` run — a diff on a file the adopter never touched
 // — and it makes a byte-compare against a formatted copy of this emission
@@ -254,6 +491,11 @@ function dependencyBlock(composition, indent) {
 // from this package's own grammar and can reach a consumer from nowhere else; a
 // listed path that does not exist yet is inert.
 //
+// `exports` puts `createServices`, the one module reading the real filesystem,
+// behind `./node`, so the root loads in a browser worker that has no `node:fs`.
+// `./lib/*` and `./package.json` stay reachable for a host that resolves
+// `<server>/lib/main.js` to spawn the server.
+//
 // `repository` is deliberately NOT emitted while `author` is emitted empty. An
 // empty `author` is the form `npm init` itself writes and asserts nothing, but
 // `repository` is CONSUMED — the registry page, `npm repo` and publish
@@ -265,16 +507,9 @@ const PACKAGE_JSON = `{
   "version": "0.0.0",
 __PRIVATE__  "description": "__NAME__ language server, built with the Hydranium framework.",
   "keywords": [
-    "hydranium",
-    "langium",
-    "language-server",
-    "__PROJECT_ID__"
-  ],
+__KEYWORDS__  ],
   "license": "UNLICENSED",
   "author": "",
-  "type": "module",
-  "main": "lib/index.js",
-  "types": "lib/index.d.ts",
   "bin": {
 __BIN__  },
   "files": [
@@ -282,17 +517,32 @@ __BIN__  },
     "src",
     "syntaxes"
   ],
+  "type": "module",
+  "main": "lib/index.js",
+  "types": "lib/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./lib/index.d.ts",
+      "default": "./lib/index.js"
+    },
+    "./node": {
+      "types": "./lib/node/services.d.ts",
+      "default": "./lib/node/services.js"
+    },
+    "./lib/*": "./lib/*",
+    "./package.json": "./package.json"
+  },
   "scripts": {
-    "build": "npm run generate && tsc",
-    "clean": "rimraf lib syntaxes src/language-server/generated src/language-server/generated-hydranium tsconfig.tsbuildinfo",
+    "build": "npm run generate && tsc -b",
+    "clean": "rimraf lib syntaxes src/language-server/generated src/language-server/generated-hydranium test/generated-hydranium tsconfig.tsbuildinfo",
     "generate": "npm run langium:generate && npm run generate:transfer-model",
-    "generate:transfer-model": "hydranium-cli generate-transfer-model --ast-file src/language-server/generated/ast.ts --augmentation-file src/language-server/ast.ts --out-file src/language-server/generated-hydranium/transfer-model.ts --ast-builder-file src/language-server/generated-hydranium/ast-builder.ts --element-type-name __NAME__Element --terminals-name __NAME__Terminals --regen-command \\"Run: __NPM_RUN__ generate:transfer-model\\"",
+    "generate:transfer-model": "hydranium-cli generate-transfer-model --ast-file src/language-server/generated/ast.ts --augmentation-file src/language-server/ast.ts --out-file ../protocol/src/generated-hydranium/transfer-model.ts --ast-builder-file src/language-server/generated-hydranium/ast-builder.ts --transfer-builder-file test/generated-hydranium/transfer-builder.ts --languages-file ../protocol/src/generated-hydranium/languages.ts --element-type-name __NAME__Element --terminals-name __NAME__Terminals --regen-command \\"Run: __NPM_RUN__ generate:transfer-model\\"",
     "langium:generate": "langium generate",
     "langium:watch": "langium generate --watch",
-__LINT__    "start": "node lib/main.js --stdio",
+__LINT__    "start": "node lib/main.js__START_ARGS__",
     "test": "npm run typecheck:test && vitest run",
     "typecheck:test": "tsc --noEmit -p tsconfig.test.json",
-    "watch": "tsc --watch"
+    "watch": "concurrently --kill-others --names langium,transfer-model,tsc \\"npm run langium:watch\\" \\"npm run generate:transfer-model -- --watch\\" \\"tsc -b --watch\\""
   },
   "dependencies": {
 __DEPENDENCIES__
@@ -300,10 +550,11 @@ __DEPENDENCIES__
   "devDependencies": {
     "@hydranium/cli": "__FRAMEWORK_PIN__",
     "@types/node": "^22.0.0",
+    "concurrently": "^9.0.0",
     "langium-cli": "4.3.0",
     "rimraf": "^5.0.0",
-    "typescript": "^5.8.0",
-    "vitest": "^4.0.0"
+    "typescript": "^7.0.2",
+    "vitest": "__VITEST__"
   },
   "engines": {
     "node": ">=22.13"
@@ -311,16 +562,17 @@ __DEPENDENCIES__
 }
 `;
 /**
- * How the scaffold names `npm run` when talking about itself.
+ * How the scaffold names `npm run` for one member's script.
  *
- * A workspace member's scripts are routinely invoked from the repo root, where
- * a bare `npm run` reaches the ROOT manifest and fails — so the regen hint a
- * generated file prints has to name the package, or it sends every reader who
- * follows it to the wrong place.
+ * Always with `--prefix`, from the directory commands are run in: the
+ * workspace root for a member, the project root for a standalone project. A
+ * bare `npm run` there reaches the ROOT manifest and fails, and the regen hint
+ * a generated file prints is read in `protocol/` as well, where the script it
+ * names does not exist.
  */
-function npmRun(composition) {
+function npmRun(composition, member) {
     const workspace = composition.packaging.workspace;
-    return workspace === undefined ? 'npm run' : `npm --prefix ${workspace.targetPath} run`;
+    return `npm --prefix ${workspace === undefined ? member : `${workspace.targetPath}/${member}`} run`;
 }
 /**
  * The `bin` targets, one per executable entry the head set emits.
@@ -331,7 +583,7 @@ function npmRun(composition) {
  * name. Without the second key a scaffolded project has no command line that
  * reaches its own data head at all.
  *
- * Alphabetical, because `prettier-plugin-packagejson` sorts `bin` and any other
+ * Alphabetical, because Oxfmt's `sortPackageJson` sorts `bin` and any other
  * order is rewritten by the scaffolded project's first `format` run.
  */
 function binBlock(composition) {
@@ -341,21 +593,37 @@ function binBlock(composition) {
     }
     return entries.map(([name, target]) => `    "${name}": "${target}"`).join(',\n') + '\n';
 }
-/** `package.json` with the name, the private flag and the dependency block all derived. */
+/**
+ * A member's `lint` script line, over `directories`, or nothing.
+ *
+ * Emitted only where a root lint config says the repo lints. The absence is
+ * the dangerous direction: a task runner runs a script only where one is
+ * declared, so a package with no `lint` is SKIPPED rather than reported, and
+ * that reads as a clean lint. A wrong invocation is one visible line to edit.
+ */
+function lintScript(member, directories) {
+    const workspace = member.packaging.workspace;
+    if (workspace?.oxlintConfig !== undefined) {
+        const config = `${'../'.repeat(workspace.targetPath.split('/').length)}${workspace.oxlintConfig}`;
+        return `    "lint": "oxlint --report-unused-disable-directives --format stylish --config ${config} ${directories} --max-warnings 0",\n`;
+    }
+    return workspace?.eslintConfig !== undefined ? `    "lint": "eslint ${directories} --max-warnings 0",\n` : '';
+}
+/** The server's `package.json`, with the name, the private flag and the dependency block all derived. */
 function packageJson(composition) {
-    const { scope } = composition.packaging;
-    const packageName = scope === undefined ? composition.projectId : `${scope}/${composition.projectId}`;
-    // Emitted only where a root eslint config says the repo lints. The absence is
-    // the dangerous direction: a task runner runs a script only where one is
-    // declared, so a package with no `lint` is SKIPPED rather than reported, and
-    // that reads as a clean lint. A wrong invocation is one visible line to edit.
-    const lint = composition.packaging.workspace?.eslintConfig === undefined ? '' : '    "lint": "eslint src test --max-warnings 0",\n';
+    const keywords = ['hydranium', 'langium', 'language-server', composition.projectId]
+        .sort()
+        .map(keyword => `    ${JSON.stringify(keyword)}`)
+        .join(',\n') + '\n';
     return project(PACKAGE_JSON, composition)
-        .replace('__PACKAGE_NAME__', packageName)
+        .replace('__PACKAGE_NAME__', memberPackageName(composition, 'server'))
+        .replace('__KEYWORDS__', keywords)
         .replace('__BIN__', binBlock(composition))
-        .replace('__LINT__', lint)
+        .replace('__LINT__', lintScript(forMember(composition, 'server'), 'src test'))
+        .replace('__START_ARGS__', composition.heads.includes('lsp') ? ' --stdio' : ' ../workspace')
+        .replace('__VITEST__', pinsVitest(composition) ? '~4.0.18' : '^4.0.0')
         .replace('__PRIVATE__', composition.packaging.private ? '  "private": true,\n' : '')
-        .replace('__NPM_RUN__', npmRun(composition))
+        .replace('__NPM_RUN__', npmRun(composition, 'server'))
         .replace('__FRAMEWORK_PIN__', frameworkPin(composition))
         .replace('__DEPENDENCIES__', dependencyBlock(composition, '    '));
 }
@@ -418,6 +686,23 @@ const TSCONFIG_COMPILER_OPTIONS = [
     ['forceConsistentCasingInFileNames', true],
     ['types', ['node']]
 ];
+/** The protocol member's compiler options, pruned against a workspace base like the server's. */
+const PROTOCOL_COMPILER_OPTIONS = [
+    ['target', 'ES2022'],
+    ['lib', ['ES2022']],
+    ['module', 'NodeNext'],
+    ['moduleResolution', 'NodeNext'],
+    ['rootDir', 'src'],
+    ['outDir', 'lib'],
+    ['strict', true],
+    ['skipLibCheck', true],
+    ['declaration', true],
+    // The server's `tsc -b` builds this project through a reference, which
+    // `tsc` refuses unless the referenced project is composite.
+    ['composite', true],
+    // No ambient Node types: a browser client compiles against this package.
+    ['types', []]
+];
 /**
  * The options that describe where THIS package's own files live. Never pruned,
  * and emitted first in the workspace case: a base config that supplied them
@@ -425,9 +710,19 @@ const TSCONFIG_COMPILER_OPTIONS = [
  * base is wrong rather than that the member is redundant.
  */
 const PACKAGE_LOCAL_OPTIONS = ['rootDir', 'outDir'];
-/** Compare two JSON option values. Sound here because compiler options are scalars and flat arrays. */
-function jsonEquals(left, right) {
-    return JSON.stringify(left) === JSON.stringify(right);
+/**
+ * The enum-valued options of {@link TSCONFIG_COMPILER_OPTIONS}, whose values
+ * `tsc` reads case-insensitively, so `nodenext` and `NodeNext` are one value.
+ * An enum-valued option added there belongs here too.
+ */
+const CASE_INSENSITIVE_OPTIONS = ['target', 'lib', 'module', 'moduleResolution'];
+/** Compare two option values. Sound here because compiler options are scalars and flat arrays. */
+function optionEquals(key, left, right) {
+    const normalise = (value) => {
+        const text = JSON.stringify(value);
+        return CASE_INSENSITIVE_OPTIONS.includes(key) ? text?.toLowerCase() : text;
+    };
+    return normalise(left) === normalise(right);
 }
 /**
  * `tsconfig.json`, extending the workspace's base config when there is one.
@@ -436,104 +731,43 @@ function jsonEquals(left, right) {
  * the same key: inheriting `"module": "CommonJS"` where the scaffold needs
  * `NodeNext` would break every emitted import, so a differing base value is a
  * reason to keep the override rather than to trust the parent.
+ *
+ * `member` is the composition as that member sees it, so `extends` reaches the
+ * workspace base from the member's own directory.
  */
-function tsconfigJson(composition) {
-    const workspace = composition.packaging.workspace;
+function tsconfigJson(member, compilerOptions, include, references = '') {
+    const workspace = member.packaging.workspace;
     const base = workspace?.baseTsconfig === undefined ? undefined : (workspace.baseCompilerOptions ?? {});
     const options = base === undefined
-        ? TSCONFIG_COMPILER_OPTIONS
+        ? compilerOptions
         : [
-            ...TSCONFIG_COMPILER_OPTIONS.filter(([key]) => PACKAGE_LOCAL_OPTIONS.includes(key)),
-            ...TSCONFIG_COMPILER_OPTIONS.filter(([key, value]) => !PACKAGE_LOCAL_OPTIONS.includes(key) && !jsonEquals(base[key], value))
+            ...compilerOptions.filter(([key]) => PACKAGE_LOCAL_OPTIONS.includes(key)),
+            ...compilerOptions.filter(([key, value]) => !PACKAGE_LOCAL_OPTIONS.includes(key) && !optionEquals(key, base[key], value))
         ];
     const extendsLine = workspace?.baseTsconfig === undefined ? '' : `  "extends": "${workspace.baseTsconfig}",\n`;
-    const body = options.map(([key, value]) => `    "${key}": ${JSON.stringify(value)}`).join(',\n');
-    return `{\n${extendsLine}  "compilerOptions": {\n${body}\n  },\n  "include": ["src", "src/**/*.json"]\n}\n`;
-}
-// `isolatedModules` is what makes this check agree with the transform that
-// actually runs the tests. `npm test` is `typecheck:test && vitest run`, and
-// vitest compiles through esbuild — a per-file transform with no type
-// information, which cannot tell a re-exported TYPE from a re-exported value.
-// Without the flag `tsc` accepts `export { SomeType } from './x'` that esbuild
-// then emits as a real import of a symbol that does not exist at runtime, so
-// the typecheck passes and the suite fails with a confusing missing-export.
-const TSCONFIG_TEST = `{
-  "extends": "./tsconfig.json",
-  "compilerOptions": {
-    "rootDir": ".",
-    "noEmit": true,
-    "isolatedModules": true,
-    "types": ["node"]
-  },
-  "include": ["src", "test", "src/**/*.json"]
+    // An array spaced as a formatter writes it, which `JSON.stringify` does not.
+    const json = (value) => (Array.isArray(value) ? `[${value.map(json).join(', ')}]` : JSON.stringify(value));
+    const body = options.map(([key, value]) => `    "${key}": ${json(value)}`).join(',\n');
+    const referencesLine = references === '' ? '' : `,\n  "references": ${references}`;
+    return `{\n${extendsLine}  "compilerOptions": {\n${body}\n  },\n  "include": ${include}${referencesLine}\n}\n`;
 }
-`;
-const VITEST_CONFIG = `import { defineConfig } from 'vitest/config';
-
-// Vitest transforms TypeScript itself and resolves \`.js\` specifiers to their
-// \`.ts\` source, so tests import from \`../src/\` with the same specifiers the
-// compiled output uses. \`include\` is scoped to \`test/\` so \`lib/\` is never
-// scanned; \`npm test\` runs \`typecheck:test\` first, because the esbuild
-// transform strips types without checking them.
-
-export default defineConfig({
-   test: {
-      environment: 'node',
-      include: ['test/**/*.{test,spec}.ts']
-   }
-});
-`;
-const GITIGNORE = `node_modules/
-lib/
-*.tsbuildinfo
-
-# Langium-generated TextMate grammar (rewritten by every \`langium generate\`).
-syntaxes/
-`;
 /**
- * The workspace-member `.gitignore` — one entry, and the one entry a root
- * cannot be assumed to have.
- *
- * A member inherits the root's rules, and `node_modules/`, `lib/` and
- * `*.tsbuildinfo` are in every monorepo root already, so repeating them here
- * would be three lines to keep in step for no coverage. `syntaxes/` is not like
- * them: it is a Langium artefact, so a root that has never held a Langium
- * package has no rule for it, and the first `langium generate` then offers
- * generated output up for commit with nothing to warn the adopter. Dropping the
- * whole file rather than this subset is the mistake this template exists to
- * undo.
- */
-const GITIGNORE_WORKSPACE_MEMBER = `# The workspace root already covers \`node_modules/\`, \`lib/\` and \`*.tsbuildinfo\`.
-# It has no reason to know about this one: the TextMate grammar is a Langium
-# artefact, rewritten by every \`langium generate\`, so a root that has never held
-# a Langium package ignores nothing here and the generated file is offered for
-# commit.
-syntaxes/
-`;
-/** The terminals every grammar needs, shared verbatim by the fragment and the lone-grammar case. */
-const TERMINALS = `hidden terminal WS: /\\s+/;
-terminal ID: /[_a-zA-Z][\\w_]*/;
-hidden terminal SL_COMMENT: /\\/\\/[^\\n\\r]*/;
-hidden terminal ML_COMMENT: /\\/\\*[\\s\\S]*?\\*\\//;
-`;
+ * The server's `tsconfig.json`. It references the protocol member, so `tsc -b`
+ * compiles protocol first, after `generate` has written its generated modules.
+ */
+function serverTsconfigJson(composition) {
+    return tsconfigJson(forMember(composition, 'server'), TSCONFIG_COMPILER_OPTIONS, '["src", "src/**/*.json"]', '[{ "path": "../protocol" }]');
+}
 /**
- * The shared lexical fragment, emitted only for a multi-grammar project.
- *
- * The alternative — every grammar declaring its own `WS` / `ID` — lets the token
- * sets drift apart.
+ * The terminals every grammar needs: the shared fragment's text after its
+ * leading comment run, so a lone grammar declares the same set.
  */
-const COMMON_GRAMMAR = `// Shared lexical basis for this project's grammars. Imported, never registered:
-// it has no entry rule and no \`langium-config.json\` entry, so it is a fragment
-// rather than a language.
-//
-// Keeping the tokens here rather than in one of the languages means a grammar
-// imports \`common\` for its TOKENS and another language only when it needs that
-// language's TYPES — separate reasons that are worth keeping separate.
-
-${TERMINALS}`;
+function terminals() {
+    return template('server/src/grammar/common.langium').replace(/^(\/\/.*\n)*\n/, '');
+}
 /** One starter grammar. `shared` decides whether it imports the fragment or declares its own terminals. */
 function grammarFile(shared) {
-    const lexis = shared ? "import './common'\n" : `\n${TERMINALS}`;
+    const lexis = shared ? "import './common'\n" : `\n${terminals()}`;
     return `grammar __GRAMMAR__
 ${shared ? '\n' + lexis : ''}
 // A minimal starter grammar — replace with your own language. \`__NODE_RULE__\` is
@@ -593,7 +827,10 @@ export const __CONFIG_ROOT_CONST___CONFIGURATION_ROOT = '__PROJECT_ID__';
 };`
         : `const __NAME__SharedModule: Module<__NAME__SharedServices, PartialLangiumSharedServices> = {};`;
     const serializerImports = composition.grammars
-        .map(grammar => `import { ${grammar.grammar}Serializer } from './${grammar.grammarId}-serializer.js';`)
+        .flatMap(grammar => [
+        `import { ${grammar.grammar}Serializer } from './${grammar.grammarId}-serializer.js';`,
+        `import { ${grammar.grammar}ValidationContribution } from './${grammar.grammarId}-validation.js';`
+    ])
         .join('\n');
     // Each language gets its own adopter module because `Serializer` is a
     // per-language slot. `additionalLanguages` defaults its `adopter` to the
@@ -603,6 +840,11 @@ export const __CONFIG_ROOT_CONST___CONFIGURATION_ROOT = '__PROJECT_ID__';
         .map(grammar => `const ${grammar.grammar}LanguageModule: Module<__NAME__Services, PartialLangiumServices & DeepPartial<ServerAddedServices>> = {
    serializer: {
       Serializer: services => new ${grammar.grammar}Serializer(services)
+   },
+   validation: {
+      checks: {
+         names: () => new ${grammar.grammar}ValidationContribution()
+      }
    }
 };`)
         .join('\n\n');
@@ -616,11 +858,11 @@ export const __CONFIG_ROOT_CONST___CONFIGURATION_ROOT = '__PROJECT_ID__';
         : `${primary.grammar}: language`;
     const text = `// DI bootstrap for __NAME__. Composes the framework defaults with adopter
 // overrides via Langium's \`inject()\` (through the framework's
-// \`createIntegrationServices\`). Each adopter module binds ONE slot — its
-// language's \`Serializer\`, which the framework cannot default because a
-// concrete syntax is grammar knowledge. Everything else (scope, naming, project
-// management, build pipeline) boots on the framework defaults; scope
-// computation, validation checks and AST extensions go in these same modules.
+// \`createIntegrationServices\`). Each adopter module binds its language's
+// \`Serializer\`, which the framework cannot default because a concrete syntax
+// is grammar knowledge, and its validation checks. Everything else (scope,
+// naming, project management, build pipeline) boots on the framework defaults;
+// scope computation and AST extensions go in these same modules.
 //
 // Note which generated symbol comes from which name: the SHARED module is
 // \`__NAME__GeneratedSharedModule\` (from \`projectName\`) and there is one of it,
@@ -634,7 +876,11 @@ export const __CONFIG_ROOT_CONST___CONFIGURATION_ROOT = '__PROJECT_ID__';
         : `
 //
 // A second grammar goes in the \`additionalLanguages\` option of
-// \`createIntegrationServices\`, generated from this same \`langium-config.json\`.`}
+// \`createIntegrationServices\`, generated from this same \`langium-config.json\`.
+// With several languages, bind \`lsp.configurationRoot\` in
+// \`__NAME__SharedModule\`, or the framework warns and takes the first
+// language's id. Type that module's second \`Module\` argument as
+// \`PartialLangiumSharedServices & { lsp: { configurationRoot: string } }\`.`}
 
 ${importList(['createLspServerLanguageModule', 'createLspServerSharedModule', 'type LspServerAddedServices', 'type LspServerAddedSharedServices'], '@hydranium/core/lsp', columns)}
 import { createIntegrationServices, type ServerAddedServices, type ServerModuleContext, type ServerSharedServices } from '@hydranium/core';
@@ -701,179 +947,121 @@ ${returnType}
 `;
     return project(text, composition);
 }
-const SERVICES = `// Zero-arg service factory for the headless \`hydranium-cli\` tooling: the
-// \`reflect\` / \`lint-grammar\` / \`validate\` subcommands import this via
-// \`--services ./lib/services.js\`. The head wires its own filesystem here.
-//
-// The contract is language-count-agnostic — a second grammar needs no edit here.
-
-import { NodeFileSystem } from '@hydranium/core/node';
-import { create__NAME__Services } from './language-server/__PROJECT_ID__-module.js';
-
-export function createServices(): ReturnType<typeof create__NAME__Services> {
-   return create__NAME__Services({ ...NodeFileSystem });
-}
-`;
-const AST = `// The language's AST entry point: a re-export of what \`langium generate\`
-// emits, plus anywhere you augment those types.
-//
-// Import the AST from HERE rather than from \`./generated/ast.js\`, so any
-// augmentation below travels with every import. One \`langium-cli\` run over N
-// grammars emits ONE combined AST module sharing one reflection, so a further
-// grammar needs no change here.
-//
-// \`generate:transfer-model\` reads this file as its \`--augmentation-file\`: the
-// generated wire types are derived from the AST *as augmented*, not from the
-// raw generated module. Augment a type here and the transfer model follows.
-//
-// A \`@derived\` property is computed at build time rather than parsed, so it is
-// declared here and populated by an AST-extension contribution:
-//
-// declare module './generated/ast.js' {
-//    interface __ENTRY_RULE__ {
-//       /** @derived Populated by an \`ast.extensions.computedProperties\` contribution. */
-//       readonly _summary?: string;
-//    }
-// }
-
-export * from './generated/ast.js';
-`;
 /**
- * The starter serializer — the concrete-syntax emitter for ONE grammar.
+ * How a host finds each socket head's port, in emission order: an LSP request
+ * when the LSP head publishes the ports, else the environment variable
+ * `main.ts` reads a port from.
  *
- * Emitted per grammar, not per project, because `services.serializer.Serializer`
- * is a per-language slot and a serializer is grammar-shaped by definition. That
- * is also why the framework refuses to default it: its `UnboundSerializer`
- * throws, naming the binding to add, rather than guessing a syntax.
- */
-const SERIALIZER = `// Concrete-syntax emitter for __GRAMMAR__ — the parser's inverse, turning a
-// model back into text this grammar accepts. Derived from the starter grammar
-// exactly as \`generated/ast.ts\` is, so replacing the grammar replaces this too.
-//
-// Without it every structured write fails: the framework's default binding at
-// \`services.serializer.Serializer\` THROWS, because a concrete syntax is
-// language knowledge no framework can derive. \`ModelService.update\` / \`save\`,
-// the data head's \`saveModelDocument\` and a GLSP \`SaveModelAction\` all reach
-// it.
-//
-// \`AbstractSerializer\`'s generic property walk lays out FORMAT-structured
-// output — its YAML and JSON subclasses are what it exists for — and cannot
-// produce a keyword-delimited syntax like \`node a -> b\`. So \`serializeNode\` is
-// a per-\`$type\` emitter here and the two array hooks are unreachable.
-
-import { AbstractSerializer } from '@hydranium/core';
-import type { AstNode } from '@hydranium/langium';
-import { type __ENTRY_RULE__, type __NODE_RULE__, is__ENTRY_RULE__, is__NODE_RULE__ } from './ast.js';
-
-export class __GRAMMAR__Serializer extends AbstractSerializer<__ENTRY_RULE__> {
-   protected override serializeNode(node: AstNode | Record<string, unknown>): string {
-      if (is__ENTRY_RULE__(node)) {
-         return node.nodes.map(child => this.emitNode(child)).join('\\n');
-      }
-      if (is__NODE_RULE__(node)) {
-         return this.emitNode(node);
-      }
-      // Defensive: a rule added to the grammar with no emitter added here.
-      throw new Error(\`__GRAMMAR__Serializer: no emitter for $type \${(node as AstNode).$type}\`);
-   }
-
-   /** Unreachable — this grammar's one list is emitted by its \`__ENTRY_RULE__\` parent. */
-   protected override serializeArray(): string {
-      throw new Error('__GRAMMAR__Serializer: arrays are emitted by the per-$type parent, not the generic dispatch.');
-   }
-
-   /** Unreachable — same reasoning as {@link serializeArray}. */
-   protected override serializeReferenceArray(): string {
-      throw new Error('__GRAMMAR__Serializer: reference arrays are emitted by the per-$type parent, not the generic dispatch.');
-   }
-
-   /**
-    * \`serializeReferenceText\` rather than \`node.target?.$refText\`: it is the one
-    * read that spans BOTH input shapes. A transfer model reaching
-    * \`serializeTransfer\` carries \`target\` as a plain string rather than a
-    * \`Reference\`, and a serializer that reaches for \`$refText\` directly emits
-    * the AST correctly and drops every reference on the transfer path.
-    */
-   private emitNode(node: __NODE_RULE__): string {
-      const target = this.serializeReferenceText(node.target);
-      return target === undefined ? \`node \${node.name}\` : \`node \${node.name} -> \${target}\`;
-   }
-}
-`;
-/**
- * The exported constant names for the head set, in emission order. Both are
- * keyed by the PROJECT rather than by a language: one server of each kind per
+ * Keyed by the PROJECT rather than by a language: one server of each kind per
  * process serves every registered grammar, so a language-derived name would tie
  * a project-level endpoint to whichever grammar was scaffolded first.
  */
-function portCommandNames(composition) {
+function headPortConstants(composition) {
     const upper = screamingSnake(composition.projectId);
+    const lsp = composition.heads.includes('lsp');
+    return socketHeads(composition).map(head => lsp
+        ? {
+            name: `${upper}_${head.key}_PORT_COMMAND`,
+            value: `${composition.projectId}/${head.path}/port`,
+            doc: `LSP request the host queries to discover the ${head.label} socket port.`
+        }
+        : {
+            name: `${upper}_${head.key}_PORT_ENV`,
+            value: `${upper}_${head.key}_PORT`,
+            doc: `Environment variable naming the ${head.label} socket port when no \`--${head.path}-port\` flag does.`
+        });
+}
+/** The socket heads of the composition, as `head-ports.ts` names them. */
+function socketHeads(composition) {
     return [
-        ...(composition.heads.includes('data') ? [`${upper}_DATA_SERVER_PORT_COMMAND`] : []),
-        ...(composition.heads.includes('glsp') ? [`${upper}_GLSP_PORT_COMMAND`] : [])
+        ...(composition.heads.includes('data')
+            ? [{ key: 'DATA_SERVER', path: 'data-server', command: 'dataServer', label: 'data-server' }]
+            : []),
+        ...(composition.heads.includes('glsp') ? [{ key: 'GLSP_SERVER', path: 'glsp-server', command: 'glsp', label: 'GLSP' }] : [])
     ];
 }
+/** Whether the composition emits the servers-only extension, which VS Code starts the server through and a Theia app sideloads. */
+function emitsVscodeServers(composition) {
+    return initMembers(composition.heads, composition.hosts).includes('vscode-servers');
+}
+/**
+ * The host commands the servers extension answers each socket head's port
+ * under, for a host without a language client of its own.
+ */
+function hostCommandConstants(composition) {
+    if (!emitsVscodeServers(composition)) {
+        return [];
+    }
+    const upper = screamingSnake(composition.projectId);
+    return socketHeads(composition).map(head => ({
+        name: `${upper}_${head.key}_HOST_COMMAND`,
+        value: `${composition.projectId}.port.${head.command}`,
+        doc: `Host command the servers extension answers with the ${head.label} socket port.`
+    }));
+}
 /**
- * The socket heads' discovery commands, as an importable module.
+ * The socket heads' port commands or variables, in the protocol member.
  *
- * Deliberately NOT declared in `main.ts`. A host shell has to name the same
- * string to reach the head, and `main.ts` opens a connection at module scope,
- * so importing a constant from it would start a server. A host that retypes the
- * literal instead gets no error when it drifts: the framework's port poll
- * defaults to `findPortAttempts = -1`, so a wrong command retries forever
- * rather than failing.
+ * A host shell has to name the same string the server reads, and reaches it
+ * here without depending on the server. A host that retypes the literal
+ * instead gets no error when it drifts: the framework's port poll defaults to
+ * `findPortAttempts = -1`, so a wrong command retries forever rather than
+ * failing, and a wrong variable is never read.
  */
 function headPortsFile(composition) {
-    const upper = screamingSnake(composition.projectId);
-    const data = composition.heads.includes('data');
-    const glsp = composition.heads.includes('glsp');
-    const blocks = [
-        ...(data
-            ? [
-                `/** LSP request the host queries to discover the data-server socket port. */\nexport const ${upper}_DATA_SERVER_PORT_COMMAND = '${composition.projectId}/data-server/port';`
-            ]
-            : []),
-        ...(glsp
-            ? [
-                `/** LSP request the host queries to discover the GLSP socket port. */\nexport const ${upper}_GLSP_PORT_COMMAND = '${composition.projectId}/glsp/port';`
-            ]
-            : [])
-    ];
-    return `// The LSP requests a host queries to discover this server's socket head${blocks.length > 1 ? 's' : ''}.
+    const constants = [...headPortConstants(composition), ...hostCommandConstants(composition)];
+    const blocks = constants.map(constant => `/** ${constant.doc} */\nexport const ${constant.name} = '${constant.value}';`);
+    const socketHeadCount = socketHeads(composition).length;
+    const heads = `socket head${socketHeadCount > 1 ? 's' : ''}`;
+    const opening = composition.heads.includes('lsp')
+        ? `// The LSP requests a host queries to discover this server's ${heads}.`
+        : `// The environment variables that name the ports of this server's ${heads}.`;
+    const usage = composition.heads.includes('lsp')
+        ? `// The server publishes them and a host shell has to name the same string to
+// reach the head; both import them from here. A shell that retypes the literal
+// gets no error when it drifts: the framework's port poll retries indefinitely
+// by default.`
+        : `// The server reads them and a process that starts it sets them; both import
+// them from here. A variable retyped with a typo is never read, and the head
+// then listens on whichever port is free.`;
+    const hostCommands = emitsVscodeServers(composition)
+        ? `
+//
+// The host commands are the same ports for a host with no language client,
+// such as a Theia app sideloading the servers extension: it runs the command
+// and the extension sends the request.`
+        : '';
+    return `${opening}
 //
-// Both are keyed by the PROJECT, not the language: one server of each kind per
+// ${socketHeadCount > 1 ? 'Both are' : 'It is'} keyed by the PROJECT, not the language: one server of each kind per
 // process serves every registered grammar, so a language-derived name would tie
 // a project-level endpoint to whichever grammar was scaffolded first.
 //
-// They live here rather than in \`main.ts\` because a host shell has to name the
-// same string to reach the head, and \`main.ts\` is an executable entry — nothing
-// can import from it. A shell that retypes the literal gets no error when it
-// drifts: the framework's port poll retries indefinitely by default. Import
-// these instead, and assert any host-side copy against them.
+${usage}${hostCommands}
 
 ${blocks.join('\n\n')}
 `;
 }
-const INDEX = `// Public surface of the __NAME__ language server: the DI factory, the generated
-// AST, and the headless \`createServices\` entry.
+/**
+ * The server's root entry: the DI factory, the generated AST and each diagram
+ * module, all loadable in a browser worker.
+ */
+function indexFile(composition) {
+    const diagrams = composition.grammars.filter(grammar => grammar.diagram);
+    const diagramPhrase = diagrams.length === 0 ? '' : diagrams.length === 1 ? ', plus the diagram module' : ', plus the diagram modules';
+    const text = `// Public surface of the __NAME__ language server: the DI factory and the
+// generated AST${diagramPhrase}.
 //
-// The entry points under \`src/\` are deliberately NOT re-exported. Each opens a
-// transport at module scope, so importing one starts a server as a side effect
-// — which is why they are \`bin\` targets and this file is \`main\`.
+// Everything here loads in a browser worker as well as in Node, so a host can
+// compose the language wherever it runs it. \`createServices\`, which reads the
+// real filesystem, is the package's \`./node\` entry instead. The entry points
+// under \`src/\` are not re-exported either: each opens a transport at module
+// scope, so importing one starts a server, which is why they are \`bin\` targets.
 
 export * from './language-server/__PROJECT_ID__-module.js';
 export * from './language-server/ast.js';
-export { createServices } from './services.js';
-`;
-/**
- * The public surface, plus the head-port commands when there is a socket head.
- *
- * The commands belong here rather than only in `head-ports.ts` so a host shell
- * reaches them from the package root, the same way it reaches `createServices`.
- */
-function indexFile(composition) {
-    const base = project(INDEX, composition);
-    return portCommandNames(composition).length ? `${base}export * from './head-ports.js';\n` : base;
+${diagrams.map(grammar => `export * from './glsp/${grammar.grammarId}/diagram-module.js';\n`).join('')}`;
+    return project(text, composition);
 }
 /**
  * The `#!` line every emitted `bin` target carries.
@@ -899,12 +1087,14 @@ const SHEBANG = '#!/usr/bin/env node\n';
  */
 function mainFile(composition) {
     const columns = columnsFor(composition);
-    const roots = [...composition.grammars.map(grammar => grammar.entryRule)].sort();
+    const roots = composition.grammars.map(grammar => grammar.entryRule).sort();
     const upper = screamingSnake(composition.projectId);
+    const lsp = composition.heads.includes('lsp');
     const data = composition.heads.includes('data');
     const glsp = composition.heads.includes('glsp');
     const diagrams = composition.grammars.filter(grammar => grammar.diagram);
     const plural = roots.length > 1 ? 's' : '';
+    const portFlags = [...(data ? ['--data-server-port'] : []), ...(glsp ? ['--glsp-server-port'] : [])];
     const headNames = composition.heads.map(head => head === 'lsp' ? 'the Langium LSP head' : head === 'data' ? 'a socket data-server (model server) head' : 'a GLSP head');
     // Comma-joined but for the last, which takes `and`: a bare `, ` join reads as
     // a truncated list, and the emitted comment is the first thing an adopter
@@ -913,7 +1103,7 @@ function mainFile(composition) {
     // `reflect-metadata` must be imported before anything that reads a
     // decorator's emitted metadata, which inversify does at module scope.
     const reflectImport = glsp ? "import 'reflect-metadata';\n" : '';
-    const coreNodeSymbols = ['NodeFileSystem', ...(data ? ['publishPortOnLspConnection', 'startSocketServer'] : [])];
+    const coreNodeSymbols = ['NodeFileSystem', ...(data ? [...(lsp ? ['publishPortOnLspConnection'] : []), 'startSocketServer'] : [])];
     const glspImports = glsp
         ? `import { ServerModule } from '@eclipse-glsp/server/node.js';
 import { GlspClientLogger, HydraniumGlspAppModule } from '@hydranium/glsp-server';
@@ -930,44 +1120,57 @@ import { startGlspServer } from '@hydranium/glsp-server/node';
 // \`TransferElement\` structurally, so naming the AST type here compiles fine and
 // silently tells every typed client that a reference is a resolvable object
 // rather than a name.
-${importList(roots, './language-server/generated-hydranium/transfer-model.js', columns, true)}
+${importList(roots, memberPackageName(composition, 'protocol'), columns, true)}
 `
         : '';
-    // The commands live in `head-ports.ts`, not here: a host shell has to name
-    // the same string to reach the head, and this file is an executable entry, so
-    // nothing can import from it.
-    const portCommands = portCommandNames(composition).length
-        ? importList(portCommandNames(composition), './head-ports.js', columns) + '\n'
-        : '';
-    const dataBlock = data
-        ? `
+    // The names live in the protocol member, not here: a host shell has to name
+    // the same string to reach the head, and this file is an executable entry,
+    // so nothing can import from it.
+    const portNames = headPortConstants(composition).map(constant => constant.name);
+    const portImports = portNames.length ? importList(portNames, memberPackageName(composition, 'protocol'), columns) + '\n' : '';
+    const dataBlock = !data
+        ? ''
+        : !lsp
+            ? `
+// Data-server head: each accepted client gets its own DataServer.
+const dataServer = startSocketServer(
+   { shared, workspace, port: portFrom('data-server-port', ${upper}_DATA_SERVER_PORT_ENV), logTag: 'ModelServer', logger: shared.Logger },
+   dataConnection => {
+      new DataServer<${roots.join(' | ')}>(dataConnection, shared);
+      return { dispose: () => undefined };
+   }
+);
+`
+            : `
 // Data-server head alongside LSP: binds an ephemeral port, published over the LSP
 // connection for the host to discover. Each accepted client gets its own DataServer.
 //
 // Neither the bind nor the publish may be swallowed: either failure leaves the LSP
 // head serving text edits while every data client waits on a port command that was
 // never registered, and the launcher reports a bind failure only if given a logger.
-const dataServer = startSocketServer({ port: 0, logTag: 'ModelServer', logger: shared.Logger }, dataConnection => {
+const dataServer = startSocketServer({ shared, port: 0, logTag: 'ModelServer', logger: shared.Logger }, dataConnection => {
    new DataServer<${roots.join(' | ')}>(dataConnection, shared);
    return { dispose: () => undefined };
 });
 dataServer.started
-   .then(() => {
-      const { port } = dataServer;
-      if (port === undefined) {
-         // \`started\` resolves only once the address is resolved, so this is
-         // unreachable; a non-null assertion in its place would publish
-         // \`undefined\`, which the host cannot tell from an unreachable port.
-         throw new Error('the data head started without a resolved port');
-      }
-      publishPortOnLspConnection(shared.lsp.Connection, ${upper}_DATA_SERVER_PORT_COMMAND, port);
-   })
+   .then(
+      () => {
+         const { port } = dataServer;
+         if (port === undefined) {
+            // \`started\` resolves only once the address is resolved, so this is
+            // unreachable; a non-null assertion in its place would publish
+            // \`undefined\`, which the host cannot tell from an unreachable port.
+            throw new Error('the data head started without a resolved port');
+         }
+         publishPortOnLspConnection(shared.lsp.Connection, ${upper}_DATA_SERVER_PORT_COMMAND, port);
+      },
+      // The launcher logged its own bind failure; the rejection is control flow.
+      () => undefined
+   )
    .catch((error: unknown) => {
-      const reason = error instanceof Error ? error.message : String(error);
-      shared.Logger.error(\`[ModelServer] Could not publish the data-server port: \${reason}\`);
+      shared.Logger.error(\`[ModelServer] Could not publish the data-server port: \${describeErrorWithStack(error)}\`);
    });
-`
-        : '';
+`;
     const glspBlock = glsp
         ? `
 // GLSP head on the same shared workspace. \`HydraniumGlspAppModule\` is used
@@ -975,89 +1178,146 @@ dataServer.started
 // grammar a request concerns, so nothing per-language belongs there — each
 // diagram module declares its own language instead.
 //
-// GLSP framework logs route through the LSP connection rather than stdout, which
-// IS the LSP transport in stdio mode; writing there corrupts the protocol stream.
+${lsp
+            ? `// GLSP framework logs route through the LSP connection rather than stdout, which
+// IS the LSP transport in stdio mode; writing there corrupts the protocol stream.`
+            : `// GLSP framework logs route through the framework's logger to stderr. GLSP's
+// own startup line goes to stdout, beside the ports line below.`}
 const glspServer = startGlspServer({
    // The GLSP log threshold lives on the logger, not beside it: the framework
    // replaces GLSP's own \`Logger\` binding, so a launcher-level \`logLevel\` would
    // be discarded. The logger tracks the framework's process-wide threshold, so
-   // \`HYDRANIUM_LOG_LEVEL\` and the LSP log-level setting govern GLSP output too;
+   // \`HYDRANIUM_LOG_LEVEL\` ${lsp ? 'and the LSP log-level setting govern' : 'governs'} GLSP output too;
    // pass \`logLevel\` only to make GLSP quieter than the rest of the server.
    createLogger: caller => new GlspClientLogger(shared, { component: caller }),
    serverModule: new ServerModule()${diagrams.map(grammar => `.configureDiagramModule(new ${grammar.grammar}DiagramModule())`).join('')},
    appModules: [new HydraniumGlspAppModule({ shared })],
-   lspConnection: shared.lsp.Connection,
-   portCommand: ${upper}_GLSP_PORT_COMMAND
+${lsp
+            ? `   lspConnection: shared.lsp.Connection,
+   portCommand: ${upper}_GLSP_SERVER_PORT_COMMAND`
+            : `   workspace,
+   port: portFrom('glsp-server-port', ${upper}_GLSP_SERVER_PORT_ENV),
+   logger: shared.Logger`}
 });
-void glspServer;
-`
+${lsp ? 'void glspServer;\n' : ''}`
         : '';
-    const text = `${SHEBANG}// Standalone entry point: starts ${headSummary} in the same
-// process, so every head shares one model store.
-// Invocation: \`node lib/main.js --stdio\`, or the package's \`__PROJECT_ID__\` bin
-// script.${data
-        ? `
-//
-// NOT the entry \`hydranium-cli query\` / \`save\` / \`projects\` / \`watch\` speak to:
-// stdio here carries LSP, and the data head is a socket whose port is published
-// over the LSP connection. Those subcommands spawn \`data-server-main.js\`.`
-        : ''}
-//
-// Everything here runs at module scope, so this file is an executable rather
-// than a library entry — import \`./index.js\` instead to compose the language.
-
-${reflectImport}${glspImports}${importList(coreNodeSymbols, '@hydranium/core/node', columns)}
-${data ? "import { DataServer } from '@hydranium/data-server';\n" : ''}// The framework's entry point, NOT Langium's \`@hydranium/langium/lsp\` one. It is
+    const lspImports = `// The framework's entry point, NOT Langium's \`@hydranium/langium/lsp\` one. It is
 // signature-compatible and delegates straight through; what it adds first is
 // \`assertLspHeadComposed\`, which fails the start if the LSP head's SHARED module
 // was never composed. Reaching for Langium's is the natural mistake and it is
 // silent: the server boots, links and completes, while echo suppression, the
 // didChangeContent debounce and the last-client-close rebuild are all inert.
-import { startLanguageServer } from '@hydranium/core/lsp';
+import { startLanguageServer, withHydraniumLspFeatures } from '@hydranium/core/lsp';
 import { ProposedFeatures, createConnection } from 'vscode-languageserver/node';
-${diagramImports}${transferImports}import { create__NAME__Services } from './language-server/__PROJECT_ID__-module.js';
-${portCommands === '' ? '' : '\n' + portCommands}
-const connection = createConnection(ProposedFeatures.all);
+`;
+    const lspStart = `
+const connection = createConnection(withHydraniumLspFeatures(ProposedFeatures.all));
 const { shared } = create__NAME__Services({ connection, ...NodeFileSystem });
 startLanguageServer(shared);
-${dataBlock}${glspBlock}`;
+`;
+    // No LSP client names the workspace or asks for the ports here, so the
+    // command line does, and the ports go to stdout once every head listens.
+    const servers = [...(data ? ['dataServer'] : []), ...(glsp ? ['glspServer'] : [])];
+    const socketStart = `
+const { values, positionals } = parseArgs({
+   options: { ${portFlags.map(flag => `'${flag.slice(2)}': { type: 'string' }`).join(', ')} },
+   allowPositionals: true
+});
+// The workspace root: the first argument, else the process cwd.
+const workspace = positionals[0] ?? process.cwd();
+
+/** A head's port: its flag, else its environment variable, else 0 for any free port. */
+function portFrom(flag: keyof typeof values, variable: string): number {
+   const text = values[flag] ?? process.env[variable] ?? '0';
+   const port = Number(text);
+   // Decimal digits only: \`Number\` also reads '' as 0 and takes '1e3' or '0x10'.
+   if (!/^\\d+$/.test(text) || port > 65_535) {
+      throw new Error(\`--\${flag} or \${variable} is '\${text}', not a port\`);
+   }
+   return port;
+}
+
+const { shared } = create__NAME__Services({ ...NodeFileSystem });
+`;
+    const portsLine = `
+// One JSON line on stdout once every head listens, for the process that started
+// this one to read the ports from: the one line that starts with \`{\`. Each
+// head brings the workspace up before it listens; a head that fails to start
+// has logged why and ends the process, which would otherwise serve without it.
+${servers.length === 1 ? `${servers[0]}.started` : `Promise.all([${servers.map(server => `${server}.started`).join(', ')}])`}.then(
+   () => process.stdout.write(\`\${JSON.stringify({ ${servers.map(server => `${server}: ${server}.port`).join(', ')} })}\\n\`),
+   () => process.exit(1)
+);
+`;
+    const invocation = lsp
+        ? `// Invocation: \`node lib/main.js --stdio\`, or the package's \`__PROJECT_ID__\` bin
+// script.`
+        : `// Invocation: \`node lib/main.js [<workspace-path>] ${portFlags.map(flag => `[${flag} <port>]`).join(' ')}\`,
+// or the package's \`__PROJECT_ID__\` bin script. Each port falls back to its
+// environment variable, then to any free port.`;
+    const dataNote = !data
+        ? ''
+        : lsp
+            ? `
+//
+// NOT the entry the data-server subcommands of \`hydranium-cli\` speak to: stdio
+// here carries LSP, and the data head is a socket whose port is published over
+// the LSP connection. Those subcommands spawn \`data-server-main.js\`.`
+            : `
+//
+// NOT the entry the data-server subcommands of \`hydranium-cli\` speak to: they
+// drive the data protocol over a child's stdio, and the data head here is a
+// socket. Those subcommands spawn \`data-server-main.js\`.`;
+    const text = `${SHEBANG}// Standalone entry point: starts ${headSummary} in the same
+// process, so every head shares one model store.
+${invocation}${dataNote}
+//
+// Everything here runs at module scope, so this file is an executable rather
+// than a library entry — import \`./index.js\` instead to compose the language.
+
+${reflectImport}${glspImports}${importList(coreNodeSymbols, '@hydranium/core/node', columns)}
+${data ? "import { DataServer } from '@hydranium/data-server';\n" : ''}${data && lsp ? "import { describeErrorWithStack } from '@hydranium/protocol';\n" : ''}${lsp ? lspImports : "import { parseArgs } from 'node:util';\n"}${diagramImports}${transferImports}import { create__NAME__Services } from './language-server/__PROJECT_ID__-module.js';
+${portImports === '' ? '' : '\n' + portImports}${lsp ? lspStart : socketStart}${dataBlock}${glspBlock}${lsp ? '' : portsLine}`;
     return project(text, composition);
 }
 /**
  * The second executable entry: the data head alone, on stdio.
  *
  * Emitted with the `data` head because it is the ONLY command line that reaches
- * that head from outside the editor. `main.ts` gives stdio to LSP and publishes
- * the data head's socket port over the LSP connection, so a client that is not
- * an LSP client cannot discover it — which is every one of `hydranium-cli`'s
- * `query` / `save` / `projects` / `watch`, all of which drive the data protocol
- * over a spawned child's stdin/stdout. Without this file a scaffolded project
- * has no `--server` value, and the closest guess — the LSP entry — fails as an
- * unrecognised method rather than as a missing head.
+ * that head from outside the editor. `main.ts` serves the data head on a
+ * socket, so a client driving the data protocol over a spawned child's
+ * stdin/stdout cannot reach it — which is every data-server subcommand of
+ * `hydranium-cli`. Without this file a scaffolded project has no `--server`
+ * value, and the closest guess, `main.ts`, fails as an unrecognised method or
+ * an unknown flag rather than as a missing head.
  *
  * A separate process rather than a flag on `main.ts`: only one protocol can own
  * stdio, so the two entries are mutually exclusive by construction.
  */
 function dataServerMainFile(composition) {
     const columns = columnsFor(composition);
-    const roots = [...composition.grammars.map(grammar => grammar.entryRule)].sort();
+    const roots = composition.grammars.map(grammar => grammar.entryRule).sort();
     const plural = roots.length > 1 ? 's' : '';
     const text = `${SHEBANG}// Standalone entry point: a data-server head on **stdio**, with no LSP head in
-// the process. This is the transport \`hydranium-cli\` speaks — \`query\`, \`save\`,
-// \`projects\` and \`watch\` all spawn a server command and drive JSON-RPC over its
-// stdin/stdout — so it is what makes those subcommands usable against this
-// language.
+// the process. This is the transport \`hydranium-cli\` speaks — its data-server
+// subcommands spawn a server command and drive JSON-RPC over its stdin/stdout —
+// so it is what makes those subcommands usable against this language.
 //
 // Invocation: \`node lib/data-server-main.js [<workspace-path>]\`, or the
 // package's \`__PROJECT_ID__-data-server\` bin script. The workspace path defaults to
 // the process cwd, which is what the CLI's \`--cwd\` sets on the child.
 //
-// Contrast with \`main.ts\`, the editor entry: there the LSP head owns stdio and
+${composition.heads.includes('lsp')
+        ? `// Contrast with \`main.ts\`, the editor entry: there the LSP head owns stdio and
 // the data head is a socket published over the LSP connection. Here there is no
 // LSP connection at all, so the workspace initialization an
 // \`initialize\`/\`initialized\` pair would otherwise drive has to happen here —
 // which is why this entry uses \`startStdioServer\` rather than wiring a
-// connection directly.
+// connection directly.`
+        : `// Contrast with \`main.ts\`, where the data head is a socket whose port it
+// prints. Here it owns stdio, and as there, no LSP connection drives the
+// workspace initialization, so \`startStdioServer\` brings the workspace up
+// before it listens.`}
 //
 // Everything here runs at module scope, so this file is an executable rather
 // than a library entry — import \`./index.js\` instead to compose the language.
@@ -1065,7 +1325,7 @@ function dataServerMainFile(composition) {
 ${importList(['NodeFileSystem', 'startStdioServer'], '@hydranium/core/node', columns)}
 import { DataServer } from '@hydranium/data-server';
 // The TRANSFER root${plural}, not the AST one${plural} — same reasoning as \`main.ts\`.
-${importList(roots, './language-server/generated-hydranium/transfer-model.js', columns, true)}
+${importList(roots, memberPackageName(composition, 'protocol'), columns, true)}
 import { create__NAME__Services } from './language-server/__PROJECT_ID__-module.js';
 
 const { shared } = create__NAME__Services({ ...NodeFileSystem });
@@ -1113,7 +1373,7 @@ function servicesTest(composition) {
 // is missing from the composition.
 
 import { describe, expect, it } from 'vitest';
-import { createServices } from '../src/services.js';
+import { createServices } from '../src/node/services.js';
 
 describe('__NAME__ services', () => {
    it('composes the DI tree and registers ${title}', () => {
@@ -1154,13 +1414,9 @@ const SERIALIZATION_SUITE = `describe('__GRAMMAR__ serialization', () => {
 
    it('emits the same text from a transfer model, whose references are plain strings', async () => {
       const { __GRAMMAR__ } = createServices();
-      const model: Transfer__ENTRY_RULE__ = {
-         $type: '__ENTRY_RULE__',
-         nodes: [
-            { $type: '__NODE_RULE__', name: 'first', target: 'second' },
-            { $type: '__NODE_RULE__', name: 'second' }
-         ]
-      };
+      const model = transferNode(Transfer__ENTRY_RULE__, {
+         nodes: __TRANSFER_NODES__
+      });
 
       expect(await __GRAMMAR__.serializer.Serializer.serializeTransfer(model)).toBe(source);
    });
@@ -1178,11 +1434,23 @@ const SERIALIZATION_SUITE = `describe('__GRAMMAR__ serialization', () => {
 function serializationTest(composition) {
     const columns = columnsFor(composition);
     const astTypes = composition.grammars.map(grammar => grammar.entryRule);
-    const transferTypes = composition.grammars.map(grammar => `${grammar.entryRule} as Transfer${grammar.entryRule}`);
+    const transferConstants = composition.grammars.flatMap(grammar => [
+        `${grammar.entryRule} as Transfer${grammar.entryRule}`,
+        grammar.nodeRule
+    ]);
+    const suite = (grammar) => {
+        const nodes = [
+            `transferNode(${grammar.nodeRule}, { name: 'first', target: 'second' })`,
+            `transferNode(${grammar.nodeRule}, { name: 'second' })`
+        ];
+        const single = `[${nodes.join(', ')}]`;
+        const literal = `         nodes: ${single}`.length <= columns ? single : `[\n${nodes.map(node => `            ${node}`).join(',\n')}\n         ]`;
+        return render(SERIALIZATION_SUITE, composition, grammar).replace('__TRANSFER_NODES__', literal);
+    };
     const text = `// Round-trips each grammar through its serializer: parse the source, serialize
 // the model, compare the text. The serializer is the parser's inverse, so this
-// is the assertion that keeps \`ModelService.update\` / \`save\` writing files the
-// language server can read back.
+// is the assertion that keeps a client session's \`update\` / \`save\` writing
+// files the language server can read back.
 //
 // The transfer case is the one that catches the mistake worth catching.
 // \`ModelService.modelToText\` short-circuits only a RAW STRING, so a typed model
@@ -1192,10 +1460,11 @@ function serializationTest(composition) {
 import { parseHelper } from '@hydranium/core/testing';
 import { describe, expect, it } from 'vitest';
 ${importList(astTypes, '../src/language-server/ast.js', columns, true)}
-${importList(transferTypes, '../src/language-server/generated-hydranium/transfer-model.js', columns, true)}
-import { createServices } from '../src/services.js';
+${importList(transferConstants, memberPackageName(composition, 'protocol'), columns)}
+import { createServices } from '../src/node/services.js';
+import { transferNode } from './generated-hydranium/transfer-builder.js';
 
-${composition.grammars.map(grammar => render(SERIALIZATION_SUITE, composition, grammar)).join('\n\n')}
+${composition.grammars.map(suite).join('\n\n')}
 `;
     return text;
 }
@@ -1272,14 +1541,9 @@ const LINKING_SUITE = `describe('__GRAMMAR__ linking', () => {
    });
 });`;
 /**
- * The validation tier, asserting the FRAMEWORK's diagnostics rather than an
- * adopter rule.
- *
- * The scaffold binds no `validation.checks`, so a test over an adopter check
- * would have to invent one and would then assert the test's own fixture rather
- * than the language. What a scaffolded project really guarantees on day one is
- * that a dangling reference is reported, which is a linker diagnostic — and
- * that is the tier a new adopter breaks third.
+ * The validation tier: the linker's diagnostic for a dangling reference, the
+ * tier a new adopter breaks third, and the scaffold's one check, a warning on
+ * a repeated name.
  */
 const VALIDATING_SUITE = `describe('__GRAMMAR__ validation', () => {
    it('reports nothing for a well-formed document', async () => {
@@ -1306,6 +1570,21 @@ const VALIDATING_SUITE = `describe('__GRAMMAR__ validation', () => {
       expect(diagnostics[0].severity).toBe(DiagnosticSeverity.Error);
       expect(diagnostics[0].message).toContain('absent');
    });
+
+   it('warns on each node named like one before it', async () => {
+      const { shared, __GRAMMAR__ } = createServices();
+
+      const document = await parseHelper<__ENTRY_RULE__>(__GRAMMAR__)('node first\\nnode second\\nnode first', {
+         documentUri: 'file:///duplicate.__EXTENSION__'
+      });
+      await shared.workspace.DocumentBuilder.build([document], { validation: true });
+
+      const diagnostics = document.diagnostics ?? [];
+      expect(diagnostics).toHaveLength(1);
+      expect(diagnostics[0].severity).toBe(DiagnosticSeverity.Warning);
+      expect(diagnostics[0].message).toBe("A node named 'first' is already declared.");
+      expect(diagnostics[0].range.start.line).toBe(2);
+   });
 });`;
 /** Assemble one grammar-derived test file: a fixed preamble plus one suite per grammar. */
 function grammarTest(composition, header, imports, suite) {
@@ -1316,7 +1595,7 @@ function grammarTest(composition, header, imports, suite) {
 import { parseHelper } from '@hydranium/core/testing';
 import { describe, expect, it } from 'vitest';
 ${imports.join('\n')}${imports.length ? '\n' : ''}${importList(astTypes, '../src/language-server/ast.js', columns, true)}
-import { createServices } from '../src/services.js';
+import { createServices } from '../src/node/services.js';
 
 ${composition.grammars.map(grammar => render(suite, composition, grammar)).join('\n\n')}
 `;
@@ -1334,15 +1613,15 @@ const LINKING_HEADER = `// Tier two: does my cross-reference resolve.
 // multi-file workspace depends on and what a single-document test cannot see.`;
 const VALIDATING_HEADER = `// Tier three: does a broken model get reported.
 //
-// These are the FRAMEWORK's own linker diagnostics, not adopter checks — the
-// scaffold binds no \`validation.checks\`, and a test over an invented one would
-// assert its own fixture rather than the language. Bind a check in your
-// language module and assert it here alongside these.`;
+// A dangling reference is the FRAMEWORK's own linker diagnostic; a repeated
+// name is reported by the scaffold's own validation check. Bind a further
+// check in your language module and assert it here alongside these.`;
 /** The README, assembled from lines to avoid escaping the Markdown code fences. */
 function readme(composition) {
     const multi = composition.grammars.length > 1;
     const data = composition.heads.includes('data');
     const primaryExtension = composition.grammars[0].extensions[0];
+    const diagramCount = composition.grammars.filter(grammar => grammar.diagram).length;
     const grammarBullets = composition.grammars.map(grammar => `- \`src/grammar/${grammar.grammarId}.langium\` — the \`${grammar.grammar}\` grammar (.${grammar.extensions.join(', .')})`);
     const lines = [
         '# __NAME__',
@@ -1351,24 +1630,15 @@ function readme(composition) {
         '',
         '## Getting started',
         '',
-        // Conditional on the pin this scaffold actually carries — see
-        // `UNPUBLISHED_FRAMEWORK_VERSION`.
-        ...(composition.frameworkVersion === UNPUBLISHED_FRAMEWORK_VERSION
-            ? [
-                '> **Pre-publish note.** `@hydranium/*` is not on npm yet, so the `0.0.0`',
-                '> pins below are placeholders and `npm install` will fail with a 404 until',
-                '> the framework is released. Until then, supply the packages from a local',
-                '> framework checkout with [yalc](https://github.com/wclr/yalc) — a plain',
-                '> `file:` path or `npm link` is not enough, because the framework packages',
-                '> depend on each other by version and npm would try to fetch those from the',
-                '> registry too.',
-                ''
-            ]
-            : []),
+        '`langium generate` fails on Node 24.20 and later with `TypeError: Invalid URL`',
+        '([tdegrunt/jsonschema#423](https://github.com/tdegrunt/jsonschema/issues/423)),',
+        'so build on Node 22.',
+        '',
         '```bash',
         'npm install',
         'npm run langium:generate   # generate the AST from the grammar',
         'npm run build              # generate + compile to lib/',
+        'npm run watch              # regenerate and recompile on every grammar or source change',
         'npm test                   # typecheck the tests, then run them',
         '```',
         '',
@@ -1379,25 +1649,26 @@ function readme(composition) {
         // nowhere else.
         '```bash',
         '# Grammar / AST reflection',
-        'npx hydranium-cli reflect --services ./lib/services.js',
+        'npx hydranium-cli reflect --services ./lib/node/services.js',
         '',
         '# Grammar-convention lint (CI gate)',
-        'npx hydranium-cli lint-grammar --services ./lib/services.js',
+        'npx hydranium-cli lint-grammar --services ./lib/node/services.js',
         '',
         '# Validate a workspace of model files (non-zero exit on errors)',
-        'npx hydranium-cli validate --services ./lib/services.js <workspace-dir>',
+        'npx hydranium-cli validate --services ./lib/node/services.js ../workspace',
         ...(data
             ? [
                 '',
                 '# Data-head operations. `--server` is a command line the CLI spawns and then',
                 "# drives the data protocol over the child's stdin/stdout, so it has to name",
-                '# `data-server-main.js` — `main.js` gives stdio to LSP and answers these',
-                '# methods with "Unhandled method".',
+                ...(composition.heads.includes('lsp')
+                    ? ['# `data-server-main.js` — `main.js` gives stdio to LSP and answers these', '# methods with "Unhandled method".']
+                    : ['# `data-server-main.js` — `main.js` serves the data head on a socket.']),
                 '#',
                 '# The workspace goes to the ENTRY, not to `--cwd`: `--cwd` re-roots the child,',
                 '# so a relative entry path is refused by name (an absolute one is fine).',
-                'npx hydranium-cli projects --server "node ./lib/data-server-main.js <workspace-dir>"',
-                `npx hydranium-cli query --server "node ./lib/data-server-main.js <workspace-dir>" --uri <file:// URI of a .${primaryExtension} file>`
+                'npx hydranium-cli projects --server "node ./lib/data-server-main.js ../workspace"',
+                `npx hydranium-cli query --server "node ./lib/data-server-main.js ../workspace" --uri <file:// URI of ../workspace/nodes.${primaryExtension}>`
             ]
             : []),
         '```',
@@ -1407,9 +1678,12 @@ function readme(composition) {
         ...grammarBullets,
         ...(multi ? ['- `src/grammar/common.langium` — shared terminals, imported by each grammar (not a language)'] : []),
         '- `src/language-server/__PROJECT_ID__-module.ts` — `create__NAME__Services` DI wiring',
-        ...composition.grammars.map(grammar => `- \`src/language-server/${grammar.grammarId}-serializer.ts\` — emits \`${grammar.grammar}\` back to text (the framework defaults this to a throw)`),
-        '- `src/services.ts` — zero-arg `createServices()` for the headless CLI',
-        '- `src/index.ts` — the package entry (`main`): DI factory + generated AST',
+        ...composition.grammars.flatMap(grammar => [
+            `- \`src/language-server/${grammar.grammarId}-serializer.ts\` — emits \`${grammar.grammar}\` back to text (the framework defaults this to a throw)`,
+            `- \`src/language-server/${grammar.grammarId}-validation.ts\` — the \`${grammar.grammar}\` checks: a warning on a repeated name`
+        ]),
+        "- `src/node/services.ts` — zero-arg `createServices()` for the headless CLI, the package's `./node` entry",
+        `- \`src/index.ts\` — the package root, loadable in a browser worker: DI factory + generated AST${diagramCount === 0 ? '' : diagramCount === 1 ? ' + diagram module' : ' + diagram modules'}`,
         `- \`src/main.ts\` — starts ${composition.heads.join(' + ')}, the \`__PROJECT_ID__\` bin entry`,
         ...(data
             ? [
@@ -1419,7 +1693,8 @@ function readme(composition) {
             : []),
         ...composition.grammars
             .filter(grammar => grammar.diagram)
-            .map(grammar => `- \`src/glsp/${grammar.grammarId}/\` — the \`${grammar.grammar}\` diagram: type ids, state, storage, submission handler, GModel factory, configuration, create-node handler, DI module`),
+            .map(grammar => `- \`src/glsp/${grammar.grammarId}/\` — the \`${grammar.grammar}\` diagram: state, storage, submission handler, GModel factory, configuration, create-node handler, DI module`),
+        `- \`../protocol/\` — the \`${memberPackageName(composition, 'protocol')}\` package: what this server and its clients both import (language ids, ${headPortConstants(composition).length === 0 ? '' : composition.heads.includes('lsp') ? 'port commands, ' : 'port variables, '}${composition.grammars.some(grammar => grammar.diagram) ? 'diagram ids, ' : ''}the transfer model), written partly by \`npm run generate\``,
         '- `test/services.test.ts` — the DI tree composes; grows as your language does',
         '- `test/parsing.test.ts` / `linking.test.ts` / `validating.test.ts` — the three tiers a new language breaks first',
         '- `test/serialization.test.ts` — each grammar round-trips through its serializer',
@@ -1472,6 +1747,24 @@ function readme(composition) {
         'atomic set and depends on a single physical copy, so a floating range can',
         'silently resolve a second one.',
         '',
+        '`vscode-languageserver` is pinned to `10.0.1`, and',
+        '`vscode-languageserver-protocol` and `vscode-jsonrpc` to the `3.18.1` and',
+        '`9.0.0` it pins, so Langium, the LSP connection and the framework share one',
+        'copy of each. With two, an error a Langium handler returns, such as a request',
+        'for a document the server does not have, reaches the client as a result, and a',
+        'framework error your own LSP handler throws loses its code. The Langium 4.4',
+        'upgrade',
+        '([eclipse-emfcloud/hydranium#142](https://github.com/eclipse-emfcloud/hydranium/issues/142))',
+        'replaces these pins.',
+        '',
+        ...(pinsVitest(composition)
+            ? [
+                '`vitest` is held below 4.1, whose peer set crashes the npm every Node 22',
+                'release bundles. Raise it once every npm that installs this project is',
+                '11.6 or later.',
+                ''
+            ]
+            : []),
         '## If your repo gates license headers',
         '',
         'The emitted `.ts` files carry no copyright header — the scaffold cannot know',
@@ -1490,189 +1783,49 @@ function readme(composition) {
 /**
  * The GLSP files for ONE grammar's diagram.
  *
- * Per grammar rather than per project because a diagram type has exactly one
- * grammar — `AbstractHydraniumGlspDiagramModule.declareLanguage()` returns that
- * grammar's `LanguageMetaData`, and it is bound on the SESSION container so a
- * grammar with no diagram can sit on the same server.
+ * Per grammar rather than per project because the state, storage and GModel
+ * factory are typed over that grammar's model, and a grammar with no diagram
+ * can sit on the same server.
  *
  * The index and the computed-bounds handler are framework classes used
  * unmodified; storage and the submission handler are thin typed subclasses,
  * which is where an adopter's own load/save and log formatting land.
  *
- * The set is EDITABLE rather than read-only: one create-node handler, registered
- * on the module. GLSP's own `DiagramModule` binds no handler that mutates a
- * source model, so without it the head renders and answers while telling the
- * client it may change nothing — which reads as a broken diagram rather than as a
- * deliberate viewer.
+ * The set is EDITABLE rather than read-only: a create-node and a delete handler,
+ * registered on the module. GLSP's own `DiagramModule` binds no handler that
+ * mutates a source model, so without them the head renders and answers while
+ * telling the client it may change nothing — which reads as a broken diagram
+ * rather than as a deliberate viewer.
  */
 function glspFiles(composition, grammar) {
     const columns = columnsFor(composition);
-    const upper = screamingSnake(grammar.grammarId);
-    const dir = `src/glsp/${grammar.grammarId}`;
-    const render = (text) => grammarTier(project(text, composition), grammar);
-    const types = `// GLSP diagram-type and element-type ids for the __GRAMMAR__ diagram.
-//
-// **Authoritative half of a client/server contract.** Every id here has to be
-// registered on the client too: sprotty's registries are exact-key maps with no
-// prefix fallback, so an id the client does not know yields an element with none
-// of a node's features, rendered by \`MissingView\` with only a
-// \`no registered view for type '…'\` console warning. Nothing fails server-side.
-//
-// The ids stay namespaced under the GLSP defaults (\`node:\` / \`edge:\`) so a
-// reader can tell a node id from an edge id at a glance.
-
-import { DefaultTypes } from '@eclipse-glsp/server';
-
-/**
- * The GLSP diagram type — the string GLSP routes every per-diagram-type request
- * by. Mirrored by the client; a mismatch silently DROPS the request rather than
- * reporting an unknown diagram type. Same value as the language id, so the two
- * cannot drift apart as a diagram gains element types.
- */
-export const ${upper}_DIAGRAM_TYPE = '__LANGUAGE_ID__';
-
-/** A \`__NODE_RULE__\` — the starter grammar's one named, referenceable node. */
-export const ${upper}_NODE_TYPE = \`\${DefaultTypes.NODE}:__GRAMMAR_ID__-node\`;
-
-/** A resolved \`target\` reference, drawn as a connection between two nodes. */
-export const ${upper}_EDGE_TYPE = \`\${DefaultTypes.EDGE}:__GRAMMAR_ID__-target\`;
-`;
-    const state = `// GLSP state for the __GRAMMAR__ diagram.
+    const fixed = (file) => grammarTemplate(`server/src/glsp/__GRAMMAR_ID__/${file}`, composition, grammar);
+    const computed = (file, text) => ({
+        path: `server/src/glsp/${grammar.grammarId}/${file}`,
+        content: render(text, composition, grammar)
+    });
+    const configuration = `// Diagram configuration for the __GRAMMAR__ diagram.
 //
-// \`FullTextHydraniumGlspState\` is the simplest of the framework source-model
-// strategies (the others project a structured transfer model, over one document
-// or several): the source model is the whole document text, serialised through
-// the per-URI \`Serializer\` and round-tripped by re-parsing. Both seams resolve
-// through shared services, so narrowing the root type is all an adopter adds.
+// **A hint is \`true\` only where a handler backs it.** The starter
+// __GRAMMAR__CreateNodeOperationHandler offers creation through the tool palette,
+// which GLSP assembles from the create handlers' trigger actions — there is no
+// \`creatable\` hint. __GRAMMAR__DeleteOperationHandler backs \`deletable\` on a
+// node and an edge; a node of another document stays undeletable, since this
+// diagram does not own it. Nothing backs reparent / reposition / resize, so
+// declaring one would offer a gesture whose operation the server rejects: a worse
+// failure than the tool being absent. Turn a hint on in the same change that adds
+// its handler.
 //
-// It cannot field-merge — every concurrent edit on a whole-document model is a
-// same-document collision, so undo / redo degrade to drop-on-divergence. Move to
-// \`ReconcilingTransferHydraniumGlspState\` when you need field-level undo.
+// \`needsClientLayout\` is \`true\` and \`layoutKind\` is \`NONE\`: the starter grammar
+// persists no bounds, so the client measures and places everything. That is also
+// why \`ChangeBoundsOperation\` is a poor second handler to add — with nowhere in
+// the grammar to write a position, a move never reaches the text and is lost on
+// the next reload.
 
-import { FullTextHydraniumGlspState } from '@hydranium/glsp-server';
+import { type GModelElementConstructor } from '@eclipse-glsp/graph';
+${importList(['type DiagramConfiguration', 'type EdgeTypeHint', 'ServerLayoutKind', 'type ShapeTypeHint', 'getDefaultMapping'], '@eclipse-glsp/server', columns)}
 import { injectable } from 'inversify';
-import type { __ENTRY_RULE__ } from '../../language-server/ast.js';
-
-@injectable()
-export class __GRAMMAR__GlspState extends FullTextHydraniumGlspState<__ENTRY_RULE__> {}
-`;
-    const storage = `// Source-model storage for the __GRAMMAR__ diagram, inheriting both framework
-// defaults: \`loadSourceModel\` (open + settle + \`setSourceRoot\`) and
-// \`saveSourceModel\` (through \`ModelService.save\` → the per-URI \`Serializer\` →
-// the multi-client text store → \`WritableFileSystemProvider\`).
-//
-// The subclass exists so a bespoke load or save has a stable place to land.
-
-import { type FullTextSourceModel, HydraniumGlspStorage } from '@hydranium/glsp-server';
-import { injectable } from 'inversify';
-import type { __ENTRY_RULE__ } from '../../language-server/ast.js';
-
-@injectable()
-export class __GRAMMAR__GlspStorage extends HydraniumGlspStorage<__ENTRY_RULE__, FullTextSourceModel> {}
-`;
-    const submission = `// Submission handler for the __GRAMMAR__ diagram.
-//
-// Inherits the framework's \`readyEvent = IntegrityService.SettledState\`, which
-// is load-bearing rather than incidental: the GModel factory resolves
-// \`target.ref\`, so it needs a fully-linked AST. Without the gate those reads
-// fire mid-build and warn about resolution before scopes are computed.
-//
-// Only \`formatSourceRoot\` is overridden, so the submit log names the model and
-// its node count instead of a bare \`$type\`.
-
-import { ModelState } from '@eclipse-glsp/server';
-import { type FullTextSourceModel, HydraniumGlspSubmissionHandler } from '@hydranium/glsp-server';
-import { inject, injectable } from 'inversify';
-import type { __ENTRY_RULE__ } from '../../language-server/ast.js';
-import type { __GRAMMAR__GlspState } from './state.js';
-
-@injectable()
-export class __GRAMMAR__SubmissionHandler extends HydraniumGlspSubmissionHandler<__ENTRY_RULE__, FullTextSourceModel> {
-   @inject(ModelState) declare protected modelState: __GRAMMAR__GlspState;
-
-   protected override formatSourceRoot(root: __ENTRY_RULE__ | undefined): string {
-      return root ? \`__ENTRY_RULE__ nodes=\${root.nodes.length}\` : 'none';
-   }
-}
-`;
-    const factory = `// AST → GModel for the __GRAMMAR__ diagram: one node per \`__NODE_RULE__\`, one
-// edge per resolved \`target\` reference.
-//
-// Ids come from the index rather than being composed here, so the id strategy
-// stays in one place. Nodes are emitted before edges, because a GLSP edge
-// pointing at an id that does not exist fails client-side with a far less
-// obvious error than a missing edge. An unresolved reference is SKIPPED rather
-// than treated as an error: a dangling reference is ordinary editing state, and
-// the LSP head already reports it as a diagnostic.
-
-import { DefaultTypes, GEdge, GGraph, GLabel, type GModelFactory, GNode, ModelState } from '@eclipse-glsp/server';
-import { inject, injectable } from 'inversify';
-import type { __ENTRY_RULE__ } from '../../language-server/ast.js';
-import { ${upper}_EDGE_TYPE, ${upper}_NODE_TYPE } from './types.js';
-import type { __GRAMMAR__GlspState } from './state.js';
-
-@injectable()
-export class __GRAMMAR__GModelFactory implements GModelFactory {
-   @inject(ModelState) protected readonly modelState!: __GRAMMAR__GlspState;
-
-   createModel(): void {
-      const root = this.modelState.sourceRoot;
-      const graph = GGraph.builder().id(this.modelState.sourceUri).build();
-      if (root) {
-         this.buildGraph(root, graph);
-      }
-      this.modelState.updateRoot(graph);
-   }
-
-   protected buildGraph(root: __ENTRY_RULE__, graph: GGraph): void {
-      for (const node of root.nodes) {
-         const id = this.modelState.index.createId(node);
-         graph.children.push(
-            GNode.builder()
-               .id(id)
-               .type(${upper}_NODE_TYPE)
-               .add(GLabel.builder().id(\`\${id}_name\`).text(node.name).type(DefaultTypes.LABEL).build())
-               .build()
-         );
-      }
-      for (const node of root.nodes) {
-         const target = node.target?.ref;
-         if (!target) {
-            continue;
-         }
-         const sourceId = this.modelState.index.createId(node);
-         graph.children.push(
-            GEdge.builder()
-               .id(\`\${sourceId}_target\`)
-               .type(${upper}_EDGE_TYPE)
-               .sourceId(sourceId)
-               .targetId(this.modelState.index.createId(target))
-               .build()
-         );
-      }
-   }
-}
-`;
-    const configuration = `// Diagram configuration for the __GRAMMAR__ diagram.
-//
-// **Every hint is \`false\`, and that is not the same as read-only.** The starter
-// __GRAMMAR__CreateNodeOperationHandler makes this diagram editable through the
-// tool palette, which GLSP assembles from the create handlers' trigger actions —
-// there is no \`creatable\` hint. What the hints govern is delete / reparent /
-// reposition / resize, and nothing backs those, so declaring one would offer a
-// gesture whose operation the server rejects: a worse failure than the tool being
-// absent. Turn a hint on in the same change that adds its handler.
-//
-// \`needsClientLayout\` is \`true\` and \`layoutKind\` is \`NONE\`: the starter grammar
-// persists no bounds, so the client measures and places everything. That is also
-// why \`ChangeBoundsOperation\` is a poor second handler to add — with nowhere in
-// the grammar to write a position, a move never reaches the text and is lost on
-// the next reload.
-
-import { type GModelElementConstructor } from '@eclipse-glsp/graph';
-${importList(['type DiagramConfiguration', 'type EdgeTypeHint', 'ServerLayoutKind', 'type ShapeTypeHint', 'getDefaultMapping'], '@eclipse-glsp/server', columns)}
-import { injectable } from 'inversify';
-import { ${upper}_EDGE_TYPE, ${upper}_NODE_TYPE } from './types.js';
+import { __GRAMMAR_ID_CONST___EDGE_TYPE, __GRAMMAR_ID_CONST___EXTERNAL_NODE_TYPE, __GRAMMAR_ID_CONST___NODE_TYPE } from '__PROTOCOL_PACKAGE__';
 
 @injectable()
 export class __GRAMMAR__DiagramConfiguration implements DiagramConfiguration {
@@ -1684,7 +1837,14 @@ export class __GRAMMAR__DiagramConfiguration implements DiagramConfiguration {
 
    readonly shapeTypeHints: ShapeTypeHint[] = [
       {
-         elementTypeId: ${upper}_NODE_TYPE,
+         elementTypeId: __GRAMMAR_ID_CONST___NODE_TYPE,
+         deletable: true,
+         reparentable: false,
+         repositionable: false,
+         resizable: false
+      },
+      {
+         elementTypeId: __GRAMMAR_ID_CONST___EXTERNAL_NODE_TYPE,
          deletable: false,
          reparentable: false,
          repositionable: false,
@@ -1694,143 +1854,69 @@ export class __GRAMMAR__DiagramConfiguration implements DiagramConfiguration {
 
    readonly edgeTypeHints: EdgeTypeHint[] = [
       {
-         elementTypeId: ${upper}_EDGE_TYPE,
-         deletable: false,
+         elementTypeId: __GRAMMAR_ID_CONST___EDGE_TYPE,
+         deletable: true,
          repositionable: false,
          routable: false,
-         sourceElementTypeIds: [${upper}_NODE_TYPE],
-         targetElementTypeIds: [${upper}_NODE_TYPE]
+         sourceElementTypeIds: [__GRAMMAR_ID_CONST___NODE_TYPE],
+         targetElementTypeIds: [__GRAMMAR_ID_CONST___NODE_TYPE, __GRAMMAR_ID_CONST___EXTERNAL_NODE_TYPE]
       }
    ];
 }
-`;
-    const createHandler = `// The starter operation handler for the __GRAMMAR__ diagram: the tool-palette
-// entry that creates a \`__NODE_RULE__\`.
-//
-// **Deleting this file and its \`configureOperationHandlers\` registration in
-// \`diagram-module.ts\` gives a read-only viewer**, and nothing else has to change
-// — creation is offered through the palette rather than through a type hint, so
-// every hint in \`diagram-configuration.ts\` is already \`false\`. The scaffold emits
-// the editable direction because that asymmetry runs one way: editable →
-// read-only is a deletion the compiler checks, while read-only → editable is
-// authoring against a seam you have not used yet.
-//
-// **It composes TEXT rather than mutating the AST.** The source model of
-// \`FullTextHydraniumGlspState\` is the document text, and reading it back through
-// \`state.sourceModel\` serialises the AST through the per-URI \`Serializer\`, which
-// this scaffold does not bind — so that getter throws until you do. Appending a
-// declaration to the text the parser last read needs no serializer, which is what
-// makes a scaffolded diagram editable on day one. Bind a \`Serializer\` at
-// \`services.serializer.Serializer\` and this becomes a
-// \`HydraniumGlspRecordingCommand\` over \`state.sourceModel\` instead — the same
-// binding the diagram's own save action needs.
-//
-// **The drop location is discarded.** \`needsClientLayout\` is \`true\` and the
-// starter grammar persists no bounds, so there is nowhere to put a coordinate: the
-// node is appended at the end of the document and the client places it.
-//
-// Like \`types.ts\`, \`gmodel-factory.ts\` and \`diagram-configuration.ts\`, this file
-// knows the starter grammar's concrete syntax — the \`node\` keyword below is that
-// grammar's. Replacing the grammar means replacing these four together.
-
-import { type Command, type CreateNodeOperation, JsonCreateNodeOperationHandler, type MaybePromise } from '@eclipse-glsp/server';
-import { findNextUnique } from '@hydranium/protocol';
-import { injectable } from 'inversify';
-import { ${upper}_NODE_TYPE } from './types.js';
-import type { __GRAMMAR__GlspState } from './state.js';
-
-/** Proposed name for a new node, uniquified against the ones the document already has. */
-const NODE_NAME_STEM = 'Node';
-
-@injectable()
-export class __GRAMMAR__CreateNodeOperationHandler extends JsonCreateNodeOperationHandler {
-   declare protected modelState: __GRAMMAR__GlspState;
-
-   /** The palette's word for the thing it creates, so a noun rather than an action. */
-   override readonly label = '__NODE_RULE__';
-   elementTypeIds = [${upper}_NODE_TYPE];
-
-   override createCommand(operation: CreateNodeOperation): MaybePromise<Command | undefined> {
-      if (!this.elementTypeIds.includes(operation.elementTypeId)) {
-         return undefined;
-      }
-      const state = this.modelState;
-      const before = this.documentText();
-      const after = this.withNode(
-         before,
-         findNextUnique(
-            NODE_NAME_STEM,
-            state.sourceRoot.nodes.map(node => node.name)
-         )
-      );
-      // Whole-document undo, which is all a full-text source model can offer: it
-      // has exactly one field, so there is nothing to merge a concurrent edit into.
-      return {
-         execute: () => state.updateSourceModel({ text: after }),
-         undo: () => state.updateSourceModel({ text: before }),
-         redo: () => state.updateSourceModel({ text: after })
-      };
-   }
-
-   /** The text the captured source root was parsed from — the baseline an edit appends to. */
-   protected documentText(): string {
-      return this.modelState.sourceRoot.$document?.textDocument.getText() ?? '';
-   }
-
-   /** \`text\` with one more node declaration, under exactly one trailing newline. */
-   protected withNode(text: string, name: string): string {
-      const body = text.trimEnd();
-      const declaration = \`node \${name}\`;
-      return body.length === 0 ? \`\${declaration}\\n\` : \`\${body}\\n\${declaration}\\n\`;
-   }
-}
 `;
     const module = `// GLSP diagram module for __GRAMMAR__ — the DI wiring of one diagram type.
 //
-// \`declareLanguage\` is the multi-grammar seam: it binds the grammar this diagram
-// edits on the SESSION container, so \`modelState.diagramLanguage\` and the
-// per-language lookups resolve to __LANGUAGE_ID__. That is what stops one
-// diagram type from fighting over a process-wide binding when a project holds
-// several grammars — a grammar with no diagram is registered on the same server.
-//
 // \`configureActionHandlers\` REBINDS rather than adds: GLSP's own
 // \`DiagramModule\` already registers \`ComputedBoundsActionHandler\`, and two
 // handlers for one action would both run.
 //
 // \`configureOperationHandlers\` ADDS: GLSP's default pair
 // (\`CompoundOperationHandler\` and \`LayoutOperationHandler\`) mutates no source
-// model, so the starter create handler is what makes this diagram editable at all.
+// model, so the starter create and delete handlers are what make this diagram
+// editable at all.
 
 ${importList([
         'ActionHandlerConstructor',
         'BindingTarget',
+        'ComputedBoundsAction',
         'DiagramConfiguration',
         'GModelFactory',
         'GModelIndex',
+        'GModelRoot',
         'InstanceMultiBinding',
         'ModelState',
         'ModelSubmissionHandler',
+        'ModelValidator',
         'OperationHandlerConstructor',
         'SourceModelStorage'
     ], '@eclipse-glsp/server', columns, true)}
 import { ComputedBoundsActionHandler } from '@eclipse-glsp/server';
-import type { LanguageMetaData } from '@hydranium/langium';
-${importList(['HydraniumGlspComputedBoundsActionHandler', 'AbstractHydraniumGlspDiagramModule', 'HydraniumGlspIndex'], '@hydranium/glsp-server', columns)}
-import { __GRAMMAR__LanguageMetaData } from '../../language-server/generated/module.js';
+${importList(['HydraniumGlspComputedBoundsActionHandler', 'AbstractHydraniumGlspDiagramModule', 'HydraniumGlspIndex', 'HydraniumGlspModelValidator'], '@hydranium/glsp-server', columns)}
 import { __GRAMMAR__CreateNodeOperationHandler } from './create-node-operation-handler.js';
+import { __GRAMMAR__DeleteOperationHandler } from './delete-operation-handler.js';
 import { __GRAMMAR__DiagramConfiguration } from './diagram-configuration.js';
 import { __GRAMMAR__GModelFactory } from './gmodel-factory.js';
 import { __GRAMMAR__GlspState } from './state.js';
 import { __GRAMMAR__GlspStorage } from './storage.js';
 import { __GRAMMAR__SubmissionHandler } from './submission-handler.js';
-import { ${upper}_DIAGRAM_TYPE } from './types.js';
-
-export class __GRAMMAR__DiagramModule extends AbstractHydraniumGlspDiagramModule {
-   readonly diagramType = ${upper}_DIAGRAM_TYPE;
+import { __GRAMMAR_ID_CONST___DIAGRAM_TYPE } from '__PROTOCOL_PACKAGE__';
+import { injectable } from 'inversify';
 
-   protected override declareLanguage(): LanguageMetaData {
-      return __GRAMMAR__LanguageMetaData;
+/**
+ * The framework handler, keeping none of the edge routes the client reports:
+ * it routes an edge before it sizes the nodes, so a self-reference's loop would
+ * stay drawn inside its node. The starter's edges have no routing points, and
+ * the client routes them afresh from the sized nodes.
+ */
+@injectable()
+export class __GRAMMAR__ComputedBoundsActionHandler extends HydraniumGlspComputedBoundsActionHandler {
+   protected override applyBounds(root: GModelRoot, action: ComputedBoundsAction): void {
+      super.applyBounds(root, { ...action, routes: undefined });
    }
+}
+
+export class __GRAMMAR__DiagramModule extends AbstractHydraniumGlspDiagramModule {
+   readonly diagramType = __GRAMMAR_ID_CONST___DIAGRAM_TYPE;
 
    protected override bindModelState(): BindingTarget<ModelState> {
       return { service: __GRAMMAR__GlspState };
@@ -1857,80 +1943,2240 @@ export class __GRAMMAR__DiagramModule extends AbstractHydraniumGlspDiagramModule
       return { service: HydraniumGlspIndex };
    }
 
+   /**
+    * The language's diagnostics as diagram markers, following each edit. GLSP
+    * binds no validator by default, and without one no marker ever shows.
+    */
+   protected override bindModelValidator(): BindingTarget<ModelValidator> {
+      return HydraniumGlspModelValidator;
+   }
+
    protected override configureActionHandlers(binding: InstanceMultiBinding<ActionHandlerConstructor>): void {
       super.configureActionHandlers(binding);
-      binding.rebind(ComputedBoundsActionHandler, HydraniumGlspComputedBoundsActionHandler);
+      binding.rebind(ComputedBoundsActionHandler, __GRAMMAR__ComputedBoundsActionHandler);
    }
 
    protected override configureOperationHandlers(binding: InstanceMultiBinding<OperationHandlerConstructor>): void {
       super.configureOperationHandlers(binding);
       binding.add(__GRAMMAR__CreateNodeOperationHandler);
+      binding.add(__GRAMMAR__DeleteOperationHandler);
    }
 }
 `;
     return [
-        { path: `${dir}/types.ts`, content: render(types) },
-        { path: `${dir}/state.ts`, content: render(state) },
-        { path: `${dir}/storage.ts`, content: render(storage) },
-        { path: `${dir}/submission-handler.ts`, content: render(submission) },
-        { path: `${dir}/gmodel-factory.ts`, content: render(factory) },
-        { path: `${dir}/diagram-configuration.ts`, content: render(configuration) },
-        { path: `${dir}/create-node-operation-handler.ts`, content: render(createHandler) },
-        { path: `${dir}/diagram-module.ts`, content: render(module) }
+        fixed('state.ts'),
+        fixed('storage.ts'),
+        fixed('submission-handler.ts'),
+        fixed('gmodel-factory.ts'),
+        computed('diagram-configuration.ts', configuration),
+        fixed('create-node-operation-handler.ts'),
+        fixed('delete-operation-handler.ts'),
+        computed('diagram-module.ts', module),
+        grammarTemplate('server/test/__GRAMMAR_ID__-diagram.test.ts', composition, grammar)
     ];
 }
 /**
- * Every file the scaffold emits, fully rendered.
+ * The server member: the grammar, the language and its heads.
  *
  * Grammar-count-dependent emissions live here rather than in a template string:
  * one `.langium` file per grammar, and the shared `common.langium` fragment only
  * when there is more than one grammar to share it.
  */
-export function buildInitTemplates(composition) {
+function serverFiles(composition) {
     const multi = composition.grammars.length > 1;
     const grammarFiles = composition.grammars.map(grammar => ({
-        path: `src/grammar/${grammar.grammarId}.langium`,
+        path: `server/src/grammar/${grammar.grammarId}.langium`,
         content: render(grammarFile(multi), composition, grammar)
     }));
+    // The shared lexical fragment, only for several grammars: each declaring its
+    // own `WS` / `ID` lets the token sets drift apart.
     if (multi) {
-        grammarFiles.unshift({ path: 'src/grammar/common.langium', content: COMMON_GRAMMAR });
+        grammarFiles.unshift(projectTemplate('server/src/grammar/common.langium', composition));
     }
     const diagramFiles = composition.grammars.filter(grammar => grammar.diagram).flatMap(grammar => glspFiles(composition, grammar));
     return [
-        { path: 'package.json', content: packageJson(composition) },
-        { path: 'langium-config.json', content: langiumConfig(composition) },
-        { path: 'tsconfig.json', content: tsconfigJson(composition) },
-        { path: 'tsconfig.test.json', content: TSCONFIG_TEST },
-        { path: 'vitest.config.ts', content: VITEST_CONFIG },
-        {
-            path: '.gitignore',
-            content: composition.packaging.workspace === undefined ? GITIGNORE : GITIGNORE_WORKSPACE_MEMBER
-        },
-        { path: 'README.md', content: readme(composition) },
+        { path: 'server/package.json', content: packageJson(composition) },
+        { path: 'server/langium-config.json', content: langiumConfig(composition) },
+        { path: 'server/tsconfig.json', content: serverTsconfigJson(composition) },
+        // `isolatedModules` is what makes this check agree with the transform that
+        // actually runs the tests. `npm test` is `typecheck:test && vitest run`, and
+        // vitest compiles each file on its own — a transform with no type
+        // information, which cannot tell a re-exported TYPE from a re-exported value.
+        // Without the flag `tsc` accepts `export { SomeType } from './x'` that the
+        // transform then emits as a real import of a symbol that does not exist at
+        // runtime, so the typecheck passes and the suite fails with a confusing
+        // missing-export.
+        projectTemplate('server/tsconfig.test.json', composition),
+        // Found by name, unlike `tsconfig.test.json`. Under vite 8, vitest's transform
+        // applies a tsconfig only to the files its own `include` lists, so without this
+        // a test declaring a decorated class fails to load.
+        projectTemplate('server/test/tsconfig.json', composition),
+        projectTemplate('server/vitest.config.ts', composition),
+        // Written for a workspace member too: its root may not ignore `lib/` (a `yo
+        // langium` root ignores `out/`), and a rule the root repeats costs nothing.
+        ignoreFile('server'),
+        { path: 'server/README.md', content: readme(composition) },
         ...grammarFiles,
-        { path: `src/language-server/${composition.projectId}-module.ts`, content: moduleFile(composition) },
-        { path: 'src/language-server/ast.ts', content: render(AST, composition, composition.grammars[0]) },
-        ...composition.grammars.map(grammar => ({
-            path: `src/language-server/${grammar.grammarId}-serializer.ts`,
-            content: render(SERIALIZER, composition, grammar)
-        })),
-        { path: 'src/index.ts', content: indexFile(composition) },
-        { path: 'src/services.ts', content: project(SERVICES, composition) },
-        { path: 'src/main.ts', content: mainFile(composition) },
-        ...(composition.heads.includes('data') ? [{ path: 'src/data-server-main.ts', content: dataServerMainFile(composition) }] : []),
-        ...(portCommandNames(composition).length ? [{ path: 'src/head-ports.ts', content: headPortsFile(composition) }] : []),
+        { path: `server/src/language-server/${composition.projectId}-module.ts`, content: moduleFile(composition) },
+        grammarTemplate('server/src/language-server/ast.ts', composition, composition.grammars[0]),
+        // Per grammar, because `services.serializer.Serializer` is a per-language slot
+        // and a serializer is grammar-shaped by definition. That is also why the
+        // framework refuses to default it: its `UnboundSerializer` throws, naming the
+        // binding to add, rather than guessing a syntax.
+        ...composition.grammars.flatMap(grammar => [
+            grammarTemplate('server/src/language-server/__GRAMMAR_ID__-serializer.ts', composition, grammar),
+            grammarTemplate('server/src/language-server/__GRAMMAR_ID__-validation.ts', composition, grammar)
+        ]),
+        { path: 'server/src/index.ts', content: indexFile(composition) },
+        projectTemplate('server/src/node/services.ts', composition),
+        { path: 'server/src/main.ts', content: mainFile(composition) },
+        ...(composition.heads.includes('data') ? [{ path: 'server/src/data-server-main.ts', content: dataServerMainFile(composition) }] : []),
         ...diagramFiles,
-        { path: 'test/services.test.ts', content: servicesTest(composition) },
-        { path: 'test/parsing.test.ts', content: grammarTest(composition, PARSING_HEADER, [], PARSING_SUITE) },
+        { path: 'server/test/services.test.ts', content: servicesTest(composition) },
+        { path: 'server/test/parsing.test.ts', content: grammarTest(composition, PARSING_HEADER, [], PARSING_SUITE) },
         {
-            path: 'test/linking.test.ts',
+            path: 'server/test/linking.test.ts',
             content: grammarTest(composition, LINKING_HEADER, ["import { AstUtils } from '@hydranium/langium';"], LINKING_SUITE)
         },
         {
-            path: 'test/validating.test.ts',
+            path: 'server/test/validating.test.ts',
             content: grammarTest(composition, VALIDATING_HEADER, ["import { DiagnosticSeverity } from 'vscode-languageserver';"], VALIDATING_SUITE)
         },
-        { path: 'test/serialization.test.ts', content: serializationTest(composition) }
+        { path: 'server/test/serialization.test.ts', content: serializationTest(composition) }
+    ];
+}
+/**
+ * The protocol member's `package.json`.
+ *
+ * Its `build` runs the server's `generate` first, because the server writes
+ * this package's `generated-hydranium/` modules from the grammar: a runner that
+ * builds in dependency order reaches this package before the server, and would
+ * otherwise compile modules that do not exist yet. A full build therefore
+ * generates twice; the second pass rewrites nothing.
+ */
+function protocolPackageJson(composition) {
+    const member = forMember(composition, 'protocol');
+    const dependencies = {};
+    for (const head of composition.heads) {
+        Object.assign(dependencies, PROTOCOL_THIRD_PARTY_DEPENDENCIES[head]);
+    }
+    const dependencyLines = Object.keys(dependencies).length === 0 ? '' : `  "dependencies": {\n${sortedBlock(dependencies, '    ')}\n  },\n`;
+    return `{
+  "name": "${memberPackageName(composition, 'protocol')}",
+  "version": "0.0.0",
+${composition.packaging.private ? '  "private": true,\n' : ''}  "description": "What the ${composition.name} language server and its clients share: language ids, wire types and diagram ids.",
+  "license": "UNLICENSED",
+  "author": "",
+  "files": [
+    "lib",
+    "src"
+  ],
+  "type": "module",
+  "main": "lib/index.js",
+  "types": "lib/index.d.ts",
+  "scripts": {
+    "build": "npm --prefix ../server run generate && tsc -b",
+    "clean": "rimraf lib tsconfig.tsbuildinfo",
+${lintScript(member, 'src')}    "watch": "tsc -b --watch"
+  },
+${dependencyLines}  "devDependencies": {
+    "rimraf": "^5.0.0",
+    "typescript": "^7.0.2"
+  },
+  "engines": {
+    "node": ">=22.13"
+  }
+}
+`;
+}
+/** The protocol member's root entry, one re-export per module. */
+function protocolIndexFile(composition) {
+    const modules = [
+        './generated-hydranium/languages.js',
+        './generated-hydranium/transfer-model.js',
+        ...(headPortConstants(composition).length ? ['./head-ports.js'] : []),
+        ...composition.grammars.filter(grammar => grammar.diagram).map(grammar => `./${grammar.grammarId}-diagram-types.js`)
+    ];
+    const text = `// What the __NAME__ server and its clients both import. A client depends on
+// this package instead of the server, so it never installs Langium to reach a
+// constant or a wire type.
+//
+// The server's \`generate\` writes \`generated-hydranium/\` from the grammar;
+// commit those modules with the grammar change that produced them. An interface
+// narrowed here hides the generated constant of the same name; re-export that
+// constant beside it, and declare the type map under its own name with the
+// narrowed entry, or the builder and the GLSP state keep the generated one.
+
+${modules.map(module => `export * from '${module}';`).join('\n')}
+`;
+    return project(text, composition);
+}
+/** The protocol member's README. */
+function protocolReadme(composition) {
+    const lines = [
+        `# ${memberPackageName(composition, 'protocol')}`,
+        '',
+        'What the __NAME__ language server and its clients both import, so a client',
+        'never depends on the server or installs Langium.',
+        '',
+        '- `src/generated-hydranium/languages.ts` — each language id and its file extensions',
+        '- `src/generated-hydranium/transfer-model.ts` — the wire types of the model, references as plain strings',
+        ...(headPortConstants(composition).length === 0
+            ? []
+            : composition.heads.includes('lsp')
+                ? ['- `src/head-ports.ts` — the LSP requests a host sends to find the socket heads']
+                : ["- `src/head-ports.ts` — the environment variables naming the socket heads' ports"]),
+        ...composition.grammars
+            .filter(grammar => grammar.diagram)
+            .map(grammar => `- \`src/${grammar.grammarId}-diagram-types.ts\` — the \`${grammar.grammar}\` diagram's type ids`),
+        '',
+        "The server's `npm run generate` writes `src/generated-hydranium/` from the",
+        'grammar, and `npm run build` here runs it first. Commit the generated',
+        'modules with the grammar change that produced them.',
+        ''
+    ];
+    return project(lines.join('\n'), composition);
+}
+/** The protocol member: everything the server and its clients both import. */
+function protocolFiles(composition) {
+    return [
+        { path: 'protocol/package.json', content: protocolPackageJson(composition) },
+        { path: 'protocol/tsconfig.json', content: tsconfigJson(forMember(composition, 'protocol'), PROTOCOL_COMPILER_OPTIONS, '["src"]') },
+        ignoreFile('protocol'),
+        { path: 'protocol/README.md', content: protocolReadme(composition) },
+        { path: 'protocol/src/index.ts', content: protocolIndexFile(composition) },
+        ...(headPortConstants(composition).length ? [{ path: 'protocol/src/head-ports.ts', content: headPortsFile(composition) }] : []),
+        ...composition.grammars
+            .filter(grammar => grammar.diagram)
+            .map(grammar => grammarTemplate('protocol/src/__GRAMMAR_ID__-diagram-types.ts', composition, grammar))
+    ];
+}
+/**
+ * The starter model files every host and the CLI open, two per language: one
+ * declaring nodes, one referencing a node in the other file.
+ *
+ * Named by extension alone, since `init` refuses two grammars sharing one.
+ */
+function workspaceFiles(composition) {
+    return composition.grammars.flatMap(grammar => [
+        grammarTemplate('workspace/nodes.__EXTENSION__', composition, grammar),
+        grammarTemplate('workspace/references.__EXTENSION__', composition, grammar)
+    ]);
+}
+/** The client member's compiler options: the protocol's, with the DOM its diagram renders into. */
+const CLIENT_COMPILER_OPTIONS = [
+    ['target', 'ES2022'],
+    ['lib', ['ES2022', 'DOM']],
+    ['module', 'NodeNext'],
+    ['moduleResolution', 'NodeNext'],
+    ['rootDir', 'src'],
+    ['outDir', 'lib'],
+    ['strict', true],
+    ['skipLibCheck', true],
+    ['declaration', true],
+    // For inversify's `@injectable`, which a GLSP view needs to be bound.
+    ['experimentalDecorators', true],
+    ['types', []],
+    // A base that sets it fails every `import` in this CommonJS member.
+    ['verbatimModuleSyntax', false]
+];
+/**
+ * The client member's `package.json`.
+ *
+ * CommonJS, unlike its siblings, as GLSP's client is: inversify ships an ES
+ * build and a CommonJS one, so an ES module here would load the first while
+ * GLSP's client loads the second, giving a page two containers' worth of
+ * classes. Node from 22.12 and `tsc` under `nodenext` both let it require the
+ * ES protocol member.
+ */
+function clientPackageJson(composition) {
+    const dependencies = {
+        [memberPackageName(composition, 'protocol')]: MEMBER_PIN,
+        ...CLIENT_THIRD_PARTY_DEPENDENCIES
+    };
+    for (const framework of CLIENT_FRAMEWORK_DEPENDENCIES) {
+        dependencies[framework] = frameworkPin(composition);
+    }
+    return `{
+  "name": "${memberPackageName(composition, 'client')}",
+  "version": "0.0.0",
+${composition.packaging.private ? '  "private": true,\n' : ''}  "description": "The host-neutral client side of the ${composition.name} language: what every host of it mounts.",
+  "license": "UNLICENSED",
+  "author": "",
+  "files": [
+    "lib",
+    "src"
+  ],
+  "main": "lib/index.js",
+  "types": "lib/index.d.ts",
+  "scripts": {
+    "build": "tsc -b",
+    "clean": "rimraf lib tsconfig.tsbuildinfo",
+${lintScript(forMember(composition, 'client'), 'src')}    "watch": "tsc --watch"
+  },
+  "dependencies": {
+${sortedBlock(dependencies, '    ')}
+  },
+  "devDependencies": {
+    "rimraf": "^5.0.0",
+    "typescript": "^7.0.2"
+  },
+  "engines": {
+    "node": ">=22.13"
+  }
+}
+`;
+}
+/** The client member's README. */
+function clientReadme(composition) {
+    const diagrams = composition.grammars.filter(grammar => grammar.diagram);
+    const lines = [
+        `# ${memberPackageName(composition, 'client')}`,
+        '',
+        'The host-neutral client side of the __NAME__ language: what every host of it',
+        'mounts, whatever that host is. It reads the element ids from the protocol',
+        'package and never depends on the server.',
+        '',
+        ...diagrams.map(grammar => `- \`src/${grammar.grammarId}-diagram-module.ts\` — the \`${grammar.grammar}\` diagram: a registration per element type, its container module, and \`initialize${grammar.grammar}DiagramContainer\``),
+        '- `src/index.ts` — the package root, re-exporting each module',
+        '',
+        'A host builds a diagram container with the initializer, passing its own',
+        'modules: they go first and the diagram definition last, since GLSP gives an',
+        'element type to whichever module registered it last.',
+        ''
+    ];
+    return project(lines.join('\n'), composition);
+}
+/** The client member's root entry, one re-export per diagram module. */
+function clientIndexFile(composition) {
+    const modules = composition.grammars.filter(grammar => grammar.diagram).map(grammar => `./${grammar.grammarId}-diagram-module.js`);
+    return `// What every host of the ${composition.name} language mounts.
+
+${modules.map(module => `export * from '${module}';`).join('\n')}
+`;
+}
+/**
+ * The client member: the host-neutral client side of the language, emitted
+ * when there is a diagram to define. Each host mounts it rather than defining
+ * the diagram again.
+ */
+function clientFiles(composition) {
+    return [
+        { path: 'client/package.json', content: clientPackageJson(composition) },
+        {
+            path: 'client/tsconfig.json',
+            content: tsconfigJson(forMember(composition, 'client'), CLIENT_COMPILER_OPTIONS, '["src"]', '[{ "path": "../protocol" }]')
+        },
+        ignoreFile('client'),
+        { path: 'client/README.md', content: clientReadme(composition) },
+        { path: 'client/src/index.ts', content: clientIndexFile(composition) },
+        ...composition.grammars
+            .filter(grammar => grammar.diagram)
+            .map(grammar => grammarTemplate('client/src/__GRAMMAR_ID__-diagram-module.ts', composition, grammar))
+    ];
+}
+/**
+ * The browser host's `package.json`. Always private: it is an application,
+ * which nothing installs as a dependency.
+ */
+function hostBrowserPackageJson(composition) {
+    const dependencies = {
+        [memberPackageName(composition, 'protocol')]: MEMBER_PIN,
+        [memberPackageName(composition, 'server')]: MEMBER_PIN,
+        ...(composition.heads.includes('glsp') ? { [memberPackageName(composition, 'client')]: MEMBER_PIN } : {}),
+        // A page with no editor saves through the diagram's own action dispatcher.
+        ...(composition.heads.includes('lsp') ? {} : { '@eclipse-glsp/client': CLIENT_THIRD_PARTY_DEPENDENCIES['@eclipse-glsp/client'] })
+    };
+    for (const head of ['base', ...composition.heads]) {
+        Object.assign(dependencies, HOST_BROWSER_THIRD_PARTY_DEPENDENCIES[head]);
+        for (const framework of HOST_BROWSER_FRAMEWORK_DEPENDENCIES[head]) {
+            dependencies[framework] = frameworkPin(composition);
+        }
+    }
+    return `{
+  "name": "${memberPackageName(composition, 'host-browser')}",
+  "version": "0.0.0",
+  "private": true,
+  "description": "${composition.name} in a browser page, with every head in a web worker and no backend.",
+  "license": "UNLICENSED",
+  "author": "",
+  "type": "module",
+  "scripts": {
+    "build": "npm run typecheck && node esbuild.mjs",
+    "clean": "rimraf out test-results playwright-report",
+${lintScript(forMember(composition, 'host-browser'), 'src test')}    "start": "node esbuild.mjs --serve",
+    "test:e2e": "playwright test --tsconfig tsconfig.e2e.json",
+    "test:e2e:install": "playwright install chromium",
+    "typecheck": "tsc --noEmit -p tsconfig.worker.json && tsc --noEmit -p tsconfig.page.json && tsc --noEmit -p tsconfig.e2e.json"
+  },
+  "dependencies": {
+${sortedBlock(dependencies, '    ')}
+  },
+  "devDependencies": {
+${sortedBlock(HOST_BROWSER_DEV_DEPENDENCIES, '    ')}
+  },
+  "engines": {
+    "node": ">=22.13"
+  }
+}
+`;
+}
+/** The workspace URI of a grammar's first starter file, as a template literal over `WORKSPACE_ROOT_URI`. */
+function starterUri(grammar) {
+    return `\`\${WORKSPACE_ROOT_URI}/nodes.${grammar.extensions[0]}\``;
+}
+/**
+ * The worker hosting the heads: every head over the one store, with the
+ * workspace seeded from `../workspace` and saved files kept in IndexedDB.
+ */
+function hostWorkerFile(composition) {
+    const columns = columnsFor(composition);
+    const lsp = composition.heads.includes('lsp');
+    const data = composition.heads.includes('data');
+    const glsp = composition.heads.includes('glsp');
+    const diagrams = composition.grammars.filter(grammar => grammar.diagram);
+    const roots = composition.grammars.map(grammar => grammar.entryRule).sort();
+    const serverSymbols = [`create${composition.name}Services`, ...diagrams.map(grammar => `${grammar.grammar}DiagramModule`)].sort((left, right) => left.localeCompare(right));
+    const imports = [
+        ...(glsp
+            ? [
+                '// First, before any class carrying a decorator loads: GLSP reads the metadata',
+                '// its decorators emit as each class is defined.',
+                "import 'reflect-metadata';",
+                "import { ServerModule } from '@eclipse-glsp/server/browser.js';"
+            ]
+            : []),
+        "import { persistentFileSystem } from '@hydranium/core';",
+        importList(['hostHeadsInWorker', 'IndexedDbFileSystemStore', ...(lsp ? ['startLanguageServerInWorker'] : [])], '@hydranium/core/browser', columns),
+        ...(data
+            ? [
+                "import { DataServer } from '@hydranium/data-server';",
+                "import { startDataServerInWorker } from '@hydranium/data-server/browser';"
+            ]
+            : []),
+        ...(glsp
+            ? [
+                "import { GlspClientLogger, HydraniumGlspAppModule } from '@hydranium/glsp-server';",
+                "import { startGlspServerInWorker } from '@hydranium/glsp-server/browser';"
+            ]
+            : []),
+        ...(data ? [importList(roots, memberPackageName(composition, 'protocol'), columns, true)] : []),
+        importList(serverSymbols, memberPackageName(composition, 'server'), columns),
+        "import { WORKSPACE_ROOT_URI } from './workspace.js';"
+    ];
+    const services = `const shared = create${composition.name}Services({ ...fileSystem }).shared;`;
+    const lspCall = `startLanguageServerInWorker(ports.lsp, connection => create${composition.name}Services({ connection, ...fileSystem }).shared);`;
+    const startServices = !lsp
+        ? services
+        : `      const shared = ${lspCall}`.length <= columns
+            ? `const shared = ${lspCall}`
+            : `const shared = startLanguageServerInWorker(
+         ports.lsp,
+         connection => create${composition.name}Services({ connection, ...fileSystem }).shared
+      );`;
+    const dataServer = `connection => new DataServer<${roots.join(' | ')}>(connection, shared)`;
+    const dataCall = `startDataServerInWorker(ports.data, shared, ${dataServer});`;
+    const dataHead = data
+        ? `
+      // The data head serves from the ${lsp ? "LSP head's" : "services'"} store, on its own port.
+      ${`      ${dataCall}`.length <= columns
+            ? dataCall
+            : `startDataServerInWorker(
+         ports.data,
+         shared,
+         ${dataServer}
+      );`}`
+        : '';
+    const glspHead = glsp
+        ? `
+      const glsp = startGlspServerInWorker({
+         context: ports.glsp,
+         createLogger: caller => new GlspClientLogger(shared, { component: caller }),
+         serverModule: new ServerModule()${diagrams.map(grammar => `.configureDiagramModule(new ${grammar.grammar}DiagramModule())`).join('')},
+         appModules: [new HydraniumGlspAppModule({ shared })]
+      });
+      // The GLSP head reports a failed start through \`started\`, which the
+      // ready message waits for.
+      return { shared, started: [glsp.started] };`
+        : `
+      return shared;`;
+    const text = `// The worker hosting the heads: every head over one store, in the browser and
+// with no backend. The page reaches each head over a \`MessagePort\` of its own.
+
+${imports.join('\n')}
+
+/** The files of \`../workspace\`, read by \`esbuild.mjs\` and keyed by their path below the root. */
+declare const __WORKSPACE_SEED__: Record<string, string>;
+/** This project's directory, hashed by \`esbuild.mjs\`, so that no other project on the origin opens its store. */
+declare const __DIRECTORY_KEY__: string;
+
+// A saved file is kept in IndexedDB and laid over the seed on the next load;
+// the heads start once the stored files are restored.
+const store = new IndexedDbFileSystemStore(\`__PROJECT_ID__-workspace-\${__DIRECTORY_KEY__}\`);
+
+hostHeadsInWorker(
+   persistentFileSystem({ store, seed: __WORKSPACE_SEED__, rootUri: WORKSPACE_ROOT_URI }),
+   (ports, fileSystem) => {
+      ${lsp ? '// The LSP head composes the services, as the Node entry does around stdio.\n      ' : ''}${startServices}${dataHead}${glspHead}
+   },
+   ${lsp
+        ? '// The ready message then carries the workspace files the page opens.'
+        : '// With no LSP head the workspace comes up from this root, and the ready\n   // message then carries its files.'}
+   { rootUri: WORKSPACE_ROOT_URI }
+);
+`;
+    return project(text, composition);
+}
+/**
+ * The page, and the one place deciding which head's part of it runs: each
+ * part is a module of its own, and this calls the ones the heads serve.
+ */
+function hostPageFile(composition) {
+    const lsp = composition.heads.includes('lsp');
+    const data = composition.heads.includes('data');
+    const diagram = composition.grammars.find(grammar => grammar.diagram);
+    // A host takes lsp or glsp, and glsp marks a diagram grammar, so without lsp there is one.
+    const diagramLanguage = lsp || diagram === undefined ? undefined : `${screamingSnake(diagram.grammarId)}_LANGUAGE`;
+    const shownLanguage = diagramLanguage ?? 'ALL_LANGUAGES';
+    const parts = [
+        // Every part follows the file the page shows, so the switch comes first. With
+        // no editor it lists only the diagram's files, the only ones the page shows.
+        {
+            module: './shown-file.js',
+            imports: 'startShownFile',
+            call: `const shownFile = await startShownFile(heads, ${diagramLanguage === undefined ? shownLanguage : `[${diagramLanguage}]`});`
+        },
+        // Save is armed with the editor, so it works before the other panes load;
+        // with a diagram it waits for the edits of the one shown, once mounted.
+        ...(lsp
+            ? [
+                {
+                    module: './editor.js',
+                    imports: 'armEditorSave, startEditor',
+                    call: [
+                        'const editor = await startEditor(heads, shownFile);',
+                        ...(diagram === undefined
+                            ? ['armEditorSave(editor);']
+                            : [
+                                'let shownDiagram: Awaited<ReturnType<typeof mountDiagram>> | undefined = undefined;',
+                                'armEditorSave(editor, () => settleDiagramEdits(shownDiagram?.()));'
+                            ])
+                    ].join('\n   ')
+                }
+            ]
+            : []),
+        ...(data
+            ? [
+                {
+                    module: './data-status.js',
+                    imports: 'showDataStatus',
+                    call: `await showDataStatus(heads.data, ${starterUri(composition.grammars[0])});`
+                }
+            ]
+            : []),
+        ...(diagram === undefined
+            ? []
+            : [
+                {
+                    module: './diagram.js',
+                    imports: lsp ? 'mountDiagram, settleDiagramEdits' : 'mountDiagram',
+                    call: `${lsp ? 'shownDiagram' : 'const shownDiagram'} = await mountDiagram(heads.glsp, shownFile, logger, ${lsp ? 'settleDiagramEdits' : 'saveBeforeLeaving'});`
+                }
+            ]),
+        // Without the editor, the diagram is what the page saves through.
+        ...(lsp ? [] : [{ module: './diagram-save.js', imports: 'armDiagramSave, saveBeforeLeaving', call: 'armDiagramSave(shownDiagram);' }])
+    ];
+    const imports = [
+        ...parts.map(part => `import { ${part.imports} } from '${part.module}';`),
+        "import { appendLog, setStatus } from './log.js';",
+        ...(data ? ["import { WORKSPACE_ROOT_URI } from './workspace.js';"] : [])
+    ].sort((left, right) => left.slice(left.indexOf("'")).localeCompare(right.slice(right.indexOf("'"))));
+    return `// The page: it starts the worker, hands each head a channel of its own, and
+// fills the pane of each head the server runs, one after the other.
+
+import { connectWorkerHeads } from '@hydranium/client-browser';
+import { ConsoleLogger, describeError } from '@hydranium/protocol';
+import { ${shownLanguage} } from '${memberPackageName(composition, 'protocol')}';
+${imports.join('\n')}
+
+/** Where the worker bundle is served, substituted by \`esbuild.mjs\`. */
+declare const __WORKER_BUNDLE_URL__: string;
+
+async function main(): Promise<void> {
+   // The page's end of each head's connection logs to the browser console.
+   const logger = new ConsoleLogger();
+   const heads = connectWorkerHeads(new Worker(__WORKER_BUNDLE_URL__), { logger });
+   heads.onWorkerError(report => appendLog(\`worker error during \${report.phase}: \${report.message}\`));
+   setStatus('starting…');
+${parts.map(part => `   ${part.call}`).join('\n')}
+   setStatus('ready');
+}
+
+main().catch((error: unknown) => setStatus(\`failed: \${describeError(error)}\`));
+`;
+}
+/**
+ * The smoke test: what each head shows on the page, and an edit that survives
+ * a reload, typed in the editor or, with no LSP head, made in the diagram. With
+ * a diagram, also a diagram edit the reload guard and Save catch before the
+ * server has answered it.
+ */
+function hostSmokeSpec(composition) {
+    const lsp = composition.heads.includes('lsp');
+    const data = composition.heads.includes('data');
+    const diagram = composition.grammars.find(grammar => grammar.diagram);
+    const primary = composition.grammars[0];
+    const checks = [
+        ...(lsp ? ["   await expect(editor).toContainText('node First');"] : []),
+        ...(data
+            ? [
+                '   // The data head reads the document out of the same store.',
+                `   await expect(page.locator('#data-status')).toHaveText('data head: nodes.${primary.extensions[0]} holds a ${primary.entryRule}');`
+            ]
+            : []),
+        ...(diagram === undefined
+            ? []
+            : [
+                '   // The diagram follows the switch: two nodes in one file, and in the other its',
+                '   // node and the target it references there, drawn as external.',
+                "   const first = await page.locator('#file').inputValue();",
+                `   await page.locator('#file').selectOption('nodes.${diagram.extensions[0]}');`,
+                "   await expect(page.locator('#diagram .sprotty-node')).toHaveCount(2);",
+                `   await page.locator('#file').selectOption('references.${diagram.extensions[0]}');`,
+                `   await expect(page.locator('#diagram .external')).toHaveText('Second (nodes.${diagram.extensions[0]})');`,
+                "   await page.locator('#file').selectOption(first);"
+            ])
+    ];
+    const edit = lsp
+        ? `   await editor.click();
+   await page.keyboard.press('ControlOrMeta+End');
+   await page.keyboard.type('\\nnode Added');
+   await page.locator('#save').click();
+   await expect(page.locator('#status')).toHaveText('saved 1 file(s)');
+
+   await page.reload();
+   await expect(page.locator('#status')).toHaveText('ready');
+   await expect(editor).toContainText('node Added');`
+        : `   // A node from the palette, dropped low and left of centre: the starter nodes
+   // sit in the upper band and the palette in the upper right.
+   const canvas = page.locator('#diagram');
+   const create = async (): Promise<void> => {
+      await page.locator('#diagram .tool-button', { hasText: '${diagram?.nodeRule}' }).click();
+      const size = await canvas.evaluate(element => ({ width: element.clientWidth, height: element.clientHeight }));
+      await canvas.click({ position: { x: size.width * 0.4, y: size.height * 0.85 } });
+   };
+   await create();
+   await expect(nodes).toHaveCount(3);
+   await page.locator('#save').click();
+   await expect(page.locator('#status')).toHaveText('saved the diagram');
+   // A second, left unsaved: the switch saves the diagram it leaves.
+   await create();
+   await expect(nodes).toHaveCount(4);
+   await page.locator('#file').selectOption('references.${diagram?.extensions[0]}');
+   await expect(page.locator('#diagram .external')).toBeVisible();
+
+   await page.reload();
+   await expect(page.locator('#status')).toHaveText('ready');
+   await expect(nodes).toHaveCount(4);`;
+    const guardTest = diagram === undefined
+        ? ''
+        : `
+test('asks before a reload drops a diagram edit the server has not answered, and saves it with Save at once', async ({ page }) => {
+   const nodes = page.locator('#diagram .sprotty-node');
+   const askGuard = (): Promise<boolean> =>
+      page.evaluate(() => {
+         const event = new Event('beforeunload', { cancelable: true });
+         window.dispatchEvent(event);
+         return event.defaultPrevented;
+      });
+   await page.goto('/');
+   await expect(page.locator('#status')).toHaveText('ready');
+   await page.locator('#file').selectOption('nodes.${diagram.extensions[0]}');
+   await expect(nodes).toHaveCount(2);
+
+   const canvas = page.locator('#diagram');
+   await page.locator('#diagram .tool-button', { hasText: '${diagram.nodeRule}' }).click();
+   const size = await canvas.evaluate(element => ({ width: element.clientWidth, height: element.clientHeight }));
+   // Asked and clicked right after the click's own handlers, in the same turn
+   // of the page, so the server's answer cannot have marked anything unsaved.
+   await page.evaluate(() => {
+      window.addEventListener(
+         'mouseup',
+         () =>
+            queueMicrotask(() => {
+               const event = new Event('beforeunload', { cancelable: true });
+               window.dispatchEvent(event);
+               document.getElementById('save')?.click();
+               Reflect.set(window, 'guardedOnCreate', event.defaultPrevented);
+            }),
+         { once: true }
+      );
+   });
+   await canvas.click({ position: { x: size.width * 0.4, y: size.height * 0.85 } });
+   expect(await page.evaluate(() => Reflect.get(window, 'guardedOnCreate'))).toBe(true);
+   await expect(page.locator('#status')).toHaveText('${lsp ? 'saved 1 file(s)' : 'saved the diagram'}');
+   expect(await askGuard()).toBe(false);
+
+   await page.reload();
+   await expect(page.locator('#status')).toHaveText('ready');
+   await page.locator('#file').selectOption('nodes.${diagram.extensions[0]}');
+   await expect(nodes).toHaveCount(3);
+});
+`;
+    const locators = [
+        ...(lsp ? ["   const editor = page.locator('#editor .view-lines');"] : []),
+        ...(lsp ? [] : ["   const nodes = page.locator('#diagram .sprotty-node');"])
+    ];
+    return `// The page loads with every head answering, and an edit saved through the
+// ${lsp ? 'LSP head' : 'GLSP head'} is still there after a reload; any console error fails that
+// test. The other asks before a reload drops a diagram edit the server has not
+// answered yet, and keeps it when Save is clicked at once.
+
+import { expect, test } from '@playwright/test';
+
+test('loads every head and keeps a saved ${lsp ? 'edit' : 'diagram edit'} across a reload', async ({ page }) => {
+   const errors: string[] = [];
+   page.on('pageerror', error => errors.push(error.message));
+   page.on('console', message => {
+      if (message.type() === 'error') {
+         errors.push(message.text());
+      }
+   });
+${locators.join('\n')}
+
+   await page.goto('/');
+   await expect(page.locator('#status')).toHaveText('ready');
+${checks.join('\n')}
+
+${edit}
+   expect(errors).toEqual([]);
+});
+${guardTest}`;
+}
+/** The browser host's README. */
+function hostBrowserReadme(composition) {
+    const lsp = composition.heads.includes('lsp');
+    const data = composition.heads.includes('data');
+    const diagram = composition.grammars.find(grammar => grammar.diagram);
+    const lines = [
+        `# ${memberPackageName(composition, 'host-browser')}`,
+        '',
+        '__NAME__ in a browser page: every head runs in a web worker, with no backend',
+        `and no Node runtime. The page saves through the ${lsp ? 'LSP head' : 'GLSP head'}, and the worker`,
+        'keeps each saved file in IndexedDB, laid over `../workspace` on the next',
+        'load.',
+        '',
+        '```bash',
+        'npm run build              # type-check and bundle into out/',
+        'npm start                  # serve the page at the URL it prints, rebundled on every source change',
+        'npm run test:e2e:install   # download the Chromium the smoke test drives, once',
+        'npm run test:e2e           # the smoke test, which serves the page itself',
+        '```',
+        '',
+        '`PORT` moves the page to another port, for `npm start` and the smoke test alike;',
+        'stop `npm start` before the smoke test, or give one of them another port.',
+        '`npm start` reads `../workspace` once, so restart it after editing a file',
+        'there.',
+        '',
+        '## Layout',
+        '',
+        '- `index.html` — the page, with a pane for each head that stays hidden until its part fills it',
+        '- `hydranium-mark.svg` — the tab icon',
+        `- \`esbuild.mjs\` — bundles the page${lsp ? ', the worker and Monaco’s worker' : ' and the worker'}, reading \`../workspace\` in as the seed`,
+        '- `src/worker.ts` — the worker: the heads over one store, seeded and persisted',
+        '- `src/page.ts` — starts the worker and runs the part of the page each head serves',
+        '- `src/shown-file.ts` — the file switch above the panes, which every part follows',
+        ...(lsp ? ['- `src/editor.ts` — the LSP part: a Monaco editor and Save'] : []),
+        ...(data ? ['- `src/data-status.ts` — the data part: one document read through the data head'] : []),
+        ...(diagram === undefined
+            ? []
+            : [
+                `- \`src/diagram.ts\` — the GLSP part: the \`${diagram.grammar}\` diagram of the file the page shows, defined in the client package`
+            ]),
+        ...(lsp ? [] : ['- `src/diagram-save.ts` — Save with no editor: the diagram saved through the GLSP head']),
+        '- `src/log.ts` — the status line and the log area',
+        '- `src/workspace.ts` — the workspace root URI both ends name',
+        ...(lsp ? ['- `src/monaco-editor-worker.ts` — Monaco’s own worker, which hosts no head'] : []),
+        '- `src/posix-path-shim.ts` — the `path` function the framework imports, for the bundle',
+        '- `test/smoke.spec.mts` — the page loads, each head answers, and a saved edit survives a reload',
+        ''
+    ];
+    return project(lines.join('\n'), composition);
+}
+/** The page with the line under its log view saying what shows there, which the LSP head decides. */
+function withLogHint(page, lsp) {
+    const hint = lsp
+        ? 'What the server logs over the LSP head, and the errors the page reports.'
+        : "The errors the page reports. The server logs to the worker's console, in the browser's developer tools.";
+    return { ...page, content: page.content.replace('__LOG_HINT__', hint) };
+}
+/** The browser host: a page and a worker, bundled by esbuild and served as static files. */
+function hostBrowserFiles(composition) {
+    const fixed = (file) => projectTemplate(`host-browser/${file}`, composition);
+    const lsp = composition.heads.includes('lsp');
+    const diagram = composition.grammars.find(grammar => grammar.diagram);
+    return [
+        { path: 'host-browser/package.json', content: hostBrowserPackageJson(composition) },
+        ignoreFile('host-browser'),
+        { path: 'host-browser/README.md', content: hostBrowserReadme(composition) },
+        withLogHint(fixed('index.html'), lsp),
+        fixed('hydranium-mark.svg'),
+        fixed('esbuild.mjs'),
+        fixed('playwright.config.mts'),
+        fixed('tsconfig.worker.json'),
+        fixed('tsconfig.page.json'),
+        fixed('tsconfig.e2e.json'),
+        { path: 'host-browser/src/worker.ts', content: hostWorkerFile(composition) },
+        { path: 'host-browser/src/page.ts', content: hostPageFile(composition) },
+        fixed('src/shown-file.ts'),
+        ...(lsp ? [fixed('src/editor.ts')] : []),
+        ...(composition.heads.includes('data') ? [fixed('src/data-status.ts')] : []),
+        ...(diagram === undefined ? [] : [grammarTemplate('host-browser/src/diagram.ts', composition, diagram)]),
+        ...(lsp ? [] : [fixed('src/diagram-save.ts')]),
+        fixed('src/log.ts'),
+        fixed('src/workspace.ts'),
+        ...(lsp ? [fixed('src/monaco-editor-worker.ts'), fixed('src/monaco-editor-core-worker.d.ts')] : []),
+        fixed('src/posix-path-shim.ts'),
+        { path: 'host-browser/test/smoke.spec.mts', content: hostSmokeSpec(composition) }
+    ];
+}
+/** A JSON value as it sits at `indent` in a manifest npm writes. */
+function jsonAt(value, indent) {
+    return JSON.stringify(value, null, 2).replace(/\n/g, `\n${indent}`);
+}
+/**
+ * The languages and grammars a VS Code extension contributes. Each extension
+ * declares its own, since either may be installed without the other; the
+ * grammars are the server's, copied in by `copy:syntaxes`.
+ */
+function vscodeLanguageContributions(composition) {
+    return {
+        grammars: composition.grammars.map(grammar => ({
+            language: grammar.languageId,
+            scopeName: `source.${grammar.languageId}`,
+            path: `./syntaxes/${grammar.languageId}.tmLanguage.json`
+        })),
+        languages: composition.grammars.map(grammar => ({
+            id: grammar.languageId,
+            aliases: [grammar.grammar],
+            extensions: grammar.extensions.map(extension => `.${extension}`)
+        }))
+    };
+}
+/** VS Code finds the grammars only inside the extension, so the build copies the server's. */
+const COPY_SYNTAXES_SCRIPT = "require('node:fs').cpSync('../server/syntaxes', 'syntaxes', { recursive: true })";
+const COPY_SYNTAXES = `node -e \\"${COPY_SYNTAXES_SCRIPT}\\"`;
+/** `copy:syntaxes`, then again each time the server's `langium:watch` rewrites a grammar. */
+const WATCH_SYNTAXES = `node -e \\"const copy = () => ${COPY_SYNTAXES_SCRIPT}; copy(); require('node:fs').watch('../server/syntaxes', copy)\\"`;
+/**
+ * The servers-only extension's `package.json`. Always private, like a host:
+ * it is installed into an application, never as a dependency.
+ *
+ * `onStartupFinished` rather than `onLanguage`, since a Theia backend asks for
+ * a port before any document is open.
+ */
+function vscodeServersPackageJson(composition) {
+    const dependencies = {
+        [memberPackageName(composition, 'protocol')]: MEMBER_PIN,
+        [memberPackageName(composition, 'server')]: MEMBER_PIN,
+        ...VSCODE_LANGUAGE_CLIENT
+    };
+    if (socketHeads(composition).length > 0) {
+        dependencies['@hydranium/client-vscode'] = frameworkPin(composition);
+    }
+    return `{
+  "name": "${memberPackageName(composition, 'vscode-servers')}",
+  "displayName": "${composition.name} Servers",
+  "version": "0.0.0",
+  "private": true,
+  "description": "Starts the ${composition.name} server${socketHeads(composition).length > 0 ? " and publishes its socket heads' ports as host commands" : ''}, with no editor of its own.",
+  "license": "UNLICENSED",
+  "author": "",
+  "publisher": "${composition.projectId}",
+  "main": "./out/extension.js",
+  "scripts": {
+    "build": "npm run copy:syntaxes && tsc",
+    "clean": "rimraf out syntaxes tsconfig.tsbuildinfo",
+    "copy:syntaxes": "${COPY_SYNTAXES}",
+${lintScript(forMember(composition, 'vscode-servers'), 'src')}    "watch": "concurrently --kill-others --names syntaxes,tsc \\"npm run watch:syntaxes\\" \\"tsc --watch\\"",
+    "watch:syntaxes": "${WATCH_SYNTAXES}"
+  },
+  "dependencies": {
+${sortedBlock(dependencies, '    ')}
+  },
+  "devDependencies": {
+${sortedBlock({ '@types/node': '^22.0.0', '@types/vscode': VSCODE_ENGINE, concurrently: '^9.0.0', rimraf: '^5.0.0', typescript: '^7.0.2' }, '    ')}
+  },
+  "contributes": ${jsonAt(vscodeLanguageContributions(composition), '  ')},
+  "activationEvents": [
+    "onStartupFinished"
+  ],
+  "engines": {
+    "vscode": "${VSCODE_ENGINE}"
+  }
+}
+`;
+}
+/**
+ * The servers-only extension's activation: the shared launch, and with a socket
+ * head the port commands, which only this extension registers.
+ */
+function vscodeServersExtensionFile(composition) {
+    const upper = screamingSnake(composition.projectId);
+    const heads = socketHeads(composition).map(head => head.key);
+    const protocolSymbols = heads.flatMap(head => [`${upper}_${head}_HOST_COMMAND`, `${upper}_${head}_PORT_COMMAND`]);
+    const imports = heads.length === 0
+        ? ''
+        : `import { registerPortCommands } from '@hydranium/client-vscode/node';
+${importList(protocolSymbols, memberPackageName(composition, 'protocol'), columnsFor(composition))}
+`;
+    const portCommands = heads.length === 0
+        ? ''
+        : `
+
+   // Each socket head's port as a host command, for a host with no language
+   // client of its own. Not in the shared launch: VS Code throws on a second
+   // registration of one id, so the VS Code extension beside this one would fail
+   // to activate. A pass-through: awaiting anything else in it would hang a
+   // Theia backend on a user dismissing a notification.
+   registerPortCommands(context, client, {
+${heads.map(head => `      [${upper}_${head}_HOST_COMMAND]: ${upper}_${head}_PORT_COMMAND`).join(',\n')}
+   });`;
+    return `// The servers-only extension: it starts the ${composition.name} server and contributes no
+// editor, view or command. A Theia app sideloads this one rather than the VS
+// Code extension, whose diagram editors would give its files a second editor.
+
+${imports}import type { ExtensionContext } from 'vscode';
+import type { LanguageClient } from 'vscode-languageclient/node';
+import { start${composition.name}LanguageClient } from './language-client.js';
+
+let client: LanguageClient | undefined;
+
+export async function activate(context: ExtensionContext): Promise<void> {
+   client = await start${composition.name}LanguageClient(context);${portCommands}
+}
+
+export async function deactivate(): Promise<void> {
+   await client?.stop();
+   client = undefined;
+}
+`;
+}
+/**
+ * The server launch both extensions share: one launch, so VS Code and a Theia
+ * app sideloading the servers extension hand the server the same documents.
+ */
+function vscodeLanguageClientFile(composition) {
+    return `// Starts the ${composition.name} server for VS Code, and for a Theia app that sideloads
+// this extension: one launch, so both hand the server the same documents.
+
+import { ALL_LANGUAGES } from '${memberPackageName(composition, 'protocol')}';
+import { type ExtensionContext, workspace } from 'vscode';
+import { LanguageClient, TransportKind } from 'vscode-languageclient/node';
+
+/** Fork the server, start its language client and return it once started. */
+export async function start${composition.name}LanguageClient(context: ExtensionContext): Promise<LanguageClient> {
+   // Resolved through the package, so it works from the workspace and from an
+   // installed extension alike. Over IPC, which keeps the server's stdout free.
+   const serverModule = require.resolve('${memberPackageName(composition, 'server')}/lib/main.js');
+   const extensions = ALL_LANGUAGES.flatMap(language => language.fileExtensions).join(',');
+   const client = new LanguageClient(
+      '${composition.projectId}',
+      '${composition.name}',
+      { module: serverModule, transport: TransportKind.ipc },
+      {
+         documentSelector: ALL_LANGUAGES.map(({ languageId }) => ({ scheme: 'file', language: languageId })),
+         // Changes on disk the editor does not hold, such as a file another tool writes.
+         synchronize: { fileEvents: workspace.createFileSystemWatcher(\`**/*{\${extensions}}\`) }
+      }
+   );
+   context.subscriptions.push(client);
+   await client.start();
+
+   return client;
+}
+`;
+}
+/** The folders of the Theia applications the composition emits, as code spans. */
+function theiaApplicationPaths(composition) {
+    return composition.hosts.filter(isTheiaHost).map(host => `\`../host-${host}\``);
+}
+/** The servers-only extension's README. */
+function vscodeServersReadme(composition) {
+    const vscode = composition.hosts.includes('vscode');
+    const theiaApps = theiaApplicationPaths(composition);
+    const intro = [
+        'A VS Code extension that starts the __NAME__ server and contributes no editor, view or command: the languages, their grammars and the server.',
+        `With a socket head, it also answers each head’s port under a host command, which a host without a language client of its own runs${theiaApps.length > 0
+            ? theiaApps.length === 1
+                ? `: the Theia application in ${theiaApps[0]}, which sideloads this extension.`
+                : `: the Theia applications in ${listPhrase(theiaApps)}, which sideload this extension.`
+            : ', such as a Theia app sideloading this extension.'}`,
+        ...(vscode
+            ? [
+                'The VS Code extension in `../host-vscode` starts the server through the same function.',
+                'Both work side by side, but each starts its own server and language client, so diagnostics may show twice: install one.'
+            ]
+            : [])
+    ];
+    const lines = [
+        `# ${memberPackageName(composition, 'vscode-servers')}`,
+        '',
+        ...wrapProse(intro.join(' ')),
+        '',
+        '```bash',
+        'npm run build   # copy the server’s grammars and compile into out/; build the server first',
+        'npm run watch   # the same on every change',
+        '```',
+        '',
+        '- `src/extension.ts` — activation, which starts the server and, with a socket head, registers its port commands',
+        `- \`src/language-client.ts\` — the server launch${vscode ? ', shared with `../host-vscode`' : ''}`,
+        ''
+    ];
+    return project(lines.join('\n'), composition);
+}
+/** The servers-only extension: the server's launch, without an editor. */
+function vscodeServersFiles(composition) {
+    return [
+        { path: 'vscode-servers/package.json', content: vscodeServersPackageJson(composition) },
+        ignoreFile('vscode-servers'),
+        { path: 'vscode-servers/README.md', content: vscodeServersReadme(composition) },
+        projectTemplate('vscode-servers/tsconfig.json', composition),
+        { path: 'vscode-servers/src/extension.ts', content: vscodeServersExtensionFile(composition) },
+        { path: 'vscode-servers/src/language-client.ts', content: vscodeLanguageClientFile(composition) }
+    ];
+}
+/**
+ * The custom-editor view type of a grammar's diagram, as the editor module
+ * declares it. VS Code keys custom editors by view type alone, across every
+ * installed extension, so it carries the language id, which `init` qualifies
+ * by the project wherever the grammar is named apart from it.
+ */
+function diagramViewType(grammar) {
+    return `${grammar.languageId}.diagram`;
+}
+/**
+ * The VS Code extension's `package.json`. Always private, as every host is.
+ *
+ * A diagram file opens in its diagram by default; `Reopen Editor With` reaches
+ * the text.
+ */
+function hostVscodePackageJson(composition) {
+    const diagrams = composition.grammars.filter(grammar => grammar.diagram);
+    const dependencies = {
+        [memberPackageName(composition, 'vscode-servers')]: MEMBER_PIN,
+        ...VSCODE_LANGUAGE_CLIENT
+    };
+    if (diagrams.length > 0) {
+        dependencies[memberPackageName(composition, 'client')] = MEMBER_PIN;
+        dependencies[memberPackageName(composition, 'protocol')] = MEMBER_PIN;
+        Object.assign(dependencies, HOST_VSCODE_GLSP_THIRD_PARTY_DEPENDENCIES);
+        for (const framework of HOST_VSCODE_GLSP_FRAMEWORK_DEPENDENCIES) {
+            dependencies[framework] = frameworkPin(composition);
+        }
+    }
+    if (composition.heads.includes('data')) {
+        dependencies[memberPackageName(composition, 'protocol')] = MEMBER_PIN;
+        Object.assign(dependencies, HOST_VSCODE_DATA_THIRD_PARTY_DEPENDENCIES);
+        for (const framework of HOST_VSCODE_DATA_FRAMEWORK_DEPENDENCIES) {
+            dependencies[framework] = frameworkPin(composition);
+        }
+    }
+    const devDependencies = { ...HOST_VSCODE_DEV_DEPENDENCIES, ...(diagrams.length > 0 ? { esbuild: '^0.28.0' } : {}) };
+    const watches = {
+        syntaxes: 'npm run watch:syntaxes',
+        tsc: 'tsc --watch',
+        ...(diagrams.length > 0 ? { webview: 'node esbuild.mjs --watch' } : {})
+    };
+    const watchNames = Object.keys(watches).join(',');
+    const watchCommands = Object.values(watches)
+        .map(command => `\\"${command}\\"`)
+        .join(' ');
+    const contributes = {
+        ...(composition.heads.includes('data')
+            ? { commands: [{ command: `${composition.projectId}.showModel`, title: 'Show Model', category: composition.name }] }
+            : {}),
+        ...(diagrams.length > 0
+            ? {
+                customEditors: diagrams.map(grammar => ({
+                    viewType: diagramViewType(grammar),
+                    displayName: `${grammar.grammar} Diagram`,
+                    selector: grammar.extensions.map(extension => ({ filenamePattern: `*.${extension}` })),
+                    priority: 'default'
+                }))
+            }
+            : {}),
+        ...vscodeLanguageContributions(composition)
+    };
+    const typecheck = [...(diagrams.length > 0 ? ['tsconfig.webview.json'] : []), 'tsconfig.e2e.json']
+        .map(project => `tsc --noEmit -p ${project}`)
+        .join(' && ');
+    return `{
+  "name": "${memberPackageName(composition, 'host-vscode')}",
+  "displayName": "${composition.name}",
+  "version": "0.0.0",
+  "private": true,
+  "description": "${composition.name} in VS Code: ${hostVscodeParts(composition)}.",
+  "license": "UNLICENSED",
+  "author": "",
+  "publisher": "${composition.projectId}",
+  "main": "./out/extension.js",
+  "scripts": {
+    "build": "npm run copy:syntaxes && npm run typecheck && tsc${diagrams.length > 0 ? ' && node esbuild.mjs' : ''}",
+    "clean": "rimraf out syntaxes tsconfig.tsbuildinfo test-results playwright-report",
+    "copy:syntaxes": "${COPY_SYNTAXES}",
+${lintScript(forMember(composition, 'host-vscode'), 'src test')}    "start": "node start.mjs",
+    "test:e2e": "playwright test --tsconfig tsconfig.e2e.json",
+    "test:e2e:install": "node --experimental-strip-types test/install-vscode.mts",
+    "typecheck": "${typecheck}",
+    "watch": "concurrently --kill-others --names ${watchNames} ${watchCommands}",
+    "watch:syntaxes": "${WATCH_SYNTAXES}"
+  },
+  "dependencies": {
+${sortedBlock(dependencies, '    ')}
+  },
+  "devDependencies": {
+${sortedBlock(devDependencies, '    ')}
+  },
+  "contributes": ${jsonAt(contributes, '  ')},
+  "activationEvents": ${jsonAt(composition.grammars.map(grammar => `onLanguage:${grammar.languageId}`), '  ')},
+  "engines": {
+    "vscode": "${VSCODE_ENGINE}"
+  }
+}
+`;
+}
+/** What the VS Code extension brings, as one phrase; `started` follows the language client. */
+function hostVscodeParts(composition, started = '') {
+    const parts = [
+        `the language client${started}`,
+        ...(composition.heads.includes('data') ? ['a Show Model command reading a file through the data head'] : []),
+        ...(composition.grammars.some(grammar => grammar.diagram) ? ['a custom editor for each diagram'] : [])
+    ];
+    return listPhrase(parts);
+}
+/** `parts` as one English list: `a`, `a and b`, `a, b, and c`. */
+function listPhrase(parts) {
+    return parts.length === 1 ? parts[0] : `${parts.slice(0, -1).join(', ')}${parts.length > 2 ? ',' : ''} and ${parts.at(-1)}`;
+}
+/**
+ * The VS Code extension's entry: the shared server launch, then the Show Model
+ * command over the data head and a diagram editor per diagram grammar.
+ */
+function hostVscodeExtensionFile(composition) {
+    const columns = columnsFor(composition);
+    const diagrams = composition.grammars.filter(grammar => grammar.diagram);
+    const data = composition.heads.includes('data');
+    const start = `start${composition.name}LanguageClient`;
+    const servers = `${memberPackageName(composition, 'vscode-servers')}/out/language-client.js`;
+    const upper = screamingSnake(composition.projectId);
+    const editors = diagrams.map(grammar => ({
+        module: `./${grammar.grammarId}-diagram-editor.js`,
+        viewType: `${screamingSnake(grammar.grammarId)}_DIAGRAM_VIEW_TYPE`,
+        provider: `${grammar.grammar}DiagramEditorProvider`,
+        local: `${grammar.grammar.charAt(0).toLowerCase()}${grammar.grammar.slice(1)}Editor`
+    }));
+    const registrations = editors.map(editor => `   const ${editor.local} = new ${editor.provider}(glspConnector, context.extensionUri);
+   context.subscriptions.push(
+      window.registerCustomEditorProvider(${editor.viewType}, ${editor.local}, {
+         // A hidden tab keeps its diagram session rather than repeating the handshake.
+         webviewOptions: { retainContextWhenHidden: true },
+         // Two views of one document would be two GLSP clients racing on one model.
+         supportsMultipleEditorsPerDocument: false
+      })
+   );`);
+    const sockets = data || diagrams.length > 0;
+    const protocolSymbols = [
+        ...(data ? [`${upper}_DATA_SERVER_PORT_COMMAND`] : []),
+        ...(diagrams.length > 0 ? [`${upper}_GLSP_SERVER_PORT_COMMAND`] : []),
+        ...(data ? [`type ${composition.name}Element`] : [])
+    ];
+    const imports = [
+        ...(sockets ? ["import { findPort } from '@hydranium/client-vscode/node';"] : []),
+        ...(data ? ["import { SocketDataPort } from '@hydranium/data-client-vscode/node';"] : []),
+        ...(diagrams.length > 0
+            ? ["import { HydraniumGlspVscodeConnector, HydraniumGlspVscodeServer } from '@hydranium/glsp-client-vscode/node';"]
+            : []),
+        ...(sockets
+            ? [
+                importList([
+                    'ConsoleLogger',
+                    ...(data ? ['DataConnectionWithEvents'] : []),
+                    ...(diagrams.length > 0 ? ['describeError'] : []),
+                    ...(data ? ['renderFrameworkMessage'] : [])
+                ], '@hydranium/protocol', columns)
+            ]
+            : []),
+        ...(sockets ? [importList(protocolSymbols, memberPackageName(composition, 'protocol'), columns)] : []),
+        ...(sockets
+            ? [`import { ${[...(data ? ['commands'] : []), 'type ExtensionContext', 'window'].join(', ')} } from 'vscode';`]
+            : ["import type { ExtensionContext } from 'vscode';"]),
+        "import type { LanguageClient } from 'vscode-languageclient/node';",
+        `import { ${start} } from '${servers}';`,
+        ...editors.map(editor => importList([editor.viewType, editor.provider], editor.module, columns)),
+        ...(data ? ["import { showModelCommand } from './show-model-command.js';"] : [])
+    ];
+    const dataBlock = data
+        ? `
+
+   // The data head, read by the Show Model command. Nothing connects until it runs.
+   const dataPort = new SocketDataPort({
+      findPort: () => findPort(running, ${upper}_DATA_SERVER_PORT_COMMAND),
+      logger: new ConsoleLogger().with('data head'),
+      // A failed read shown to the user, not only logged; the message carries the detail.
+      reportError: (_error, reported) => void window.showErrorMessage(renderFrameworkMessage(reported))
+   });
+   const dataConnection = new DataConnectionWithEvents<${composition.name}Element>(dataPort);
+   context.subscriptions.push(dataConnection, dataPort, commands.registerCommand('${composition.projectId}.showModel', showModelCommand(dataConnection)));`
+        : '';
+    const glspBlock = diagrams.length > 0
+        ? `
+
+   // The GLSP head, and the connector bridging it to every diagram webview. No
+   // \`messenger\` option: the connector's own keeps messages flowing to a hidden tab.
+   const glspServer = new HydraniumGlspVscodeServer({
+      clientId: '${composition.projectId}-glsp',
+      clientName: '${composition.name}',
+      findPort: () => findPort(running, ${upper}_GLSP_SERVER_PORT_COMMAND),
+      logger: new ConsoleLogger().with('GLSP head')
+   });
+   const glspConnector = new HydraniumGlspVscodeConnector({ server: glspServer, logging: false });
+   context.subscriptions.push(glspServer, glspConnector);
+   // Not awaited, so a session that opens no diagram does not wait on the port.
+   // \`start()\` resolves either way; a failure is reported off \`onReady\`.
+   void glspServer.start();
+   void glspServer.onReady.catch((error: unknown) => {
+      void window.showErrorMessage(\`${composition.name} diagram unavailable: \${describeError(error)}\`);
+   });
+${registrations.join('\n')}`
+        : '';
+    const opening = wrapComment(`The ${composition.name} VS Code extension: ${hostVscodeParts(composition, ', started the way the servers extension starts it')}.${sockets ? ' Node extension host only: the server is forked and its socket heads reached over TCP.' : ''}`);
+    const activation = sockets
+        ? `   const running = await ${start}(context);
+   client = running;${dataBlock}${glspBlock}`
+        : `   client = await ${start}(context);`;
+    return `${opening}
+
+${imports.join('\n')}
+
+let client: LanguageClient | undefined;
+
+export async function activate(context: ExtensionContext): Promise<void> {
+${activation}
+}
+
+export async function deactivate(): Promise<void> {
+   await client?.stop();
+   client = undefined;
+}
+`;
+}
+/** A smoke test's title: what it checks of each head the composition has. */
+function hostVscodeSmokeTitle(composition) {
+    return listPhrase([
+        ...(composition.heads.includes('data') ? ['reads the model'] : []),
+        ...(composition.grammars.some(grammar => grammar.diagram) ? ['draws the diagram'] : []),
+        'reports a broken reference'
+    ]);
+}
+/**
+ * The smoke test: VS Code opens the starter workspace with the extension
+ * loaded, Show Model names the model with the data head, each diagram file
+ * draws, and the server reports a broken reference.
+ */
+function hostVscodeSmokeSpec(composition) {
+    const diagram = composition.grammars.find(grammar => grammar.diagram);
+    const file = `nodes.${(diagram ?? composition.grammars[0]).extensions[0]}`;
+    const diagramSteps = diagram
+        ? `
+      // The diagram file opens in its diagram, which draws the two starter nodes.
+      const webview = page.frameLocator('iframe.webview.ready').frameLocator('#active-frame');
+      // In the editor's container: sprotty measures shapes in a hidden copy beside it.
+      await expect(webview.locator('.hydranium-diagram-container .sprotty-node')).toHaveCount(2);
+      // Then as text. The row is clicked, since Enter runs the best fuzzy match,
+      // and its name ends in its keybinding, if it has one.
+      await page.keyboard.press('ControlOrMeta+Shift+P');
+      await page.locator('.quick-input-widget input').fill('>View: Reopen Editor with Text Editor');
+      await page
+         .locator('.quick-input-list')
+         .getByRole('option', { name: /^View: Reopen Editor with Text Editor(,|$)/ })
+         .click();
+`
+        : '';
+    const primary = diagram ?? composition.grammars[0];
+    const showModelSteps = composition.heads.includes('data')
+        ? `      // The data head reads the open file.
+      await page.keyboard.press('ControlOrMeta+Shift+P');
+      await page.locator('.quick-input-widget input').fill('>${composition.name}: Show Model');
+      await page
+         .locator('.quick-input-list')
+         .getByRole('option', { name: /^${composition.name}: Show Model(,|$)/ })
+         .click();
+      await expect(page.locator('.notification-toast').filter({ hasText: '${file} holds a ${primary.entryRule}' })).toBeVisible();
+`
+        : '';
+    const opening = wrapComment(`VS Code opens a copy of the starter workspace with this extension loaded, ${listPhrase([
+        ...(composition.heads.includes('data') ? ['the data head reads the file'] : []),
+        ...(diagram ? ['the diagram file draws in its diagram editor'] : []),
+        'the server reports a reference that resolves to nothing'
+    ])}.`);
+    return `${opening}
+
+import { _electron, expect, test, type ElectronApplication, type Page } from '@playwright/test';
+import { downloadAndUnzipVSCode } from '@vscode/test-electron';
+import { cpSync, mkdtempSync, rmSync } from 'node:fs';
+import { tmpdir } from 'node:os';
+import { join } from 'node:path';
+import { fileURLToPath } from 'node:url';
+import { VSCODE_CACHE, VSCODE_VERSION } from './vscode-version.mts';
+
+const extensionRoot = fileURLToPath(new URL('..', import.meta.url));
+
+test('${hostVscodeSmokeTitle(composition)}', async () => {
+   // A copy, since the server writes its repairs to the folder it opens, and a
+   // fresh profile, since a reused one restores the last run's editors.
+   const scratch = mkdtempSync(join(tmpdir(), '${composition.projectId}-vscode-'));
+   const workspace = join(scratch, 'workspace');
+   cpSync(fileURLToPath(new URL('../../workspace', import.meta.url)), workspace, { recursive: true });
+   let app: ElectronApplication | undefined;
+   try {
+      app = await _electron.launch({
+         executablePath: await downloadAndUnzipVSCode({ version: VSCODE_VERSION, cachePath: VSCODE_CACHE }),
+         args: [
+            '--no-sandbox',
+            '--disable-gpu-sandbox',
+            '--disable-updates',
+            '--skip-welcome',
+            '--skip-release-notes',
+            '--disable-workspace-trust',
+            '--disable-extensions',
+            \`--extensionDevelopmentPath=\${extensionRoot}\`,
+            \`--user-data-dir=\${join(scratch, 'user-data')}\`,
+            \`--extensions-dir=\${join(scratch, 'extensions')}\`,
+            workspace
+         ]
+      });
+      const page = await app.firstWindow();
+      await expect(page.locator('.monaco-workbench')).toBeVisible();
+      await quickOpen(page, '${file}');
+${showModelSteps}${diagramSteps}
+      const editor = page.locator('.monaco-editor .view-lines').first();
+      await expect(editor).toContainText('node First');
+      await editor.click();
+      await page.keyboard.press('ControlOrMeta+End');
+      // In one edit: typed key by key, the half-typed reference is reported on the way.
+      await page.keyboard.insertText('\\nnode Broken -> Missing');
+      await expect(page.locator('.monaco-editor .squiggly-error').first()).toBeVisible();
+   } finally {
+      await app?.close();
+      rmSync(scratch, { recursive: true, force: true });
+   }
+});
+
+/** Open \`file\` through Quick Open, so it gets the editor a user would. */
+async function quickOpen(page: Page, file: string): Promise<void> {
+   await page.keyboard.press('ControlOrMeta+P');
+   const input = page.locator('.quick-input-widget input');
+   await input.fill(file);
+   await expect(page.locator('.quick-input-list .monaco-list-row').first()).toContainText(file);
+   await input.press('Enter');
+   await expect(page.locator('.quick-input-widget')).toBeHidden();
+}
+`;
+}
+/**
+ * `text` broken at spaces into lines of at most 80 columns, the width
+ * `check:docs` holds Markdown to. A link or code span stays whole, and runs
+ * long on a line of its own.
+ */
+function wrapProse(text, width = 80) {
+    const lines = [];
+    for (const piece of text.match(/!?\[[^\]]*\]\([^)]*\)\S*|`+[^`]*`+\S*|\S+/g) ?? []) {
+        const last = lines.at(-1);
+        if (last !== undefined && last.length + 1 + piece.length <= width) {
+            lines[lines.length - 1] = `${last} ${piece}`;
+        }
+        else {
+            lines.push(piece);
+        }
+    }
+    return lines;
+}
+/** `text` as a `//` comment of lines at most 80 columns wide. */
+function wrapComment(text) {
+    return wrapProse(text, 77)
+        .map(line => `// ${line}`)
+        .join('\n');
+}
+/** The VS Code extension's README. */
+function hostVscodeReadme(composition) {
+    const diagrams = composition.grammars.filter(grammar => grammar.diagram);
+    const data = composition.heads.includes('data');
+    const intro = [
+        diagrams.length > 0
+            ? `${composition.name} in VS Code: the language client, and a custom editor drawing each diagram file.`
+            : `${composition.name} in VS Code: the language client.`,
+        'The server is started by `../vscode-servers`, whose launch this extension calls, so the two never hand the server different documents.',
+        socketHeads(composition).length > 0
+            ? 'It needs a Node extension host: the server is forked, and its socket heads are reached over TCP.'
+            : 'It needs a Node extension host, since the server is forked.'
+    ];
+    const dataNote = `\`${composition.name}: Show Model\`, in the Command Palette, reads the active file through the data head over a socket from the extension host, and names its root type. A webview reaches the data head too: see the Host in VS Code guide.`;
+    const lines = [
+        `# ${memberPackageName(composition, 'host-vscode')}`,
+        '',
+        ...wrapProse(intro.join(' ')),
+        ...(data ? ['', ...wrapProse(dataNote)] : []),
+        '',
+        '```bash',
+        `npm run build              # copy the server’s grammars, type-check and compile${diagrams.length > 0 ? ', then bundle' : ''}`,
+        `npm run watch              # copy the grammars and recompile${diagrams.length > 0 ? ' and rebundle' : ''} on every change; Developer: Reload Window picks it up`,
+        'npm start                  # VS Code with this extension, on ../workspace; needs `code` on the PATH',
+        'npm run test:e2e:install   # download the VS Code the smoke test drives, once',
+        'npm run test:e2e           # the smoke test; under `xvfb-run -a` on Linux without a display',
+        '```',
+        '',
+        '## Layout',
+        '',
+        `- \`src/extension.ts\` — activation: ${listPhrase([
+            'the server, through `../vscode-servers`',
+            ...(data ? ['the Show Model command'] : []),
+            ...(diagrams.length > 0 ? ['the diagram editors'] : [])
+        ])}`,
+        ...(data ? ['- `src/show-model-command.ts` — Show Model: the active file, read through the data head'] : []),
+        ...diagrams.flatMap(grammar => [
+            `- \`src/${grammar.grammarId}-diagram-editor.ts\` — the \`${grammar.grammar}\` diagram’s custom editor; its view type is the one \`package.json\` declares`,
+            `- \`src/webview/${grammar.grammarId}-diagram.ts\` — the webview it loads, over the client package’s diagram`
+        ]),
+        ...(diagrams.length > 0
+            ? ['- `src/webview/diagram.css` — the webview’s size and colours', '- `esbuild.mjs` — bundles each webview into `out/webview/`']
+            : []),
+        '- `start.mjs` — `npm start`: VS Code with this extension, on `../workspace`',
+        '- `test/smoke.spec.mts` — VS Code opens the workspace, ' +
+            (composition.heads.includes('data') ? 'Show Model names the model, ' : '') +
+            (diagrams.length > 0 ? 'the diagram draws, ' : '') +
+            'and the server reports a broken reference',
+        '- `test/vscode-version.mts` — the VS Code release the smoke test runs',
+        ''
+    ];
+    return project(lines.join('\n'), composition);
+}
+/** The VS Code extension: the language client and a diagram editor per diagram grammar. */
+function hostVscodeFiles(composition) {
+    const fixed = (file) => projectTemplate(`host-vscode/${file}`, composition);
+    const diagrams = composition.grammars.filter(grammar => grammar.diagram);
+    return [
+        { path: 'host-vscode/package.json', content: hostVscodePackageJson(composition) },
+        ignoreFile('host-vscode'),
+        { path: 'host-vscode/README.md', content: hostVscodeReadme(composition) },
+        fixed('tsconfig.json'),
+        fixed('tsconfig.e2e.json'),
+        fixed('playwright.config.mts'),
+        fixed('start.mjs'),
+        { path: 'host-vscode/src/extension.ts', content: hostVscodeExtensionFile(composition) },
+        ...(composition.heads.includes('data') ? [fixed('src/show-model-command.ts')] : []),
+        ...(diagrams.length > 0 ? [fixed('tsconfig.webview.json'), fixed('esbuild.mjs'), fixed('src/webview/diagram.css')] : []),
+        ...diagrams.flatMap(grammar => [
+            grammarTemplate('host-vscode/src/__GRAMMAR_ID__-diagram-editor.ts', composition, grammar),
+            grammarTemplate('host-vscode/src/webview/__GRAMMAR_ID__-diagram.ts', composition, grammar)
+        ]),
+        { path: 'host-vscode/test/smoke.spec.mts', content: hostVscodeSmokeSpec(composition) },
+        fixed('test/vscode-version.mts'),
+        fixed('test/install-vscode.mts')
+    ];
+}
+/**
+ * The Theia release of every Theia member, the one the framework's own
+ * Theia examples take, so a scaffold builds against what the repo tests: the
+ * Theia community release. Exact, as Theia's members pin each other, so a
+ * workspace root declares it too and GLSP's open Theia peer resolves to it.
+ */
+const THEIA_VERSION = '1.74.3';
+/**
+ * What each head adds to the Theia extension; `base` is the connection hardening
+ * and editor sync every one gets. With the third-party entries below, they name
+ * the peers of the framework's Theia packages, so an installer that adds no peers
+ * still finds them.
+ */
+const THEIA_FRAMEWORK_DEPENDENCIES = {
+    base: ['@hydranium/client-theia', '@hydranium/protocol'],
+    lsp: [],
+    data: ['@hydranium/data-client-theia'],
+    glsp: ['@hydranium/glsp-client', '@hydranium/glsp-client-theia']
+};
+const THEIA_THIRD_PARTY_DEPENDENCIES = {
+    base: {
+        '@theia/core': THEIA_VERSION,
+        '@theia/editor': THEIA_VERSION,
+        '@theia/filesystem': THEIA_VERSION,
+        '@theia/output': THEIA_VERSION,
+        inversify: '^6.1.3',
+        'vscode-jsonrpc': '9.0.0'
+    },
+    lsp: {},
+    data: { '@theia/workspace': THEIA_VERSION },
+    glsp: {
+        '@eclipse-glsp/client': '2.7.0',
+        '@eclipse-glsp/theia-integration': '2.7.0',
+        '@theia/process': THEIA_VERSION,
+        '@theia/workspace': THEIA_VERSION
+    }
+};
+/** The Theia extension's third-party pins for `heads`, for its manifest and a workspace root's. */
+function theiaThirdPartyDependencies(heads) {
+    return ['base', ...heads].flatMap(head => Object.entries(THEIA_THIRD_PARTY_DEPENDENCIES[head]));
+}
+/**
+ * The Theia packages the application assembles: the workbench a user expects,
+ * and `plugin-ext` with its VS Code API to sideload the servers extension.
+ */
+const HOST_THEIA_BROWSER_DEPENDENCIES = [
+    '@theia/core',
+    '@theia/editor',
+    '@theia/filesystem',
+    '@theia/markers',
+    '@theia/messages',
+    '@theia/monaco',
+    '@theia/navigator',
+    '@theia/output',
+    '@theia/plugin-ext',
+    '@theia/plugin-ext-vscode',
+    '@theia/preferences',
+    '@theia/process',
+    '@theia/workspace'
+];
+/** The Theia tooling the application builds with. */
+const HOST_THEIA_BROWSER_DEV_DEPENDENCIES = ['@theia/cli'];
+/** Every Theia package the application declares, for a workspace root's pins. */
+function hostTheiaBrowserTheiaDependencies() {
+    return [...HOST_THEIA_BROWSER_DEPENDENCIES, ...HOST_THEIA_BROWSER_DEV_DEPENDENCIES].map(name => [name, THEIA_VERSION]);
+}
+/** The Electron application's Theia packages: the browser application's, and Theia's Electron integration. */
+const HOST_THEIA_ELECTRON_DEPENDENCIES = [...HOST_THEIA_BROWSER_DEPENDENCIES, '@theia/electron'].sort();
+/** The Electron release `@theia/electron` peers on, exactly. */
+const ELECTRON_VERSION = '42.11.16';
+/** Every package the Electron application pins, for a workspace root's pins. */
+function hostTheiaElectronPins() {
+    return [
+        ...[...HOST_THEIA_ELECTRON_DEPENDENCIES, ...HOST_THEIA_BROWSER_DEV_DEPENDENCIES].map((name) => [
+            name,
+            THEIA_VERSION
+        ]),
+        ['electron', ELECTRON_VERSION]
+    ];
+}
+/** The Theia extension's `theiaExtensions` entries: one per head it forwards, and one per diagram. */
+function theiaExtensionEntries(composition) {
+    const id = composition.projectId;
+    return [
+        {
+            frontendPreload: `lib/browser/${id}-connection-preload-module`,
+            frontend: `lib/browser/${id}-frontend-module`,
+            backend: `lib/node/${id}-connection-backend-module`
+        },
+        ...(composition.heads.includes('data') ? [{ backend: `lib/node/${id}-data-backend-module` }] : []),
+        ...(composition.heads.includes('glsp') ? [{ backend: `lib/node/${id}-glsp-backend-module` }] : []),
+        ...composition.grammars
+            .filter(grammar => grammar.diagram)
+            .map(grammar => ({ frontend: `lib/browser/${grammar.grammarId}-diagram-frontend-module` }))
+    ];
+}
+/** The Theia extension's `package.json`. Private unless `--public`, as the client member is. */
+function theiaPackageJson(composition) {
+    const dependencies = {
+        // The socket heads' host commands, and the data head's model type.
+        ...(socketHeads(composition).length > 0 ? { [memberPackageName(composition, 'protocol')]: MEMBER_PIN } : {}),
+        ...(composition.heads.includes('glsp') ? { [memberPackageName(composition, 'client')]: MEMBER_PIN } : {}),
+        ...Object.fromEntries(theiaThirdPartyDependencies(composition.heads))
+    };
+    for (const head of ['base', ...composition.heads]) {
+        for (const framework of THEIA_FRAMEWORK_DEPENDENCIES[head]) {
+            dependencies[framework] = frameworkPin(composition);
+        }
+    }
+    return `{
+  "name": "${memberPackageName(composition, 'theia')}",
+  "version": "0.0.0",
+${composition.packaging.private ? '  "private": true,\n' : ''}  "description": "The ${composition.name} Theia extension: ${theiaParts(composition)}.",
+  "license": "UNLICENSED",
+  "author": "",
+  "files": [
+    "lib",
+    "src",
+    "style"
+  ],
+  "scripts": {
+    "build": "tsc",
+    "clean": "rimraf lib tsconfig.tsbuildinfo",
+${lintScript(forMember(composition, 'theia'), 'src')}    "watch": "tsc --watch"
+  },
+  "dependencies": {
+${sortedBlock(dependencies, '    ')}
+  },
+  "devDependencies": {
+${sortedBlock({ '@types/node': '^22.0.0', rimraf: '^5.0.0', typescript: '^7.0.2' }, '    ')}
+  },
+  "engines": {
+    "node": ">=22.13"
+  },
+  "theiaExtensions": ${jsonAt(theiaExtensionEntries(composition), '  ')}
+}
+`;
+}
+/** What the Theia extension brings, as one phrase. */
+function theiaParts(composition) {
+    return listPhrase([
+        'reconnect hardening',
+        ...(composition.heads.includes('data') ? ['a Show Model command reading a file through the data head'] : []),
+        ...(composition.grammars.some(grammar => grammar.diagram) ? ['a diagram editor for each diagram'] : [])
+    ]);
+}
+/** The extension's one frontend module: the logger, the connection diagnostics and editor sync, and each head's client. */
+function theiaFrontendModuleFile(composition) {
+    const id = composition.projectId;
+    const name = composition.name;
+    const data = composition.heads.includes('data');
+    const glsp = composition.heads.includes('glsp');
+    const imports = [
+        ...(glsp ? ["import { GLSPClientContribution } from '@eclipse-glsp/theia-integration';"] : []),
+        "import { bindChannelLogger, bindConnectionDiagnostics, bindEditorDiskSync } from '@hydranium/client-theia/browser';",
+        ...(data
+            ? [
+                "import { bindDataConnection } from '@hydranium/data-client-theia/browser';",
+                "import { CommandContribution } from '@theia/core';"
+            ]
+            : []),
+        "import { ContainerModule } from '@theia/core/shared/inversify';",
+        ...(data
+            ? [
+                `import { ${name}DataConnection } from './${id}-data-connection.js';`,
+                `import { ${name}DataPort } from './${id}-data-port.js';`
+            ]
+            : []),
+        ...(glsp ? [`import { ${name}GlspClientContribution } from './${id}-glsp-client-contribution.js';`] : []),
+        ...(data ? [`import { ${name}ShowModelCommand } from './${id}-show-model-command.js';`] : [])
+    ];
+    const dataBlock = data
+        ? `
+
+   // The data head: one connection, opened when the command first runs.
+   bind(${name}DataPort).toSelf().inSingletonScope();
+   bindDataConnection(bind, isBound, ${name}DataConnection);
+   bind(${name}ShowModelCommand).toSelf().inSingletonScope();
+   bind(CommandContribution).toService(${name}ShowModelCommand);`
+        : '';
+    const glspBlock = glsp
+        ? `
+
+   // One GLSP client for every diagram, so each diagram module skips binding its own.
+   bind(${name}GlspClientContribution).toSelf().inSingletonScope();
+   bind(GLSPClientContribution).toService(${name}GlspClientContribution);`
+        : '';
+    return `${wrapComment(`The ${name} Theia extension's frontend: ${listPhrase([
+        'the connection’s lifecycle in an Output channel',
+        'a warning when an outage outlasts the offline buffer',
+        'editor disk sync',
+        ...(data ? ['the data head’s connection and the Show Model command'] : []),
+        ...(glsp ? ['the GLSP client the diagrams share'] : [])
+    ])}.`)}
+
+${imports.join('\n')}
+
+export default new ContainerModule((bind, _unbind, isBound, rebind) => {
+   bindChannelLogger(bind, { channelName: '${name} Connection' });
+   bindConnectionDiagnostics(bind);
+   // Keeps an editor from writing over a file a head saved while it held the same text unsaved.
+   bindEditorDiskSync(bind, isBound, rebind);${dataBlock}${glspBlock}
+});
+`;
+}
+/** The Theia extension's README. */
+function theiaReadme(composition) {
+    const id = composition.projectId;
+    const data = composition.heads.includes('data');
+    const glsp = composition.heads.includes('glsp');
+    const diagrams = composition.grammars.filter(grammar => grammar.diagram);
+    const theiaApps = theiaApplicationPaths(composition);
+    const intro = [
+        `The ${composition.name} Theia extension: ${theiaParts(composition)}.`,
+        socketHeads(composition).length > 0
+            ? 'The language client is not here: the application sideloads `../vscode-servers`, which starts the server and answers each socket head’s port under a host command, and the backend modules forward the page’s channels to those ports.'
+            : 'The language client is not here: the application sideloads `../vscode-servers`, which starts the server.',
+        theiaApps.length === 1 ? `The application in ${theiaApps[0]} runs it.` : `The applications in ${listPhrase(theiaApps)} run it.`
+    ];
+    const before = [...(socketHeads(composition).length > 0 ? ['protocol'] : []), ...(glsp ? ['client'] : [])];
+    const lines = [
+        `# ${memberPackageName(composition, 'theia')}`,
+        '',
+        ...wrapProse(intro.join(' ')),
+        '',
+        '```bash',
+        'npm run build   # compile into lib/' +
+            (before.length > 0 ? `; build the ${before.join(' and ')} package${before.length > 1 ? 's' : ''} first` : ''),
+        '```',
+        '',
+        '## Layout',
+        '',
+        `- \`src/browser/${id}-connection-preload-module.ts\` and \`src/node/${id}-connection-backend-module.ts\` — reconnect hardening, sized by the application’s \`connectionBufferBytes\``,
+        `- \`src/browser/${id}-frontend-module.ts\` — the frontend bindings`,
+        ...(data
+            ? [
+                `- \`src/browser/${id}-data-port.ts\` and \`${id}-data-connection.ts\` — the data head’s connection`,
+                `- \`src/browser/${id}-show-model-command.ts\` — \`${composition.name}: Show Model\`, reading the current file through the data head`,
+                `- \`src/node/${id}-data-backend-module.ts\` — forwards the data channel to the data head’s port`
+            ]
+            : []),
+        ...(glsp
+            ? [
+                `- \`src/common/${id}-glsp-contribution.ts\` — the id the GLSP client and its forwarder share`,
+                `- \`src/browser/${id}-glsp-client-contribution.ts\` — the GLSP client every diagram shares`,
+                `- \`src/node/${id}-glsp-backend-module.ts\` — forwards the GLSP channel to the GLSP head’s port`
+            ]
+            : []),
+        ...diagrams.map(grammar => `- \`src/browser/${grammar.grammarId}-diagram-frontend-module.ts\` — the \`${grammar.grammar}\` diagram editor, over the client package’s diagram`),
+        ...(diagrams.length > 0 ? ['- `style/diagram.css` — the diagrams’ colours, from the Theia theme'] : []),
+        ''
+    ];
+    return project(lines.join('\n'), composition);
+}
+/** The Theia extension: what a Theia application runs of the language, beside the sideloaded servers extension. */
+function theiaFiles(composition) {
+    const fixed = (file) => ({
+        path: project(`theia/${file}`, composition),
+        content: project(template(`theia/${file}`), composition)
+    });
+    const id = composition.projectId;
+    const data = composition.heads.includes('data');
+    const glsp = composition.heads.includes('glsp');
+    const diagrams = composition.grammars.filter(grammar => grammar.diagram);
+    return [
+        { path: 'theia/package.json', content: theiaPackageJson(composition) },
+        ignoreFile('theia'),
+        { path: 'theia/README.md', content: theiaReadme(composition) },
+        fixed('tsconfig.json'),
+        fixed('src/browser/__PROJECT_ID__-connection-preload-module.ts'),
+        { path: `theia/src/browser/${id}-frontend-module.ts`, content: theiaFrontendModuleFile(composition) },
+        fixed('src/node/__PROJECT_ID__-connection-backend-module.ts'),
+        ...(data
+            ? [
+                fixed('src/browser/__PROJECT_ID__-data-port.ts'),
+                fixed('src/browser/__PROJECT_ID__-data-connection.ts'),
+                fixed('src/browser/__PROJECT_ID__-show-model-command.ts'),
+                fixed('src/node/__PROJECT_ID__-data-backend-module.ts')
+            ]
+            : []),
+        ...(glsp
+            ? [
+                fixed('src/common/__PROJECT_ID__-glsp-contribution.ts'),
+                fixed('src/browser/__PROJECT_ID__-glsp-client-contribution.ts'),
+                fixed('src/node/__PROJECT_ID__-glsp-backend-module.ts')
+            ]
+            : []),
+        ...diagrams.map(grammar => grammarTemplate('theia/src/browser/__GRAMMAR_ID__-diagram-frontend-module.ts', composition, grammar)),
+        ...(diagrams.length > 0 ? [fixed('style/diagram.css')] : [])
+    ];
+}
+/**
+ * The Theia application's `package.json`. Always private, as every host is.
+ *
+ * Theia's default `frontendConnectionTimeout` of 0 ends the session on any
+ * dropped socket, and the page reloads; a minute lets the reconnect hardening
+ * resume it.
+ */
+function hostTheiaBrowserPackageJson(composition) {
+    const dependencies = {
+        [memberPackageName(composition, 'theia')]: MEMBER_PIN,
+        ...Object.fromEntries(HOST_THEIA_BROWSER_DEPENDENCIES.map(name => [name, THEIA_VERSION]))
+    };
+    const devDependencies = {
+        // Built before this application, whose start links it into plugins/.
+        [memberPackageName(composition, 'vscode-servers')]: MEMBER_PIN,
+        '@playwright/test': '^1.55.0',
+        ...Object.fromEntries(HOST_THEIA_BROWSER_DEV_DEPENDENCIES.map(name => [name, THEIA_VERSION])),
+        '@types/node': '^22.0.0',
+        rimraf: '^5.0.0',
+        typescript: '^7.0.2'
+    };
+    const theia = {
+        target: 'browser',
+        frontend: {
+            config: {
+                applicationName: composition.name,
+                connectionBufferBytes: 102400,
+                preferences: { 'security.workspace.trust.enabled': false }
+            }
+        },
+        backend: { config: { connectionBufferBytes: 102400, frontendConnectionTimeout: 60000 } }
+    };
+    return `{
+  "name": "${memberPackageName(composition, 'host-theia-browser')}",
+  "version": "0.0.0",
+  "private": true,
+  "description": "${composition.name} in a Theia browser application: the Theia extension, and the servers extension sideloaded for the language client.",
+  "license": "UNLICENSED",
+  "author": "",
+  "scripts": {
+    "build": "theia build --mode development && npm run typecheck",
+    "clean": "rimraf lib src-gen plugins gen-esbuild.browser.mjs gen-esbuild.node.mjs smoke-workspace test-results playwright-report",
+${lintScript(forMember(composition, 'host-theia-browser'), 'test')}    "start": "node start.mjs",
+    "test:e2e": "playwright test --tsconfig tsconfig.e2e.json",
+    "test:e2e:install": "playwright install chromium",
+    "typecheck": "tsc --noEmit -p tsconfig.e2e.json",
+    "watch": "theia build --watch --mode development"
+  },
+  "dependencies": {
+${sortedBlock(dependencies, '    ')}
+  },
+  "devDependencies": {
+${sortedBlock(devDependencies, '    ')}
+  },
+  "engines": {
+    "node": ">=22.13"
+  },
+  "theia": ${jsonAt(theia, '  ')}
+}
+`;
+}
+/**
+ * The Theia smoke test: the application opens a copy of the starter
+ * workspace, and each head answers. The steps are the same in both
+ * applications; the browser one's page is Chromium on the server the
+ * configuration starts, the Electron one's the window the test launches.
+ */
+function theiaSmokeSpec(composition, target) {
+    const data = composition.heads.includes('data');
+    const diagram = composition.grammars.find(grammar => grammar.diagram);
+    const primary = diagram ?? composition.grammars[0];
+    const file = `nodes.${primary.extensions[0]}`;
+    const showModelSteps = data
+        ? `
+   // The data head reads the open file, with focus in the Explorer beside it.
+   await page.locator('.theia-FileTree .theia-TreeNode', { hasText: '${file}' }).click();
+   await expect(page.locator('.theia-FileTree:focus-within')).toHaveCount(1);
+   await runCommand(page, '${composition.name}: Show Model');
+   // \`first()\`: Theia lists a notification in its toast and in the notification centre.
+   await expect(
+      page.locator('.theia-notification-message').filter({ hasText: '${file} holds a ${primary.entryRule}' }).first()
+   ).toBeVisible();
+`
+        : '';
+    const diagramSteps = diagram
+        ? `
+   // The diagram file opens in its diagram, which draws the two starter nodes.
+   // In the editor's copy: sprotty measures shapes in a hidden one on the page.
+   await expect(page.locator('.sprotty:not(.sprotty-hidden) .sprotty-node')).toHaveCount(2);
+`
+        : '';
+    const textSteps = diagram
+        ? `   // Then as text, through the Explorer's Open With.
+   await page.locator('.theia-FileTree .theia-TreeNode', { hasText: '${file}' }).click({ button: 'right' });
+   await page.locator('.lm-Menu-item', { hasText: 'Open With...' }).click();
+   await page.locator('.quick-input-list .monaco-list-row', { hasText: 'Text Editor' }).click();
+`
+        : '';
+    return `${wrapComment(`Theia opens a copy of the starter workspace with this application's extensions, ${listPhrase([
+        ...(diagram ? ['the diagram file draws in its diagram editor'] : []),
+        ...(data ? ['the data head reads the file'] : []),
+        'the server reports a reference that resolves to nothing'
+    ])}.`)}
+
+${target === 'browser' ? "import { expect, test, type Page } from '@playwright/test';\n" : theiaElectronSmokeFixture(composition)}
+test('${listPhrase([...(diagram ? ['draws the diagram'] : []), ...(data ? ['reads the model'] : []), 'reports a broken reference'])}', async ({ page }) => {
+${target === 'browser' ? "   await page.goto('/');\n" : ''}   // Up once the loading screen is gone; a key pressed before then is lost.
+   await expect(page.locator('.theia-preload')).toHaveCount(0);
+   await page.keyboard.press('ControlOrMeta+Shift+E');
+   await expect(page.locator('.theia-FileTree .theia-TreeNode', { hasText: '${file}' })).toBeVisible();
+   await quickOpen(page, '${file}');
+${diagramSteps}${showModelSteps}
+${textSteps}   const editor = page.locator('.monaco-editor .view-lines').first();
+   await expect(editor).toContainText('node First');
+   await editor.click();
+   await page.keyboard.press('ControlOrMeta+End');
+   // In one edit: typed key by key, the half-typed reference is reported on the way.
+   await page.keyboard.insertText('\\nnode Broken -> Missing');
+   await expect(page.locator('.monaco-editor .squiggly-error').first()).toBeVisible();
+});
+
+/** Open \`file\` through Quick Open, so it gets the editor a user would. */
+async function quickOpen(page: Page, file: string): Promise<void> {
+   await page.keyboard.press('ControlOrMeta+P');
+   const input = page.locator('.quick-input-widget input');
+   await input.fill(file);
+   await expect(page.locator('.quick-input-list .monaco-list-row').first()).toContainText(file);
+   await input.press('Enter');
+   await expect(page.locator('.quick-input-widget')).toBeHidden();
+}
+${data
+        ? `
+/** Run the command whose palette entry reads \`label\`, checked before Enter, since the match is fuzzy. */
+async function runCommand(page: Page, label: string): Promise<void> {
+   await page.keyboard.press('F1');
+   const input = page.locator('.quick-input-widget input');
+   await input.fill(\`>\${label}\`);
+   await expect(page.locator('.quick-input-list .monaco-list-row.focused')).toContainText(label);
+   await input.press('Enter');
+   await expect(page.locator('.quick-input-widget')).toBeHidden();
+}
+`
+        : ''}`;
+}
+/** The Theia application's README. */
+function hostTheiaBrowserReadme(composition) {
+    const intro = [
+        `${composition.name} in a Theia browser application: the Theia extension in \`../theia\`, and \`../vscode-servers\` sideloaded through \`@theia/plugin-ext\`, which starts the server and its language client.`,
+        'The backend runs the server, so this is a Node application; Theia serves the page.',
+        ...(composition.grammars.some(grammar => grammar.diagram)
+            ? ['The servers extension contributes no editor, so a diagram file opens in the Theia diagram editor alone.']
+            : [])
+    ];
+    const lines = [
+        `# ${memberPackageName(composition, 'host-theia-browser')}`,
+        '',
+        ...wrapProse(intro.join(' ')),
+        '',
+        '```bash',
+        'npm run build              # bundle and type-check; build the members first',
+        'npm run watch              # rebundle whenever the members’ builds change; reload the page to pick it up',
+        'npm start                  # Theia at http://localhost:3000 on ../workspace; THEIA_PORT picks another port',
+        'npm run test:e2e:install   # download the Chromium the smoke test drives, once',
+        'npm run test:e2e           # the smoke test, which starts the application itself',
+        '```',
+        '',
+        ...wrapProse('The `theia` block of `package.json` sets `frontendConnectionTimeout`, without which Theia ends the session on any dropped socket and the page reloads, and `connectionBufferBytes`, the messages kept while the socket is down; the Theia extension’s connection modules read both.'),
+        '',
+        '## Layout',
+        '',
+        '- `esbuild.mjs` — the bundling `theia build` runs. It keeps this file, so it is the place to adjust the bundle',
+        '- `start.mjs` — `npm start`: links `../vscode-servers` into `plugins/`, then starts the backend on `THEIA_PORT`, on a folder given as its argument or `../workspace`',
+        '- `playwright.config.mts` — the smoke tier, on port 4938 or `THEIA_PORT`, on a copy of `../workspace` in `smoke-workspace/`',
+        '- `test/smoke.spec.mts` — Theia opens the workspace and each head answers',
+        ''
+    ];
+    return project(lines.join('\n'), composition);
+}
+/** The Theia browser application: the Theia extension and the sideloaded servers extension. */
+function hostTheiaBrowserFiles(composition) {
+    const fixed = (file) => projectTemplate(`host-theia-browser/${file}`, composition);
+    return [
+        { path: 'host-theia-browser/package.json', content: hostTheiaBrowserPackageJson(composition) },
+        ignoreFile('host-theia-browser'),
+        { path: 'host-theia-browser/README.md', content: hostTheiaBrowserReadme(composition) },
+        fixed('esbuild.mjs'),
+        fixed('start.mjs'),
+        fixed('playwright.config.mts'),
+        fixed('tsconfig.e2e.json'),
+        { path: 'host-theia-browser/test/smoke.spec.mts', content: theiaSmokeSpec(composition, 'browser') }
+    ];
+}
+/**
+ * The Electron smoke test's imports and its `page`: the application's window,
+ * launched by the test on a scratch copy of the workspace.
+ */
+function theiaElectronSmokeFixture(composition) {
+    return `import { expect, test as base, type ElectronApplication, type Page } from '@playwright/test';
+import { once } from 'node:events';
+import { cpSync, mkdirSync, mkdtempSync, rmSync, symlinkSync } from 'node:fs';
+import { tmpdir } from 'node:os';
+import { join } from 'node:path';
+import { fileURLToPath, pathToFileURL } from 'node:url';
+
+/**
+ * The application in Electron, on a copy of the starter workspace, since the
+ * server writes its repairs to the folder it opens, with a profile of its own:
+ * Theia quits at once while another window holds one. Its settings are its own
+ * too, so a run never writes \`~/.theia/settings.json\`.
+ */
+const test = base.extend<{ page: Page }>({
+   page: async ({ playwright }, use) => {
+      const scratch = mkdtempSync(join(tmpdir(), '${composition.projectId}-theia-electron-'));
+      const workspace = join(scratch, 'workspace');
+      // The servers extension, sideloaded from a plugins folder as \`npm start\` does.
+      const plugins = join(scratch, 'plugins');
+      const link = join(plugins, '${composition.projectId}-vscode-servers');
+      let app: ElectronApplication | undefined;
+      try {
+         cpSync(fileURLToPath(new URL('../../workspace', import.meta.url)), workspace, { recursive: true });
+         mkdirSync(plugins);
+         symlinkSync(fileURLToPath(new URL('../../vscode-servers', import.meta.url)), link, 'junction');
+         // Playwright resolves Electron itself; given its path, Theia opens this
+         // folder instead of the workspace.
+         app = await playwright._electron.launch({
+            args: [
+               fileURLToPath(new URL('..', import.meta.url)),
+               '--no-sandbox',
+               \`--user-data-dir=\${join(scratch, 'user-data')}\`,
+               // In URI form, since Theia reads the argument as a URI.
+               \`--plugins=local-dir:\${pathToFileURL(plugins).pathname}\`,
+               workspace
+            ],
+            env: {
+               ...process.env,
+               THEIA_CONFIG_DIR: join(scratch, 'config'),
+               // Menus drawn in the page, where the test can click them.
+               THEIA_ELECTRON_DISABLE_NATIVE_ELEMENTS: '1'
+            }
+         });
+         await use(await app.firstWindow());
+      } finally {
+         try {
+            // Exited, not closed: closing asks whether to save the edited file. An
+            // app that is already gone is left alone, so the test's own error stands.
+            const child = app?.process();
+            if (app && child?.exitCode === null && child.signalCode === null) {
+               const exited = once(child, 'exit');
+               await app.evaluate(({ app: electron }) => electron.exit(0));
+               await exited;
+            }
+         } finally {
+            // Unlinked first, so the remove never reaches \`../vscode-servers\` through it.
+            rmSync(link, { force: true });
+            rmSync(scratch, { recursive: true, force: true });
+         }
+      }
+   }
+});
+`;
+}
+/**
+ * The Theia Electron application's `package.json`: the browser application's
+ * `theia` block with the Electron target. Always private, as every host is.
+ */
+function hostTheiaElectronPackageJson(composition) {
+    const dependencies = {
+        [memberPackageName(composition, 'theia')]: MEMBER_PIN,
+        ...Object.fromEntries(HOST_THEIA_ELECTRON_DEPENDENCIES.map(name => [name, THEIA_VERSION]))
+    };
+    const devDependencies = {
+        // Built before this application, whose start links it into plugins/.
+        [memberPackageName(composition, 'vscode-servers')]: MEMBER_PIN,
+        '@playwright/test': '^1.55.0',
+        ...Object.fromEntries(HOST_THEIA_BROWSER_DEV_DEPENDENCIES.map(name => [name, THEIA_VERSION])),
+        '@types/node': '^22.0.0',
+        electron: ELECTRON_VERSION,
+        rimraf: '^5.0.0',
+        typescript: '^7.0.2'
+    };
+    const theia = {
+        target: 'electron',
+        frontend: {
+            config: {
+                applicationName: composition.name,
+                connectionBufferBytes: 102400,
+                preferences: { 'security.workspace.trust.enabled': false }
+            }
+        },
+        backend: { config: { connectionBufferBytes: 102400, frontendConnectionTimeout: 60000 } }
+    };
+    return `{
+  "name": "${memberPackageName(composition, 'host-theia-electron')}",
+  "version": "0.0.0",
+  "private": true,
+  "description": "${composition.name} in a Theia Electron application: the Theia extension, and the servers extension sideloaded for the language client.",
+  "license": "UNLICENSED",
+  "author": "",
+  "main": "lib/backend/electron-main.js",
+  "scripts": {
+    "build": "theia build --mode development && npm run typecheck",
+    "clean": "rimraf lib src-gen plugins gen-esbuild.browser.mjs gen-esbuild.electron.mjs gen-esbuild.node.mjs test-results playwright-report",
+${lintScript(forMember(composition, 'host-theia-electron'), 'test')}    "start": "node start.mjs",
+    "test:e2e": "playwright test --tsconfig tsconfig.e2e.json",
+    "typecheck": "tsc --noEmit -p tsconfig.e2e.json",
+    "watch": "theia build --watch --mode development"
+  },
+  "dependencies": {
+${sortedBlock(dependencies, '    ')}
+  },
+  "devDependencies": {
+${sortedBlock(devDependencies, '    ')}
+  },
+  "engines": {
+    "node": ">=22.13"
+  },
+  "theia": ${jsonAt(theia, '  ')}
+}
+`;
+}
+/** The Theia Electron application's README. */
+function hostTheiaElectronReadme(composition) {
+    const intro = [
+        `${composition.name} in a Theia Electron application: the Theia extension in \`../theia\`, and \`../vscode-servers\` sideloaded through \`@theia/plugin-ext\`, which starts the server and its language client.`,
+        'Electron runs the window, and a backend process it starts runs the server.',
+        ...(composition.grammars.some(grammar => grammar.diagram)
+            ? ['The servers extension contributes no editor, so a diagram file opens in the Theia diagram editor alone.']
+            : [])
+    ];
+    const lines = [
+        `# ${memberPackageName(composition, 'host-theia-electron')}`,
+        '',
+        ...wrapProse(intro.join(' ')),
+        '',
+        '```bash',
+        'npm run build      # bundle and type-check, and download Electron; build the members first',
+        'npm run watch      # rebundle whenever the members’ builds change; reload the window to pick it up',
+        'npm start          # the application on ../workspace',
+        'npm run test:e2e   # the smoke test, which launches the application itself',
+        '```',
+        '',
+        ...wrapProse('There is no `theia rebuild:electron` step: Theia’s native modules are N-API builds, which load in Electron as `npm install` built them for Node.'),
+        '',
+        ...wrapProse('`npm run watch` reports a `theia-source-map-paths` JSON error as it starts: `esbuild.mjs` starts the browser and electron builds together, and they share `lib/frontend`. Later rebuilds are clean.'),
+        '',
+        '## Layout',
+        '',
+        '- `esbuild.mjs` — the bundling `theia build` runs. It keeps this file, so it is the place to adjust the bundle',
+        '- `start.mjs` — `npm start`: links `../vscode-servers` into `plugins/`, then starts the application on a folder given as its argument or `../workspace`',
+        '- `playwright.config.mts` — the smoke tier',
+        '- `test/smoke.spec.mts` — Electron opens a copy of the workspace with a profile of its own, and each head answers',
+        ''
+    ];
+    return project(lines.join('\n'), composition);
+}
+/** The Theia Electron application: the browser application's extensions in a desktop window. */
+function hostTheiaElectronFiles(composition) {
+    const fixed = (file) => projectTemplate(`host-theia-electron/${file}`, composition);
+    return [
+        { path: 'host-theia-electron/package.json', content: hostTheiaElectronPackageJson(composition) },
+        ignoreFile('host-theia-electron'),
+        { path: 'host-theia-electron/README.md', content: hostTheiaElectronReadme(composition) },
+        fixed('esbuild.mjs'),
+        fixed('start.mjs'),
+        fixed('playwright.config.mts'),
+        fixed('tsconfig.e2e.json'),
+        { path: 'host-theia-electron/test/smoke.spec.mts', content: theiaSmokeSpec(composition, 'electron') }
+    ];
+}
+/**
+ * The formatter and linter a standalone root runs. Exact, because a formatter
+ * release that changes its output would fail the project's `format:check`.
+ */
+const ROOT_STYLE_DEV_DEPENDENCIES = { oxfmt: '0.71.0', oxlint: '1.82.0' };
+/**
+ * The standalone root's formatter config: the style every template is written
+ * in, at the width the emitted sources wrap at. Generated code is ignored
+ * because each run of its generator rewrites it in that generator's style.
+ */
+function oxfmtConfig(composition) {
+    return `{
+  "$schema": "./node_modules/oxfmt/configuration_schema.json",
+  "arrowParens": "avoid",
+  "endOfLine": "lf",
+  "ignorePatterns": ["**/generated", "**/generated-hydranium", "**/syntaxes", "**/*.md"],
+  "jsxSingleQuote": true,
+  "printWidth": ${columnsFor(composition)},
+  "singleQuote": true,
+  "sortPackageJson": true,
+  "tabWidth": 3,
+  "trailingComma": "none",
+  "overrides": [
+    {
+      "files": ["*.json", "*.yml", "*.yaml"],
+      "options": {
+        "printWidth": 100,
+        "tabWidth": 2
+      }
+    }
+  ]
+}
+`;
+}
+/**
+ * A standalone project's root: the members as npm workspaces.
+ *
+ * Always private: it is never published, whatever `--public` makes of the
+ * members. npm runs a script across the members in the order listed here, not
+ * by their dependencies; listing protocol first is safe because its `build`
+ * runs the server's `generate` before compiling.
+ *
+ * It declares the exact pins `--monorepo` prints for a workspace root, for the
+ * same reason: a package ranging over one, such as a framework package's peer,
+ * otherwise takes the top of the tree with the newest match, and each member's
+ * exact copy nests beneath it.
+ *
+ * `watch` keeps every non-host member built; `watch:<host>` adds one host, so
+ * only the bundler of the host being worked on runs.
+ *
+ * `format` and `lint` run at the root over every member, which is why the
+ * members get no `lint` of their own here.
+ */
+function rootFiles(composition) {
+    const devDependencies = {
+        ...Object.fromEntries(workspaceRootPins(composition)),
+        concurrently: '^9.0.0',
+        ...ROOT_STYLE_DEV_DEPENDENCIES
+    };
+    const members = initMembers(composition.heads, composition.hosts);
+    // Only the server's watch is `tsc -b`, so protocol is built by one process
+    // rather than two writing the same `lib/`; a host's watch joins only in its
+    // own `watch:<host>`.
+    const watched = members.filter(member => member !== 'protocol' && !member.startsWith('host-'));
+    const parallel = (commands) => `concurrently --kill-others --names ${Object.keys(commands).join(',')} ${Object.values(commands)
+        .map(command => `\\"${command}\\"`)
+        .join(' ')}`;
+    const scripts = {
+        build: 'npm run build --workspaces',
+        clean: 'npm run clean --workspaces --if-present',
+        format: 'oxfmt',
+        'format:check': 'oxfmt --check',
+        lint: 'oxlint --report-unused-disable-directives --max-warnings 0',
+        ...Object.fromEntries(composition.hosts.map(host => [`start:${host}`, `npm --prefix host-${host} start`])),
+        test: 'npm test --workspaces --if-present',
+        watch: parallel(Object.fromEntries(watched.map(member => [member, `npm --prefix ${member} run watch`]))),
+        // The browser host's `start` is its watch: it rebundles the page as it serves it.
+        ...Object.fromEntries(composition.hosts.map(host => [
+            `watch:${host}`,
+            parallel({
+                watch: 'npm run watch',
+                [`host-${host}`]: `npm --prefix host-${host} ${host === 'browser' ? 'start' : 'run watch'}`
+            })
+        ]))
+    };
+    const content = `{
+  "name": "${composition.projectId}-root",
+  "version": "0.0.0",
+  "private": true,
+  "workspaces": [
+${members.map(member => `    "${member}"`).join(',\n')}
+  ],
+  "scripts": {
+${Object.entries(scripts)
+        .map(([name, command]) => `    "${name}": "${command}"`)
+        .join(',\n')}
+  },
+  "devDependencies": {
+${sortedBlock(devDependencies, '    ')}
+  },
+  "engines": {
+    "node": ">=22.13"
+  }
+}
+`;
+    return [
+        { path: 'package.json', content },
+        ignoreFile(''),
+        { path: '.editorconfig', content: template('editorconfig') },
+        { path: '.oxfmtrc.json', content: oxfmtConfig(composition) },
+        { path: '.oxlintrc.json', content: template('oxlintrc.json') },
+        { path: '.nvmrc', content: `${SCAFFOLD_NODE_MAJOR}\n` }
+    ];
+}
+/**
+ * Every file the scaffold emits, fully rendered, at its path in the project
+ * directory. A workspace member's project gets no root of its own: it joins the
+ * surrounding workspace, whose manifest `init` prints the changes for.
+ */
+export function buildInitTemplates(composition) {
+    return [
+        ...(composition.packaging.workspace === undefined ? rootFiles(composition) : []),
+        ...protocolFiles(composition),
+        ...serverFiles(composition),
+        ...(composition.heads.includes('glsp') ? clientFiles(composition) : []),
+        ...(emitsVscodeServers(composition) ? vscodeServersFiles(composition) : []),
+        ...(composition.hosts.some(isTheiaHost) ? theiaFiles(composition) : []),
+        ...(composition.hosts.includes('browser') ? hostBrowserFiles(composition) : []),
+        ...(composition.hosts.includes('vscode') ? hostVscodeFiles(composition) : []),
+        ...(composition.hosts.includes('theia-browser') ? hostTheiaBrowserFiles(composition) : []),
+        ...(composition.hosts.includes('theia-electron') ? hostTheiaElectronFiles(composition) : []),
+        ...workspaceFiles(composition)
     ];
 }
 //# sourceMappingURL=init-templates.js.map