create-sprinkles 0.2.3

package/dist/bin.mjs

@@ -0,0 +1,295 @@
+#!/usr/bin/env node
+import * as prompts from "@clack/prompts";
+import { createTemplate, runTemplate } from "bingo";
+import path from "node:path";
+import { handlebars } from "bingo-handlebars";
+import { z } from "zod";
+//#region src/context.ts
+function buildContext(opts) {
+	const isSPA = opts.kind === "react-router-spa";
+	const isSSR = opts.kind === "react-router-ssr";
+	const isRSC = opts.kind === "react-router-rsc";
+	return {
+		...opts,
+		hasContentLayer: isRSC && Boolean(opts.contentLayer),
+		hasConvex: (isSPA || isSSR) && Boolean(opts.convex),
+		isPackage: opts.kind === "ts-package",
+		isRSC,
+		isReactRouter: opts.kind !== "ts-package",
+		isSPA,
+		isSSR,
+		ssr: isSSR || isRSC
+	};
+}
+//#endregion
+//#region src/merge.ts
+function isDirectory(value) {
+	return typeof value === "object" && value !== null && !Array.isArray(value);
+}
+function mergeFiles(...layers) {
+	const result = {};
+	for (const layer of layers) if (layer) for (const [key, value] of Object.entries(layer)) {
+		const existing = result[key];
+		if (isDirectory(existing) && isDirectory(value)) result[key] = mergeFiles(existing, value);
+		else result[key] = value;
+	}
+	return result;
+}
+//#endregion
+//#region src/options.ts
+const kind$1 = z.enum([
+	"react-router-spa",
+	"react-router-ssr",
+	"react-router-rsc",
+	"ts-package"
+]).describe("project kind");
+const options = {
+	cli: z.boolean().optional(),
+	contentLayer: z.boolean().optional(),
+	convex: z.boolean().optional(),
+	generator: z.boolean().optional(),
+	kind: kind$1,
+	owner: z.string().describe("GitHub owner or organization"),
+	repository: z.string().describe("repository name"),
+	sea: z.boolean().optional()
+};
+//#endregion
+//#region src/scripts.ts
+function buildDependencyCommands(context) {
+	const commands = [];
+	commands.push("vp add -D @types/node @typescript/native-preview");
+	if (context.isReactRouter) {
+		commands.push("vp add react react-dom react-router");
+		commands.push("vp add -D @types/react @types/react-dom @react-router/dev @tailwindcss/vite tailwindcss vite-plugin-devtools-json");
+		commands.push("vp add -D @rolldown/plugin-babel @vitejs/plugin-react babel-plugin-react-compiler");
+		commands.push("vp add -D @cloudflare/vite-plugin wrangler");
+		commands.push("vp add -D eslint-plugin-perfectionist eslint-plugin-react-hooks");
+	}
+	if (context.isReactRouter) commands.push("vp add @react-router/node isbot");
+	if (context.hasConvex) commands.push("vp add convex @convex-dev/react-query @tanstack/react-query");
+	if (context.isRSC) commands.push("vp add -D @vitejs/plugin-rsc");
+	if (context.hasContentLayer) {
+		commands.push("vp add jsr:@std/jsonc jsr:@std/yaml gray-matter github-slugger @remix-run/data-schema");
+		commands.push("vp add -D @mdx-js/rollup");
+	}
+	if (context.isPackage) {
+		if (context.cli) commands.push("vp add @bomb.sh/args");
+		if (context.generator) commands.push("vp add bingo bingo-handlebars zod");
+	}
+	commands.push("vp add -D vite-plus vite@npm:@voidzero-dev/vite-plus-core@latest vitest@npm:@voidzero-dev/vite-plus-test@latest");
+	return commands;
+}
+function buildScripts(context) {
+	const scripts = [];
+	const phase0Commands = [...buildDependencyCommands(context), "vp install"];
+	scripts.push({
+		commands: phase0Commands,
+		phase: 0
+	});
+	if (context.isRSC) scripts.push({
+		commands: ["vpx wrangler types -c wrangler.rsc.jsonc"],
+		phase: 1
+	});
+	else if (context.isSSR) scripts.push({
+		commands: ["vpx wrangler types"],
+		phase: 1
+	});
+	scripts.push({
+		commands: ["vp fmt"],
+		phase: 2
+	});
+	if (context.hasConvex) scripts.push({
+		commands: ["vpx convex dev --once"],
+		phase: 3,
+		silent: true
+	});
+	scripts.push({
+		commands: [
+			"ln -sf AGENTS.md CLAUDE.md",
+			"git init",
+			"git add -A",
+			"git commit -m initial"
+		],
+		phase: 4
+	});
+	return scripts;
+}
+//#endregion
+//#region src/suggestions.ts
+function buildSuggestions(context) {
+	const suggestions = [];
+	if (context.hasConvex) suggestions.push("Open the Convex dashboard: https://dashboard.convex.dev");
+	if (context.isSSR || context.isRSC) suggestions.push("Log in to Cloudflare: vpx wrangler login");
+	if (context.isReactRouter) suggestions.push("Start the dev server: vp dev");
+	else suggestions.push("Start development: vp run dev");
+	return suggestions;
+}
+//#endregion
+//#region src/template.ts
+const templatesDir = path.join(import.meta.dirname, "../templates");
+const kindDirectories = {
+	"react-router-rsc": "react-router-rsc",
+	"react-router-spa": "react-router-spa",
+	"react-router-ssr": "react-router-ssr",
+	"ts-package": "ts-package"
+};
+async function tryHandlebars(dir, context) {
+	try {
+		return await handlebars(path.join(templatesDir, dir), context) || null;
+	} catch {
+		return null;
+	}
+}
+async function collectAddonLayers(context) {
+	const addons = [];
+	if (context.isPackage && context.cli) addons.push(await tryHandlebars("ts-package-cli", context));
+	if (context.isPackage && context.generator) addons.push(await tryHandlebars("ts-package-generator", context));
+	if (context.isPackage && context.sea) addons.push(await tryHandlebars("ts-package-sea", context));
+	if (context.hasConvex) addons.push(await tryHandlebars("react-router-convex", context));
+	if (context.isSSR && context.hasConvex) addons.push(await tryHandlebars("react-router-ssr-convex", context));
+	if (context.hasContentLayer) addons.push(await tryHandlebars("react-router-rsc-content-layer", context));
+	return addons;
+}
+async function buildLayers(context) {
+	const shared = await tryHandlebars("shared", context);
+	let reactShared = null;
+	if (context.isReactRouter) reactShared = await tryHandlebars("react-shared", context);
+	const kindDir = kindDirectories[context.kind];
+	let kindSpecific = null;
+	if (kindDir) kindSpecific = await tryHandlebars(kindDir, context);
+	const addons = await collectAddonLayers(context);
+	return mergeFiles(shared, reactShared, kindSpecific, ...addons);
+}
+var template_default = createTemplate({
+	about: {
+		description: "Get started with development by creating projects from templates quickly.",
+		name: NAME
+	},
+	options,
+	async produce({ options: opts }) {
+		const context = buildContext(opts);
+		return {
+			files: await buildLayers(context),
+			scripts: buildScripts(context),
+			suggestions: buildSuggestions(context)
+		};
+	}
+});
+//#endregion
+//#region src/index.ts
+const NAME = "create-sprinkles";
+//#endregion
+//#region bin/index.ts
+prompts.intro(NAME);
+const directory = await prompts.text({
+	message: "Where should we create the project?",
+	placeholder: "./my-project",
+	validate: (value) => {
+		if (!value) return "Directory is required";
+	}
+});
+if (prompts.isCancel(directory)) process.exit(0);
+const kind = await prompts.select({
+	message: "What kind of project?",
+	options: [
+		{
+			label: "React Router — SPA",
+			value: "react-router-spa"
+		},
+		{
+			label: "React Router — SSR",
+			value: "react-router-ssr"
+		},
+		{
+			label: "React Router — RSC",
+			value: "react-router-rsc"
+		},
+		{
+			label: "TypeScript Package",
+			value: "ts-package"
+		}
+	]
+});
+if (prompts.isCancel(kind)) process.exit(0);
+let convex = false;
+let contentLayer = false;
+let cli = false;
+let generator = false;
+let sea = false;
+if (kind === "react-router-spa" || kind === "react-router-ssr") {
+	const answer = await prompts.confirm({
+		initialValue: false,
+		message: "Include Convex backend?"
+	});
+	if (prompts.isCancel(answer)) process.exit(0);
+	convex = answer;
+}
+if (kind === "react-router-rsc") {
+	const answer = await prompts.confirm({
+		initialValue: false,
+		message: "Include content-layer plugin?"
+	});
+	if (prompts.isCancel(answer)) process.exit(0);
+	contentLayer = answer;
+}
+if (kind === "ts-package") {
+	const features = await prompts.multiselect({
+		message: "Include optional features?",
+		options: [
+			{
+				label: "CLI scaffold",
+				value: "cli"
+			},
+			{
+				label: "Bingo generator scaffold",
+				value: "generator"
+			},
+			{
+				label: "Single Executable Application (SEA)",
+				value: "sea"
+			}
+		],
+		required: false
+	});
+	if (prompts.isCancel(features)) process.exit(0);
+	cli = features.includes("cli");
+	generator = features.includes("generator");
+	sea = features.includes("sea");
+}
+const resolvedDir = path.resolve(directory);
+const repository = path.basename(resolvedDir);
+const owner = await prompts.text({
+	message: "GitHub owner or organization?",
+	placeholder: "my-org",
+	validate: (value) => {
+		if (!value) return "Owner is required";
+	}
+});
+if (prompts.isCancel(owner)) process.exit(0);
+const spinner = prompts.spinner();
+spinner.start("Scaffolding project...");
+try {
+	const creation = await runTemplate(template_default, {
+		directory: resolvedDir,
+		mode: "setup",
+		options: {
+			cli,
+			contentLayer,
+			convex,
+			generator,
+			kind,
+			owner,
+			repository,
+			sea
+		}
+	});
+	spinner.stop("Project scaffolded!");
+	if (creation.suggestions?.length) prompts.note(creation.suggestions.join("\n"), "Next steps");
+	prompts.outro(`Created ${repository} at ${resolvedDir}`);
+} catch (error) {
+	spinner.stop("Failed to scaffold project");
+	prompts.log.error(String(error));
+	process.exit(1);
+}
+//#endregion
+export {};

