npm - @moku-labs/web - Versions diffs - 1.3.1 → 1.4.0 - Mend

@moku-labs/web 1.3.1 → 1.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (5) hide show

package/dist/index.cjs CHANGED Viewed

@@ -3842,7 +3842,7 @@ const DEFAULT_BODY = "<h1>404</h1><p>The page you requested could not be found.<
 * ```
 */
 function wrap(body) {
-	return `<!doctype html><html lang="en"><head><meta charset="utf-8"><title>404 — Not Found</title></head><body>${body}</body></html>`;
+	return `<!doctype html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><title>404 — Not Found</title></head><body>${body}</body></html>`;
 }
 /**
 * Emits `outDir/404.html`. When `config.notFound` is `true`, writes the built-in
@@ -4526,6 +4526,8 @@ const HEAD_PLACEHOLDER = "<!--moku:head-->";
 const BODY_PLACEHOLDER = "<!--moku:body-->";
 /** Template placeholder for the injected asset `<link>`/`<script>` tags. */
 const ASSETS_PLACEHOLDER = "<!--moku:assets-->";
+/** Template placeholder for the page's locale (`<html lang>`). */
+const LANG_PLACEHOLDER = "<!--moku:lang-->";
 /**
 * Read the bundle phase's hashed asset manifest for one kind from `state.buildCache`
 * as a typed {@link BuildCacheEntry} (no `Map<string, unknown>` reads).
@@ -4573,14 +4575,16 @@ function buildAssetTags(ctx) {
 * ```
 */
 function renderDocument(parts) {
-	return `<!DOCTYPE html><html lang="${parts.locale}"><head>${parts.head}${parts.assets}</head><body>${parts.body}</body></html>`;
+	return `<!DOCTYPE html><html lang="${parts.locale}"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1">${parts.head}${parts.assets}</head><body>${parts.body}</body></html>`;
 }
 /**
-* Fill a shell template's `<!--moku:head-->` / `<!--moku:body-->` /
-* `<!--moku:assets-->` placeholders deterministically at build time.
+* Fill a shell template's `<!--moku:lang-->` / `<!--moku:head-->` /
+* `<!--moku:body-->` / `<!--moku:assets-->` placeholders deterministically at build
+* time. `<!--moku:lang-->` carries the page locale (for `<html lang>`), so a single
+* shared template stays locale-correct across every locale.
 *
 * @param template - The raw shell template HTML.
-* @param parts - The composed head/body/assets pieces.
+* @param parts - The composed head/body/assets/locale pieces.
 * @returns The filled document string.
 * @example
 * ```ts
@@ -4588,7 +4592,7 @@ function renderDocument(parts) {
 * ```
 */
 function fillTemplate(template, parts) {
-	return template.replaceAll(HEAD_PLACEHOLDER, parts.head).replaceAll(BODY_PLACEHOLDER, parts.body).replaceAll(ASSETS_PLACEHOLDER, parts.assets);
+	return template.replaceAll(LANG_PLACEHOLDER, parts.locale).replaceAll(HEAD_PLACEHOLDER, parts.head).replaceAll(BODY_PLACEHOLDER, parts.body).replaceAll(ASSETS_PLACEHOLDER, parts.assets);
 }
 /**
 * Resolve the compiled entry for a manifest definition, asserting the router
@@ -5840,7 +5844,8 @@ function buildWranglerArgs(input) {
 		"--project-name",
 		input.slug,
 		"--branch",
-		branch
+		branch,
+		"--commit-dirty=true"
 	];
 }
 /**
@@ -6449,17 +6454,18 @@ function validateConfig$1(ctx) {
 	ctx.require(sitePlugin);
 }
 /**
-* Run wrangler for the prepared argv and surface its scrubbed result, translating
-* a non-zero exit into the classified deploy error. The API token is read from env
-* here so it never crosses a logging boundary; only scrubbed output is returned.
-* Shared by `run()` (deploy) and `createProject()` (project create).
+* Run wrangler for the prepared argv and return its stdout, translating a non-zero
+* exit into the classified deploy error. The API token is read from env here so it
+* never crosses a logging boundary; the scrubbed stderr is used only to classify a
+* failure — it is never logged (that was console noise), so nothing leaks. Shared by
+* `run()` (deploy) and `createProject()` (project create).
 *
 * @param ctx - Plugin context (provides `state.spawn`, `config`, `env`).
 * @param args - The fully-built, pre-validated wrangler argv.
-* @returns The wrangler `stdout` plus the scrubbed `stderr` to log on success.
+* @returns The wrangler `stdout` (for URL/id parsing on a deploy).
 * @throws {Error} With a `code` from the deploy error taxonomy on a non-zero exit.
 * @example
-* const { stdout, scrubbedStderr } = await executeWrangler(ctx, args);
+* const stdout = await executeWrangler(ctx, args);
 */
 async function executeWrangler(ctx, args) {
 	const token = ctx.env.require("CLOUDFLARE_API_TOKEN");
@@ -6473,10 +6479,7 @@ async function executeWrangler(ctx, args) {
 		const { code, message } = classifyWranglerError(exitCode, scrubbedStderr);
 		throw deployError(code, message);
 	}
-	return {
-		stdout,
-		scrubbedStderr
-	};
+	return stdout;
 }
 /**
 * Assemble the public {@link DeployResult} from wrangler's stdout, parsing the
@@ -6533,9 +6536,7 @@ function createApi$2(ctx) {
 				root
 			});
 			const start = Date.now();
-			const { stdout, scrubbedStderr } = await executeWrangler(ctx, args);
-			ctx.log.info(scrubbedStderr);
-			const result = buildDeployResult(stdout, branch, start);
+			const result = buildDeployResult(await executeWrangler(ctx, args), branch, start);
 			ctx.state.lastDeployment = result;
 			ctx.emit("deploy:complete", {
 				url: result.url,
@@ -6595,11 +6596,10 @@ function createApi$2(ctx) {
 		async createProject() {
 			const name = toSlug(ctx.require(sitePlugin).name());
 			const branch = ctx.config.productionBranch ?? "main";
-			const { scrubbedStderr } = await executeWrangler(ctx, buildProjectCreateArgs({
+			await executeWrangler(ctx, buildProjectCreateArgs({
 				slug: name,
 				branch
 			}));
-			ctx.log.info(scrubbedStderr);
 			return {
 				name,
 				branch
@@ -8766,16 +8766,24 @@ function createPanelRenderer(options = {}) {
 			write(line);
 		},
 		/**
-		* Render the deploy result from a `deploy:complete` event: a `✓ DEPLOYED → url` line
-		* with the URL the hero value, then a dim `branch · id · time` line beneath it.
+		* Render the deploy result from a `deploy:complete` event as a full-width box (matching
+		* the BUILD panel): a `✓ DEPLOYED · branch` header with the elapsed time right-aligned,
+		* then a `→ url · id` row. The url/id row is omitted entirely when wrangler returned no
+		* URL, so a first-deploy with nothing to parse never renders a dangling `→` or `· ·`.
 		*
 		* @param result - The `deploy:complete` payload.
 		* @example
 		* render.deployed({ url: "https://x.pages.dev", deploymentId: "id", branch: "main", durationMs: 1200 });
 		*/
 		deployed(result) {
-			const meta = palette.dim(`branch ${result.branch} · ${result.deploymentId} · ${result.durationMs}ms`);
-			writeBlock([`  ${palette.green("✓")} ${palette.bold("DEPLOYED")}   ${palette.dim("→")}  ${palette.cyan(result.url)}`, `  ${meta}`]);
+			const dot = palette.dim("·");
+			const time = result.durationMs >= 1e3 ? `${(result.durationMs / 1e3).toFixed(1)}s` : `${result.durationMs}ms`;
+			const lines = [railLine(`${palette.green("✓")} ${palette.bold("DEPLOYED")} ${dot} ${result.branch}`, palette.dim(time), BOX_INNER)];
+			if (result.url) {
+				const id = result.deploymentId ? ` ${dot} ${palette.dim(result.deploymentId)}` : "";
+				lines.push(`${palette.dim("→")} ${palette.cyan(result.url)}${id}`);
+			} else if (result.deploymentId) lines.push(palette.dim(`id ${result.deploymentId}`));
+			writeBlock(box(lines, color, BOX_INNER));
 		},
 		/**
 		* Render a neutral informational line.
@@ -8870,6 +8878,29 @@ function createPanelRenderer(options = {}) {
 */
 /** Matches an explicit affirmative answer (`y`/`yes`, case-insensitive). */
 const YES_PATTERN = /^y(es)?$/i;
