From 9fa5896ae20718383c7b06be2a181fcb07efee05 Mon Sep 17 00:00:00 2001
From: SylvainDruaux <sydru06@gmail.com>
Date: Sat, 24 Oct 2026 16:59:52 +0200
Subject: [PATCH 1/4] refactor(project): remove the unused scaffold project
 channel

The renderer never calls project:scaffold, so the channel and the minimal starter it generated are removed.
---
 README.md                                    |   2 +-
 docs/codebase.md                             |   2 +-
 electron/handlers/projectHandlers.ts         |   9 +-
 electron/preload/preloadBridge.ts            |   1 -
 electron/project/scaffold.ts                 | 184 -------------------
 shared/ipc/ipcPayloads.ts                    |   1 -
 shared/ipc/ipcResults.ts                     |   3 -
 shared/ipc/preloadApi.ts                     |   1 -
 test/electron/app/mainBoundaries.test.ts     |   2 +-
 test/electron/documents/singleWriter.test.ts |   3 -
 10 files changed, 4 insertions(+), 204 deletions(-)
 delete mode 100644 electron/project/scaffold.ts

diff --git a/README.md b/README.md
index 11b601cf..531e6cc4 100644
--- a/README.md
+++ b/README.md
@@ -16,7 +16,7 @@ MIT licensed — fork it, build on it, ship your own version.
 - **Git & GitHub** — the branch chip in the title bar shows the current branch and dirty state. From its dropdown you can switch branches, create branches, commit, push, or publish a brand-new repo to GitHub (via the `gh` CLI).
 - **Tell an AI what's selected** — **⇧⌘C** copies whatever the canvas has selected as the trail of `file:line-range` pointers that leads to it: the page, each component drilled into on the way down, then the node itself. Paste that into Claude Code or any AI chat that can read the project and it knows exactly which markup you mean.
 - **Code fallback** — pages with markup too complex for the visual model open in a code editor instead, still with live preview.
-- **New project** — "New Project…" scaffolds a minimal Astro starter (layout + 5 components + home page) and runs `npm install` for you.
+- **New project** — "Start from Lumos" or "Start from Astro" creates a named site with the framework's own scaffolder and installs its dependencies for you.
 
 ## Running in development
 
diff --git a/docs/codebase.md b/docs/codebase.md
index 3ad857ed..c83b0942 100644
--- a/docs/codebase.md
+++ b/docs/codebase.md
@@ -27,7 +27,7 @@ lets you edit its pages visually:
   assistant so it knows exactly which markup is meant. Making the project
   legible to AI tools is a first-class goal of the design.
 - Pages too complex for the visual model fall back to a code editor with live
-  preview; "New Project…" scaffolds a minimal Astro starter.
+  preview; "Start from Lumos" and "Start from Astro" create a new site.
 
 The product constraint that shapes everything below: Stacki edits files that
 are _also_ edited by hand and by AI assistants in real editors. The source of
diff --git a/electron/handlers/projectHandlers.ts b/electron/handlers/projectHandlers.ts
index aaa4b69c..2d481680 100644
--- a/electron/handlers/projectHandlers.ts
+++ b/electron/handlers/projectHandlers.ts
@@ -1,5 +1,5 @@
 // The project IPC: opening and creating projects (from a dialog, the Astro
-// template, a starter or a scaffold), and installing their dependencies.
+// template or a starter), and installing their dependencies.
 
 import { gitErrorDetail } from '../git/git';
 import { toRecord } from '../../shared/core/record';
@@ -7,7 +7,6 @@ import { assert } from '../../shared/core/assert';
 import * as path from 'path';
 import * as fs from 'fs';
 import { spawn } from 'child_process';
-import { scaffoldProject } from '../project/scaffold';
 import { createStarter, newSiteDirectory } from '../project/starter';
 import { isWin, errorMessage } from '../lib/mainHelpers';
 import { ensureToolPath, run } from '../lib/nodeTools';
@@ -123,12 +122,6 @@ function registerProjectCreateAstroHandlers({
       return result;
     },
   );
