@valancex/cli 0.12.0 → 0.14.0

package/dist/build.d.ts

@@ -1,7 +1,14 @@
+import type { TargetId } from "./targets.js";
+import type { BudgetResult, SizeReport } from "./size.js";
 export interface Built {
     readonly dir: string;
     readonly files: ReadonlyArray<string>;
     readonly pages: ReadonlyArray<string>;
+    /** The web build's start-up and after-start sets, measured, and each budget it was held to (a production build only). */
+    readonly size?: SizeReport;
+    readonly budgets?: ReadonlyArray<BudgetResult>;
+    /** The size report as the lines a terminal prints. */
+    readonly report?: ReadonlyArray<string>;
 }
 /** The file a pathname is written to in the site: `/` → `index.html`, `/guide/x` → `guide/x/index.html`, relative to the base. */
 export declare const fileOf: (pathname: string, base: string) => string;
@@ -10,5 +17,9 @@ export type BuildStage = "configuration" | "content" | "templates" | "bundle" |
 export interface BuildOptions {
     /** Called as each stage begins. */
     readonly onStage?: (stage: BuildStage) => void;
+    /** Which of the project's targets to build; all of them by default. */
+    readonly targets?: ReadonlyArray<TargetId>;
+    /** Called with the size report as soon as the bundle is measured, before a budget error stops the build (a terminal prints it). */
+    readonly onReport?: (lines: ReadonlyArray<string>) => void;
 }
 export declare const build: (root: string, options?: BuildOptions) => Promise<Built>;

package/dist/build.js

@@ -1,7 +1,8 @@
-// `vlx build`: the project → a static site in `dist/`. The stages, in order: configuration, content, templates, the browser bundle, then one document per page (and a 404 page, a sitemap
-// when the site has a published address). Everything is generated under `.valance/` first; `dist/` holds only the site.
+// `vlx build`: the project → a static site in `dist/web/`. The stages, in order: configuration, content, templates, the browser bundle, then one document per page (and a 404 page, a sitemap
+// when the site has a published address). Everything is generated under `.valance/` first; `dist/` holds only what is built.
 import { build as bundle } from "vite";
-import { mkdirSync, readFileSync, rmSync, writeFileSync } from "node:fs";
+import { copyFileSync, cpSync, existsSync, mkdirSync, readFileSync, rmSync, writeFileSync } from "node:fs";
+import { createRequire } from "node:module";
 import { dirname, join } from "node:path";
 import { loadAuthor } from "./author.js";
 import { loadConfig } from "./config.js";
@@ -9,44 +10,89 @@ import { headersFile } from "./security.js";
 import { AppError } from "./diagnostics.js";
 import { generateContent, generateEntries, generateProgram } from "./emit.js";
 import { OUTPUT_DIR } from "./project.js";
