feat: Enhance CLI prompts and improve Shadcn UI setup workflow

README.md

@@ -13,7 +13,7 @@
 - **Next.js App Directory** — support for the new Next.js app directory.
 - **Custom Page Generation** — create multiple pages at once.
 - **Linter Support** — choose between no linter, ESLint, and Biome.
-- **Shadcn UI** — automatically installs and configures Shadcn UI with a default style and color.
+- **Shadcn UI** — automatically installs and configures Shadcn UI with a default style and color, **non-interactively**.
 - **Clean Project Setup** — removes default favicon and clears public folder.
 - **Empty Default Page** — overwrites the default `page.tsx` or `index.tsx` with an empty template.
 - **Dynamic Metadata** — always overwrites the `layout.tsx` or `layout.jsx` with a minimal template.
@@ -51,13 +51,15 @@ npx create-next-quick
 When you run `npx create-next-quick` without a project name, you will be prompted to:
 
 1.  **Enter Project Name** — e.g., `my-app` (or `.` to create in the current directory). If you use `.` the directory must be empty.
-2.  **Choose a package manager** — detects installed package managers (`npm`, `yarn`, `pnpm`) and prompts you to choose.
-3.  **Choose to use TypeScript (default: Yes)**
-4.  **Choose to use Tailwind CSS (default: Yes)**
-5.  **Choose to use the app directory (default: Yes)**
-6.  **Enter the names of the pages you want to create (default: none)**
-7.  **Choose a linter (default: none)**
-8.  **Choose an ORM (default: none)**
+2.  **Choose a package manager** — detects installed package managers (`npm`, `yarn`, `pnpm`) and prompts you to choose. **(Default: pnpm, logged to console)**
+3.  **Choose to use TypeScript (default: Yes, logged to console)**
+4.  **Choose to use Tailwind CSS (default: Yes, logged to console)**
+5.  **Choose to use src directory (default: Yes, logged to console)**
+6.  **Choose to use the app directory (default: Yes, logged to console)**
+7.  **Enter the names of the pages you want to create (default: none, logged to console)**
+8.  **Choose a linter (default: none, logged to console)**
+9.  **Choose an ORM (default: none, logged to console)**
+10. **Choose to use Shadcn UI (default: Yes, logged to console)****
 
 Example run:
 
@@ -69,13 +71,15 @@ npx create-next-quick
 
 ```
 ? Enter project name: my-portfolio
-? Do you want to use TypeScript? Yes
-? Do you want to use Tailwind CSS? Yes
-? Do you want to use the app directory? Yes
+Using default for package manager: pnpm
+Using default for TypeScript: Yes
+Using default for Tailwind CSS: Yes
+Using default for src directory: Yes
+Using default for app directory: Yes
 ? Enter the names of the pages you want to create (comma-separated): home, about, contact
-? Choose a linter (default: none): none
-? Choose an ORM (default: none): prisma
-? Do you want to use Shadcn UI? No
+Using default for linter: none
+Using default for ORM: none
+Using default for Shadcn UI: Yes
 ```
 
 ## CLI Demo

index.js

@@ -73,30 +73,30 @@ import { createPages, createLayout } from './lib/templates.js';
       name: "packageManager",
       message: "Choose a package manager:",
       choices: availablePackageManagers,
-      default: "pnpm"
+      default: "pnpm" || "npm" || "yarn",
     },
     {
       type: "confirm",
       name: "useTypeScript",
-      message: "Do you want to use TypeScript?",
+      message: "Do you want to use TypeScript? (default: Yes)",
       default: true
     },
     {
       type: "confirm",
       name: "useTailwind",
-      message: "Do you want to use Tailwind CSS?",
+      message: "Do you want to use Tailwind CSS? (default: Yes)",
       default: true
     },
     {
       type: "confirm",
       name: "useSrcDir",
-      message: "Do you want to use src directory?",
+      message: "Do you want to use src directory? (default: Yes)",
       default: true
     },
     {
       type: "confirm",
       name: "useAppDir",
-      message: "Do you want to use the app directory?",
+      message: "Do you want to use the app directory? (default: Yes)",
       default: true
     },
     {
@@ -123,8 +123,8 @@ import { createPages, createLayout } from './lib/templates.js';
     {
       type: "confirm",
       name: "useShadcn",
-      message: "Do you want to use Shadcn UI?",
-      default: false
+      message: "Do you want to use Shadcn UI? (default: Yes)",
+      default: true
     }
   ]);
 
@@ -218,10 +218,10 @@ import { createPages, createLayout } from './lib/templates.js';
   }
 
   const emptyPageContent = `export default function Page() {
-    return (
-      <></>
-    );
-  }`;
+  return (
+    <></>
+  );
+}`;
 
   writeFile(defaultPagePath, emptyPageContent);
 
@@ -301,11 +301,15 @@ import { createPages, createLayout } from './lib/templates.js';
     console.log(chalk.magenta("Setting up Shadcn UI..."));
 
     run(`${packageManager} install --save-dev tailwindcss-animate class-variance-authority`, projectPath);
-    run(`npx shadcn@latest init`, projectPath);
+    run(`cmd /C "echo y | npx shadcn@latest init --yes"`, projectPath);
 
     const componentsJsonPath = path.join(projectPath, "components.json");
-    const componentsJsonContent = {
-      "$schema": "https://ui.shadcn.com/schema.json",
+    let existingComponentsJson = {};
+    if (fs.existsSync(componentsJsonPath)) {
+      existingComponentsJson = JSON.parse(fs.readFileSync(componentsJsonPath, "utf8"));
+    }
+
+    const customComponentsJsonContent = {
       "style": "default",
       "rsc": useAppDir,
       "tsx": useTypeScript,
@@ -322,7 +326,9 @@ import { createPages, createLayout } from './lib/templates.js';
         "utils": "@/lib/utils"
       }
     };
-    writeFile(componentsJsonPath, JSON.stringify(componentsJsonContent, null, 2));
+
+    const mergedComponentsJsonContent = Object.assign({}, existingComponentsJson, customComponentsJsonContent);
+    writeFile(componentsJsonPath, JSON.stringify(mergedComponentsJsonContent, null, 2));
 
     console.log(chalk.bold.green("Shadcn UI configured"));
   }
@@ -341,6 +347,6 @@ import { createPages, createLayout } from './lib/templates.js';
   console.log(chalk.cyan(`  cd ${chalk.bold.white(projectName)}`));
   console.log(chalk.cyan(`  ${packageManager} ${chalk.bold.white(`run dev`)}`));
   console.log();
-  console.log(chalk.white.bold(`Thank you for using create-next-quick!✨`));
+  console.log(chalk.white.bold(`Thank you for using create-next-quick!`));
   console.log();
 })();