create-next-mui 0.1.1 → 0.1.3

package/README.md

@@ -1,122 +1,209 @@
-<img width="1420" height="308" alt="CREATE-NEXT-MUI-BANNER" src="https://github.com/user-attachments/assets/11e72fc8-6b6d-40c4-97a1-c05f7b943e02" />
+<img width="1420" alt="CREATE-NEXT-MUI-BANNER" src="https://github.com/user-attachments/assets/11e72fc8-6b6d-40c4-97a1-c05f7b943e02" />
 
-# create-next-mui 🚀
+# create-next-mui
 
 [![npm version](https://img.shields.io/npm/v/create-next-mui?style=flat&logo=npm&color=CB3837)](https://www.npmjs.com/package/create-next-mui)
-[![Next.js v19](https://img.shields.io/badge/Next.js-v19-000000?style=flat&logo=nextdotjs&logoColor=white)](https://nextjs.org/)
-[![MUI v9](https://img.shields.io/badge/MUI-v9-007FFF?style=flat&logo=mui&logoColor=white)](https://mui.com/)
+[![Next.js](https://img.shields.io/badge/Next.js-v19-000000?style=flat&logo=nextdotjs&logoColor=white)](https://nextjs.org/)
+[![MUI](https://img.shields.io/badge/MUI-v9-007FFF?style=flat&logo=mui&logoColor=white)](https://mui.com/)
 
-A blazing-fast, interactive CLI tool to instantly scaffold production-ready **Next.js** applications pre-configured with **Material UI (MUI)**, robust theme providers, and an elite architectural linting layout.
+Scaffold a production-ready **Next.js + Material UI** application in seconds.
 
-Stop wasting time wiring up Emotion caches, Next.js App Router layout configs, or sorting your imports manually. Launch your next project perfectly in under 10 seconds.
+The generated project comes preconfigured with:
+
+- ⚡ Next.js App Router
+- 🎨 Material UI
+- 📦 TypeScript or JavaScript templates
+- 🧹 ESLint Flat Config
+- 📁 Scalable project structure
+
+No global installation required.
 
 ---
 
-## 🚀 Quick Start
+# Quick Start
+
+Create a new project:
+
+```bash
+npx create-next-mui my-app
+```
 
-You don't need to install anything globally. Just run the following command in your terminal:
+or
 
 ```bash
-npx create-next-mui my-next-mui-app
+npm init next-mui
+```
 
-# or use prompts
+If no project name is provided, the CLI will guide you through the setup interactively.
 
+```bash
 npx create-next-mui
+```
 
-# or 
+---
 
-npm init next-mui
+# Non-interactive Mode
+
+Use the `--yes` (or `-y`) flag to skip prompts and accept the default configuration.
+
+```bash
+npx create-next-mui my-app --yes
 ```
 
-Passing a project name creates that folder and uses the same name in the generated project metadata. If you omit the name, the interactive prompt engine (powered by `@clack/prompts`) will guide you through naming your project and selecting your preferred flavor.
+This will automatically:
 
----
+- use the provided project name
+- select the **TypeScript** template
+- generate the project without prompting
 
-## ✨ Key Features
+This is especially useful for:
 
-- **⚡ Modern Architecture:** Built natively on top of the Next.js App Router structure.
-- **🎨 Material UI Ready:** Seamless compilation of MUI components inside Server and Client Components with pre-configured UI themes.
-- **🧩 Dual-Template Architecture:** Full support for both **TypeScript** and **JavaScript** boilerplates.
-- **🧼 Perfectionist Linting Config:** Pre-packaged with **ESLint v9 Flat Config** (`eslint.config.mjs`) utilizing `eslint-plugin-perfectionist` and `eslint-plugin-unused-imports`.
-- **📦 Pure & Lightweight:** Zero bloat. Template files are automatically stripped of development artifacts (`node_modules`, caches) before build deployment.
+- CI/CD pipelines
+- automation scripts
+- testing
+- quick project generation
 
 ---
 
-## 📦 Choice of Flavors
+# Interactive Setup
+
+Without `--yes`, the CLI walks you through the available options.
 
-During the prompt sequence, you can choose between two completely separate architectures, both fine-tuned for high-performance builds:
+Current prompts include:
 
-1. **TypeScript Template (`next-mui-template-ts`)** – Out-of-the-box strong typing, custom theme module augmentations, and strict `@typescript-eslint` checking.
-2. **JavaScript Template (`next-mui-template-js`)** – Lightweight, clean vanilla ES modern syntax with optimized configuration overhead.
+- Project name
+- Language selection
+  - TypeScript (recommended)
+  - JavaScript
 
 ---
 
-## 📐 Generated Project Structure
+# Available Templates
+
+## TypeScript
+
+Recommended for most projects.
+
+Includes:
+
+- TypeScript
+- strict type checking
+- MUI theme typings
+- ESLint Flat Config
+
+## JavaScript
 
-No matter which path you choose, `create-next-mui` prints out an organized, production-grade layout optimized for scalability:
+For developers who prefer JavaScript.
+
+Includes:
+
+- modern JavaScript
+- Material UI
+- ESLint Flat Config
+
+---
+
+# Generated Project Structure
 
 ```text
-my-awesome-app/
+my-app/
 ├── src/
 │   ├── app/
-│   │   ├── layout.js/ts      # Handles App Router initialization & MUI Cache Provider
-│   │   └── page.js/ts        # Pre-built home view utilizing responsive MUI layouts
-│   ├── components/           # Reusable global presentation components
+│   ├── components/
 │   └── theme/
-│       ├── index.js/ts       # Deep theme customization (palette, typography, overrides)
-│       └── theme-provider.js # Keeps layout tree hydrations isolated and performant
-├── eslint.config.mjs         # Elite natural line-length linting layout
-├── next.config.js            # Configured optimization vectors
+├── eslint.config.mjs
+├── next.config.js
 ├── package.json
 └── README.md
-
 ```
 
 ---
 
-## 🎨 Elite Linting Layout (Perfectionist Grouping)
+# What's Included
 
-Both boilerplate environments contain a fine-tuned, strict importing arrangement rule framework using `line-length` natural alpha sorting. Your files are automatically linted and organized cleanly on save down this architectural chain:
+Every generated project comes configured with:
 
-1. **React Core APIs** (`react`)
-2. **Next.js Framework Hooks & Context** (`next/*`)
-3. **Material UI Design Tokens & Engine** (`@mui/*`, `@emotion/*`)
-4. **External Third-Party Libraries**
-5. **Internal Layer Architectures** (`@/types`, `@/lib`, `@/components`, `@/theme`)
+- Next.js App Router
+- Material UI
+- Theme Provider
+- Emotion integration
+- ESLint v9 Flat Config
+- eslint-plugin-perfectionist
+- eslint-plugin-unused-imports
+- organized project structure
 
-Say goodbye to disorganized, messy blocks of import statements!
+Development artifacts such as `node_modules`, `.next`, and build caches are excluded from generated projects.
 
 ---
 
-## ⚙️ Development Scripts
+# Getting Started
 
-Once your scaffolding finishes generating, step inside your directory and run the standard lifecycle workflows:
+After scaffolding:
 
 ```bash
-# Install dependencies
+cd my-app
 npm install
+npm run dev
+```
+
+Useful scripts:
 
-# Boot up local development server
+```bash
 npm run dev
+```
 
-# Run ESLint validation checks with automated file ordering adjustment
+Start the development server.
+
+```bash
 npm run lint
+```
+
+Run ESLint.
 
-# Compile production-ready code bundles
+```bash
 npm run build
+```
+
+Create a production build.
+
+---
+
+# CLI Reference
+
+## Create a project
 
+```bash
+npx create-next-mui my-app
+```
+
+## Interactive mode
+
+```bash
+npx create-next-mui
+```
+
+## Accept defaults
+
+```bash
+npx create-next-mui my-app --yes
+```
+
+or
+
+```bash
+npx create-next-mui my-app -y
 ```
 
 ---
 
-## 🤝 Contributing & Feedback
+# Contributing
 
-Issues and pull requests are highly welcome! If you want to expand the templates or suggest additional components, feel free to open an issue or submit a pull request on the official repository.
+Issues and pull requests are welcome.
 
-Maintained with 💻 by [thatonevikash](https://github.com/thatonevikash).
+If you'd like to improve the templates or add new features, feel free to open an issue or submit a PR.
 
 ---
 
-## 📜 License
+# License
 
-This project is licensed under the MIT License - see the LICENSE file for details.
+MIT

package/{next-mui-template-ts → next-mui-templates/base-js}/package-lock.json

@@ -1,11 +1,11 @@
 {
-  "name": "next-mui-template",
+  "name": "create-next-mui",
   "version": "0.0.1",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
-      "name": "next-mui-template",
+      "name": "create-next-mui",
       "version": "0.0.1",
       "dependencies": {
         "@emotion/react": "^11.14.0",
@@ -276,9 +276,9 @@
       }
     },
     "node_modules/@emnapi/wasi-threads": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/@emnapi/wasi-threads/-/wasi-threads-1.2.1.tgz",
-      "integrity": "sha512-uTII7OYF+/Mes/MrcIOYp5yOtSMLBWSIoLPpcgwipoiKbli6k322tcoFsxoIIxPDqW01SQGAgko4EzZi2BNv2w==",
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/@emnapi/wasi-threads/-/wasi-threads-1.2.2.tgz",
+      "integrity": "sha512-c95qOXkHdydNKhscBTebqEC1CVAZpyqOfVfBzQ1qgzyl3gfeldUjIggDbIZgDKsHLgnsM+igH7TJ/eAasaVuMA==",
       "dev": true,
       "license": "MIT",
       "optional": true,
@@ -2312,6 +2312,40 @@
         "node": ">=14.0.0"
       }
     },
+    "node_modules/@unrs/resolver-binding-wasm32-wasi/node_modules/@emnapi/core": {
+      "version": "1.10.0",
+      "resolved": "https://registry.npmjs.org/@emnapi/core/-/core-1.10.0.tgz",
+      "integrity": "sha512-yq6OkJ4p82CAfPl0u9mQebQHKPJkY7WrIuk205cTYnYe+k2Z8YBh11FrbRG/H6ihirqcacOgl2BIO8oyMQLeXw==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "dependencies": {
+        "@emnapi/wasi-threads": "1.2.1",
+        "tslib": "^2.4.0"
+      }
+    },
+    "node_modules/@unrs/resolver-binding-wasm32-wasi/node_modules/@emnapi/runtime": {
+      "version": "1.10.0",
+      "resolved": "https://registry.npmjs.org/@emnapi/runtime/-/runtime-1.10.0.tgz",
+      "integrity": "sha512-ewvYlk86xUoGI0zQRNq/mC+16R1QeDlKQy21Ki3oSYXNgLb45GV1P6A0M+/s6nyCuNDqe5VpaY84BzXGwVbwFA==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "dependencies": {
+        "tslib": "^2.4.0"
+      }
+    },
+    "node_modules/@unrs/resolver-binding-wasm32-wasi/node_modules/@emnapi/wasi-threads": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/@emnapi/wasi-threads/-/wasi-threads-1.2.1.tgz",
+      "integrity": "sha512-uTII7OYF+/Mes/MrcIOYp5yOtSMLBWSIoLPpcgwipoiKbli6k322tcoFsxoIIxPDqW01SQGAgko4EzZi2BNv2w==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "dependencies": {
+        "tslib": "^2.4.0"
+      }
+    },
     "node_modules/@unrs/resolver-binding-win32-arm64-msvc": {
       "version": "1.12.2",
       "resolved": "https://registry.npmjs.org/@unrs/resolver-binding-win32-arm64-msvc/-/resolver-binding-win32-arm64-msvc-1.12.2.tgz",

package/{next-mui-template-js → next-mui-templates/base-js}/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "next-mui-template",
+  "name": "create-next-mui",
   "version": "0.0.1",
   "private": true,
   "scripts": {

package/{next-mui-template-js → next-mui-templates/base-ts}/package-lock.json

@@ -276,9 +276,9 @@
       }
     },
     "node_modules/@emnapi/wasi-threads": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/@emnapi/wasi-threads/-/wasi-threads-1.2.1.tgz",
-      "integrity": "sha512-uTII7OYF+/Mes/MrcIOYp5yOtSMLBWSIoLPpcgwipoiKbli6k322tcoFsxoIIxPDqW01SQGAgko4EzZi2BNv2w==",
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/@emnapi/wasi-threads/-/wasi-threads-1.2.2.tgz",
+      "integrity": "sha512-c95qOXkHdydNKhscBTebqEC1CVAZpyqOfVfBzQ1qgzyl3gfeldUjIggDbIZgDKsHLgnsM+igH7TJ/eAasaVuMA==",
       "dev": true,
       "license": "MIT",
       "optional": true,
@@ -2312,6 +2312,40 @@
         "node": ">=14.0.0"
       }
     },
+    "node_modules/@unrs/resolver-binding-wasm32-wasi/node_modules/@emnapi/core": {
+      "version": "1.10.0",
+      "resolved": "https://registry.npmjs.org/@emnapi/core/-/core-1.10.0.tgz",
+      "integrity": "sha512-yq6OkJ4p82CAfPl0u9mQebQHKPJkY7WrIuk205cTYnYe+k2Z8YBh11FrbRG/H6ihirqcacOgl2BIO8oyMQLeXw==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "dependencies": {
+        "@emnapi/wasi-threads": "1.2.1",
+        "tslib": "^2.4.0"
+      }
+    },
+    "node_modules/@unrs/resolver-binding-wasm32-wasi/node_modules/@emnapi/runtime": {
+      "version": "1.10.0",
+      "resolved": "https://registry.npmjs.org/@emnapi/runtime/-/runtime-1.10.0.tgz",
+      "integrity": "sha512-ewvYlk86xUoGI0zQRNq/mC+16R1QeDlKQy21Ki3oSYXNgLb45GV1P6A0M+/s6nyCuNDqe5VpaY84BzXGwVbwFA==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "dependencies": {
+        "tslib": "^2.4.0"
+      }
+    },
+    "node_modules/@unrs/resolver-binding-wasm32-wasi/node_modules/@emnapi/wasi-threads": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/@emnapi/wasi-threads/-/wasi-threads-1.2.1.tgz",
+      "integrity": "sha512-uTII7OYF+/Mes/MrcIOYp5yOtSMLBWSIoLPpcgwipoiKbli6k322tcoFsxoIIxPDqW01SQGAgko4EzZi2BNv2w==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "dependencies": {
+        "tslib": "^2.4.0"
+      }
+    },
     "node_modules/@unrs/resolver-binding-win32-arm64-msvc": {
       "version": "1.12.2",
       "resolved": "https://registry.npmjs.org/@unrs/resolver-binding-win32-arm64-msvc/-/resolver-binding-win32-arm64-msvc-1.12.2.tgz",

package/{next-mui-template-ts → next-mui-templates/base-ts}/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "next-mui-template",
+  "name": "create-next-mui",
   "version": "0.0.1",
   "private": true,
   "scripts": {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-next-mui",
-  "version": "0.1.1",
+  "version": "0.1.3",
   "description": "spin up your nextjs project with mui setup",
   "keywords": [
     "nextjs",
@@ -23,8 +23,7 @@
   },
   "files": [
     "src",
-    "next-mui-template-ts",
-    "next-mui-template-js"
+    "next-mui-templates"
   ],
   "main": "index.js",
   "scripts": {
@@ -32,7 +31,6 @@
   },
   "dependencies": {
     "@clack/prompts": "^1.5.0",
-    "degit": "^3.3.2",
     "picocolors": "^1.1.1"
   }
 }

package/src/index.js

@@ -6,12 +6,54 @@ import fs from "node:fs/promises";
 import path from "node:path";
 import { fileURLToPath } from "node:url";
 
-// Resolve the directory where this CLI package actually lives on the user's system
+// ----------------------------------------------------------------------
+
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = path.dirname(__filename);
 
-const initialProjectName = process.argv[2];
-const hasInitialProjectName = typeof initialProjectName === "string";
+const args = process.argv.slice(2);
+
+const positionalArgs = args.filter(
+  (arg) => !["--yes", "-y", "--js"].includes(arg),
+);
+
+const PROJECT_NAME = positionalArgs[0];
+const hasInitialProjectName = PROJECT_NAME !== undefined;
+
+const hasYesFlag = args.includes("--yes") || args.includes("-y");
+const hasJsFlag = args.includes("--js");
+
+const DEFAULT_LANGUAGE = hasJsFlag ? "js" : "ts";
+
+// ----------------------------------------------------------------------
+
+const LANG = [
+  {
+    value: "ts",
+    label: "TypeScript (Recommended)",
+    hint: "Strict typings, clean architecture",
+  },
+  {
+    value: "js",
+    label: "JavaScript",
+    hint: "Vanilla JS configuration",
+  },
+];
+
+const FEATURES = [
+  {
+    value: "react-query",
+    label: "React Query",
+    hint: "TanStack Query configuration",
+  },
+  {
+    value: "zustand",
+    label: "Zustand",
+    hint: "Lightweight global state management",
+  },
+];
+
+// ----------------------------------------------------------------------
 
 function validateProjectName(value) {
   if (value.length === 0) return "Project name is required!";
@@ -48,19 +90,21 @@ async function updateProjectName(targetProjectDir, packageName) {
         await fs.writeFile(filePath, `${JSON.stringify(json, null, 2)}\n`);
       } catch (error) {
         if (error.code === "ENOENT") return;
-
         throw error;
       }
     }),
   );
 }
 