-
-  ipcMain.handle('project:scaffold', async (_event, { dir: directory, name }) => {
-    scaffoldProject(directory, name);
-    await installDependencies({ send }, directory);
-    return { ok: true as const };
-  });
 }
 
 export async function installDependencies({ send }: Pick<MainHost, 'send'>, directory: string) {
diff --git a/electron/preload/preloadBridge.ts b/electron/preload/preloadBridge.ts
index 1a5d93bf..7747c061 100644
--- a/electron/preload/preloadBridge.ts
+++ b/electron/preload/preloadBridge.ts
@@ -48,7 +48,6 @@ function projectBridge() {
 
     // Project:
     openProjectDialog: invoke('project:openDialog'),
-    scaffoldProject: invoke('project:scaffold'),
     createAstroProject: invoke('project:createAstro'),
     parentDialog: invoke('project:parentDialog'),
     createStarter: invoke('project:createStarter'),
diff --git a/electron/project/scaffold.ts b/electron/project/scaffold.ts
deleted file mode 100644
index 65e02762..00000000
--- a/electron/project/scaffold.ts
+++ /dev/null
@@ -1,184 +0,0 @@
-// Creates a minimal Astro starter project the visual builder can edit
-// immediately: a base layout, a handful of components with typed props,
-// and an index page.
-
-import fs from 'fs';
-import path from 'path';
-
-const FILES: Record<string, (name: string) => string> = {
-  'package.json': (name) =>
-    JSON.stringify(
-      {
-        name,
-        type: 'module',
-        version: '0.0.1',
-        scripts: {
-          dev: 'astro dev',
-          build: 'astro build',
-          preview: 'astro preview',
-        },
-        dependencies: {
-          astro: '^5.1.1',
-        },
-      },
-      null,
-      2,
-    ) + '\n',
-
-  'astro.config.mjs': () => `import { defineConfig } from 'astro/config';
-
-export default defineConfig({});
-`,
-
-  '.gitignore': () => `node_modules/
-dist/
-.astro/
-`,
-
-  'src/layouts/BaseLayout.astro': () => `---
-interface Props {
-  title?: string;
-  description?: string;
-}
-const { title = 'My Site', description = 'Built with Stacki' } = Astro.props;
----
-<html lang="en">
-  <head>
-    <meta charset="utf-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1" />
-    <meta name="description" content={description} />
-    <title>{title}</title>
-    <style is:global>
-      * { box-sizing: border-box; margin: 0; }
-      body {
-        font-family: system-ui, -apple-system, sans-serif;
-        color: #1a1a2e;
-        background: #fdfdfd;
-        line-height: 1.6;
-      }
-    </style>
-  </head>
-  <body>
-    <slot />
-  </body>
-</html>
-`,
-
-  'src/components/Hero.astro': () => `---
-interface Props {
-  heading?: string;
-  subheading?: string;
-  ctaText?: string;
-  ctaLink?: string;
-}
-const {
-  heading = 'Welcome to your new site',
-  subheading = 'Edit this hero in the visual builder.',
-  ctaText = 'Get Started',
-  ctaLink = '#',
-} = Astro.props;
----
-<section style="padding: 6rem 2rem; text-align: center; \
-background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: white;">
-  <h1 style="font-size: 3rem; margin-bottom: 1rem;">{heading}</h1>
-  <p style="font-size: 1.25rem; opacity: 0.9; margin-bottom: 2rem;">{subheading}</p>
-  <a href={ctaLink} style="display: inline-block; padding: 0.75rem 2rem; background: white; \
-color: #667eea; border-radius: 8px; text-decoration: none; font-weight: 600;">{ctaText}</a>
-</section>
-`,
-
-  'src/components/Feature.astro': () => `---
-interface Props {
-  icon?: string;
-  title?: string;
-  description?: string;
-}
-const {
-  icon = '✨',
-  title = 'Feature title',
-  description = 'Describe this feature here.',
-} = Astro.props;
----
-<div style="max-width: 640px; margin: 0 auto; padding: 2rem; display: flex; gap: 1rem; \
-align-items: flex-start;">
-  <div style="font-size: 2rem;">{icon}</div>
-  <div>
-    <h3 style="font-size: 1.25rem; margin-bottom: 0.25rem;">{title}</h3>
-    <p style="color: #555;">{description}</p>
-  </div>
-</div>
-`,
-
-  'src/components/TextBlock.astro': () => `---
-interface Props {
-  heading?: string;
-  text?: string;
-  align?: string;
-}
-const {
-  heading = '',
-  text = 'Write something here.',
-  align = 'left',
-} = Astro.props;
----
-<section style={\`max-width: 720px; margin: 0 auto; padding: 3rem 2rem; text-align: \${align};\`}>
-  {heading && <h2 style="font-size: 2rem; margin-bottom: 1rem;">{heading}</h2>}
-  <p style="font-size: 1.05rem; color: #444;">{text}</p>
-</section>
-`,
-
-  'src/components/Spacer.astro': () => `---
-interface Props {
-  height?: number;
-}
-const { height = 48 } = Astro.props;
----
-<div style={\`height: \${height}px;\`}></div>
-`,
-
-  'src/components/Footer.astro': () => `---
-interface Props {
-  text?: string;
-}
-const { text = '© 2026 My Site. All rights reserved.' } = Astro.props;
----
-<footer style="padding: 3rem 2rem; text-align: center; color: #888; \
-border-top: 1px solid #eee; margin-top: 4rem;">
-  <p>{text}</p>
-</footer>
-`,
-
-  'src/pages/index.astro': () => `---
-import BaseLayout from '../layouts/BaseLayout.astro';
-import Hero from '../components/Hero.astro';
-import Feature from '../components/Feature.astro';
-import Footer from '../components/Footer.astro';
----
-<BaseLayout title="Home">
-  <Hero heading="Welcome to your new site" \
-subheading="Everything on this page is editable in the visual builder." />
-  <Feature icon="🚀" title="Fast by default" \
-description="Astro ships zero JavaScript unless you ask for it." />
-  <Feature icon="🎨" title="Visually editable" \
-description="Drag components, tweak props, and watch the preview update live." />
-  <Footer />
-</BaseLayout>
-`,
-};
-
-function scaffoldProject(directory: string, name?: string): string {
-  const safeName =
-    (name || path.basename(directory))
-      .toLowerCase()
-      .replace(/[^a-z0-9-]+/g, '-')
-      .replace(/^-+|-+$/g, '') || 'astro-site';
-
-  for (const [rel, gen] of Object.entries(FILES)) {
-    const filePath = path.join(directory, rel);
-    fs.mkdirSync(path.dirname(filePath), { recursive: true });
-    fs.writeFileSync(filePath, gen(safeName), 'utf8');
-  }
-  return directory;
-}
-
-export { scaffoldProject };
diff --git a/shared/ipc/ipcPayloads.ts b/shared/ipc/ipcPayloads.ts
index ee512a18..87c2f1bb 100644
--- a/shared/ipc/ipcPayloads.ts
+++ b/shared/ipc/ipcPayloads.ts
@@ -277,7 +277,6 @@ export const IPC_PAYLOADS = {
   'project:parentDialog': nothing,
   'project:pending': nothing,
   'project:resolveImport': object({ ...source }),
-  'project:scaffold': object({ dir: pathText, name: text }),
   'project:scan': pathText,
   'recents:add': pathText,
   'recents:list': nothing,
diff --git a/shared/ipc/ipcResults.ts b/shared/ipc/ipcResults.ts
index d330e90e..3b9a5efd 100644
--- a/shared/ipc/ipcResults.ts
+++ b/shared/ipc/ipcResults.ts
@@ -597,9 +597,6 @@ export interface IpcResults {
   readonly 'project:resolveImport': {
     readonly path: undefined | string;
   };
-  readonly 'project:scaffold': {
-    readonly ok: true;
-  };
   readonly 'project:scan': {
     readonly pages: ReadonlyArray<{
       readonly path: string;
diff --git a/shared/ipc/preloadApi.ts b/shared/ipc/preloadApi.ts
index 626ea297..f540be13 100644
--- a/shared/ipc/preloadApi.ts
+++ b/shared/ipc/preloadApi.ts
@@ -10,7 +10,6 @@ interface InvokeChannels {
   readonly studioStatus: 'studio:status';
   readonly installStudio: 'studio:install';
   readonly openProjectDialog: 'project:openDialog';
-  readonly scaffoldProject: 'project:scaffold';
   readonly createAstroProject: 'project:createAstro';
   readonly parentDialog: 'project:parentDialog';
   readonly createStarter: 'project:createStarter';
diff --git a/test/electron/app/mainBoundaries.test.ts b/test/electron/app/mainBoundaries.test.ts
index 87b51b98..be60429a 100644
--- a/test/electron/app/mainBoundaries.test.ts
+++ b/test/electron/app/mainBoundaries.test.ts
@@ -62,7 +62,7 @@ test('the complete channel inventory matches real main and terminal registration
   // Account sign-in adds one project-scoped channel for start, status, and cancellation.
   // Published-site discovery has its own channel so remote lookups cannot block local status.
   // Git pull and its background incoming check each have a project-scoped channel.
-  assert.equal(harness.handlers.size, 134);
+  assert.equal(harness.handlers.size, 133);
   assert.equal(terminalChannels.length, 4);
   assert.deepEqual(
     [...Object.keys(IPC_PAYLOADS)].sort(),
diff --git a/test/electron/documents/singleWriter.test.ts b/test/electron/documents/singleWriter.test.ts
index 3622d18e..b6f483a3 100644
--- a/test/electron/documents/singleWriter.test.ts
+++ b/test/electron/documents/singleWriter.test.ts
@@ -99,9 +99,6 @@ const ALLOWED: Readonly<Record<string, Readonly<Record<string, Allowed>>>> = {
       reason: 'generated Studio dev config in node_modules and session metadata ignore rules',
     },
   },
-  'electron/project/scaffold.ts': {
-    writeFileSync: { count: 1, reason: 'a new project, scaffolded before it is opened' },
-  },
   'electron/project/publishReceipt.ts': {
     writeFile: {
       count: 1,

From bf67537ad3d087f133c17f6d8aa3530d1ea50904 Mon Sep 17 00:00:00 2001
From: SylvainDruaux <sydru06@gmail.com>
Date: Sat, 24 Oct 2026 18:21:40 +0200
Subject: [PATCH 2/4] refactor(project): share one create flow: create,
 install, then commit
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The Astro wizard reuses the Lumos runner instead of its own copy, and a stalled scaffolder is stopped after five minutes instead of leaving the wizard stuck on "Creating…".

Both wizards now create the files, install, then make the first commit, so the lockfile is part of it and a new site opens with a clean working tree. create-astro runs with --no-install --no-git, and the site keeps its history even when the install fails.
---
 electron/handlers/projectHandlers.ts  | 97 +++++++++++----------------
 electron/project/starter.ts           | 97 +++++++++++++++++----------
 test/electron/project/starter.test.js |  7 +-
 3 files changed, 106 insertions(+), 95 deletions(-)

diff --git a/electron/handlers/projectHandlers.ts b/electron/handlers/projectHandlers.ts
index 2d481680..a7e509a7 100644
--- a/electron/handlers/projectHandlers.ts
+++ b/electron/handlers/projectHandlers.ts
@@ -6,9 +6,14 @@ import { toRecord } from '../../shared/core/record';
 import { assert } from '../../shared/core/assert';
 import * as path from 'path';
 import * as fs from 'fs';
-import { spawn } from 'child_process';
-import { createStarter, newSiteDirectory } from '../project/starter';
-import { isWin, errorMessage } from '../lib/mainHelpers';
+import {
+  createStarter,
+  newSiteDirectory,
+  runCreateCommand,
+  startSiteHistory,
+  STARTERS,
+} from '../project/starter';
+import { isWin } from '../lib/mainHelpers';
 import { ensureToolPath, run } from '../lib/nodeTools';
 import { isAstroProject } from '../project/projectFiles';
 import { detectPackageManager, installArguments } from '../project/packageManager';
@@ -78,8 +83,8 @@ function registerProjectCreateAstroHandlers({
       '--',
       '--template',
       template,
-      install ? '--install' : '--no-install',
-      git ? '--git' : '--no-git',
+      '--no-install', // Stacki installs, then makes the first commit (finishNewSite).
+      '--no-git',
       ...(ai ? [] : ['--no-ai']),
       '--skip-houston',
       '--yes', // accept defaults for anything not covered above
@@ -87,6 +92,7 @@ function registerProjectCreateAstroHandlers({
 
     send('create:log', `> npm ${args.join(' ')}\n\n`);
     await runCreateAstroInNewFolder({ send }, directory, args);
+    await finishNewSite({ send }, directory, { install, history: git, label: 'Astro' });
     return { ok: true as const, installed: install, projectPath: directory };
   });
 
@@ -116,9 +122,8 @@ function registerProjectCreateAstroHandlers({
         name,
         onLog: (text) => send('create:log', text),
       });
-      send('create:log', '\n> installing dependencies\n');
-      await installDependencies({ send }, result.projectPath);
-      send('progress', PROGRESS_CLEARED);
+      const label = STARTERS[starter]?.label ?? starter;
+      await finishNewSite({ send }, result.projectPath, { install: true, history: true, label });
       return result;
     },
   );
@@ -143,6 +148,27 @@ export async function installDependencies({ send }: Pick<MainHost, 'send'>, dire
   }
 }
 
+// The install comes first, so the site's first commit includes the lockfile. The site gets
+// its history even when the install fails; the install error still reaches the wizard.
+async function finishNewSite(
+  { send }: Pick<MainHost, 'send'>,
+  directory: string,
+  options: { readonly install: boolean; readonly history: boolean; readonly label: string },
+): Promise<void> {
+  const onLog = (text: string): void => send('create:log', text);
+  try {
+    if (options.install) {
+      onLog('\n> installing dependencies\n');
+      await installDependencies({ send }, directory);
+    }
+  } finally {
+    if (options.history) {
+      await startSiteHistory(directory, options.label, onLog);
+    }
+  }
+  send('progress', PROGRESS_CLEARED);
+}
+
 // Clears the progress line: no message (src/ipc/appBridge.ts, onAppProgress). IPC is
 // a structured clone, which keeps the absent value.
 export const PROGRESS_CLEARED = { message: undefined } as const;
@@ -167,57 +193,14 @@ async function runCreateAstroInNewFolder(
 
 // The create-astro run itself, its output streamed to the wizard's log. It
 // settles once the CLI exits and a package.json has landed in `directory`.
-function runCreateAstro(
+async function runCreateAstro(
   { send }: Pick<MainHost, 'send'>,
   directory: string,
   args: readonly string[],
 ): Promise<void> {
-  return new Promise((resolve, reject) => {
-    let proc;
-    try {
-      proc = spawn(isWin ? 'npm.cmd' : 'npm', [...args], {
-        cwd: directory,
-        shell: isWin,
-        env: { ...process.env, FORCE_COLOR: '0', NO_COLOR: '1', CI: '1' },
-      });
-    } catch (error: unknown) {
-      reject(new Error(`Could not run npm: ${errorMessage(error)}`));
-      return;
-    }
-
-    let tail = '';
-    const onOut = (chunk: Buffer) => {
-      // create-astro animates with cursor moves and line clears; strip the
-      // escape codes so the log pane reads as plain text.
-      const text = chunk
-        .toString()
-        .replace(/\x1b\[[0-9;?]*[A-Za-z]/g, '')
-        .replace(/\r/g, '\n');
-      tail = (tail + text).slice(-4000);
-      send('create:log', text);
-    };
-    proc.stdout.on('data', onOut);
-    proc.stderr.on('data', onOut);
-    proc.on('error', (error) => {
-      reject(
-        new Error(
-          toRecord(error)?.['code'] === 'ENOENT'
-            ? 'npm could not be found. Install Node.js (which includes npm) and try again.'
-            : `Could not run npm: ${errorMessage(error)}`,
-        ),
-      );
-    });
-    proc.on('exit', (code) => {
-      if (code === 0) {
-        // Sanity-check that a project actually landed.
-        if (!fs.existsSync(path.join(directory, 'package.json'))) {
-          reject(new Error(`create-astro finished but no package.json appeared.\n\n${tail}`));
-          return;
-        }
-        resolve();
-      } else {
-        reject(new Error(`create-astro exited with code ${code}.\n\n${tail}`));
-      }
-    });
-  });
+  const npm = isWin ? 'npm.cmd' : 'npm';
+  await runCreateCommand(npm, args, directory, (text) => send('create:log', text));
+  if (!fs.existsSync(path.join(directory, 'package.json'))) {
+    throw new Error('create-astro finished but no package.json appeared.');
+  }
 }
diff --git a/electron/project/starter.ts b/electron/project/starter.ts
index c2d3deae..f01c03c1 100644
--- a/electron/project/starter.ts
+++ b/electron/project/starter.ts
@@ -4,6 +4,7 @@ import { spawn } from 'child_process';
 
 import { toRecord } from '../../shared/core/record';
 import { commandNeedsShell } from '../lib/platform';
+import { stopProcessTree } from '../lib/nodeTools';
 
 // Starting a site from a starter.
 //
@@ -39,6 +40,10 @@ const NAME_RE = /^[A-Za-z0-9._-]+$/;
 
 type OnLog = (text: string) => void;
 
+// A scaffolder only downloads a template, so a run this long has stalled, and the wizard
+// cannot be closed while it waits.
+const RUN_TIMEOUT_MS = 5 * 60 * 1000;
+
 const run = (cmd: string, args: readonly string[], cwd: string, onLog?: OnLog): Promise<string> =>
   new Promise((resolve, reject) => {
     let proc;
@@ -47,6 +52,8 @@ const run = (cmd: string, args: readonly string[], cwd: string, onLog?: OnLog):
         cwd,
         // On Windows npm is a .cmd shim, which needs a shell to be found.
         shell: commandNeedsShell(cmd),
+        // Its own process group, so a stalled run is stopped with what it started.
+        detached: !isWin,
         env: {
           ...process.env,
           GIT_TERMINAL_PROMPT: '0',
@@ -63,6 +70,13 @@ const run = (cmd: string, args: readonly string[], cwd: string, onLog?: OnLog):
       );
       return;
     }
+    const child = proc;
+    const timer = setTimeout(() => {
+      stopProcessTree(child);
+      reject(
+        new Error(`${path.basename(cmd)} ${args[0] ?? ''} took over 5 minutes and was stopped.`),
+      );
+    }, RUN_TIMEOUT_MS);
     let tail = '';
     const onOut = (chunk: { toString(): string }): void => {
       // Progress spinners are drawn with cursor moves and line clears; strip
@@ -77,6 +91,7 @@ const run = (cmd: string, args: readonly string[], cwd: string, onLog?: OnLog):
     proc.stdout.on('data', onOut);
     proc.stderr.on('data', onOut);
     proc.on('error', (error: Error) => {
+      clearTimeout(timer);
       const code = toRecord(error)?.['code'];
       reject(
         new Error(
@@ -88,11 +103,14 @@ const run = (cmd: string, args: readonly string[], cwd: string, onLog?: OnLog):
         ),
       );
     });
-    proc.on('exit', (code) =>
-      code === 0
-        ? resolve(tail)
-        : reject(new Error(`${cmd} ${args[0] ?? ''} exited with code ${code}.\n\n${tail}`)),
-    );
+    proc.on('exit', (code) => {
+      clearTimeout(timer);
+      if (code === 0) {
+        resolve(tail);
+      } else {
+        reject(new Error(`${cmd} ${args[0] ?? ''} exited with code ${code}.\n\n${tail}`));
+      }
+    });
   });
 
 interface CreateStarterOptions {
@@ -105,8 +123,8 @@ interface CreateStarterOptions {
 }
 
 /**
- * Runs a starter's scaffolder in `parentPath` to make `parentPath/name`, then
- * gives the site a history of its own. Installing what it needs is the
+ * Runs a starter's scaffolder in `parentPath` to make `parentPath/name`.
+ * Installing what it needs and its first commit (`startSiteHistory`) are the
  * caller's — this is the part that has to be right before anything is
  * installed into it.
  */
@@ -149,37 +167,44 @@ async function createStarter({
     /* an unusual package.json is not worth failing the site over */
   }
 
+  return { ok: true, projectPath: directory };
+}
+
+/**
+ * Gives a new site a history of its own: one commit of the site as it stands.
+ * The caller runs it after the install, so the lockfile is part of that commit.
+ */
+async function startSiteHistory(directory: string, label: string, onLog?: OnLog): Promise<void> {
   // A scaffolder that started a history of its own has already done this, and
   // its first commit is the one to keep.
-  if (!fs.existsSync(path.join(directory, '.git'))) {
-    onLog?.('\n> starting a history for this site\n');
-    try {
-      await run('git', ['init', '-b', 'main'], directory);
-      await run('git', ['add', '-A'], directory);
-      // A first-time Git installation has no author configured yet. Give only
-      // this generated commit a neutral identity; do not change the user's
-      // repository or global configuration behind their back.
-      await run(
-        'git',
-        [
-          '-c',
-          'user.name=Stacki',
-          '-c',
-          'user.email=stacki@local.invalid',
-          'commit',
-          '-m',
-          `Start ${folder} from ${template.label}`,
-        ],
-        directory,
-      );
-    } catch (error: unknown) {
-      // A site with no git still runs; say so rather than throwing it away.
-      const reason = error instanceof Error ? error.message : String(error);
-      onLog?.(`\n(could not start a git history: ${reason})\n`);
-    }
+  if (fs.existsSync(path.join(directory, '.git'))) {
+    return;
+  }
+  onLog?.('\n> starting a history for this site\n');
+  try {
+    await run('git', ['init', '-b', 'main'], directory);
+    await run('git', ['add', '-A'], directory);
+    // A first-time Git installation has no author configured yet. Give only
+    // this generated commit a neutral identity; do not change the user's
+    // repository or global configuration behind their back.
+    await run(
+      'git',
+      [
+        '-c',
+        'user.name=Stacki',
+        '-c',
+        'user.email=stacki@local.invalid',
+        'commit',
+        '-m',
+        `Start ${path.basename(directory)} from ${label}`,
+      ],
+      directory,
+    );
+  } catch (error: unknown) {
+    // A site with no git still runs; say so rather than throwing it away.
+    const reason = error instanceof Error ? error.message : String(error);
+    onLog?.(`\n(could not start a git history: ${reason})\n`);
   }
-
-  return { ok: true, projectPath: directory };
 }
 
 /**
@@ -205,4 +230,4 @@ function newSiteDirectory(parentPath: string | undefined, name: string | undefin
   return directory;
 }
 
-export { createStarter, newSiteDirectory, STARTERS };
+export { createStarter, newSiteDirectory, run as runCreateCommand, startSiteHistory, STARTERS };
diff --git a/test/electron/project/starter.test.js b/test/electron/project/starter.test.js
index cf8802aa..daab8e53 100644
--- a/test/electron/project/starter.test.js
+++ b/test/electron/project/starter.test.js
@@ -18,7 +18,7 @@ const fs = require('fs');
 const os = require('os');
 const path = require('path');
 const { execFileSync } = require('child_process');
-const { createStarter, STARTERS } = require('#dist/electron/project/starter.js');
+const { createStarter, startSiteHistory, STARTERS } = require('#dist/electron/project/starter.js');
 
 const failures = [];
 let checked = 0;
@@ -142,7 +142,9 @@ console.log('Ready.');
   check('the package takes the site name', pkg.name === 'my-site', pkg.name);
   check('and keeps everything else', pkg.dependencies?.astro === '^7.1.4');
 
-  // The history is theirs.
+  // The history is theirs, started by the caller once the install is done.
+  check('creating leaves the history to the caller', !fs.existsSync(path.join(directory, '.git')));
+  await startSiteHistory(directory, 'Lumos', (text) => log.push(text));
   check('it is a git repository', fs.existsSync(path.join(directory, '.git')));
   const commits = git(directory, ['rev-list', '--count', 'HEAD']).trim();
   check('starting at one commit', commits === '1', `${commits} commits`);
@@ -238,6 +240,7 @@ g('-c', 'user.email=t@t', '-c', 'user.name=T',
 `,
     );
     const own = await createStarter({ npm: withGit, parentPath: parent, name: 'has-history' });
+    await startSiteHistory(own.projectPath, 'Lumos');
     check(
       "the scaffolder's own first commit is left alone",
       /Initial commit from the scaffolder/.test(git(own.projectPath, ['log', '-1', '--pretty=%s'])),

From 0fc69b0d8d51e2767a99f2861db9296d00e4323c Mon Sep 17 00:00:00 2001
From: SylvainDruaux <sydru06@gmail.com>
Date: Sat, 24 Oct 2026 18:50:04 +0200
Subject: [PATCH 3/4] feat(welcome): animate dots after the create log's last
 line

Installs and downloads can print nothing for a long time, so while the wizard runs, dots animate after the log's last line, as a terminal shows work in progress.
---
 src/app/styles.css                      | 14 ++++++++++++++
 src/features/welcome/WelcomeWizards.tsx | 13 ++++++++++---
 test/renderer/welcome/welcome.test.js   | 17 +++++++++++++++--
 3 files changed, 39 insertions(+), 5 deletions(-)

diff --git a/src/app/styles.css b/src/app/styles.css
index e6860e0d..77890ce3 100644
--- a/src/app/styles.css
+++ b/src/app/styles.css
@@ -4628,6 +4628,20 @@ body > .embed-editor_provenance {
   margin: 0;
   flex-shrink: 0;
 }
+/* Dots after the log's last line: none, one, two, three, as a terminal shows work. */
+.create-log-dots::after {
+  content: '...';
+  display: inline-block;
+  width: 0;
+  overflow: hidden;
+  vertical-align: bottom;
+  animation: create-log-dots 1.2s steps(4) infinite;
+}
+@keyframes create-log-dots {
+  to {
+    width: 4ch;
+  }
+}
 .create-log {
   max-height: 260px;
   overflow: auto;
diff --git a/src/features/welcome/WelcomeWizards.tsx b/src/features/welcome/WelcomeWizards.tsx
index acc96c84..bc968691 100644
--- a/src/features/welcome/WelcomeWizards.tsx
+++ b/src/features/welcome/WelcomeWizards.tsx
@@ -82,7 +82,9 @@ export function StarterWizard({
         Runs <code>npm create lumos@latest</code>, then starts a git history of its own — so
         publishing it later publishes your site, not a fork of the starter.
       </div>
-      {(running || log.text) && <CreateLog log={log.text} elementRef={log.elementRef} />}
+      {(running || log.text) && (
+        <CreateLog log={log.text} running={running} elementRef={log.elementRef} />
+      )}
       {state.kind === 'error' && <ErrorToast message={state.message} />}
     </WizardFrame>
   );
@@ -149,7 +151,7 @@ export function NewProjectWizard({
         />
       )}
       {state.kind !== 'idle' && (
-        <CreateLog log={log.text || 'Starting…'} elementRef={log.elementRef} />
+        <CreateLog log={log.text || 'Starting…'} running={running} elementRef={log.elementRef} />
       )}
       {state.kind === 'error' && <ErrorToast message={state.message} />}
     </WizardFrame>
@@ -304,16 +306,21 @@ function CheckRow({
   );
 }
 
+// While it runs, dots animate after the last line, as a terminal shows work in progress:
+// installs and downloads can print nothing for a long time.
 function CreateLog({
   log,
+  running,
   elementRef,
 }: {
   readonly log: string;
+  readonly running: boolean;
   readonly elementRef: React.RefObject<HTMLPreElement>;
 }) {
   return (
     <pre className="create-log" ref={elementRef}>
-      {log}
+      {running ? log.trimEnd() : log}
+      {running && <span className="create-log-dots" aria-label="Working" />}
     </pre>
   );
 }
diff --git a/test/renderer/welcome/welcome.test.js b/test/renderer/welcome/welcome.test.js
index 38a63e71..f85f371f 100644
--- a/test/renderer/welcome/welcome.test.js
+++ b/test/renderer/welcome/welcome.test.js
@@ -292,9 +292,13 @@ const PIXEL =
   {
     dom.window.avb.parentDialog = async () => ({ canceled: false, parentPath: '/tmp/sites' });
     const created = [];
-    dom.window.avb.createAstroProject = async (payload) => {
+    let finish = () => {};
+    // Held open until `finish`, so the test can look at the wizard while it runs.
+    dom.window.avb.createAstroProject = (payload) => {
       created.push(payload);
-      return { ok: true, installed: true, projectPath: '/tmp/sites/blog-site' };
+      return new Promise((resolve) => {
+        finish = () => resolve({ ok: true, installed: true, projectPath: '/tmp/sites/blog-site' });
+      });
     };
     await act(async () => all('.actions button')[3].click());
     await act(async () => {
@@ -333,6 +337,15 @@ const PIXEL =
       create().click();
       await settle(30);
     });
+    check(
+      'while it runs, dots animate after the last line of the log',
+      !!wizard.querySelector('.create-log .create-log-dots'),
+      wizard.querySelector('.create-log')?.outerHTML,
+    );
+    await act(async () => {
+      finish();
+      await settle(30);
+    });
     check(
       'creating sends the parent folder and the name, not a folder of its own',
       created.length === 1 &&

From fdef3a70f83a11a45c5ac67171ae690542bbfac1 Mon Sep 17 00:00:00 2001
From: SylvainDruaux <sydru06@gmail.com>
Date: Sat, 24 Oct 2026 20:30:04 +0200
Subject: [PATCH 4/4] feat(welcome): choose npm or pnpm when creating a project

Both wizards ask which package manager installs the new site, npm by default. Stacki checks it is installed before creating anything, removes the starter's npm lockfile when pnpm is chosen, and installs with it before the first commit. Yarn and Bun can follow once they have been tested.
---
 electron/handlers/projectHandlers.ts         | 61 +++++++++++++++++---
 shared/ipc/ipcPayloads.ts                    |  9 ++-
 shared/properties/packageManager.ts          | 13 +++++
 src/app/styles.css                           |  6 +-
 src/features/welcome/WelcomeWizards.tsx      | 56 ++++++++++++++++--
 src/features/welcome/welcomeBridge.ts        | 10 +++-
 test/electron/project/packageManager.test.ts | 25 ++++++++
 test/renderer/app/viteModules.test.ts        |  3 +-
 test/renderer/welcome/welcome.test.js        | 33 +++++++++++
 9 files changed, 200 insertions(+), 16 deletions(-)

diff --git a/electron/handlers/projectHandlers.ts b/electron/handlers/projectHandlers.ts
index a7e509a7..a49910aa 100644
--- a/electron/handlers/projectHandlers.ts
+++ b/electron/handlers/projectHandlers.ts
@@ -6,6 +6,7 @@ import { toRecord } from '../../shared/core/record';
 import { assert } from '../../shared/core/assert';
 import * as path from 'path';
 import * as fs from 'fs';
+import * as os from 'os';
 import {
   createStarter,
   newSiteDirectory,
@@ -17,6 +18,7 @@ import { isWin } from '../lib/mainHelpers';
 import { ensureToolPath, run } from '../lib/nodeTools';
 import { isAstroProject } from '../project/projectFiles';
 import { detectPackageManager, installArguments } from '../project/packageManager';
+import { packageManagerLabel, type PackageManager } from '../../shared/properties/packageManager';
 import type { MainHost } from './mainHost';
 
 export function registerProjectHandlers(
@@ -24,6 +26,7 @@ export function registerProjectHandlers(
 ): void {
   registerProjectOpenDialogHandlers(host);
   registerProjectCreateAstroHandlers(host);
+  registerProjectCreateStarterHandlers(host);
 }
 
 function registerProjectOpenDialogHandlers({
@@ -71,9 +74,13 @@ function registerProjectCreateAstroHandlers({
       install = true,
       git = true,
       ai = false,
+      packageManager = 'npm',
     } = options || {};
     const directory = newSiteDirectory(parentPath, name);
     ensureToolPath(); // npm is a Node shim — same PATH problem as astro
+    if (install) {
+      await requirePackageManager(packageManager);
+    }
     fs.mkdirSync(directory);
 
     const args = [
@@ -92,7 +99,12 @@ function registerProjectCreateAstroHandlers({
 
     send('create:log', `> npm ${args.join(' ')}\n\n`);
     await runCreateAstroInNewFolder({ send }, directory, args);
-    await finishNewSite({ send }, directory, { install, history: git, label: 'Astro' });
+    await finishNewSite({ send }, directory, {
+      install,
+      manager: packageManager,
+      history: git,
+      label: 'Astro',
+    });
     return { ok: true as const, installed: install, projectPath: directory };
   });
 
@@ -108,14 +120,20 @@ function registerProjectCreateAstroHandlers({
     }
     return { canceled: false as const, parentPath: result.filePaths[0] };
   });
+}
 
+function registerProjectCreateStarterHandlers({
+  ipcMain,
+  send,
+}: Pick<MainHost, 'ipcMain' | 'send'>): void {
   // Starting from a starter. The scaffolder, the first commit and the package's
   // name are in ./starter.js; what is here is the install that follows and the
   // log the wizard reads.
   ipcMain.handle(
     'project:createStarter',
-    async (_event, { starter = 'lumos', parentPath, name }) => {
+    async (_event, { starter = 'lumos', parentPath, name, packageManager = 'npm' }) => {
       ensureToolPath(); // npm and git are both on the PATH the Dock does not have
+      await requirePackageManager(packageManager);
       const result = await createStarter({
         starter,
         parentPath,
@@ -123,15 +141,23 @@ function registerProjectCreateAstroHandlers({
         onLog: (text) => send('create:log', text),
       });
       const label = STARTERS[starter]?.label ?? starter;
-      await finishNewSite({ send }, result.projectPath, { install: true, history: true, label });
+      await finishNewSite({ send }, result.projectPath, {
+        install: true,
+        manager: packageManager,
+        history: true,
+        label,
+      });
       return result;
     },
   );
 }
 
-export async function installDependencies({ send }: Pick<MainHost, 'send'>, directory: string) {
+export async function installDependencies(
+  { send }: Pick<MainHost, 'send'>,
+  directory: string,
+  pm: PackageManager = detectPackageManager(directory),
+) {
   ensureToolPath(); // npm/pnpm/yarn are Node shims — same PATH problem as astro
-  const pm = detectPackageManager(directory);
   send('progress', { message: `Installing dependencies (${pm} install)…` });
   try {
     await run(isWin ? `${pm}.cmd` : pm, [...installArguments(pm)], directory, {
@@ -148,18 +174,37 @@ export async function installDependencies({ send }: Pick<MainHost, 'send'>, dire
   }
 }
 
+// A new site is only started when its manager can install it, so a missing one fails before
+// any folder exists. On Windows a missing command fails without ENOENT, so any failure counts.
+async function requirePackageManager(manager: PackageManager): Promise<void> {
+  try {
+    await run(isWin ? `${manager}.cmd` : manager, ['--version'], os.homedir());
+  } catch {
+    throw new Error(`${packageManagerLabel(manager)} is not installed. Install it or choose npm.`);
+  }
+}
+
 // The install comes first, so the site's first commit includes the lockfile. The site gets
 // its history even when the install fails; the install error still reaches the wizard.
 async function finishNewSite(
   { send }: Pick<MainHost, 'send'>,
   directory: string,
-  options: { readonly install: boolean; readonly history: boolean; readonly label: string },
+  options: {
+    readonly install: boolean;
+    readonly manager: PackageManager;
+    readonly history: boolean;
+    readonly label: string;
+  },
 ): Promise<void> {
   const onLog = (text: string): void => send('create:log', text);
   try {
     if (options.install) {
-      onLog('\n> installing dependencies\n');
-      await installDependencies({ send }, directory);
+      // A starter's npm lockfile would sit beside the chosen manager's own and misname it.
+      if (options.manager !== 'npm') {
+        fs.rmSync(path.join(directory, 'package-lock.json'), { force: true });
+      }
+      onLog(`\n> installing dependencies with ${packageManagerLabel(options.manager)}\n`);
+      await installDependencies({ send }, directory, options.manager);
     }
   } finally {
     if (options.history) {
diff --git a/shared/ipc/ipcPayloads.ts b/shared/ipc/ipcPayloads.ts
index 87c2f1bb..c9279aec 100644
--- a/shared/ipc/ipcPayloads.ts
+++ b/shared/ipc/ipcPayloads.ts
@@ -5,6 +5,7 @@ import { parseCanvasCreate, defaultsCanvasFile } from '../properties/defaultsCan
 import { parseDiscoveryRequest } from '../properties/publishDiscovery';
 import { parsePublishCommitMessage, parsePublishTarget } from '../properties/publishConfig';
 import { metadataKind, parseMetadataWrite } from '../properties/projectMetadata';
+import { parseCreatePackageManager } from '../properties/packageManager';
 import { parseImageFormat, parseImagePath } from './assetConversion';
 import { parseGitHubRepository } from './githubRepository';
 import { parseCommitDiffRequest } from './gitCommitDiff';
@@ -270,8 +271,14 @@ export const IPC_PAYLOADS = {
     install: maybeFlag,
     git: maybeFlag,
     ai: maybeFlag,
+    packageManager: optional(parseCreatePackageManager),
+  }),
+  'project:createStarter': object({
+    starter: optional(text),
+    parentPath: pathText,
+    name: text,
+    packageManager: optional(parseCreatePackageManager),
   }),
-  'project:createStarter': object({ starter: optional(text), parentPath: pathText, name: text }),
   'project:injectedRoutes': object({ ...project }),
   'project:openDialog': nothing,
   'project:parentDialog': nothing,
diff --git a/shared/properties/packageManager.ts b/shared/properties/packageManager.ts
index e22aa6f6..39b1ca1e 100644
--- a/shared/properties/packageManager.ts
+++ b/shared/properties/packageManager.ts
@@ -4,8 +4,21 @@
 export const PACKAGE_MANAGERS = ['npm', 'pnpm', 'yarn', 'bun'] as const;
 export type PackageManager = (typeof PACKAGE_MANAGERS)[number];
 
+// The managers a new site can be created with: those tested end to end so far. Yarn's newer
+// versions skip node_modules by default, which the preview has not been checked against.
+export const CREATE_PACKAGE_MANAGERS = ['npm', 'pnpm'] as const satisfies readonly PackageManager[];
+export type CreatePackageManager = (typeof CREATE_PACKAGE_MANAGERS)[number];
+
 const FIELD_CHARS_MAX = 256;
 
+export function parseCreatePackageManager(input: unknown): CreatePackageManager {
+  const manager = CREATE_PACKAGE_MANAGERS.find((candidate) => candidate === input);
+  if (manager === undefined) {
+    throw new Error(`Package manager: expected ${CREATE_PACKAGE_MANAGERS.join(' or ')}`);
+  }
+  return manager;
+}
+
 // The name people know each manager by, for messages.
 export function packageManagerLabel(manager: PackageManager): string {
   switch (manager) {
diff --git a/src/app/styles.css b/src/app/styles.css
index 77890ce3..76b94457 100644
--- a/src/app/styles.css
+++ b/src/app/styles.css
@@ -8207,12 +8207,16 @@ textarea::selection {
 /* Start from a template: a name, where it goes, and what that means. */
 /* Beats `.modal-body label { display: block }`, which would drop the gap and leave the
    field's name jammed against its input. The gap matches the template question's 6px. */
-.modal-body label.starter-field {
+.modal-body .starter-field {
   display: flex;
   flex-direction: column;
   gap: 6px;
   margin-bottom: 0;
 }
+/* Picking an option refocuses the dropdown; only keyboard focus needs the accent border. */
+.starter-field .dd-trigger:focus:not(:focus-visible) {
+  border-color: transparent;
+}
 .starter-field > span {
   font-size: 11.5px;
   color: var(--text-dim);
diff --git a/src/features/welcome/WelcomeWizards.tsx b/src/features/welcome/WelcomeWizards.tsx
index bc968691..67c74367 100644
--- a/src/features/welcome/WelcomeWizards.tsx
+++ b/src/features/welcome/WelcomeWizards.tsx
@@ -7,6 +7,12 @@ import {
   subscribeCreateLog,
   type ProjectTemplate,
 } from './welcomeBridge';
+import {
+  CREATE_PACKAGE_MANAGERS,
+  packageManagerLabel,
+  type CreatePackageManager,
+} from '../../../shared/properties/packageManager';
+import Dropdown from '../../ui/Dropdown';
 
 const CREATE_LOG_CHARS_MAX = 20_000;
 const SITE_NAME_DEFAULT = 'my-site';
@@ -38,6 +44,7 @@ export function StarterWizard({
   onDone,
 }: WizardProps & { readonly parentPath: string }) {
   const [name, setName] = useState(SITE_NAME_DEFAULT);
+  const [manager, setManager] = useState<CreatePackageManager>('npm');
   const [state, setState] = useState<RunState>({ kind: 'idle' });
   const log = useCreateLog();
   const cleanName = name.trim();
@@ -46,7 +53,7 @@ export function StarterWizard({
   const run = async (): Promise<void> => {
     setState({ kind: 'running' });
     log.clear();
-    const result = await createStarterProject(parentPath, cleanName);
+    const result = await createStarterProject(parentPath, cleanName, manager);
     if (!result.ok) {
       setState({ kind: 'error', message: result.error });
     } else if (!result.value.ok) {
@@ -78,9 +85,16 @@ export function StarterWizard({
         change={setName}
         submit={() => void run()}
       />
+      <PackageManagerField value={manager} disabled={running} change={setManager} />
       <div className="starter-note">
-        Runs <code>npm create lumos@latest</code>, then starts a git history of its own — so
-        publishing it later publishes your site, not a fork of the starter.
+        Runs <code>npm create lumos@latest</code>
+        {manager !== 'npm' && (
+          <>
+            , installs it with <code>{manager}</code>
+          </>
+        )}
+        , then starts a git history of its own — so publishing it later publishes your site, not a
+        fork of the starter.
       </div>
       {(running || log.text) && (
         <CreateLog log={log.text} running={running} elementRef={log.elementRef} />
@@ -100,6 +114,7 @@ export function NewProjectWizard({
   const [install, setInstall] = useState(true);
   const [git, setGit] = useState(true);
   const [ai, setAi] = useState(false);
+  const [packageManager, setPackageManager] = useState<CreatePackageManager>('npm');
   const [state, setState] = useState<RunState>({ kind: 'idle' });
   const log = useCreateLog();
   const running = state.kind === 'running';
@@ -107,7 +122,7 @@ export function NewProjectWizard({
   const run = async (): Promise<void> => {
     setState({ kind: 'running' });
     log.clear();
-    const options = { parentPath, name: name.trim(), template, install, git, ai };
+    const options = { parentPath, name: name.trim(), template, install, git, ai, packageManager };
     const result = await createAstroProject(options);
     if (result.ok) {
       onDone(result.value.projectPath);
@@ -144,6 +159,8 @@ export function NewProjectWizard({
           install={install}
           git={git}
           ai={ai}
+          manager={packageManager}
+          setManager={setPackageManager}
           setTemplate={setTemplate}
           setInstall={setInstall}
           setGit={setGit}
@@ -205,6 +222,30 @@ function SiteNameField(props: {
   );
 }
 
+// The manager that installs the new site. The main process checks it is installed first.
+function PackageManagerField(props: {
+  readonly value: CreatePackageManager;
+  readonly disabled: boolean;
+  readonly change: (manager: CreatePackageManager) => void;
+}) {
+  return (
+    <div className="starter-field">
+      <span>Package manager</span>
+      <Dropdown
+        ariaLabel="Package manager"
+        value={props.value}
+        disabled={props.disabled}
+        livePreview={false}
+        options={CREATE_PACKAGE_MANAGERS.map((manager) => ({
+          value: manager,
+          label: packageManagerLabel(manager),
+        }))}
+        onChange={props.change}
+      />
+    </div>
+  );
+}
+
 function useCreateLog() {
   const [text, setText] = useState('');
   const elementRef = useRef<HTMLPreElement>(null);
@@ -254,6 +295,8 @@ interface ProjectChoicesProps {
   readonly install: boolean;
   readonly git: boolean;
   readonly ai: boolean;
+  readonly manager: CreatePackageManager;
+  readonly setManager: (manager: CreatePackageManager) => void;
   readonly setTemplate: (template: ProjectTemplate) => void;
   readonly setInstall: (value: boolean) => void;
   readonly setGit: (value: boolean) => void;
@@ -278,6 +321,11 @@ function ProjectChoices(props: ProjectChoicesProps) {
           ))}
         </div>
       </div>
+      <PackageManagerField
+        value={props.manager}
+        disabled={!props.install}
+        change={props.setManager}
+      />
       <CheckRow label="Install dependencies" checked={props.install} change={props.setInstall} />
       <CheckRow label="Initialize a new git repository" checked={props.git} change={props.setGit} />
       <CheckRow label="Add AI agent files" checked={props.ai} change={props.setAi} />
diff --git a/src/features/welcome/welcomeBridge.ts b/src/features/welcome/welcomeBridge.ts
index fde5ba70..dd88cdde 100644
--- a/src/features/welcome/welcomeBridge.ts
+++ b/src/features/welcome/welcomeBridge.ts
@@ -11,6 +11,7 @@ import {
 } from '../../../shared/core/boundary';
 import { parseIpcPayload } from '../../../shared/ipc/ipcPayloads';
 import type { Result } from '../../../shared/core/result';
+import type { CreatePackageManager } from '../../../shared/properties/packageManager';
 import { cleanError } from '../../lib/cleanError';
 
 export type RecentProject = IpcResults['recents:list'][number];
@@ -26,6 +27,7 @@ export interface AstroProjectOptions {
   readonly install: boolean;
   readonly git: boolean;
   readonly ai: boolean;
+  readonly packageManager: CreatePackageManager;
 }
 
 export function parseRecentProjects(input: unknown): readonly RecentProject[] {
@@ -93,11 +95,16 @@ export function chooseStarterParent() {
   return welcomeRequest(parseParentDialog, () => window.avb.parentDialog(payload));
 }
 
-export function createStarterProject(parentPath: string, name: string) {
+export function createStarterProject(
+  parentPath: string,
+  name: string,
+  packageManager: CreatePackageManager,
+) {
   const payload = parseIpcPayload('project:createStarter', {
     starter: 'lumos',
     parentPath,
     name,
+    packageManager,
   });
   return welcomeRequest(parseStarterResult, () => window.avb.createStarter(payload));
 }
@@ -110,6 +117,7 @@ export function createAstroProject(options: AstroProjectOptions) {
     install: options.install,
     git: options.git,
     ai: options.ai,
+    packageManager: options.packageManager,
   });
   return welcomeRequest(parseAstroResult, () => window.avb.createAstroProject(payload));
 }
diff --git a/test/electron/project/packageManager.test.ts b/test/electron/project/packageManager.test.ts
index a1ad8d3a..58f0f5fb 100644
--- a/test/electron/project/packageManager.test.ts
+++ b/test/electron/project/packageManager.test.ts
@@ -1,5 +1,6 @@
 // Goal: a project's package manager comes from package.json's packageManager field when it
 // names one Stacki runs, then from its lockfile, then npm; each installs with its own command.
+// A new site is created only with a manager from the tested list, at the IPC boundary too.
 // Method: parse valid, versioned, unknown, malformed and oversized fields, then detect inside
 // temporary project folders that combine fields and lockfiles, and pin each install command.
 // Nothing is installed.
@@ -10,10 +11,19 @@ import { tmpdir } from 'node:os';
 import path from 'node:path';
 import { detectPackageManager, installArguments } from '#dist/electron/project/packageManager.js';
 import {
+  CREATE_PACKAGE_MANAGERS,
   PACKAGE_MANAGERS,
   packageManagerLabel,
+  parseCreatePackageManager,
   parsePackageManagerField,
 } from '#dist/shared/properties/packageManager.js';
+import { parseIpcPayload } from '#dist/shared/ipc/ipcPayloads.js';
+
+const starter = (packageManager: string | undefined) => ({
+  parentPath: '/tmp/sites',
+  name: 'my-site',
+  ...(packageManager === undefined ? {} : { packageManager }),
+});
 
 async function project(context: TestContext, files: Readonly<Record<string, string>>) {
   const directory = await mkdtemp(path.join(tmpdir(), 'stacki-package-manager-'));
@@ -46,6 +56,21 @@ test('the packageManager field names nothing when unknown, malformed or oversize
   }
 });
 
+test('a new site can be created with npm or pnpm, and nothing else yet', () => {
+  assert.deepEqual(CREATE_PACKAGE_MANAGERS, ['npm', 'pnpm']);
+  assert.equal(parseCreatePackageManager('npm'), 'npm');
+  assert.equal(parseCreatePackageManager('pnpm'), 'pnpm');
+  for (const input of [undefined, 7, '', 'yarn', 'bun', 'PNPM', ' npm']) {
+    assert.throws(() => parseCreatePackageManager(input), /expected npm or pnpm/, String(input));
+  }
+  assert.equal(parseIpcPayload('project:createStarter', starter('pnpm')).packageManager, 'pnpm');
+  assert.equal(
+    parseIpcPayload('project:createStarter', starter(undefined)).packageManager,
+    undefined,
+  );
+  assert.throws(() => parseIpcPayload('project:createStarter', starter('yarn')), /npm or pnpm/);
+});
+
 test('each package manager installs dependencies with its own command', () => {
   assert.deepEqual(installArguments('npm'), ['install', '--no-audit', '--no-fund']);
   assert.deepEqual(installArguments('pnpm'), ['install', '--config.strict-dep-builds=false']);
diff --git a/test/renderer/app/viteModules.test.ts b/test/renderer/app/viteModules.test.ts
index 4de9c917..eb0fc184 100644
--- a/test/renderer/app/viteModules.test.ts
+++ b/test/renderer/app/viteModules.test.ts
@@ -14,7 +14,8 @@ import { createServer, type ViteDevServer } from 'vite';
 // Includes publishing, project metadata, defaults-canvas, and history payload parsers.
 // The graph includes the package-source and review-receipt contracts alongside account sign-in.
 // The validated merge-result payload adds one module to the 47-module graph.
-const MODULES_MAX = 48;
+// The package manager a new site is created with adds one more.
+const MODULES_MAX = 49;
 // Repository paths; the dev server serves each at `/<path>`.
 const ENTRY_MODULES: ReadonlyArray<{ readonly file: string; readonly exportName: string }> = [
   { file: 'src/lib/cleanError.ts', exportName: 'cleanError' },
diff --git a/test/renderer/welcome/welcome.test.js b/test/renderer/welcome/welcome.test.js
index f85f371f..a94dbe3a 100644
--- a/test/renderer/welcome/welcome.test.js
+++ b/test/renderer/welcome/welcome.test.js
@@ -270,6 +270,19 @@ const PIXEL =
       !!wizard?.querySelector('input') && /\/tmp\/sites\/my-site/.test(wizard?.textContent || ''),
       wizard?.textContent?.slice(0, 200),
     );
+    const note = () => wizard.querySelector('.starter-note')?.textContent || '';
+    check(
+      'with npm, the note names only the command it runs',
+      note().startsWith('Runs npm create lumos@latest, then starts a git history'),
+      note(),
+    );
+    await act(async () => wizard.querySelector('.dd-trigger').click());
+    await act(async () => dom.window.document.querySelectorAll('.dd-option')[1].click());
+    check(
+      'with pnpm, it also says pnpm installs it',
+      note().startsWith('Runs npm create lumos@latest, installs it with pnpm, then starts'),
+      note(),
+    );
 
     // Cancelling the folder dialog leaves the screen where it was.
     await act(async () => {
@@ -333,10 +346,30 @@ const PIXEL =
       );
       input.dispatchEvent(new dom.window.Event('input', { bubbles: true }));
     });
+    const trigger = wizard.querySelector('.dd-trigger');
+    check(
+      'the package manager is npm by default',
+      trigger?.textContent === 'npm',
+      trigger?.outerHTML,
+    );
+    await act(async () => trigger.click());
+    const managers = [...dom.window.document.querySelectorAll('.dd-option')];
+    check(
+      'and offers npm and pnpm',
+      managers.map((option) => option.textContent).join() === 'npm,pnpm',
+      managers.map((option) => option.textContent).join(),
+    );
+    await act(async () => managers[1].click());
+    check('picking pnpm shows it', trigger?.textContent === 'pnpm', trigger?.textContent);
     await act(async () => {
       create().click();
       await settle(30);
     });
+    check(
+      'and the one chosen is sent with the site',
+      created[0]?.packageManager === 'pnpm',
+      JSON.stringify(created),
+    );
     check(
       'while it runs, dots animate after the last line of the log',
       !!wizard.querySelector('.create-log .create-log-dots'),