package/dist/index.d.mts

@@ -0,0 +1,46 @@
+import * as bingo from "bingo";
+import * as zod from "zod";
+import { z } from "zod";
+
+//#region src/template.d.ts
+declare const _default: bingo.Template<{
+  cli: zod.ZodOptional<zod.ZodBoolean>;
+  contentLayer: zod.ZodOptional<zod.ZodBoolean>;
+  convex: zod.ZodOptional<zod.ZodBoolean>;
+  generator: zod.ZodOptional<zod.ZodBoolean>;
+  kind: zod.ZodEnum<["react-router-spa", "react-router-ssr", "react-router-rsc", "ts-package"]>;
+  owner: zod.ZodString;
+  repository: zod.ZodString;
+  sea: zod.ZodOptional<zod.ZodBoolean>;
+}, unknown>;
+//#endregion
+//#region src/options.d.ts
+declare const options: {
+  cli: z.ZodOptional<z.ZodBoolean>;
+  contentLayer: z.ZodOptional<z.ZodBoolean>;
+  convex: z.ZodOptional<z.ZodBoolean>;
+  generator: z.ZodOptional<z.ZodBoolean>;
+  kind: z.ZodEnum<["react-router-spa", "react-router-ssr", "react-router-rsc", "ts-package"]>;
+  owner: z.ZodString;
+  repository: z.ZodString;
+  sea: z.ZodOptional<z.ZodBoolean>;
+};
+//#endregion
+//#region src/context.d.ts
+type Options = { [Key in keyof typeof options]: z.infer<(typeof options)[Key]> };
+interface TemplateContext extends Options {
+  isSPA: boolean;
+  isSSR: boolean;
+  isRSC: boolean;
+  isPackage: boolean;
+  isReactRouter: boolean;
+  hasConvex: boolean;
+  hasContentLayer: boolean;
+  ssr: boolean;
+}
+declare function buildContext(opts: Options): TemplateContext;
+//#endregion
+//#region src/index.d.ts
+declare const NAME = "create-sprinkles";
+//#endregion
+export { NAME, type TemplateContext, buildContext, options, _default as template };