+// ----------------------------------------------------------------------
+
 async function main() {
   console.clear();
+
   p.intro(color.bgBlue(color.white("  create-next-mui  ")));
 
   const projectNameError = hasInitialProjectName
-    ? validateProjectName(initialProjectName)
+    ? validateProjectName(PROJECT_NAME)
     : undefined;
 
   if (projectNameError) {
@@ -72,28 +116,29 @@ async function main() {
     {
       name: () =>
         hasInitialProjectName
-          ? Promise.resolve(initialProjectName)
+          ? Promise.resolve(PROJECT_NAME)
           : p.text({
               message: "What is your project name?",
               placeholder: "my-next-mui-app (or '.' for current directory)",
               validate: validateProjectName,
             }),
+
       language: () =>
-        p.select({
-          message: "Choose your language flavor:",
-          options: [
-            {
-              value: "ts",
-              label: "TypeScript (Recommended)",
-              hint: "Strict typings, clean architecture",
-            },
-            {
-              value: "js",
-              label: "JavaScript",
-              hint: "Vanilla JS configuration",
-            },
-          ],
-        }),
+        hasYesFlag
+          ? Promise.resolve(DEFAULT_LANGUAGE)
+          : p.select({
+              message: "Choose your language flavor:",
+              options: LANG,
+            }),
+
+      features: () =>
+        hasYesFlag
+          ? Promise.resolve([])
+          : p.multiselect({
+              message: "Select optional features:",
+              required: false,
+              options: FEATURES,
+            }),
     },
     {
       onCancel: () => {
@@ -103,71 +148,110 @@ async function main() {
     },
   );
 
-  // Define local source paths (inside this CLI package folder)
-  const templateFolderName =
-    project.language === "ts" ? "next-mui-template-ts" : "next-mui-template-js";
-  const sourceTemplateDir = path.resolve(__dirname, "..", templateFolderName);
+  // --------------------------------------------------------------------
+  // Paths
+  // --------------------------------------------------------------------
+
+  const baseTemplateDir = path.resolve(
+    __dirname,
+    "..",
+    "next-mui-templates",
+    `base-${project.language}`,
+  );
 
-  // Define destination paths (where the user is running the command)
   const targetProjectDir = path.resolve(process.cwd(), project.name);
+
   const packageName = getPackageName(project.name, targetProjectDir);
 
-  // If targeting current directory, make sure it's clean
+  // --------------------------------------------------------------------
+  // Current directory validation
+  // --------------------------------------------------------------------
+
   if (project.name === ".") {
     try {
-      const existingFiles = await fs.readdir(targetProjectDir);
-      if (existingFiles.length > 0) {
+      const files = await fs.readdir(targetProjectDir);
+
+      if (files.length > 0) {
         p.log.error(
           color.red(
-            "The current directory is not empty! Please clear it or specify a project name.",
+            "The current directory is not empty! Please clear it or specify another project name.",
           ),
         );
+
         process.exit(1);
       }
-    } catch (err) {
-      // If the directory reading fails completely, we exit safely
+    } catch {
       process.exit(1);
     }
   }
 
+  // --------------------------------------------------------------------
+
   const s = p.spinner();
-  s.start("Unboxing your Next.js + MUI foundation locally...");
+
+  s.start("Scaffolding your Next.js + MUI workspace...");
 
   try {
-    // Native high-speed recursive copy
-    await fs.cp(sourceTemplateDir, targetProjectDir, {
+    // ------------------------------------------------------------------
+    // Copy base template
+    // ------------------------------------------------------------------
+
+    await fs.cp(baseTemplateDir, targetProjectDir, {
       recursive: true,
       filter: (src) => {
-        const targetName = path.basename(src);
-        return (
-          targetName !== "node_modules" &&
-          targetName !== ".next" &&
-          targetName !== "out" &&
-          targetName !== "build"
-        );
+        const name = path.basename(src);
+
+        return !["node_modules", ".next", "out", "build"].includes(name);
       },
     });
+
+    // ------------------------------------------------------------------
+    // Apply selected features
+    // ------------------------------------------------------------------
+
+    for (const feature of project.features) {
+      const featureDir = path.resolve(
+        __dirname,
+        "..",
+        "next-mui-features",
+        feature,
+        project.language,
+      );
+
+      await fs.cp(featureDir, targetProjectDir, {
+        recursive: true,
+        filter: (src) => {
+          const name = path.basename(src);
+
+          return !["node_modules", ".next", "out", "build"].includes(name);
+        },
+      });
+    }
+
+    // ------------------------------------------------------------------
+
     await updateProjectName(targetProjectDir, packageName);
 
     s.stop(color.green("Workspace scaffolded successfully!"));
   } catch (error) {
-    s.stop(color.red("Failed to build workspace structure."));
-    p.note(color.yellow(`Error details: ${error.message}`), "Troubleshooting:");
+    s.stop(color.red("Failed to scaffold workspace."));
+
+    p.note(color.yellow(error.message), "Troubleshooting");
+
     process.exit(1);
   }
 
-  // Clear instructions for the developer
-  const isCurrentDir = project.name === ".";
-  const cdInstruction = isCurrentDir
-    ? ""
-    : `${color.cyan(`cd ${project.name}`)}\n`;
+  // --------------------------------------------------------------------
+
+  const cd =
+    project.name === "." ? "" : `${color.cyan(`cd ${project.name}`)}\n`;
 
   p.note(
-    `${cdInstruction}${color.cyan("npm install")}\n${color.cyan("npm run dev")}`,
-    "Next Steps to Get Started:",
+    `${cd}${color.cyan("npm install")}\n${color.cyan("npm run dev")}`,
+    "Next Steps",
   );
 
-  p.outro(`✨ Code cleanly, sort perfectly. Built with create-next-mui!`);
+  p.outro("✨ Build clean and fast with create-next-mui!");
 }
 
 main().catch(console.error);