+/** Prompt rail width — matches the renderer's `RAIL_WIDTH` so the hint aligns with other rows. */
+const PROMPT_WIDTH = 66;
+/** Whether the interactive prompts render with the MOKU marker styling (color/TTY only). */
+const PROMPT_COLOR = supportsColor();
+/** Shared palette for the interactive prompts (same brand colors as the Panel renderer). */
+const PROMPT_PALETTE = makePalette(PROMPT_COLOR, PROMPT_COLOR && supportsTruecolor());
+/**
+* Build the styled y/N confirm prompt: a brand `◆` marker + the question on the left,
+* a dim `y / N` hint + cyan `›` caret right-aligned to {@link PROMPT_WIDTH}. Falls back
+* to the plain `question [y/N] ` form off a color TTY (CI/pipes), where prompts rarely run.
+*
+* @param question - The yes/no question to display.
+* @returns The readline prompt string (the typed answer follows the caret).
+* @example
+* confirmPrompt("Deploy dist/ to Cloudflare Pages?");
+*/
+function confirmPrompt(question) {
+	if (!PROMPT_COLOR) return `${question} [y/N] `;
+	const left = `  ${PROMPT_PALETTE.pink("◆")} ${question}`;
+	const right = `${PROMPT_PALETTE.dim("y / N")} ${PROMPT_PALETTE.cyan("›")} `;
+	const gap = Math.max(1, PROMPT_WIDTH - visibleWidth(left) - visibleWidth(right));
+	return `${left}${" ".repeat(gap)}${right}`;
+}
 /**
 * Resolve the `Bun` runtime global, or `undefined` when not running under Bun.
 *
@@ -8927,7 +8958,7 @@ function defaultConfirm(question) {
 			input: process.stdin,
 			output: process.stdout
 		});
-		readline.question(`${question} [y/N] `, (answer) => {
+		readline.question(confirmPrompt(question), (answer) => {
 			readline.close();
 			resolve(YES_PATTERN.test(answer.trim()));
 		});
@@ -8950,8 +8981,8 @@ function defaultSelect(question, choices) {
 			input: process.stdin,
 			output: process.stdout
 		});
-		for (const [index, choice] of choices.entries()) console.log(`  ${index + 1}) ${choice}`);
-		readline.question(`${question} [1-${choices.length}] `, (answer) => {
+		console.log(selectChoicesBlock(question, choices));
+		readline.question(selectPrompt(question, choices.length), (answer) => {
 			readline.close();
 			const picked = Number.parseInt(answer.trim(), 10);
 			resolve(Number.isInteger(picked) && picked >= 1 && picked <= choices.length ? picked - 1 : 0);
@@ -8959,6 +8990,36 @@ function defaultSelect(question, choices) {
 	});
 }
 /**
+* Render the select block: a brand `◆` marker + the question, then each choice as an
+* indented dim number + label. Off a color TTY, falls back to the plain `  N) label`
+* list (the question rides the prompt instead).
+*
+* @param question - The prompt shown above the choices (styled mode only).
+* @param choices - The selectable option labels.
+* @returns The multi-line choices block.
+* @example
+* selectChoicesBlock("Set up a workflow?", ["Auto", "Manual", "Skip"]);
+*/
+function selectChoicesBlock(question, choices) {
+	if (!PROMPT_COLOR) return choices.map((choice, index) => `  ${index + 1}) ${choice}`).join("\n");
+	return [`  ${PROMPT_PALETTE.pink("◆")} ${question}`, ...choices.map((choice, index) => `      ${PROMPT_PALETTE.dim(String(index + 1))}  ${choice}`)].join("\n");
+}
+/**
+* Build the select input prompt: a dim `pick 1–N` hint + cyan `›` caret in styled mode,
+* or the plain `question [1-N] ` form off a color TTY (where the question is not printed
+* separately).
+*
+* @param question - The prompt (used only by the plain fallback).
+* @param count - The number of choices.
+* @returns The readline prompt string.
+* @example
+* selectPrompt("Set up a workflow?", 3);
+*/
+function selectPrompt(question, count) {
+	if (!PROMPT_COLOR) return `${question} [1-${count}] `;
+	return `    ${PROMPT_PALETTE.dim(`pick 1–${count}`)} ${PROMPT_PALETTE.cyan("›")} `;
+}
+/**
 * Default recursive directory watcher — wraps `node:fs.watch` with `{ recursive: true }`
 * and adapts its handle to {@link WatchHandle}. Tests inject a fake emitter so no real
 * FS watch is registered.

package/dist/index.d.cts CHANGED Viewed

@@ -1615,7 +1615,17 @@ type Config$3 = {
     body?: string;
   }; /** Emit per-path i18n bare-path redirect HTML pages. Default `false`. */
   localeRedirects?: boolean; /** Authoritative client bundle entry path (overrides the conventional scan). */
