acrylblends 1.4.0 → 1.5.1

package/legacy/blank/a53d41e6ef42/src/routes.ts

@@ -0,0 +1,79 @@
+import type { Context } from '@deepseek-ai/cordis'
+import { Acryl } from '../plugins/acryl-router/src/index.ts'
+import { type Home, renderWidgets } from '../plugins/home/index.ts'
+import { aboutPage } from './about.tsx'
+import { FIRST_PAGE_MARKER } from './first-page.ts'
+
+export const APP_NAME = '__APP_NAME__'
+
+/**
+ * The only place the app's mount prefix is named. On its own server (production, `npm start`) the app mounts at the root and
+ * its public URLs are `/`, `/about`, `/health`; when the ACRYL frame hosts it (`npm run dev`) the routes mount here, and the
+ * frame opens its tile at `/app` (`/app/` answers too). Every page link and asset URL this template writes is derived from the prefix it is
+ * mounted at, so the same source serves both.
+ */
+export const FRAME_MOUNT_PREFIX = '/app'
+
+/** The scaffold's name comes from the folder, so the first screen escapes it like any other user text. */
+const escapeHtml = (text: string): string =>
+  text
+    .replaceAll('&', '&')
+    .replaceAll('<', '&lt;')
+    .replaceAll('>', '&gt;')
+    .replaceAll('"', '&quot;')
+
+/**
+ * The first screen: the page a browser gets at the root, which is what the ACRYL frame's first tile shows. A blank app whose root answered JSON to
+ * every client gave the tile Chrome's JSON viewer, nearly invisible in the frame's dark surface (owner review, 2026-11-02); the root now answers a page
+ * to a browser and the JSON hello to everything else, the way the agent template does. The About link is relative, so it works under the frame's /app
+ * mount and on the app's own server alike.
+ */
+const homePage = (name: string, widgets: string): string => `<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>${escapeHtml(name)}</title>
+    <style>:root{color-scheme:light dark;background:Canvas;color:CanvasText}body{margin:2rem auto;max-width:44rem;padding:0 1rem;font:15px/1.55 system-ui,-apple-system,"Segoe UI",sans-serif}h1{font-size:1.6rem;margin:0 0 .5rem}a{color:#5468ff}code{font:.9em ui-monospace,"SF Mono",Menlo,monospace}</style>
+  </head>
+  <body>
+    <main>
+      <h1>${escapeHtml(name)}</h1>
+      <p>Your app is running. ${FIRST_PAGE_MARKER}; edit <code>src/routes.ts</code> to change it.</p>
+      <p><a href="./about">About</a></p>
+      ${widgets}
+    </main>
+  </body>
+</html>`
+
+/**
+ * The app's own pages and routes, mountable at any prefix: the standalone server mounts it at the root, the frame host at {@link FRAME_MOUNT_PREFIX}.
+ * The first screen shows the widgets of the app's plugins (`ctx.home`), read at each request, so a plugin switched on or off shows at the next load.
+ */
+export function makeApp(home: Home, name: () => string = () => APP_NAME): Acryl {
+  return (
+    new Acryl()
+      // A browser gets the first screen; an API client gets the JSON hello.
+      .get('/', async (c) =>
+        (c.req.header('accept') ?? '').includes('text/html')
+          ? c.html(homePage(name(), await renderWidgets(home)))
+          : c.json({ app: name(), ok: true }),
+      )
+      .get('/health', (c) => c.json({ ok: true }))
+      .get('/about', (c) => c.html(aboutPage()))
+  )
+}
+
+/** The app's own routes: an `App` mounted on the router at `options.prefix` (empty or absent: the root). The mount is removed when this plugin is disposed. */
+export const routes = {
+  name: 'routes',
+  inject: ['router', 'home'],
+  apply(ctx: Context, options: { readonly prefix?: string } = {}) {
+    const prefix = options.prefix ?? ''
+    // The name the app has now (Settings > App renames it), else the one the scaffold was made with.
+    ctx.router.route(
+      prefix === '' ? '/' : prefix,
+      makeApp(ctx.home, () => ctx.get('appInstance')?.name ?? APP_NAME),
+    )
+  },
+}

package/legacy/layouts.json

@@ -430,6 +430,28 @@
         "notes": "fb43a1c5f3b4",
         "todo": "164274ffcf7f"
       }
