sprawlify 0.0.91 → 0.0.93

package/dist/index.mjs

@@ -1,13 +1,14 @@
 #!/usr/bin/env node
 import { Command } from "commander";
-import fsExtra from "fs-extra";
 import path, { join } from "path";
-import prompts from "prompts";
-import { z } from "zod";
+import fsExtra from "fs-extra";
 import { cyan, green, red, yellow } from "kleur/colors";
+import { z } from "zod";
 import { existsSync } from "fs";
+import prompts from "prompts";
+import dedent from "dedent";
 //#region package.json
-var version = "0.0.91";
+var version = "0.0.93";
 //#endregion
 //#region src/utils/file-helper.ts
 const FILE_BACKUP_SUFFIX = ".bak";
@@ -148,22 +149,27 @@ function clearRegistryContext() {
 	context.headers = {};
 }
 //#endregion
-//#region src/preset/presets.ts
-const PRESETS = {
-	clay: {
-		name: "Clay",
-		frameworks: ["react"]
-	},
-	monochrome: {
-		name: "Monochrome",
-		frameworks: [
-			"react",
-			"solid",
-			"svelte",
-			"vue"
-		]
+//#region src/utils/env-loader.ts
+async function loadEnvFiles(cwd = process.cwd()) {
+	try {
+		const { config } = await import("@dotenvx/dotenvx");
+		for (const envFile of [
+			".env.local",
+			".env.development.local",
+			".env.development",
+			".env"
+		]) {
+			const envPath = join(cwd, envFile);
+			if (existsSync(envPath)) config({
+				path: envPath,
+				overload: false,
+				quiet: true
+			});
+		}
+	} catch (error) {
+		logger.warn("Failed to load env files:", error);
 	}
-};
+}
 //#endregion
 //#region src/frameworks/index.ts
 const FRAMEWORKS = {
@@ -187,29 +193,24 @@ const METAFRAMEWORKS = {
 	}
 };
 //#endregion
-//#region src/utils/env-loader.ts
-async function loadEnvFiles(cwd = process.cwd()) {
-	try {
-		const { config } = await import("@dotenvx/dotenvx");
-		for (const envFile of [
-			".env.local",
-			".env.development.local",
-			".env.development",
-			".env"
-		]) {
-			const envPath = join(cwd, envFile);
-			if (existsSync(envPath)) config({
-				path: envPath,
-				overload: false,
-				quiet: true
-			});
-		}
-	} catch (error) {
-		logger.warn("Failed to load env files:", error);
+//#region src/preset/presets.ts
+const PRESETS = {
+	clay: {
+		name: "Clay",
+		frameworks: ["react"]
+	},
+	monochrome: {
+		name: "Monochrome",
+		frameworks: [
+			"react",
+			"solid",
+			"svelte",
+			"vue"
+		]
 	}
-}
+};
 //#endregion
-//#region src/commands/init.ts
+//#region src/commands/init/options.ts
 const initOptionsSchema = z.object({
 	cwd: z.string(),
 	name: z.string().optional(),
@@ -222,8 +223,317 @@ const initOptionsSchema = z.object({
 	framework: z.string().optional(),
 	metaframework: z.string().optional()
 });
+function parseInitOptions(opts) {
+	const parsed = opts;
+	return initOptionsSchema.parse({
+		...parsed,
+		reinstall: parsed.reinstall,
+		cwd: path.resolve(String(parsed.cwd ?? process.cwd()))
+	});
+}
+function applyDefaultInitOptions(options) {
+	if (!options.defaults) return;
+	options.preset = options.preset || "monochrome";
+	options.framework = options.framework || "react";
+	options.reinstall = options.reinstall ?? false;
+}
+function validateExplicitOptions(options) {
+	if (options.preset && !(options.preset in PRESETS)) exitForInvalidOption("preset", options.preset, Object.keys(PRESETS));
+	if (options.framework && !(options.framework in FRAMEWORKS)) exitForInvalidOption("framework", options.framework, Object.keys(FRAMEWORKS));
+	if (options.metaframework && !(options.metaframework in METAFRAMEWORKS)) exitForInvalidOption("metaframework", options.metaframework, Object.keys(METAFRAMEWORKS));
+}
+function exitForInvalidOption(optionName, receivedValue, allowedValues) {
+	logger.error(`Invalid ${optionName}: ${highlighter.info(receivedValue)}. Available ${optionName}s: ${allowedValues.map((value) => highlighter.info(value)).join(", ")}.`);
+	logger.break();
+	process.exit(1);
+}
+//#endregion
+//#region src/commands/init/prompts.ts
+async function promptForMissingSelections(options) {
+	if (!options.name) {
+		const { name } = await prompts({
+			type: "text",
+			name: "name",
+			message: "What is your project name?",
+			initial: "my-project",
+			validate: (value) => value.trim().length > 0 || "Project name is required."
+		});
+		if (!name) {
+			logger.error("Project name is required.");
+			process.exit(1);
+		}
+		options.name = name;
+	}
+	if (!options.framework) {
+		const { framework } = await prompts({
+			type: "select",
+			name: "framework",
+			message: "Which framework would you like to use?",
+			choices: Object.keys(FRAMEWORKS).map((frameworkKey) => ({
+				title: FRAMEWORKS[frameworkKey].title,
+				value: frameworkKey
+			})),
+			initial: 0
+		});
+		if (!framework) {
+			logger.error("Framework selection is required.");
+			process.exit(1);
+		}
+		options.framework = framework;
+	}
+	if (!options.preset) {
+		const { preset } = await prompts({
+			type: "select",
+			name: "preset",
+			message: "Which preset would you like to use?",
+			choices: Object.entries(PRESETS).map(([key, preset]) => ({
+				title: preset.name,
+				value: key,
+				disabled: !preset.frameworks.includes(options.framework)
+			})),
+			initial: 0
+		});
+		if (!preset) {
+			logger.error("Preset selection is required.");
+			process.exit(1);
+		}
+		options.preset = preset;
+	}
+	if (!options.metaframework) {
+		const { metaframework } = await prompts({
+			type: "select",
+			name: "metaframework",
+			message: "Which metaframework would you like to use (optional)?",
+			choices: [{
+				title: "None",
+				value: "none"
+			}, ...Object.entries(METAFRAMEWORKS).filter(([_, meta]) => meta.frameworks.includes(options.framework)).map(([key, meta]) => ({
+				title: meta.title,
+				value: key
+			}))],
+			initial: 0
+		});
+		options.metaframework = metaframework === "none" ? void 0 : metaframework;
+	}
+}
+async function ensureOverwriteAllowed(options) {
+	if (!fsExtra.existsSync(path.resolve(options.cwd, "components.json")) || options.override) return;
+	const { overwrite } = await prompts({
+		type: "confirm",
+		name: "overwrite",
+		message: `A ${highlighter.info("components.json")} file already exists. Would you like to overwrite it?`,
+		initial: false
+	});
+	if (!overwrite) {
+		logger.info(`  To start over, remove the ${highlighter.info("components.json")} file and run ${highlighter.info("init")} again.`);
+		logger.break();
+		process.exit(1);
+	}
+	options.override = true;
+}
+//#endregion
+//#region src/templates/create-template.ts
+function createTemplate(config) {
+	return {
+		...config,
+		frameworks: config.frameworks || []
+	};
+}
+//#endregion
+//#region \0@oxc-project+runtime@0.115.0/helpers/taggedTemplateLiteral.js
+function _taggedTemplateLiteral(e, t) {
+	return t || (t = e.slice(0)), Object.freeze(Object.defineProperties(e, { raw: { value: Object.freeze(t) } }));
+}
+//#endregion
+//#region src/templates/react.ts
+var _templateObject;
+//#endregion
+//#region src/templates/index.ts
+const templates = {
+	react: createTemplate({ files: [
+		{
+			path: "src/root.tsx",
+			content: dedent`export function Root() {
+  return (
+    <div>
+      <h1 className="text-2xl font-bold">Welcome to Sprawlify + React!</h1>
+      <p className="mt-4 text-lg">This is your root component.</p>
+    </div>
+  )
+}`
+		},
+		{
+			path: "src/main.tsx",
+			content: dedent`import { StrictMode } from 'react'
+import { createRoot } from 'react-dom/client'
+import { Root } from './root'
+import './globals.css'
+
+createRoot(document.getElementById('root')!).render(
+  <StrictMode>
+    <Root />
+  </StrictMode>,
+)`
+		},
+		{
+			path: ".gitignore",
+			content: dedent`# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?`
+		},
+		{
+			path: "index.html",
+			content: dedent(_templateObject || (_templateObject = _taggedTemplateLiteral(["<!DOCTYPE html>\n<html lang=\"en\">\n  <head>\n    <meta charset=\"UTF-8\" />\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" />\n    <title>Sprawlify + React</title>\n  </head>\n  <body>\n    <div id=\"root\"></div>\n    <script type=\"module\" src=\"/src/main.tsx\"><\/script>\n  </body>\n</html>"])))
+		},
+		{
+			path: "package.json",
+			content: dedent`{
+  "private": true,
+  "version": "0.0.0",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "tsc -b && vite build",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "react": "^19.2.4",
+    "react-dom": "^19.2.4"
+  },
+  "devDependencies": {
+    "@types/node": "^24.12.0",
+    "@types/react": "^19.2.14",
+    "@types/react-dom": "^19.2.3",
+    "@vitejs/plugin-react": "^6.0.1",
+    "globals": "^17.4.0",
+    "typescript": "~5.9.3",
+    "vite": "^8.0.0"
+  }
+}`
+		},
+		{
+			path: "tsconfig.app.json",
+			content: dedent`{
+  "compilerOptions": {
+    "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
+    "target": "ES2023",
+    "useDefineForClassFields": true,
+    "lib": ["ES2023", "DOM", "DOM.Iterable"],
+    "module": "ESNext",
+    "types": ["vite/client"],
+    "skipLibCheck": true,
+    /* Bundler mode */
+    "moduleResolution": "bundler",
+    "allowImportingTsExtensions": true,
+    "verbatimModuleSyntax": true,
+    "moduleDetection": "force",
+    "noEmit": true,
+    "jsx": "react-jsx",
+    /* Linting */
+    "strict": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "erasableSyntaxOnly": true,
+    "noFallthroughCasesInSwitch": true,
+    "noUncheckedSideEffectImports": true
+  },
+  "include": ["src"]
+}`
+		},
+		{
+			path: "tsconfig.json",
+			content: dedent`{
+  "files": [],
+  "references": [
+    { "path": "./tsconfig.app.json" },
+    { "path": "./tsconfig.node.json" }
+  ]
+}`
+		},
+		{
+			path: "tsconfig.node.json",
+			content: dedent`{
+  "compilerOptions": {
+    "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.node.tsbuildinfo",
+    "target": "ES2023",
+    "lib": ["ES2023"],
+    "module": "ESNext",
+    "types": ["node"],
+    "skipLibCheck": true,
+    /* Bundler mode */
+    "moduleResolution": "bundler",
+    "allowImportingTsExtensions": true,
+    "verbatimModuleSyntax": true,
+    "moduleDetection": "force",
+    "noEmit": true,
+    /* Linting */
+    "strict": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "erasableSyntaxOnly": true,
+    "noFallthroughCasesInSwitch": true,
+    "noUncheckedSideEffectImports": true
+  },
+  "include": ["vite.config.ts"]
+}`
+		},
+		{
+			path: "vite.config.ts",
+			content: dedent`import { defineConfig } from 'vite'
+import react from '@vitejs/plugin-react'
+
+export default defineConfig({
+  plugins: [react()],
+})
+`
+		}
+	] }),
+	solid: createTemplate({ files: [] }),
+	svelte: createTemplate({ files: [] }),
+	vue: createTemplate({ files: [] })
+};
+//#endregion
+//#region src/commands/init/run-init.ts
 async function runInit(options) {
-	const cwd = options.cwd;
+	let cwd = options.cwd;
+	if (options.name && options.name !== ".") {
+		cwd = path.resolve(options.cwd, options.name);
+		await fsExtra.ensureDir(cwd);
+		options.cwd = cwd;
+		logger.info(`Using project directory: ${highlighter.info(options.name)}`);
+	}
+	const selectedTemplate = options.framework && options.framework in templates ? templates[options.framework] : void 0;
+	if (selectedTemplate?.files.length) for (const file of selectedTemplate.files) {
+		const targetPath = path.resolve(cwd, file.path);
+		if (fsExtra.existsSync(targetPath) && !options.override) {
+			logger.warn(`Skipping ${highlighter.info(file.path)} because it already exists. Use ${highlighter.info("--override")} to replace it.`);
+			continue;
+		}
+		await fsExtra.ensureDir(path.dirname(targetPath));
+		await fsExtra.writeFile(targetPath, file.content, "utf8");
+		logger.success(`Created ${highlighter.info(file.path)} template file.`);
+	}
 	const componentsJsonPath = path.resolve(cwd, "components.json");
 	logger.info("Starting project initialization...");
 	const config = {
@@ -257,114 +567,23 @@ async function runInit(options) {
 		throw error;
 	}
 }
+//#endregion
+//#region src/commands/init.ts
 const init = new Command().name("init").alias("create").description("initialize your project and install dependencies").argument("[components...]", "names, url or local path to component").option("-p, --preset <preset>", "the preset to use. (monochrome, clay)").option("-f, --framework <framework>", "the framework to use. (react, solid, svelte, vue)").option("--metaframework <metaframework>", "the metaframework to use. (next, react-router, nuxt, sveltekit)").option("-y, --yes", "skip confirmation prompt.", true).option("-d, --defaults", "use default configuration: --preset=monochrome --framework=react --metaframework=vanilla", false).option("-o, --override", "override existing configuration.", false).option("-c, --cwd <cwd>", "the working directory. defaults to the current directory.", process.cwd()).option("-n, --name <name>", "the name for the new project.").option("-s, --silent", "mute output.", false).option("--reinstall", "re-install existing UI components.").option("--no-reinstall", "do not re-install existing UI components.").action(async (components, opts) => {
-	let reinstallComponents = [];
-	const restoreBackupOnExit = () => {};
-	process.on("exit", restoreBackupOnExit);
 	try {
-		const options = initOptionsSchema.parse({
-			...opts,
-			reinstall: opts.reinstall,
-			cwd: path.resolve(opts.cwd)
-		});
-		if (options.defaults) {
-			options.preset = options.preset || "monochrome";
-			options.framework = options.framework || "react";
-			options.reinstall = options.reinstall ?? false;
-		}
-		if (options.preset && !(options.preset in PRESETS)) {
-			logger.error(`Invalid preset: ${highlighter.info(options.preset)}. Available presets: ${Object.keys(PRESETS).map((f) => highlighter.info(f)).join(", ")}.`);
-			logger.break();
-			process.exit(1);
-		}
-		if (options.framework && !(options.framework in FRAMEWORKS)) {
-			logger.error(`Invalid framework: ${highlighter.info(options.framework)}. Available frameworks: ${Object.keys(FRAMEWORKS).map((f) => highlighter.info(f)).join(", ")}.`);
-			logger.break();
-			process.exit(1);
-		}
-		if (options.metaframework && !(options.metaframework in METAFRAMEWORKS)) {
-			logger.error(`Invalid metaframework: ${highlighter.info(options.metaframework)}. Available metaframeworks: ${Object.keys(METAFRAMEWORKS).map((f) => highlighter.info(f)).join(", ")}.`);
-			logger.break();
-			process.exit(1);
-		}
-		if (!options.framework) {
-			const { framework } = await prompts({
-				type: "select",
-				name: "framework",
-				message: "Which framework would you like to use?",
-				choices: Object.keys(FRAMEWORKS).map((framework) => ({
-					title: FRAMEWORKS[framework].title,
-					value: framework
-				})),
-				initial: 0
-			});
-			if (!framework) {
-				logger.error("Framework selection is required.");
-				process.exit(1);
-			}
-			options.framework = framework;
-		}
-		if (!options.preset) {
-			const { preset } = await prompts({
-				type: "select",
-				name: "preset",
-				message: "Which preset would you like to use?",
-				choices: Object.entries(PRESETS).map(([key, preset]) => ({
-					title: preset.name,
-					value: key,
-					disabled: !preset.frameworks.includes(options.framework)
-				})),
-				initial: 0
-			});
-			if (!preset) {
-				logger.error("Preset selection is required.");
-				process.exit(1);
-			}
-			options.preset = preset;
-		}
-		if (!options.metaframework) {
-			const { metaframework } = await prompts({
-				type: "select",
-				name: "metaframework",
-				message: "Which metaframework would you like to use (optional)?",
-				choices: [{
-					title: "None",
-					value: "none"
-				}, ...Object.entries(METAFRAMEWORKS).filter(([_, meta]) => meta.frameworks.includes(options.framework)).map(([key, meta]) => ({
-					title: meta.title,
-					value: key
-				}))],
-				initial: 0
-			});
-			options.metaframework = metaframework === "none" ? void 0 : metaframework;
-		}
-		const cwd = options.cwd;
-		if (fsExtra.existsSync(path.resolve(cwd, "components.json")) && !options.override) {
-			const { overwrite } = await prompts({
-				type: "confirm",
-				name: "overwrite",
-				message: `A ${highlighter.info("components.json")} file already exists. Would you like to overwrite it?`,
-				initial: false
-			});
-			if (!overwrite) {
-				logger.info(`  To start over, remove the ${highlighter.info("components.json")} file and run ${highlighter.info("init")} again.`);
-				logger.break();
-				process.exit(1);
-			}
-			options.override = true;
-		}
-		if (reinstallComponents.length) components = [...components, ...reinstallComponents];
+		const options = parseInitOptions(opts);
+		applyDefaultInitOptions(options);
+		validateExplicitOptions(options);
+		await promptForMissingSelections(options);
+		await ensureOverwriteAllowed(options);
 		options.components = components;
 		await loadEnvFiles(options.cwd);
 		await runInit(options);
 		logger.break();
-		logger.log(`Project initialization completed.\nYou may now add components.`);
-		process.removeListener("exit", restoreBackupOnExit);
-		deleteFileBackup(path.resolve(cwd, "components.json"));
+		logger.log(`Project initialization completed in ${highlighter.info(options.cwd)}.\nYou may now add components.`);
+		deleteFileBackup(path.resolve(options.cwd, "components.json"));
 		logger.break();
 	} catch (error) {
-		process.removeListener("exit", restoreBackupOnExit);
-		restoreBackupOnExit();
 		logger.break();
 		handleError(error);
 	} finally {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sprawlify",
-  "version": "0.0.91",
+  "version": "0.0.93",
   "type": "module",
   "description": "A command-line interface for Sprawlify.",
   "author": "sprawlify <npm@sprawlify.com>",
@@ -19,6 +19,7 @@
   "dependencies": {
     "@dotenvx/dotenvx": "^1.55.1",
     "commander": "^14.0.3",
+    "dedent": "^1.7.2",
     "fs-extra": "^11.3.4",
     "kleur": "^4.1.5",
     "prompts": "^2.4.2",