-  clientEntry?: string; /** HTML shell template with `<!--moku:head-->`/`<!--moku:body-->`/`<!--moku:assets-->` placeholders. */
+  clientEntry?: string;
+  /**
+   * Path to a custom HTML document shell, giving the app full control over the
+   * scaffold (charset, viewport, `<html lang>`, body attributes, wrapper markup).
+   * Placeholders, substituted per page at build time:
+   * `<!--moku:lang-->` (page locale for `<html lang>`),
+   * `<!--moku:head-->` (composed `<head>` inner HTML),
+   * `<!--moku:assets-->` (injected `<link>`/`<script>` tags),
+   * `<!--moku:body-->` (SSR body HTML).
+   * When unset, the built-in shell is used (it emits charset + viewport by default).
+   */
   template?: string;
 };
 /**

package/dist/index.d.mts CHANGED Viewed

@@ -1615,7 +1615,17 @@ type Config$3 = {
     body?: string;
   }; /** Emit per-path i18n bare-path redirect HTML pages. Default `false`. */
   localeRedirects?: boolean; /** Authoritative client bundle entry path (overrides the conventional scan). */
-  clientEntry?: string; /** HTML shell template with `<!--moku:head-->`/`<!--moku:body-->`/`<!--moku:assets-->` placeholders. */
+  clientEntry?: string;
+  /**
+   * Path to a custom HTML document shell, giving the app full control over the
+   * scaffold (charset, viewport, `<html lang>`, body attributes, wrapper markup).
+   * Placeholders, substituted per page at build time:
+   * `<!--moku:lang-->` (page locale for `<html lang>`),
+   * `<!--moku:head-->` (composed `<head>` inner HTML),
+   * `<!--moku:assets-->` (injected `<link>`/`<script>` tags),
+   * `<!--moku:body-->` (SSR body HTML).
+   * When unset, the built-in shell is used (it emits charset + viewport by default).
+   */
   template?: string;
 };
 /**

package/dist/index.mjs CHANGED Viewed

@@ -3829,7 +3829,7 @@ const DEFAULT_BODY = "<h1>404</h1><p>The page you requested could not be found.<
 * ```
 */
 function wrap(body) {
-	return `<!doctype html><html lang="en"><head><meta charset="utf-8"><title>404 — Not Found</title></head><body>${body}</body></html>`;
+	return `<!doctype html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><title>404 — Not Found</title></head><body>${body}</body></html>`;
 }
 /**
 * Emits `outDir/404.html`. When `config.notFound` is `true`, writes the built-in
@@ -4513,6 +4513,8 @@ const HEAD_PLACEHOLDER = "<!--moku:head-->";
 const BODY_PLACEHOLDER = "<!--moku:body-->";
 /** Template placeholder for the injected asset `<link>`/`<script>` tags. */
 const ASSETS_PLACEHOLDER = "<!--moku:assets-->";