package/dist/index.mjs

@@ -0,0 +1,180 @@
+import { createTemplate } from "bingo";
+import { handlebars } from "bingo-handlebars";
+import path from "node:path";
+import { z } from "zod";
+//#region src/context.ts
+function buildContext(opts) {
+	const isSPA = opts.kind === "react-router-spa";
+	const isSSR = opts.kind === "react-router-ssr";
+	const isRSC = opts.kind === "react-router-rsc";
+	return {
+		...opts,
+		hasContentLayer: isRSC && Boolean(opts.contentLayer),
+		hasConvex: (isSPA || isSSR) && Boolean(opts.convex),
+		isPackage: opts.kind === "ts-package",
+		isRSC,
+		isReactRouter: opts.kind !== "ts-package",
+		isSPA,
+		isSSR,
+		ssr: isSSR || isRSC
+	};
+}
+//#endregion
+//#region src/merge.ts
+function isDirectory(value) {
+	return typeof value === "object" && value !== null && !Array.isArray(value);
+}
+function mergeFiles(...layers) {
+	const result = {};
+	for (const layer of layers) if (layer) for (const [key, value] of Object.entries(layer)) {
+		const existing = result[key];
+		if (isDirectory(existing) && isDirectory(value)) result[key] = mergeFiles(existing, value);
+		else result[key] = value;
+	}
+	return result;
+}
+//#endregion
+//#region src/options.ts
+const kind = z.enum([
+	"react-router-spa",
+	"react-router-ssr",
+	"react-router-rsc",
+	"ts-package"
+]).describe("project kind");
+const options = {
+	cli: z.boolean().optional(),
+	contentLayer: z.boolean().optional(),
+	convex: z.boolean().optional(),
+	generator: z.boolean().optional(),
+	kind,
+	owner: z.string().describe("GitHub owner or organization"),
+	repository: z.string().describe("repository name"),
+	sea: z.boolean().optional()
+};
+//#endregion
+//#region src/scripts.ts
+function buildDependencyCommands(context) {
+	const commands = [];
+	commands.push("vp add -D @types/node @typescript/native-preview");
+	if (context.isReactRouter) {
+		commands.push("vp add react react-dom react-router");
+		commands.push("vp add -D @types/react @types/react-dom @react-router/dev @tailwindcss/vite tailwindcss vite-plugin-devtools-json");
+		commands.push("vp add -D @rolldown/plugin-babel @vitejs/plugin-react babel-plugin-react-compiler");
+		commands.push("vp add -D @cloudflare/vite-plugin wrangler");
+		commands.push("vp add -D eslint-plugin-perfectionist eslint-plugin-react-hooks");
+	}
+	if (context.isReactRouter) commands.push("vp add @react-router/node isbot");
+	if (context.hasConvex) commands.push("vp add convex @convex-dev/react-query @tanstack/react-query");
+	if (context.isRSC) commands.push("vp add -D @vitejs/plugin-rsc");
+	if (context.hasContentLayer) {
+		commands.push("vp add jsr:@std/jsonc jsr:@std/yaml gray-matter github-slugger @remix-run/data-schema");
+		commands.push("vp add -D @mdx-js/rollup");
+	}
+	if (context.isPackage) {
+		if (context.cli) commands.push("vp add @bomb.sh/args");
+		if (context.generator) commands.push("vp add bingo bingo-handlebars zod");
+	}
+	commands.push("vp add -D vite-plus vite@npm:@voidzero-dev/vite-plus-core@latest vitest@npm:@voidzero-dev/vite-plus-test@latest");
+	return commands;
+}
+function buildScripts(context) {
+	const scripts = [];
+	const phase0Commands = [...buildDependencyCommands(context), "vp install"];
+	scripts.push({
+		commands: phase0Commands,
+		phase: 0
+	});
+	if (context.isRSC) scripts.push({
+		commands: ["vpx wrangler types -c wrangler.rsc.jsonc"],
+		phase: 1
+	});
+	else if (context.isSSR) scripts.push({
+		commands: ["vpx wrangler types"],
+		phase: 1
+	});
+	scripts.push({
+		commands: ["vp fmt"],
+		phase: 2
+	});
+	if (context.hasConvex) scripts.push({
+		commands: ["vpx convex dev --once"],
+		phase: 3,
+		silent: true
+	});
+	scripts.push({
+		commands: [
+			"ln -sf AGENTS.md CLAUDE.md",
+			"git init",
+			"git add -A",
+			"git commit -m initial"
+		],
+		phase: 4
+	});
+	return scripts;
+}
+//#endregion
+//#region src/suggestions.ts
+function buildSuggestions(context) {
+	const suggestions = [];
+	if (context.hasConvex) suggestions.push("Open the Convex dashboard: https://dashboard.convex.dev");
+	if (context.isSSR || context.isRSC) suggestions.push("Log in to Cloudflare: vpx wrangler login");
+	if (context.isReactRouter) suggestions.push("Start the dev server: vp dev");
+	else suggestions.push("Start development: vp run dev");
+	return suggestions;
+}
+//#endregion
+//#region src/template.ts
+const templatesDir = path.join(import.meta.dirname, "../templates");
+const kindDirectories = {
+	"react-router-rsc": "react-router-rsc",
+	"react-router-spa": "react-router-spa",
+	"react-router-ssr": "react-router-ssr",
+	"ts-package": "ts-package"
+};
+async function tryHandlebars(dir, context) {
+	try {
+		return await handlebars(path.join(templatesDir, dir), context) || null;
+	} catch {
+		return null;
+	}
+}
+async function collectAddonLayers(context) {
+	const addons = [];
+	if (context.isPackage && context.cli) addons.push(await tryHandlebars("ts-package-cli", context));
+	if (context.isPackage && context.generator) addons.push(await tryHandlebars("ts-package-generator", context));
+	if (context.isPackage && context.sea) addons.push(await tryHandlebars("ts-package-sea", context));
+	if (context.hasConvex) addons.push(await tryHandlebars("react-router-convex", context));
+	if (context.isSSR && context.hasConvex) addons.push(await tryHandlebars("react-router-ssr-convex", context));
+	if (context.hasContentLayer) addons.push(await tryHandlebars("react-router-rsc-content-layer", context));
+	return addons;
+}
+async function buildLayers(context) {
+	const shared = await tryHandlebars("shared", context);
+	let reactShared = null;
+	if (context.isReactRouter) reactShared = await tryHandlebars("react-shared", context);
+	const kindDir = kindDirectories[context.kind];
+	let kindSpecific = null;
+	if (kindDir) kindSpecific = await tryHandlebars(kindDir, context);
+	const addons = await collectAddonLayers(context);
+	return mergeFiles(shared, reactShared, kindSpecific, ...addons);
+}
+var template_default = createTemplate({
+	about: {
+		description: "Get started with development by creating projects from templates quickly.",
+		name: NAME
+	},
+	options,
+	async produce({ options: opts }) {
+		const context = buildContext(opts);
+		return {
+			files: await buildLayers(context),
+			scripts: buildScripts(context),
+			suggestions: buildSuggestions(context)
+		};
+	}
+});
+//#endregion
+//#region src/index.ts
+const NAME = "create-sprinkles";
+//#endregion
+export { NAME, buildContext, options, template_default as template };