-import { baseConfig, createLoader, SERVER_ENTRY } from "./vite.js";
+import { check, DEFAULT_BUDGETS, failure, lines, measure } from "./size.js";
+import { assertOneRuntime } from "./runtime-guard.js";
+import { baseConfig, createLoader, SERVER_ENTRY, templates } from "./vite.js";
+import { GENERATED_DIR } from "./project.js";
 /** The file a pathname is written to in the site: `/` → `index.html`, `/guide/x` → `guide/x/index.html`, relative to the base. */
 export const fileOf = (pathname, base) => {
     const inside = pathname.slice(base.length).replace(/\/+$/, "");
     return inside === "" ? "index.html" : `${inside}/index.html`;
 };
 const sitemap = (content) => `<?xml version="1.0" encoding="UTF-8"?>\n<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">\n${content.pages.map((page) => `  <url><loc>${content.site.url}${content.site.base}${page.path.replace(/^\//, "")}</loc></url>`).join("\n")}\n</urlset>\n`;
-export const build = async (root, options = {}) => {
-    const stage = options.onStage ?? (() => undefined);
-    stage("configuration");
-    const config = loadConfig(root);
-    generateEntries(root);
-    stage("content");
-    const content = generateContent(root, config);
-    const loader = await createLoader(root, config);
-    let rendered;
-    try {
-        stage("templates");
-        const author = await loadAuthor(loader, root);
-        await generateProgram(root, author);
-        // The browser bundle first: it empties dist/, and the documents are written into it after.
-        stage("bundle");
-        await bundle({ ...baseConfig(root, config), mode: "production" });
-        rendered = (await loader.ssrLoadModule(SERVER_ENTRY));
-    }
-    catch (error) {
-        await loader.close();
-        throw error;
+/** The MESH runtime's module, found the way the project's own dependency would be: through `@valancex/common`, which depends on it. */
+const wasmOf = (root) => {
+    const fromRoot = createRequire(join(root, "package.json"));
+    const fromCommon = createRequire(fromRoot.resolve("@valancex/common/package.json"));
+    return fromCommon.resolve("@valancex/mesh-runtime/mesh-runtime.wasm");
+};
+/** The desktop build: the engine, one ES module with everything it needs bundled in, and the MESH runtime's module beside it, in `dist/desktop/`. The window is the Desktop PORT's. */
+const buildDesktop = async (root) => {
+    const out = join(root, OUTPUT_DIR, "desktop");
+    rmSync(out, { recursive: true, force: true });
+    await bundle({
+        root,
+        configFile: false,
+        publicDir: false, // the site's public files are the web's
+        logLevel: "warn",
+        plugins: [templates(root)],
+        cacheDir: join(root, GENERATED_DIR, "cache"),
+        ssr: { noExternal: true, target: "node" },
+        esbuild: { keepNames: true },
+        build: {
+            ssr: join(root, GENERATED_DIR, "desktop.ts"),
+            outDir: out,
+            emptyOutDir: true,
+            target: "node22",
+            // W10: the engine is minified (half the bytes; start-up measured no worse, 2026-10-24). Names are kept: errors and their `_tag` are read by name.
+            minify: "esbuild",
+            rollupOptions: {
+                output: {
+                    format: "es",
+                    entryFileNames: "engine.mjs",
+                    banner: 'import { createRequire as __vlxRequire } from "node:module"; const require = __vlxRequire(import.meta.url);',
+                },
+            },
+        },
+    });
+    copyFileSync(wasmOf(root), join(out, "mesh-runtime.wasm"));
+    // The files images are drawn from, beside the engine (the site's `public/`, which the desktop's content refers to the same way).
+    const publicDir = join(root, "public");
+    if (existsSync(publicDir)) {
+        cpSync(publicDir, join(out, "public"), { recursive: true });
     }
-    try {
-        const dist = join(root, OUTPUT_DIR);
+    return { dir: out, files: ["desktop/engine.mjs", "desktop/mesh-runtime.wasm"], pages: [] };
+};
+/** The web build: the browser bundle into `out`, then one document per page. The loader is the one the templates were compiled with. */
+const buildWeb = async (root, config, loader, content, out, prefix, stage, onReport) => {
+    // The browser bundle first: it empties its directory, and the documents are written into it after.
+    stage("bundle");
+    await bundle({ ...baseConfig(root, config, out), mode: "production" });
+    const rendered = (await loader.ssrLoadModule(SERVER_ENTRY));
+    {
+        const dist = join(root, out);
         const manifest = JSON.parse(readFileSync(join(dist, ".vite", "manifest.json"), "utf8"));
         const entry = Object.values(manifest).find((chunk) => chunk.isEntry === true);
         if (entry === undefined) {
-            throw new AppError([{ file: OUTPUT_DIR, line: 0, column: 0, code: "build-entry", message: "the bundle has no entry chunk" }]);
+            throw new AppError([{ file: out, line: 0, column: 0, code: "build-entry", message: "the bundle has no entry chunk" }]);
         }
         rmSync(join(dist, ".vite"), { recursive: true, force: true }); // the bundler's bookkeeping is not part of the site
-        const built = { script: `${config.web.base}${entry.file}`, styles: (entry.css ?? []).map((file) => `${config.web.base}${file}`) };
+        // The WebAssembly runtime is in the start-up set (H7): the head starts compiling it while the page's script downloads (W11).
+        const wasm = Object.values(manifest).find((chunk) => chunk.file.endsWith(".wasm"))?.file;
+        const built = {
+            script: `${config.web.base}${entry.file}`,
+            styles: (entry.css ?? []).map((file) => `${config.web.base}${file}`),
+            ...(wasm === undefined ? {} : { wasm: `${config.web.base}${wasm}` }),
+        };
+        // The size report: the start-up set and the after-start set, held to the project's budgets or the framework's (W9, W14). Production only.
+        const size = measure(dist, manifest, wasm);
+        const budgets = check(size, config.budgets ?? DEFAULT_BUDGETS);
+        const report = lines(size, budgets);
+        onReport(report);
+        const over = failure(budgets);
+        if (over !== undefined) {
+            throw over;
+        }
         const files = [];
         const write = (relative, text) => {
             mkdirSync(dirname(join(dist, relative)), { recursive: true });
@@ -67,9 +113,53 @@ export const build = async (root, options = {}) => {
         if (config.web.headers) {
             write("_headers", headersFile(config));
         }
-        return { dir: dist, files, pages };
+        return { dir: dist, files: files.map((file) => `${prefix}${file}`), pages, size, budgets, report };
+    }
+};
+export const build = async (root, options = {}) => {
+    const stage = options.onStage ?? (() => undefined);
+    stage("configuration");
+    const config = loadConfig(root);
+    const selected = options.targets ?? config.targets;
+    const unknown = selected.filter((id) => !config.targets.includes(id));
+    if (unknown.length > 0) {
+        throw new AppError([
+            {
+                file: "valance.json",
+                line: 0,
+                column: 0,
+                code: "build-target",
+                message: `this project is not built for ${unknown.join(", ")} (its targets: ${config.targets.join(", ")}): add valance.${unknown[0]}.json`,
+            },
+        ]);
+    }
+    // Production only (`vlx dev` does not build through here): one copy of the MESH runtime, or the site ships its WebAssembly module more than once (W20).
+    assertOneRuntime(root);
+    generateEntries(root, config);
+    stage("content");
+    const content = generateContent(root, config);
+    const loader = await createLoader(root, config);
+    const built = [];
+    try {
+        stage("templates");
+        await generateProgram(root, await loadAuthor(loader, root), config, selected);
+        // Each target writes to a directory of its own, whatever else the project has: dist/web/ and dist/desktop/.
+        if (selected.includes("web")) {
+            built.push(await buildWeb(root, config, loader, content, `${OUTPUT_DIR}/web`, "web/", stage, options.onReport ?? (() => undefined)));
+        }
+        if (selected.includes("desktop")) {
+            stage("bundle");
+            built.push(await buildDesktop(root));
+        }
     }
     finally {
         await loader.close();
     }
+    const web = built.find((each) => each.size !== undefined);
+    return {
+        dir: join(root, OUTPUT_DIR),
+        files: built.flatMap((each) => each.files),
+        pages: built.flatMap((each) => each.pages),
+        ...(web?.size === undefined ? {} : { size: web.size, budgets: web.budgets, report: web.report }),
+    };
 };

package/dist/check.js

@@ -22,13 +22,13 @@ export const check = async (root) => {
     if (config === undefined) {
         return { diagnostics: problems, pages: 0, components: [] };
     }
-    generateEntries(root);
+    generateEntries(root, config);
     const content = await collect(problems, () => generateContent(root, config));
     const server = await createLoader(root, config);
     try {
         const author = await collect(problems, () => loadAuthor(server, root));
         const failedAuthor = problems.some((each) => each.file === "src/main.ts");
-        const components = failedAuthor ? undefined : await collect(problems, () => generateProgram(root, author));
+        const components = failedAuthor ? undefined : await collect(problems, () => generateProgram(root, author, config));
         return { diagnostics: problems, pages: content?.pages.length ?? 0, components: components ?? [] };
     }
     finally {

package/dist/cli.js

@@ -2,46 +2,58 @@
 //
 //   vlx init [name] [--web ...]     make a new application (asks what the flags do not say)
 //   vlx dev [--port N] [--host H]   serve the project and rebuild it as it changes
-//   vlx build                       write the site to dist/
+//   vlx build                       write the site to dist/web/
 //   vlx check [--json]              find mistakes in authored files without building
+//   vlx theme check [--json]        the theme: its tokens, recipes, contrast and what each target applies
 //   vlx generate page|component <name>   add a page, or a component registered in src/main.ts (alias: g)
 //   vlx sync                        bring .valance/ (generated types, manifest, entries) up to date; runs by itself after install and generate
 //   vlx help [command]              what a command does
 //
 // In a terminal, `init`, `dev`, `build` and `check` draw an interface (Ink, `ui/`). Anywhere else (a pipe, CI, `--json`, `--plain`) they print the plain text they always have.
+import { resolve } from "node:path";
 import { readFileSync } from "node:fs";
 import { pathToFileURL } from "node:url";
 import { INIT_HELP, parseInit } from "./args.js";
 import { build } from "./build.js";
-import { generateComponent, generatePage, GenerateError, KINDS } from "./add.js";
+import { packageDesktop } from "./package.js";
+import { generateComponent, generatePage, generateTarget, GenerateError, KINDS } from "./add.js";
 import { check } from "./check.js";
+import { themeReport } from "./theme.js";
 import { findRoot } from "./config.js";
 import { localCli } from "./delegate.js";
 import { dev } from "./dev.js";
+import { defaultRecording, replayFile } from "./replay.js";
 import { AppError, format } from "./diagnostics.js";
 import { detectPackageManager, directoryFor, directoryProblem, execute, nameProblem, runCommand, titleOf } from "./init.js";
-import { TARGETS } from "./targets.js";
+import { DEFAULT_TARGETS, TARGETS } from "./targets.js";
 import { canAsk, canDraw } from "./tty.js";
 const HELP = `vlx <command>
 
   init [name] [--web]              make a new application
-  dev [--port N] [--host H]        serve it and rebuild as it changes
-  build                            write the site to dist/
+  dev [--port N] [--host H]        serve it and rebuild as it changes (--record [file]: write a session log)
+  replay <log> [--route R] [--allow-user-data]  play a session log against this project and find where it differs
+  build                            write the site to dist/web/
   check [--json]                   find mistakes in your files without building
+  theme check [--json]             check the theme: tokens, recipes, contrast, and what each target applies
   generate page|component <name>  add a page, or a component (alias: g)
+  generate target web|desktop      add a target to the project
+  package --desktop                the desktop target as one executable beside its window (unsigned)
   sync                             refresh the generated files (this runs by itself; see vlx help sync)
   help [command]                   say more about one command
 
 Run it in a project (a directory with a valance.json), or any directory inside one.
 In a terminal the commands draw an interface; --plain (or a pipe, or CI) prints plain text.
 `;
-const GENERATE_HELP = `vlx generate <page|component> <name>   (alias: vlx g)
+const GENERATE_HELP = `vlx generate <page|component|target> <name>   (alias: vlx g)
 
   vlx generate page guide/getting-started   content/guide/getting-started.md, with its front matter
                                             (--title "Getting started" to say the title)
   vlx generate component post-card          src/post-card.mprx and src/post-card.ts, imported in
                                             src/main.ts and listed in its \`components\`. Write
                                             <post-card></post-card> in a template to use it.
+  vlx generate target desktop               valance.desktop.json and a layout of its own in src/desktop/,
+                                            registered in \`targets\` of src/main.ts; the content, the state and
+                                            the commands are shared. Nothing the project has is moved.
 
 Nothing is overwritten: a name that is taken is refused.
 `;
@@ -49,9 +61,12 @@ const COMMAND_HELP = {
     init: INIT_HELP,
     generate: GENERATE_HELP,
     g: GENERATE_HELP,
-    dev: "vlx dev [--port N] [--host H]\n\nServe the project and rebuild it as files change. A mistake leaves the last good build serving and shows in the terminal and in the page.\n",
-    build: "vlx build\n\nWrite the site to dist/. Any host that serves files can serve it.\n",
+    replay: "vlx replay <log> [--route changes,update,render] [--json] [--allow-user-data]\n\nPlay a session log (written by vlx dev --record, or one of MESH's conformance logs) against this project's templates by the three routes of the equivalence law, and find the first line where one differs from the log: a tree, an event's outcome, a program or manifest that is not the one recorded. It runs no command and reads no clock. Exits 0 when every route gave what the log recorded, 1 when one did not, 2 when the log cannot be read. A log that holds user data (every recording does: its header says containsUserData) is refused unless you pass --allow-user-data: a divergence prints what was typed and shown.\n",
+    dev: "vlx dev [--web|--desktop] [--port N] [--host H] [--record [file]]\n\nServe the project (the web is served, a desktop project opens its window; a project of more than one target does both, or the one named) and rebuild it as files change. A mistake leaves the last good build serving and shows in the terminal and in the page. --record writes the web page's session as a log (default .valance/sessions/<time>.jsonl) for vlx replay: development only, never uploaded, and it holds what the person typed.\n",
+    build: "vlx build [--web] [--desktop]\n\nBuild every target the project has (or the ones named). The web: the site, in dist/web/; any host that serves files can serve it. The desktop: the engine, in dist/desktop/.\n",
     sync: "vlx sync\n\nBring .valance/ up to date: the generated types for your templates (so your editor and tsc agree with them), the manifest and the entries. You rarely run it: a new project does it after install (the `prepare` script), `vlx generate` does it after it writes, and dev, build and check do it as they run. It never fails: mistakes in your files are reported by vlx check.\n",
+    package: "vlx package --desktop [--platform linux-x64|win32-x64] [--window <path>] [--node <path>] [--archive]\n\nBuild the desktop target and package it: the engine as one executable (Node's single executable application, with the MESH runtime inside) beside the Desktop PORT's window program, in dist/package/<platform>/. --window is the window program for that platform (default: VLX_WINDOW, else vlx-window on the PATH; build it from the PORT repository). For another platform, --node is a node binary of this version for it. --archive also writes the package as one file, a .tar.gz (Linux) or a .zip (Windows), with its SHA-256 beside it. The result is unsigned.\n",
+    theme: "vlx theme check [--json]\n\nCheck the theme: the project's `theme/theme.json` (its tokens by mode, in the Design Tokens format, and its recipes), or the default theme when it has none. Reports a token that does not resolve, a recipe that names a part, state, variant, property or token that does not exist, a removed focus ring, the contrast of every pair the theme declares (WCAG 2.2), and what the web and the desktop apply of it. --json prints the diagnostics, the contrast and the coverage.\n",
     check: "vlx check [--json]\n\nFind mistakes in your files without building. --json prints them as { file, line, column, code, message } for editors and CI.\n",
 };
 /** Refreshes `.valance/` and says so in a line. Best effort: a mistake in the project is `check`'s to report, and a project with no `valance.json` (the install ran before init finished) is left alone. */
@@ -66,10 +81,22 @@ const sync = async (from) => {
         return `skipped (${error instanceof Error ? error.message.split("\n")[0] : String(error)})`;
     }
 };
+/** The targets named by flags (`--web`, `--desktop`), in the order given. */
+const targetFlags = (args) => TARGETS.map((each) => each.id).filter((id) => args.includes(`--${id}`));
 const option = (args, name) => {
     const at = args.indexOf(name);
     return at < 0 ? undefined : args[at + 1];
 };
+/** `--record` alone, `--record file` or `--record=file`: the file, `""` for the default, nothing when it is not there. A word after it that is another flag is not its file. */
+const recordOption = (args) => {
+    const joined = args.find((each) => each.startsWith("--record="));
+    if (joined !== undefined) {
+        return joined.slice("--record=".length);
+    }
+    const at = args.indexOf("--record");
+    const next = at < 0 ? undefined : args[at + 1];
+    return at < 0 ? undefined : next === undefined || next.startsWith("-") ? "" : next;
+};
 const version = () => JSON.parse(readFileSync(new URL("../package.json", import.meta.url), "utf8")).version;
 const runInit = async (args, cwd) => {
     if (args.name !== undefined) {
@@ -90,13 +117,13 @@ const runInit = async (args, cwd) => {
         return 2;
     }
     if (args.targets.length === 0 && !args.yes) {
-        console.error(`vlx init: choose a target (${TARGETS.map((each) => `--${each.id}`).join(", ")}), or --yes for all of them`);
+        console.error(`vlx init: choose a target (${TARGETS.map((each) => `--${each.id}`).join(", ")}), or --yes for the web`);
         return 2;
     }
     const answers = {
         name: args.name,
         dir: directoryFor(args.name, cwd),
-        targets: args.targets.length === 0 ? TARGETS.map((each) => each.id) : args.targets,
+        targets: args.targets.length === 0 ? DEFAULT_TARGETS : args.targets,
         web: { base: args.base ?? "", url: args.url ?? "" },
         packageManager: args.packageManager ?? detectPackageManager(),
         install: args.install ?? true,
@@ -128,7 +155,15 @@ export const main = async (args, cwd = process.cwd()) => {
         return 0;
     }
     // A global `vlx` runs the project's own (see `delegate.ts`).
-    if (command === "dev" || command === "build" || command === "check" || command === "sync" || command === "generate" || command === "g") {
+    if (command === "dev" ||
+        command === "replay" ||
+        command === "build" ||
+        command === "package" ||
+        command === "check" ||
+        command === "theme" ||
+        command === "sync" ||
+        command === "generate" ||
+        command === "g") {
         const local = localCli(cwd);
         if (local !== undefined) {
             const theirs = (await import(pathToFileURL(local).href));
@@ -153,32 +188,85 @@ export const main = async (args, cwd = process.cwd()) => {
             case "dev": {
                 const port = option(rest, "--port");
                 const host = option(rest, "--host");
+                const picked = targetFlags(rest);
+                if (picked.length > 1) {
+                    console.error("vlx dev: name one target, or none for all of them: vlx dev --web or vlx dev --desktop");
+                    return 2;
+                }
+                const target = picked[0];
+                const asked = recordOption(rest);
+                const record = asked === undefined ? undefined : asked === "" ? defaultRecording(findRoot(cwd)) : resolve(cwd, asked);
                 if (draws) {
                     const { drawDev } = await import("./ui/run.js");
-                    await drawDev(findRoot(cwd), { ...(port === undefined ? {} : { port: Number(port) }), ...(host === undefined ? {} : { host }) });
+                    await drawDev(findRoot(cwd), {
+                        ...(record === undefined ? {} : { record }),
+                        ...(target === undefined ? {} : { target }),
+                        ...(port === undefined ? {} : { port: Number(port) }),
+                        ...(host === undefined ? {} : { host }),
+                    });
                     return 0;
                 }
-                const running = await dev(findRoot(cwd), { ...(port === undefined ? {} : { port: Number(port) }), ...(host === undefined ? {} : { host }) });
+                const running = await dev(findRoot(cwd), {
+                    ...(record === undefined ? {} : { record }),
+                    ...(target === undefined ? {} : { target }),
+                    ...(port === undefined ? {} : { port: Number(port) }),
+                    ...(host === undefined ? {} : { host }),
+                });
                 console.log(`vlx dev: ${running.url}`);
-                // Until interrupted.
+                // Until interrupted (or, for a desktop project, until the window is closed).
                 await new Promise((resolve) => {
                     process.once("SIGINT", resolve);
                     process.once("SIGTERM", resolve);
+                    void running.closed?.then(resolve);
                 });
                 await running.close();
                 return 0;
             }
+            case "replay": {
+                const file = rest.find((each, index) => !each.startsWith("-") && rest[index - 1] !== "--route");
+                if (file === undefined) {
+                    console.error("vlx replay: name a log: vlx replay <log> [--route changes,update,render] [--json]");
+                    return 2;
+                }
+                const routes = option(rest, "--route");
+                const replayed = await replayFile(findRoot(cwd), resolve(cwd, file), {
+                    ...(routes === undefined ? {} : { routes: routes.split(",") }),
+                    json: rest.includes("--json"),
+                    allowUserData: rest.includes("--allow-user-data"),
+                });
+                (replayed.code === 0 ? console.log : console.error)(replayed.output);
+                return replayed.code;
+            }
             case "build": {
                 if (draws) {
                     const { drawBuild } = await import("./ui/run.js");
-                    await drawBuild(findRoot(cwd));
+                    await drawBuild(findRoot(cwd), targetFlags(rest));
                     return 0;
                 }
                 const started = Date.now();
-                const built = await build(findRoot(cwd));
+                const flagged = targetFlags(rest);
+                const built = await build(findRoot(cwd), { ...(flagged.length === 0 ? {} : { targets: flagged }), onReport: (report) => report.forEach((line) => console.log(line)) });
                 console.log(`vlx build: ${built.pages.length} pages, ${built.files.length} files → ${built.dir} (${((Date.now() - started) / 1000).toFixed(1)}s)`);
                 return 0;
             }
+            case "package": {
+                if (!rest.includes("--desktop")) {
+                    console.error("vlx package: say what: vlx package --desktop [--platform linux-x64|win32-x64] [--window <path>] [--node <path>] [--archive]");
+                    return 2;
+                }
+                const platform = option(rest, "--platform");
+                const window = option(rest, "--window");
+                const node = option(rest, "--node");
+                const packaged = await packageDesktop(findRoot(cwd), {
+                    ...(platform === undefined ? {} : { platform }),
+                    ...(window === undefined ? {} : { window }),
+                    ...(node === undefined ? {} : { node }),
+                    ...(rest.includes("--archive") ? { archive: true } : {}),
+                });
+                console.log(`vlx package: ${packaged.files.join(", ")} → ${packaged.dir}`);
+                packaged.notes.forEach((note) => console.log(`vlx package: ${note}`));
+                return 0;
+            }
             case "check": {
                 if (draws && !rest.includes("--json")) {
                     const { drawCheck } = await import("./ui/run.js");
@@ -199,6 +287,32 @@ export const main = async (args, cwd = process.cwd()) => {
                 }
                 return result.diagnostics.length === 0 ? 0 : 1;
             }
+            case "theme": {
+                if (rest[0] !== "check") {
+                    console.error("vlx theme: say what: vlx theme check [--json]");
+                    return 2;
+                }
+                const report = themeReport(findRoot(cwd));
+                if (rest.includes("--json")) {
+                    console.log(JSON.stringify({ theme: report.name, custom: report.custom, diagnostics: report.diagnostics, contrast: report.contrast, coverage: report.coverage }, null, 2));
+                    return report.diagnostics.length === 0 ? 0 : 1;
+                }
+                console.log(`vlx theme check: ${report.custom ? "the project's theme" : "the default theme"} "${report.name}" (modes: ${report.modes.join(", ")})`);
+                for (const each of report.contrast) {
+                    console.log(`  contrast  ${each.mode.padEnd(9)} ${each.text} on ${each.on}  ${each.ratio.toFixed(2)}:1  (min ${each.min})  ${each.passes ? "ok" : "BELOW"}`);
+                }
+                for (const each of report.coverage) {
+                    console.log(`  ${each.target}: ${each.styled.length} of ${each.styled.length + each.unstyled.length} primitives of the portable core styled${each.unstyled.length === 0 ? "" : ` (not styled: ${each.unstyled.join(", ")})`}`);
+                    for (const note of each.notApplied) {
+                        console.log(`    not applied: ${note.primitive} ${note.kind} ${note.name} (${note.support})`);
+                    }
+                }
+                report.diagnostics.forEach((each) => {
+                    console.error(format(each));
+                });
+                console.log(report.diagnostics.length === 0 ? "vlx theme check: no problems" : `vlx theme check: ${report.diagnostics.length} problem${report.diagnostics.length === 1 ? "" : "s"}`);
+                return report.diagnostics.length === 0 ? 0 : 1;
+            }
             case "sync": {
                 const synced = await sync(cwd);
                 console.log(synced);
@@ -219,7 +333,7 @@ export const main = async (args, cwd = process.cwd()) => {
                 }
                 const root = findRoot(cwd);
                 try {
-                    const made = kind === "page" ? generatePage(root, positional[1], title) : generateComponent(root, positional[1]);
+                    const made = kind === "page" ? generatePage(root, positional[1], title) : kind === "target" ? generateTarget(root, positional[1]) : generateComponent(root, positional[1]);
                     made.created.forEach((file) => console.log(`vlx generate: created ${file}`));
                     made.changed.forEach((file) => console.log(`vlx generate: changed ${file}`));
                     console.log(`vlx generate: ${await sync(root)}`);

package/dist/compile.d.ts

@@ -6,6 +6,8 @@ export declare const SOURCE_DIR = "src";
 /** The component the page is drawn by. */
 export declare const ROOT = "layout";
 export declare const BUILT_IN: string;
+/** The desktop target's built-in views: the same components as the web's, written in the desktop vocabulary. */
+export declare const BUILT_IN_DESKTOP: string;
 /** The package directory: where its README, which documents the framework's own names, is. */
 export declare const PACKAGE_DIR: string;
 interface Template {
@@ -24,8 +26,14 @@ export interface Templates {
  * Built-in templates, then the author's. The author's are exactly the ones `src/main.ts` declares: `layout`, `components` and `override`. A file under `src/` that is not declared is an error, not
  * a guess; a registered component that no template writes is allowed (it is not part of the program until one does). Which components a template uses is read from the template. A name that is a built-in's replaces it only through `override`.
  */
-export declare const templatesOf: (root: string, author: DefinedApp | undefined, vocabulary?: Vocabulary) => Templates;
-export declare const manifestOf: (author: DefinedApp | undefined, vocabulary?: Vocabulary) => import("@valancex/valance/web/build").Manifest;
+export declare const templatesOf: (root: string, author: DefinedApp | undefined, vocabulary?: Vocabulary, views?: string) => Templates;
+export declare const manifestOf: (author: DefinedApp | undefined, vocabulary?: Vocabulary) => {
+    components: {
+        [x: string]: unknown;
+    };
+    version: 1;
+    types: Readonly<Record<string, never>>;
+};
 export interface Compiled {
     readonly program: Valance.Program;
     /**
@@ -48,5 +56,5 @@ export interface Compiled {
     }>;
 }
 /** Compiles the application's templates against a target's vocabulary (the web's by default). Fails with every diagnostic, each pointing into the file it is about. */
-export declare const compileViews: (root: string, author: DefinedApp | undefined, vocabulary?: Vocabulary) => Promise<Compiled>;
+export declare const compileViews: (root: string, author: DefinedApp | undefined, vocabulary?: Vocabulary, views?: string) => Promise<Compiled>;
 export {};