+/** Template placeholder for the page's locale (`<html lang>`). */
+const LANG_PLACEHOLDER = "<!--moku:lang-->";
 /**
 * Read the bundle phase's hashed asset manifest for one kind from `state.buildCache`
 * as a typed {@link BuildCacheEntry} (no `Map<string, unknown>` reads).
@@ -4560,14 +4562,16 @@ function buildAssetTags(ctx) {
 * ```
 */
 function renderDocument(parts) {
-	return `<!DOCTYPE html><html lang="${parts.locale}"><head>${parts.head}${parts.assets}</head><body>${parts.body}</body></html>`;
+	return `<!DOCTYPE html><html lang="${parts.locale}"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1">${parts.head}${parts.assets}</head><body>${parts.body}</body></html>`;
 }
 /**
-* Fill a shell template's `<!--moku:head-->` / `<!--moku:body-->` /
-* `<!--moku:assets-->` placeholders deterministically at build time.
+* Fill a shell template's `<!--moku:lang-->` / `<!--moku:head-->` /
+* `<!--moku:body-->` / `<!--moku:assets-->` placeholders deterministically at build
+* time. `<!--moku:lang-->` carries the page locale (for `<html lang>`), so a single
+* shared template stays locale-correct across every locale.
 *
 * @param template - The raw shell template HTML.
-* @param parts - The composed head/body/assets pieces.
+* @param parts - The composed head/body/assets/locale pieces.
 * @returns The filled document string.
 * @example
 * ```ts
@@ -4575,7 +4579,7 @@ function renderDocument(parts) {
 * ```
 */
 function fillTemplate(template, parts) {
-	return template.replaceAll(HEAD_PLACEHOLDER, parts.head).replaceAll(BODY_PLACEHOLDER, parts.body).replaceAll(ASSETS_PLACEHOLDER, parts.assets);
+	return template.replaceAll(LANG_PLACEHOLDER, parts.locale).replaceAll(HEAD_PLACEHOLDER, parts.head).replaceAll(BODY_PLACEHOLDER, parts.body).replaceAll(ASSETS_PLACEHOLDER, parts.assets);
 }
 /**
 * Resolve the compiled entry for a manifest definition, asserting the router
@@ -5827,7 +5831,8 @@ function buildWranglerArgs(input) {
 		"--project-name",
 		input.slug,
 		"--branch",
-		branch
+		branch,
+		"--commit-dirty=true"
 	];
 }
 /**
@@ -6436,17 +6441,18 @@ function validateConfig$1(ctx) {
 	ctx.require(sitePlugin);
 }
 /**
-* Run wrangler for the prepared argv and surface its scrubbed result, translating
-* a non-zero exit into the classified deploy error. The API token is read from env
-* here so it never crosses a logging boundary; only scrubbed output is returned.
-* Shared by `run()` (deploy) and `createProject()` (project create).
+* Run wrangler for the prepared argv and return its stdout, translating a non-zero
+* exit into the classified deploy error. The API token is read from env here so it
+* never crosses a logging boundary; the scrubbed stderr is used only to classify a
+* failure — it is never logged (that was console noise), so nothing leaks. Shared by
+* `run()` (deploy) and `createProject()` (project create).
 *
 * @param ctx - Plugin context (provides `state.spawn`, `config`, `env`).
 * @param args - The fully-built, pre-validated wrangler argv.
-* @returns The wrangler `stdout` plus the scrubbed `stderr` to log on success.
+* @returns The wrangler `stdout` (for URL/id parsing on a deploy).
 * @throws {Error} With a `code` from the deploy error taxonomy on a non-zero exit.
 * @example
-* const { stdout, scrubbedStderr } = await executeWrangler(ctx, args);
+* const stdout = await executeWrangler(ctx, args);
 */
 async function executeWrangler(ctx, args) {
 	const token = ctx.env.require("CLOUDFLARE_API_TOKEN");
@@ -6460,10 +6466,7 @@ async function executeWrangler(ctx, args) {
 		const { code, message } = classifyWranglerError(exitCode, scrubbedStderr);
 		throw deployError(code, message);
 	}
-	return {
-		stdout,
-		scrubbedStderr
-	};
+	return stdout;
 }
 /**
 * Assemble the public {@link DeployResult} from wrangler's stdout, parsing the
@@ -6520,9 +6523,7 @@ function createApi$2(ctx) {
 				root
 			});
 			const start = Date.now();
-			const { stdout, scrubbedStderr } = await executeWrangler(ctx, args);
-			ctx.log.info(scrubbedStderr);
-			const result = buildDeployResult(stdout, branch, start);
+			const result = buildDeployResult(await executeWrangler(ctx, args), branch, start);
 			ctx.state.lastDeployment = result;
 			ctx.emit("deploy:complete", {
 				url: result.url,
@@ -6582,11 +6583,10 @@ function createApi$2(ctx) {
 		async createProject() {
 			const name = toSlug(ctx.require(sitePlugin).name());
 			const branch = ctx.config.productionBranch ?? "main";
-			const { scrubbedStderr } = await executeWrangler(ctx, buildProjectCreateArgs({
+			await executeWrangler(ctx, buildProjectCreateArgs({
 				slug: name,
 				branch
 			}));
-			ctx.log.info(scrubbedStderr);
 			return {
 				name,
 				branch
@@ -8753,16 +8753,24 @@ function createPanelRenderer(options = {}) {
 			write(line);
 		},
 		/**
-		* Render the deploy result from a `deploy:complete` event: a `✓ DEPLOYED → url` line
-		* with the URL the hero value, then a dim `branch · id · time` line beneath it.
+		* Render the deploy result from a `deploy:complete` event as a full-width box (matching
+		* the BUILD panel): a `✓ DEPLOYED · branch` header with the elapsed time right-aligned,
+		* then a `→ url · id` row. The url/id row is omitted entirely when wrangler returned no
+		* URL, so a first-deploy with nothing to parse never renders a dangling `→` or `· ·`.
 		*
 		* @param result - The `deploy:complete` payload.
 		* @example
 		* render.deployed({ url: "https://x.pages.dev", deploymentId: "id", branch: "main", durationMs: 1200 });
 		*/
 		deployed(result) {
-			const meta = palette.dim(`branch ${result.branch} · ${result.deploymentId} · ${result.durationMs}ms`);
-			writeBlock([`  ${palette.green("✓")} ${palette.bold("DEPLOYED")}   ${palette.dim("→")}  ${palette.cyan(result.url)}`, `  ${meta}`]);
+			const dot = palette.dim("·");
+			const time = result.durationMs >= 1e3 ? `${(result.durationMs / 1e3).toFixed(1)}s` : `${result.durationMs}ms`;
+			const lines = [railLine(`${palette.green("✓")} ${palette.bold("DEPLOYED")} ${dot} ${result.branch}`, palette.dim(time), BOX_INNER)];
+			if (result.url) {
+				const id = result.deploymentId ? ` ${dot} ${palette.dim(result.deploymentId)}` : "";
+				lines.push(`${palette.dim("→")} ${palette.cyan(result.url)}${id}`);
+			} else if (result.deploymentId) lines.push(palette.dim(`id ${result.deploymentId}`));
+			writeBlock(box(lines, color, BOX_INNER));
 		},
 		/**
 		* Render a neutral informational line.
@@ -8857,6 +8865,29 @@ function createPanelRenderer(options = {}) {
 */
 /** Matches an explicit affirmative answer (`y`/`yes`, case-insensitive). */
 const YES_PATTERN = /^y(es)?$/i;