package/package.json

@@ -0,0 +1,45 @@
+{
+  "name": "create-sprinkles",
+  "version": "0.2.3",
+  "description": "Get started with development by creating projects from templates quickly.",
+  "homepage": "https://github.com/withsprinkles/workbench#readme",
+  "bugs": {
+    "url": "https://github.com/withsprinkles/workbench/issues"
+  },
+  "license": "MIT",
+  "author": "Mark Malstrom <mark@malstrom.me>",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/withsprinkles/workbench.git"
+  },
+  "bin": {
+    "create-sprinkles": "dist/bin.mjs"
+  },
+  "files": [
+    "dist",
+    "templates"
+  ],
+  "type": "module",
+  "types": "./dist/index.d.mts",
+  "exports": {
+    ".": "./dist/index.mjs",
+    "./package.json": "./package.json"
+  },
+  "dependencies": {
+    "@bomb.sh/args": "^0.3.1",
+    "@clack/prompts": "^1.1.0",
+    "bingo": "^0.9.2",
+    "bingo-fs": "^0.5.6",
+    "bingo-handlebars": "^0.1.0",
+    "zod": "^3.25.76"
+  },
+  "devDependencies": {
+    "@types/node": "^25.3.5",
+    "@typescript/native-preview": "latest",
+    "bingo-testers": "^0.5.8",
+    "bumpp": "^10.4.1",
+    "vite-plus": "latest",
+    "vitest": "npm:@voidzero-dev/vite-plus-test@latest"
+  },
+  "scripts": {}
+}