+    },
+    {
+      "version": "1.4.0",
+      "layouts": {
+        "agent": "46c6eadf9230",
+        "blank": "a7e8f539ffee",
+        "chat": "d4464dfb3b04",
+        "nodejs": "a6a340b4d3a6",
+        "notes": "fb43a1c5f3b4",
+        "todo": "164274ffcf7f"
+      }
+    },
+    {
+      "version": "1.5.0",
+      "layouts": {
+        "agent": "46c6eadf9230",
+        "blank": "a53d41e6ef42",
+        "chat": "d4464dfb3b04",
+        "nodejs": "a6a340b4d3a6",
+        "notes": "fb43a1c5f3b4",
+        "todo": "164274ffcf7f"
+      }
     }
   ],
   "templates": {
@@ -485,6 +507,10 @@
       "ecbc84f1c1e5": [
         "src/app.ts",
         "src/routes.ts"
+      ],
+      "46c6eadf9230": [
+        "src/app.ts",
+        "src/routes.ts"
       ]
     },
     "blank": {
@@ -519,6 +545,10 @@
       "a7e8f539ffee": [
         "src/app.ts",
         "src/routes.ts"
+      ],
+      "a53d41e6ef42": [
+        "src/app.ts",
+        "src/routes.ts"
       ]
     },
     "chat": {

package/lib/{client-modules-Bkdr83jO.js → client-modules-C5qiVroz.js}

@@ -2,7 +2,7 @@ import { t as Acryl } from "./app-CQcGWjrk.js";
 import "./core-BOu1jYua.js";
 import { t as basePath } from "./route-D8m-a2I1.js";
 import "./helpers-BEjcdbgw.js";
-import { n as compileModule, t as MissingTypeScriptError } from "./transpile-QUK9b3eG.js";
+import { n as compileModule, t as MissingTypeScriptError } from "./transpile-CRRaixyS.js";
 import { dirname, extname, isAbsolute, join, relative, resolve, sep } from "node:path";
 import { copyFileSync, mkdirSync, readFileSync, readdirSync, realpathSync, statSync, writeFileSync } from "node:fs";
 import { fileURLToPath } from "node:url";

package/lib/cordis/door.js

@@ -2,7 +2,7 @@ import { t as Acryl } from "../app-CQcGWjrk.js";
 import { r as streamSSE } from "../streaming-BlDaph8U.js";
 import { r as loopbackAuthority } from "../loopback-only-BbasoF7R.js";
 import "../helpers-BEjcdbgw.js";
-import { n as clientModules } from "../client-modules-Bkdr83jO.js";
+import { n as clientModules } from "../client-modules-C5qiVroz.js";
 import { a as MAX_WAIT_MS, d as parseChannelToHost, l as UiControlError, p as parseUiRequest, r as MAX_SNAPSHOT_NODES, u as WINDOW_ID } from "../protocol-CQ_if7Dg.js";
 import { a as INVALID_JSON, c as operatorOnly, d as AuditLog, f as auditPath, i as DOOR_PREFIX, l as privateApi, o as error, p as UiChannel, r as pageChannelRoutes, s as jsonBody, t as renderSnapshot, u as readJson } from "../snapshot-text-CXTnjxGx.js";
 import "../src-iBJ2ysV9.js";

package/lib/node-server/register.js

@@ -1,4 +1,4 @@
-import { n as compileModule } from "../transpile-QUK9b3eG.js";
+import { n as compileModule, r as usePackagesOfProgram } from "../transpile-CRRaixyS.js";
 import { registerHooks } from "node:module";
 import { existsSync, readFileSync } from "node:fs";
 import { fileURLToPath, pathToFileURL } from "node:url";
@@ -35,6 +35,11 @@ registerHooks({ load(url, context, nextLoad) {
 */
 const plugins = new URL("../../", import.meta.url);
 const appRoot = new URL("../", plugins).href;
+const family = new URL("instance/bundle.ts", plugins);
+if (existsSync(fileURLToPath(family))) {
+	const { appTree } = await import(family.href);
+	if (appTree(process.env, fileURLToPath(appRoot)) !== void 0) usePackagesOfProgram(fileURLToPath(appRoot));
+}
 const resolver = new URL("extensions/resolve.ts", plugins);
 if (existsSync(fileURLToPath(new URL("acryl-router/src/index.ts", plugins))) && existsSync(fileURLToPath(resolver))) {
 	const { routerAliases } = await import(resolver.href);

package/lib/node-server.js

@@ -1,5 +1,5 @@
 import { a as serve, d as RequestError, i as createAdaptorServer, n as UpgradeEmitter, o as upgradeWebSocket, r as UpgradeHub, s as getRequestListener, t as testWebSocket } from "./test-websocket-CQOSvBth.js";
 import { t as serveStatic } from "./serve-static-C1Nkj_xB.js";
 import { t as getConnInfo } from "./conninfo-CWJwieh4.js";
-import { n as clientModules, t as buildClientModules } from "./client-modules-Bkdr83jO.js";
+import { n as clientModules, t as buildClientModules } from "./client-modules-C5qiVroz.js";
 export { RequestError, UpgradeEmitter, UpgradeHub, buildClientModules, clientModules, createAdaptorServer, getConnInfo, getRequestListener, serve, serveStatic, testWebSocket, upgradeWebSocket };

package/lib/{transpile-QUK9b3eG.js → transpile-CRRaixyS.js}

@@ -23,10 +23,25 @@ const importSources = /* @__PURE__ */ new Map();
 * @returns the compiler.
 * @throws MissingTypeScriptError when the app has no `typescript`.
 */
+/** The nearest folder from `start` up whose node_modules has `typescript`, or undefined. */
+function typescriptOwner(start) {
+	for (let dir = start;; dir = dirname(dir)) {
+		if (existsSync(join(dir, "node_modules", "typescript", "package.json"))) return dir;
+		if (dirname(dir) === dir) return void 0;
+	}
+}
+/** The Program's folder when this process is a desktop product's frame host: the person's source has no packages, the bundle has them. */
+let programPackages;
+/**
+* In a desktop product's frame host, compile with the Program's packages when a file's own chain has none (`register.ts` calls this once it finds the
+* product's app tree, plugins/instance/bundle.ts). Nowhere else: an app without `typescript` is told so.
+*/
+function usePackagesOfProgram(dir) {
+	programPackages = dir;
+}
 function compilerFor(file, what) {
-	let owner;
-	for (let dir = dirname(file); owner === void 0; dir = dirname(dir)) if (existsSync(join(dir, "node_modules", "typescript", "package.json"))) owner = dir;
-	else if (dirname(dir) === dir) throw new MissingTypeScriptError(file, what);
+	const owner = typescriptOwner(dirname(file)) ?? (programPackages === void 0 ? void 0 : typescriptOwner(programPackages));
+	if (owner === void 0) throw new MissingTypeScriptError(file, what);
 	const path = createRequire(join(owner, "package.json")).resolve("typescript");
 	let compiler = compilers.get(path);
 	if (compiler === void 0) {
@@ -87,4 +102,4 @@ function rewriteSpecifiers(ts, code, rewrite) {
 	return result + code.slice(last);
 }
 //#endregion
-export { compileModule as n, MissingTypeScriptError as t };
+export { compileModule as n, usePackagesOfProgram as r, MissingTypeScriptError as t };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "acrylblends",
-  "version": "1.4.0",
+  "version": "1.5.1",
   "description": "The Acryl web framework (import { Acryl } from \"acrylblends\") and the acrylblends command that scaffolds Cordis apps.",
   "license": "MIT",
   "type": "module",

package/plugins/acryl-door/src/cli/acryl.ts

@@ -196,13 +196,17 @@ export function parseInvocation(argv: readonly string[], env: NodeJS.ProcessEnv
   }
 }
 
-/** The app folder: `--dir`, or the nearest folder upward from `cwd` that has `.acryl/door.json` (or at least `.acryl/`). */
+/**
+ * The app folder: `--dir`, or the nearest folder upward from `cwd` that has `.acryl/door.json`. When no app is running, the nearest folder that is an app (it
+ * has a `blend.yaml`), so "no running app in <that folder>" names the app. A folder that only has a `.acryl/` is not an app: the person's `~/.acryl` is ACRYL's
+ * own home, and it must never be taken for the app the command was run in.
+ */
 export function findApp(cwd: string, dir: string | undefined): string | undefined {
   if (dir !== undefined) return resolve(cwd, dir)
   let fallback: string | undefined
   for (let at = resolve(cwd); ; at = dirname(at)) {
     if (existsSync(join(at, STATE_DIR, DOOR_FILE))) return at
-    if (fallback === undefined && existsSync(join(at, STATE_DIR))) fallback = at
+    if (fallback === undefined && existsSync(join(at, 'blend.yaml'))) fallback = at
     if (dirname(at) === at) return fallback
   }
 }

package/plugins/acryl-node-server/src/register.ts

@@ -10,7 +10,7 @@
 import { existsSync, readFileSync } from 'node:fs'
 import { registerHooks } from 'node:module'
 import { fileURLToPath, pathToFileURL } from 'node:url'
-import { compileModule } from './transpile.ts'
+import { compileModule, usePackagesOfProgram } from './transpile.ts'
 
 /** The JSX runtime the docs set up; an app's tsconfig.json (or a file's own `@jsxImportSource` pragma) chooses another. */
 const DEFAULT_IMPORT_SOURCE = 'acrylblends/jsx'
@@ -36,6 +36,15 @@ registerHooks({
  */
 const plugins = new URL('../../', import.meta.url)
 const appRoot = new URL('../', plugins).href
+// A desktop product's frame host runs the Program from the bundle on an app's source, which holds only the person's files: their JSX compiles with the
+// Program's `typescript` (the instance family says whether this is such a host; a published framework has no family beside it).
+const family = new URL('instance/bundle.ts', plugins)
+if (existsSync(fileURLToPath(family))) {
+  const { appTree } = (await import(family.href)) as {
+    appTree(env: NodeJS.ProcessEnv, bundle: string): unknown
+  }
+  if (appTree(process.env, fileURLToPath(appRoot)) !== undefined) usePackagesOfProgram(fileURLToPath(appRoot))
+}
 const resolver = new URL('extensions/resolve.ts', plugins)
 if (existsSync(fileURLToPath(new URL('acryl-router/src/index.ts', plugins))) && existsSync(fileURLToPath(resolver))) {
   const { routerAliases } = (await import(resolver.href)) as { routerAliases(): Record<string, string> }

package/plugins/acryl-node-server/src/transpile.ts

@@ -36,13 +36,32 @@ const importSources = new Map<string, string>()
  * @returns the compiler.
  * @throws MissingTypeScriptError when the app has no `typescript`.
  */
-function compilerFor(file: string, what: string): Compiler {
-  // Only the app's own node_modules chain counts: Node's global folders (NODE_PATH, which a package manager's shims may set) are not the app.
-  let owner: string | undefined
-  for (let dir = dirname(file); owner === undefined; dir = dirname(dir)) {
-    if (existsSync(join(dir, 'node_modules', 'typescript', 'package.json'))) owner = dir
-    else if (dirname(dir) === dir) throw new MissingTypeScriptError(file, what)
+/** The nearest folder from `start` up whose node_modules has `typescript`, or undefined. */
+function typescriptOwner(start: string): string | undefined {
+  for (let dir = start; ; dir = dirname(dir)) {
+    if (existsSync(join(dir, 'node_modules', 'typescript', 'package.json'))) return dir
+    if (dirname(dir) === dir) return undefined
   }
+}
+
+/** The Program's folder when this process is a desktop product's frame host: the person's source has no packages, the bundle has them. */
+let programPackages: string | undefined
+
+/**
+ * In a desktop product's frame host, compile with the Program's packages when a file's own chain has none (`register.ts` calls this once it finds the
+ * product's app tree, plugins/instance/bundle.ts). Nowhere else: an app without `typescript` is told so.
+ */
+export function usePackagesOfProgram(dir: string): void {
+  programPackages = dir
+}
+
+function compilerFor(file: string, what: string): Compiler {
+  // Only the app's own node_modules chain counts: Node's global folders (NODE_PATH, which a package manager's shims may set) are not the app. In a
+  // desktop product the app is the person's source with the Program's packages.
+  const owner =
+    typescriptOwner(dirname(file)) ??
+    (programPackages === undefined ? undefined : typescriptOwner(programPackages))
+  if (owner === undefined) throw new MissingTypeScriptError(file, what)
   const path = createRequire(join(owner, 'package.json')).resolve('typescript')
   let compiler = compilers.get(path)
   if (compiler === undefined) {

package/plugins/acryl-page/src/favicon.ts

@@ -0,0 +1,19 @@
+/**
+ * The page's own icon: the ACRYL Blends logo (plugins/desktop/assets/acrylblends-logo.png at 64 px) inside an SVG, which is what a browser tab reads at 16 px. The wordmark is
+ * unreadable that small. The frontend package the page borrows its scripts from ships DeepSeek's whale as favicon.svg, so the page answers every icon request itself and
+ * never serves that file.
+ */
+export const ACRYL_FAVICON_SVG =
+  "<svg xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" viewBox=\"0 0 64 64\" role=\"img\" aria-label=\"ACRYL Blends\"><image width=\"64\" height=\"64\" xlink:href=\"data:image/png;base64,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\"/></svg>"
+
+/** The web manifest of an app page: its title and the icon above, not the frontend package's own. */
+export function pageManifest(title: string): string {
+  return JSON.stringify({
+    name: title,
+    short_name: title,
+    start_url: './',
+    scope: './',
+    display: 'standalone',
+    icons: [{ src: 'favicon.svg', sizes: 'any', type: 'image/svg+xml', purpose: 'any' }],
+  })
+}

package/plugins/acryl-page/src/index.ts

@@ -10,6 +10,7 @@ import { dirname, extname, join, normalize, sep } from 'node:path'
 import type { IncomingMessage, ServerResponse } from 'node:http'
 import type { Context } from '@deepseek-ai/cordis'
 import type {} from 'acryl-web-server'
+import { ACRYL_FAVICON_SVG, pageManifest } from './favicon.ts'
 
 /** Stable Cordis plugin name, equal to the package name and the Loader row id. */
 export const name = 'acryl-page'
@@ -64,12 +65,17 @@ export function clientAssetTags(indexHtml: string): string {
 
 /** Our document: minimal on purpose; the frame renders into `#root`, and the taps add the boot wire before `</head>`. */
 export function pageDocument(tags: string, title: string, taps: (html: string) => string): string {
+  // The title is an app's name, typed by a person: markup in it is text, never the page's.
+  const text = title.replace(/[&<>"']/gu, (character) => `&#${String(character.charCodeAt(0))};`)
   const document = `<!doctype html>
 <html lang="en">
   <head>
     <meta charset="utf-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
-    <title>${title}</title>
+    <title>${text}</title>
+    <meta name="application-name" content="${text}" />
+    <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
+    <link rel="manifest" href="/manifest.webmanifest" />
     ${tags}
   </head>
   <body>
@@ -143,21 +149,20 @@ export function apply(ctx: Context, config: Partial<Config> = {}): void {
       await serveFile(assets, pathname.slice('/assets'.length), res, req.method ?? 'GET')
     },
   })
-  // Browsers ask for /favicon.ico unconditionally; the built light icon answers it.
+  // Browsers ask for /favicon.ico unconditionally. The icon is ours (the ACRYL mark), never the frontend package's DeepSeek whale.
+  const sendIcon = async (req: IncomingMessage, res: ServerResponse): Promise<void> => {
+    res.writeHead(200, { 'content-type': 'image/svg+xml', 'content-length': String(Buffer.byteLength(ACRYL_FAVICON_SVG)), 'cache-control': 'no-cache' })
+    res.end(req.method === 'HEAD' ? undefined : ACRYL_FAVICON_SVG)
+  }
+  for (const path of ['/favicon.ico', '/favicon.svg', '/favicon-dark.svg'])
+    ctx.webServer.register({ kind: 'exact', path, handler: sendIcon })
   ctx.webServer.register({
     kind: 'exact',
-    path: '/favicon.ico',
+    path: '/manifest.webmanifest',
     handler: async (req: IncomingMessage, res: ServerResponse) => {
-      await serveFile(dist, 'favicon.svg', res, req.method ?? 'GET')
+      const manifest = pageManifest(title)
+      res.writeHead(200, { 'content-type': 'application/manifest+json', 'content-length': String(Buffer.byteLength(manifest)) })
+      res.end(req.method === 'HEAD' ? undefined : manifest)
     },
   })
-  for (const file of ['favicon.svg', 'favicon-dark.svg', 'manifest.webmanifest']) {
-    ctx.webServer.register({
-      kind: 'exact',
-      path: `/${file}`,
-      handler: async (req: IncomingMessage, res: ServerResponse) => {
-        await serveFile(dist, file, res, req.method ?? 'GET')
-      },
-    })
-  }
 }

package/plugins/agent-panel/client/main.ts

@@ -525,6 +525,8 @@ export async function start(prefix: string = '/api/agent-panel'): Promise<void>
   const watch = async (source: RunSource, own: boolean): Promise<void> => {
     let live = true
     let changed = false
+    // Every run the server finishes ends with `done` or `error`; a stream that stops without either lost its server, and the run with it.
+    let finished = false
     let answer: HTMLElement | undefined
     let answered = ''
     // The Assistant's steps on the page, shown under its answer in one line, as the person reads what it did.
@@ -592,11 +594,18 @@ export async function start(prefix: string = '/api/agent-panel'): Promise<void>
           changed = true
           line(`plugin ${String(data.extension)}: ${String(data.action)}`, 'tool')
         } else if (event === 'error') {
+          finished = true
           line(String(data.message ?? 'The run failed.'), 'err')
         } else if (event === 'done') {
+          finished = true
           changed = changed || data.changed === true
         }
       }
+      if (live && working !== undefined && !finished)
+        line(
+          'The app stopped while the agent was working, and the run ended with it (`npm run dev` restarts the app when a file it runs changes). Ask again to go on.',
+          'err',
+        )
     } catch (error) {
       line(`The request failed: ${error instanceof Error ? error.message : String(error)}`, 'err')
     } finally {

package/plugins/agent-panel/headless.ts

@@ -1,9 +1,9 @@
 /** The panel's own drivers, all `chat`: the app's agent, and the coding agents (`claude`, `codex`, `pi`) started headless in the app folder. */
 import { type ChildProcess, spawn, spawnSync } from 'node:child_process'
 import { readFileSync } from 'node:fs'
-import { homedir } from 'node:os'
 import { join } from 'node:path'
 import type { Context } from '@deepseek-ai/cordis'
+import { personHome } from '../instance/storage.ts'
 import type { ChatDriver, ChatEvent } from './drivers.ts'
 import { resolveLaunch } from './launch.ts'
 
@@ -78,7 +78,7 @@ export function onPath(program: string): boolean {
 /** Whether pi can reach DeepSeek: the key in the environment, or the one pi stored for itself when its owner logged in (`~/.pi/agent/auth.json`, a `deepseek` entry). */
 export function piHasDeepseekKey(
   env: NodeJS.ProcessEnv = process.env,
-  home: string = homedir(),
+  home: string = personHome(env),
 ): boolean {
   if (env.DEEPSEEK_API_KEY) return true
   try {

package/plugins/desktop/app-page.ts

@@ -0,0 +1,151 @@
+/**
+ * What the frame's App pages ask of a desktop product (app-storage.md, "What the person sees"): the first start's "Name your app" and Settings > App
+ * (name, size, show the folder, export, import, start over, the other apps, git's licence). The page asks through one IPC channel that `preload.cjs`
+ * exposes as `window.acrylBlendsApp`; this module answers, over `AppStorage` and the shell's own ports, so it is tested without Electron.
+ *
+ * Every answer is a plain result, never a thrown IPC error: the page shows `message` as it is.
+ */
+
+import type { AppInstance } from '../instance/index.ts'
+import type { AppSize, AppStorage, RegisteredApp } from '../instance/storage.ts'
+import type { ProductGit } from './git.ts'
+
+/** The IPC channel; `preload.cjs` names the same string. */
+export const APP_PAGE_CHANNEL = 'acrylblends:app'
+
+/** What the page shows. `named` is false until the person names the app (the first start asks). */
+export interface AppPageState {
+  readonly id: string
+  readonly name: string
+  readonly named: boolean
+  /** The other apps on this computer, to open one instead. */
+  readonly others: readonly {
+    readonly id: string
+    readonly name: string
+    readonly created: string
+  }[]
+  /** What the OS calls its file manager: the Show button's label. */
+  readonly fileManager: 'Finder' | 'Explorer' | 'Files'
+  /** The product ships git (its licence and source are offered on the page). */
+  readonly git: boolean
+}
+
+export type AppPageResult =
+  | { readonly ok: true; readonly value?: unknown }
+  | { readonly ok: false; readonly message: string }
+
+export interface AppPagePorts {
+  readonly storage: AppStorage
+  /** The id of the app the window shows now. */
+  current(): string
+  /** A new app's starting files (the first start's seed). */
+  readonly seed: (source: string) => void
+  /**
+   * Stop the frame host, run `next` (which may move the old app's folders), and start the host on the app it returns, reloading the windows. When
+   * `next` fails, the app that ran comes back and the failure is the answer.
+   */
+  switchTo(next: () => AppInstance): Promise<void>
+  /** The save dialog for an export (`suggested` is the file name), or undefined when the person cancels. */
+  chooseExportFile(suggested: string): Promise<string | undefined>
+  /** The open dialog for an import, or undefined when the person cancels. */
+  chooseImportFile(): Promise<string | undefined>
+  /** Open a file with the OS's own application for it. */
+  openPath(path: string): Promise<void>
+  /** The app's label changed: the process name and the window titles follow. */
+  renamed(app: RegisteredApp): void
+  readonly platform: NodeJS.Platform
+  readonly git?: ProductGit
+}
+
+const fileManagerOf = (platform: NodeJS.Platform): AppPageState['fileManager'] =>
+  platform === 'darwin' ? 'Finder' : platform === 'win32' ? 'Explorer' : 'Files'
+
+/** A file name every OS accepts, from the app's label: the export's suggested name. */
+export function exportFileName(name: string): string {
+  const safe = [...name]
+    .filter((character) => (character.codePointAt(0) ?? 0) >= 0x20)
+    .join('')
+    .replace(/[<>:"/\\|?*]/gu, '-')
+    .replace(/[. ]+$/u, '')
+    .trim()
+  return `${safe === '' ? 'app' : safe}.acrylblend`
+}
+
+/** The handler of the page's channel: one operation and its argument, one result. */
+export function appPageHandler(
+  ports: AppPagePorts,
+): (op: unknown, arg: unknown) => Promise<AppPageResult> {
+  const state = (): AppPageState => {
+    const id = ports.current()
+    const app = ports.storage.app(id)
+    return {
+      id,
+      name: app.name,
+      named: app.named === true,
+      others: ports.storage
+        .apps()
+        .filter((other) => other.id !== id)
+        .map((other) => ({ id: other.id, name: other.name, created: other.created })),
+      fileManager: fileManagerOf(ports.platform),
+      git: ports.git !== undefined,
+    }
+  }
+  const run = async (op: unknown, arg: unknown): Promise<unknown> => {
+    switch (op) {
+      case 'state':
+        return state()
+      case 'size':
+        return (await ports.storage.size(ports.current())) satisfies AppSize
+      case 'rename': {
+        if (typeof arg !== 'string') throw new Error('a name is text')
+        ports.renamed(ports.storage.rename(ports.current(), arg))
+        return state()
+      }
+      case 'reveal':
+        ports.storage.reveal(ports.current())
+        return undefined
+      case 'export': {
+        const data = (arg as { data?: unknown } | undefined)?.data === true
+        const id = ports.current()
+        const file = await ports.chooseExportFile(exportFileName(ports.storage.app(id).name))
+        if (file === undefined) return { cancelled: true }
+        ports.storage.export(id, file, { data })
+        return { file }
+      }
+      case 'import': {
+        const file = await ports.chooseImportFile()
+        if (file === undefined) return { cancelled: true }
+        // Made beside the running app, which keeps running until the new one is ready to open.
+        const made = ports.storage.import(file)
+        await ports.switchTo(() => ports.storage.open(made.id))
+        return undefined
+      }
+      case 'startOver': {
+        const id = ports.current()
+        await ports.switchTo(() => ports.storage.open(ports.storage.reset(id, ports.seed).id))
+        return undefined
+      }
+      case 'open': {
+        if (typeof arg !== 'string' || !ports.storage.apps().some((app) => app.id === arg))
+          throw new Error('there is no such app on this computer')
+        if (arg !== ports.current()) await ports.switchTo(() => ports.storage.open(arg))
+        return undefined
+      }
+      case 'gitLicence':
+      case 'gitSource': {
+        if (ports.git === undefined) throw new Error('this app ships no git of its own')
+        await ports.openPath(op === 'gitLicence' ? ports.git.licence : ports.git.source)
+        return undefined
+      }
+      default:
+        throw new Error(`the app page cannot ${String(op)}`)
+    }
+  }
+  return async (op, arg) => {
+    try {
+      return { ok: true, value: await run(op, arg) }
+    } catch (cause) {
+      return { ok: false, message: cause instanceof Error ? cause.message : String(cause) }
+    }
+  }
+}