+/** Prompt rail width — matches the renderer's `RAIL_WIDTH` so the hint aligns with other rows. */
+const PROMPT_WIDTH = 66;
+/** Whether the interactive prompts render with the MOKU marker styling (color/TTY only). */
+const PROMPT_COLOR = supportsColor();
+/** Shared palette for the interactive prompts (same brand colors as the Panel renderer). */
+const PROMPT_PALETTE = makePalette(PROMPT_COLOR, PROMPT_COLOR && supportsTruecolor());
+/**
+* Build the styled y/N confirm prompt: a brand `◆` marker + the question on the left,
+* a dim `y / N` hint + cyan `›` caret right-aligned to {@link PROMPT_WIDTH}. Falls back
+* to the plain `question [y/N] ` form off a color TTY (CI/pipes), where prompts rarely run.
+*
+* @param question - The yes/no question to display.
+* @returns The readline prompt string (the typed answer follows the caret).
+* @example
+* confirmPrompt("Deploy dist/ to Cloudflare Pages?");
+*/
+function confirmPrompt(question) {
+	if (!PROMPT_COLOR) return `${question} [y/N] `;
+	const left = `  ${PROMPT_PALETTE.pink("◆")} ${question}`;
+	const right = `${PROMPT_PALETTE.dim("y / N")} ${PROMPT_PALETTE.cyan("›")} `;
+	const gap = Math.max(1, PROMPT_WIDTH - visibleWidth(left) - visibleWidth(right));
+	return `${left}${" ".repeat(gap)}${right}`;
+}
 /**
 * Resolve the `Bun` runtime global, or `undefined` when not running under Bun.
 *
@@ -8914,7 +8945,7 @@ function defaultConfirm(question) {
 			input: process.stdin,
 			output: process.stdout
 		});
-		readline.question(`${question} [y/N] `, (answer) => {
+		readline.question(confirmPrompt(question), (answer) => {
 			readline.close();
 			resolve(YES_PATTERN.test(answer.trim()));
 		});
@@ -8937,8 +8968,8 @@ function defaultSelect(question, choices) {
 			input: process.stdin,
 			output: process.stdout
 		});
-		for (const [index, choice] of choices.entries()) console.log(`  ${index + 1}) ${choice}`);
-		readline.question(`${question} [1-${choices.length}] `, (answer) => {
+		console.log(selectChoicesBlock(question, choices));
+		readline.question(selectPrompt(question, choices.length), (answer) => {
 			readline.close();
 			const picked = Number.parseInt(answer.trim(), 10);
 			resolve(Number.isInteger(picked) && picked >= 1 && picked <= choices.length ? picked - 1 : 0);
@@ -8946,6 +8977,36 @@ function defaultSelect(question, choices) {
 	});
 }
 /**
+* Render the select block: a brand `◆` marker + the question, then each choice as an
+* indented dim number + label. Off a color TTY, falls back to the plain `  N) label`
+* list (the question rides the prompt instead).
+*
+* @param question - The prompt shown above the choices (styled mode only).
+* @param choices - The selectable option labels.
+* @returns The multi-line choices block.
+* @example
+* selectChoicesBlock("Set up a workflow?", ["Auto", "Manual", "Skip"]);
+*/
+function selectChoicesBlock(question, choices) {
+	if (!PROMPT_COLOR) return choices.map((choice, index) => `  ${index + 1}) ${choice}`).join("\n");
+	return [`  ${PROMPT_PALETTE.pink("◆")} ${question}`, ...choices.map((choice, index) => `      ${PROMPT_PALETTE.dim(String(index + 1))}  ${choice}`)].join("\n");
+}
+/**
+* Build the select input prompt: a dim `pick 1–N` hint + cyan `›` caret in styled mode,
+* or the plain `question [1-N] ` form off a color TTY (where the question is not printed
+* separately).
+*
+* @param question - The prompt (used only by the plain fallback).
+* @param count - The number of choices.
+* @returns The readline prompt string.
+* @example
+* selectPrompt("Set up a workflow?", 3);
+*/
+function selectPrompt(question, count) {
+	if (!PROMPT_COLOR) return `${question} [1-${count}] `;
+	return `    ${PROMPT_PALETTE.dim(`pick 1–${count}`)} ${PROMPT_PALETTE.cyan("›")} `;
+}
+/**
 * Default recursive directory watcher — wraps `node:fs.watch` with `{ recursive: true }`
 * and adapts its handle to {@link WatchHandle}. Tests inject a fake emitter so no real
 * FS watch is registered.

package/package.json CHANGED Viewed

@@ -113,5 +113,5 @@
     "test:cli-e2e": "bun test src/plugins/cli/__tests__/e2e/",
     "test:coverage": "vitest run --project unit --project integration --coverage"
   },
-  "version": "1.3.1"
+  "version": "1.4.0"
 }