package/templates/react-router-convex/.env.local

@@ -0,0 +1,2 @@
+CONVEX_DEPLOYMENT=# Set by `npx convex dev`
+VITE_CONVEX_URL=# Set by `npx convex dev`

package/templates/react-router-convex/convex/schema.ts

@@ -0,0 +1,9 @@
+import { defineSchema } from "convex/server";
+
+export default defineSchema({
+    // Define your tables here
+    // Example:
+    // import { defineTable } from "convex/server";
+    // import { v } from "convex/values";
+    // messages: defineTable({ text: v.string() }),
+});

package/templates/react-router-rsc/app/home.tsx.hbs

@@ -0,0 +1,31 @@
+{{#if hasContentLayer}}
+import { getCollection } from "sprinkles:content";
+
+export async function ServerComponent() {
+    let posts = await getCollection("posts");
+
+    return (
+        <main>
+            <h1>Welcome to {{repository}}</h1>
+            <section>
+                <h2>Posts</h2>
+                <ul>
+                    {posts.map((post) => (
+                        <li key={post.id}>
+                            <h3>{post.data.title}</h3>
+                        </li>
+                    ))}
+                </ul>
+            </section>
+        </main>
+    );
+}
+{{else}}
+export async function ServerComponent() {
+    return (
+        <main>
+            <h1>Welcome to {{repository}}</h1>
+        </main>
+    );
+}
+{{/if}}

package/templates/react-router-rsc/app/root.tsx.hbs

@@ -0,0 +1,55 @@
+import type { PropsWithChildren } from "react";
+import { isRouteErrorResponse, Outlet } from "react-router";
+
+import type { Route } from "./+types/root";
+import styles from "./styles/tailwind.css?url";
+
+export function Layout({ children }: PropsWithChildren) {
+    return (
+        <html lang="en">
+            <head>
+                <meta charSet="utf-8" />
+                <meta content="width=device-width, initial-scale=1" name="viewport" />
+                <meta content="#000000" name="theme-color" />
+                <link href={styles} rel="stylesheet" />
+                <title>{{repository}}</title>
+            </head>
+            <body>
+                {children}
+            </body>
+        </html>
+    );
+}
+
+export function ServerComponent() {
+    return <Outlet />;
+}
+
+export function ErrorBoundary({ error }: Route.ErrorBoundaryProps) {
+    let message = "Oops!";
+    let details = "An unexpected error occurred.";
+    let stack: string | undefined;
+
+    if (isRouteErrorResponse(error)) {
+        message = error.status === 404 ? "404" : "Error";
+        details =
+            error.status === 404
+                ? "The requested page could not be found."
+                : error.statusText || details;
+    } else if (import.meta.env.DEV && error && error instanceof Error) {
+        details = error.message;
+        stack = error.stack;
+    }
+
+    return (
+        <main>
+            <h1>{message}</h1>
+            <p>{details}</p>
+            {stack && (
+                <pre>
+                    <code>{stack}</code>
+                </pre>
+            )}
+        </main>
+    );
+}