nextworks 0.1.0-alpha.9 → 0.2.0-alpha.2

package/README.md

@@ -3,154 +3,155 @@
 Nextworks is a CLI that installs **modular Next.js building blocks** into your app:
 
 - **Blocks** – UI sections, templates, and core UI primitives.
-- **Auth Core** – Email/password auth (NextAuth + Prisma), basic dashboard, and helpers.
-- **Forms** – Opinionated form primitives built on React Hook Form + Zod.
-- **Data** – Example CRUD for Users + Posts with admin UI, wired to Auth + Prisma.
 
 > **Status:** early‑access alpha. Expect rough edges and breaking changes between alpha releases.
 >
-> In this alpha, the most reliable setup is to install **Blocks** first using:
+> **Package manager:** npm only (for now).
 >
-> ```bash
-> npx nextworks add blocks --sections --templates
-> ```
+> In this alpha, the most reliable setup is:
+>
+> 1. Create a new Next.js project (App Router **or** Pages Router):
+>
+>    ```bash
+>    npx create-next-app@latest
+>    ```
+>
+> 2. From your app root, install **Blocks**:
+>
+>    ```bash
+>    npx nextworks@latest add blocks --sections --templates
+>    ```
 >
-> and then add **Auth Core**, **Forms**, and **Data** on top. Partial setups (e.g. Auth/Data without Blocks) may require manual tweaks and are not yet fully supported.
+>    Non-interactive / CI-friendly:
+>
+>    ```bash
+>    npx nextworks@latest add blocks --sections --templates --yes
+>    ```
+>
+> 3. Optionally, adjust flags to install only what you want (UI-only, sections, templates).
 
 ---
 
-## Feedback / Contact
+## Safety (read this first)
 
-Nextworks is early‑access alpha and I’m actively looking for feedback from early testers. If you run into issues, have questions, or want to suggest improvements or pro‑level features, I’m happy to help and would really appreciate hearing from you:
+`nextworks` installs kits by copying files into your Next.js project. If a destination path already exists, kit installs may **overwrite** your files.
 
-- Email: nextjsworks@gmail.com
+Before running installs, strongly consider:
 
----
-
-## Install and run the CLI
+- **Commit first**, then install:
+  - `git add -A && git commit -m "baseline"`
+- Review changes after install:
+  - `git diff --name-status`
+- To undo everything quickly:
+  - `git reset --hard`
+  - (optional) remove untracked files created by installs: `git clean -fd`
 
-From your Next.js app root, use `npx`:
+Kits may also:
 
-```bash
-npx nextworks --help
-```
+- **merge dependencies** into `package.json`
+- **edit your router entrypoint** (Blocks):
+  - App Router: `app/layout.tsx`
+  - Pages Router: `pages/_app.tsx` (and may create/update `pages/_document.tsx`)
+- create/update `.nextworks/config.json`
 
-Example commands:
+For a transparent breakdown of what each kit writes/edits, see:
 
-```bash
-npx nextworks add blocks --sections --templates
-npx nextworks add auth-core
-npx nextworks add forms
-npx nextworks add data
-```
+- https://github.com/jblh/nextworks-cli/blob/main/docs/FILE_CHANGES.md
 
 ---
 
-## Getting started in an existing Next.js app
+## Feedback
 
-Prerequisites:
+Nextworks is early‑access alpha and I’m actively looking for feedback from early testers.
 
-- A Next.js App Router project (e.g. from `create-next-app`).
-- TypeScript + Tailwind recommended.
-- A **PostgreSQL database** if you plan to use **Auth Core** and **Data**.
-  - The kits are designed and tested with Postgres using a database hosted on [Neon](https://neon.tech/).
+### Where to post feedback
 
-From your app root:
+- **Start here (installation + where to post feedback):** https://github.com/jblh/nextworks-cli/discussions/1
+- **Alpha feedback thread (what broke / what’s missing):** https://github.com/jblh/nextworks-cli/discussions/2
 
-### 1) Install Blocks (UI kit)
+### Bug reports
 
-```bash
-npx nextworks add blocks --sections --templates
-```
+For reproducible bugs / errors (especially install/runtime issues), please open a GitHub Issue using the templates in `.github/ISSUE_TEMPLATE/`.
 
-This copies:
+### Private contact (optional)
 
-- `components/ui/*` (core UI primitives)
-- `components/sections/*` (reusable sections)
-- Page templates under `app/templates/*`
-- Theme helpers and `app/globals.css` (if not already present)
+If you need to share something privately (e.g. security-related), email: nextjsworks@gmail.com
 
-After this step you should be able to start your dev server and visit:
+---
 
-- `/` (if wired as the home page), or
-- `/templates/productlaunch`, `/templates/saasdashboard`, `/templates/digitalagency`
+## Install and run the CLI
 
-### 2) Add Auth Core
+From your Next.js app root, use `npx`:
 
 ```bash
-npx nextworks add auth-core
+npx nextworks@latest --help
 ```
 
-Then:
-
-1. Copy and edit your environment variables:
-
-   ```bash
-   cp .env.example .env
-   ```
-
-   Set at minimum:
-
-   ```bash
-   DATABASE_URL=postgres://...
-   NEXTAUTH_URL=http://localhost:3000
-   NEXTAUTH_SECRET=your-strong-secret
-   ```
-
-2. Install Prisma (if you haven’t already):
-
-   ```bash
-   npm install @prisma/client prisma
-   ```
-
-3. Run Prisma:
-
-   ```bash
-   npx prisma generate
-   npx prisma migrate dev -n init
-   ```
-
-Start your dev server:
+Example commands:
 
 ```bash
-npm run dev
+npx nextworks@latest add blocks --sections --templates
+npx nextworks@latest add blocks --sections --templates --yes  # non-interactive / CI
 ```
 
-Visit:
+---
 
-- `/auth/signup`
-- `/auth/login`
-- `/dashboard` (protected)
+## Getting started in an existing Next.js app
 
-### 3) Add Forms (optional)
+Prerequisites:
 
-```bash
-npx nextworks add forms
-```
+- A Next.js project (App Router **or** Pages Router).
+- TypeScript required.
+- Tailwind CSS required (the Blocks kit and templates rely on Tailwind classes).
 
-This adds form primitives and example pages:
+From your app root:
 
-- `/examples/forms/basic`
-- `/examples/forms/server-action`
-- `/examples/forms/wizard`
+### 1) Install Blocks (UI kit)
 
-### 4) Add Data (optional, requires Auth Core)
+Non-interactive / CI-friendly (auto-accept defaults where possible):
 
 ```bash
-npx nextworks add data
+npx nextworks@latest add blocks --sections --templates --yes
 ```
 
-Make sure your Prisma migrations are up to date:
+> **Turbopack / Next 16 note (fonts + AppProviders)**
+>
+> Shared packages intentionally avoid importing `next/font/*`.
+> Fonts are configured directly in your app’s router entrypoint (the CLI patches this for you):
+>
+> - App Router: `app/layout.tsx`
+> - Pages Router: `pages/_app.tsx`
+>   This avoids Turbopack dev issues related to internal Next font modules.
+>
+> If you ever see a font-related Turbopack error after upgrades or manual edits, re-run:
+>
+> ```bash
+> npx nextworks@latest add blocks --sections --templates
+> ```
+>
+> to re-apply the patch, and ensure your router entrypoint contains a valid
+> `import { ... } from "next/font/google";` plus the corresponding `const geistSans = ...` etc.
+>
+> - App Router: `app/layout.tsx`
+> - Pages Router: `pages/_app.tsx`
 
 ```bash
-npx prisma generate
-npx prisma migrate dev
+npx nextworks@latest add blocks --sections --templates
 ```
 
-Then visit:
+This copies:
+
+- `components/ui/*` (core UI primitives)
+- `components/sections/*` (reusable sections)
+- Templates (router-native):
+  - App Router projects: `app/templates/*`
+  - Pages Router projects: `pages/templates/<template>/index.tsx`
+- Theme helpers and `app/globals.css` (if not already present)
+
+After this step you should be able to start your dev server and visit:
 
-- `/admin/posts`
-- `/admin/users`
+- `/` (if wired as the home page), or
+- `/templates/productlaunch`, `/templates/saasdashboard`, `/templates/digitalagency`
 
 ---
 
@@ -159,15 +160,21 @@ Then visit:
 For a full UI kit including core primitives, sections, and templates, use:
 
 ```bash
-npx nextworks add blocks --sections --templates
+npx nextworks@latest add blocks --sections --templates
+```
+
+Non-interactive / CI-friendly:
+
+```bash
+npx nextworks@latest add blocks --sections --templates --yes
 ```
 
 If you want finer control:
 
-- `npx nextworks add blocks --ui-only` – install core UI primitives only (no sections/templates).
-- `npx nextworks add blocks --sections` – install core + sections only.
-- `npx nextworks add blocks --templates` – install core + templates only.
-- `npx nextworks add blocks --sections --templates` – install core + sections + templates.
+- `npx nextworks@latest add blocks --ui-only` – install core UI primitives only (no sections/templates).
+- `npx nextworks@latest add blocks --sections` – install core + sections only.
+- `npx nextworks@latest add blocks --templates` – install core + templates only.
+- `npx nextworks@latest add blocks --sections --templates` – install core + sections + templates.
 
 ---
 
@@ -176,41 +183,29 @@ If you want finer control:
 You can add a short “Nextworks setup” section to your app README:
 
 ```md
-### Nextworks setup (Blocks + Auth + optional Forms/Data)
+### Nextworks setup (Blocks)
 
 1. Install and run the CLI from your Next.js app root:
 
-   npx nextworks add blocks --sections --templates
-   npx nextworks add auth-core
-
-2. Copy environment variables:
-
-   cp .env.example .env
-
-   Set DATABASE_URL, NEXTAUTH_URL, NEXTAUTH_SECRET (and any OAuth or email provider vars you need).
-
-3. Install Prisma (if not present) and run migrations:
+   npx nextworks@latest add blocks --sections --templates
 
-   npm install @prisma/client prisma
-   npx prisma generate
-   npx prisma migrate dev -n init
+   # CI / non-interactive:
 
-4. (Optional) Add Forms and Data kits:
+   npx nextworks@latest add blocks --sections --templates --yes
 
-   npx nextworks add forms
-   npx nextworks add data
-   npx prisma generate
-   npx prisma migrate dev -n init_data
-
-5. Start dev server:
+2. Start dev server:
 
    npm run dev
 
-6. Try these routes:
-   - `/` or `/templates/productlaunch` (Blocks template)
-   - `/auth/signup`, `/auth/login`, `/dashboard` (Auth)
-   - `/examples/forms/basic` (if you ran `npx nextworks add forms`)
-   - `/admin/posts`, `/admin/users` (if you ran `npx nextworks add data`)
+3. Try these routes:
+   - `/templates/productlaunch`
+   - `/templates/saasdashboard`
+   - `/templates/digitalagency`
+   - `/templates/gallery`
+
+   Template files live at:
+   - App Router: `app/templates/...`
+   - Pages Router: `pages/templates/<template>/index.tsx`
 ```
 
 ---
@@ -228,27 +223,6 @@ the MIT License.
 
 ## Troubleshooting
 
-- **Prisma errors or missing migrations**
-
-  Ensure you’ve run:
-
-  ```bash
-  npx prisma generate
-  npx prisma migrate dev
-  ```
-
-  and that `DATABASE_URL` in `.env` points to a reachable PostgreSQL instance.
-
-- **Auth routes 404**
-
-  Make sure you ran:
-
-  ```bash
-  npx nextworks add auth-core
-  ```
-
-  from your app root, and restart your dev server.
-
 - **Type errors from imported components**
 
   Confirm your project is using TypeScript and that your TypeScript config picks up the new `components/` and `lib/` paths.

package/dist/cli_manifests/blocks_manifest.json

@@ -27,11 +27,15 @@
         "components/ui/theme-toggle.tsx",
         "components/ui/toaster.tsx",
         "components/enhanced-theme-provider.tsx",
+        "components/providers/BlocksAppProviders.tsx",
         "components/app-providers.tsx",
+        "components/app-providers.app.tsx",
+        "components/app-providers.pages.tsx",
         "components/theme-provider.tsx",
         "lib/themes.ts",
         "lib/utils.ts",
         "app/globals.css",
+        "app/tw-animate.css",
         "next.config.ts",
         ".nextworks/docs/THEME_GUIDE.md",
         ".nextworks/docs/BLOCKS_README.md",
@@ -85,11 +89,15 @@
         "components/ui/theme-toggle.tsx",
         "components/ui/toaster.tsx",
         "components/enhanced-theme-provider.tsx",
+        "components/providers/BlocksAppProviders.tsx",
         "components/app-providers.tsx",
+        "components/app-providers.app.tsx",
+        "components/app-providers.pages.tsx",
         "components/theme-provider.tsx",
         "lib/themes.ts",
         "lib/utils.ts",
         "app/globals.css",
+        "app/tw-animate.css",
         "next.config.ts",
 
         "app/templates/productlaunch/page.tsx",

package/dist/commands/blocks.d.ts

@@ -3,6 +3,8 @@ export interface AddBlocksOptions {
     templates?: boolean;
     gallery?: boolean;
     uiOnly?: boolean;
+    /** Skip interactive prompts and accept defaults. */
+    yes?: boolean;
 }
 export declare function addBlocks(options?: AddBlocksOptions): Promise<void>;
 //# sourceMappingURL=blocks.d.ts.map

package/dist/commands/blocks.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"blocks.d.ts","sourceRoot":"","sources":["../../src/commands/blocks.ts"],"names":[],"mappings":"AAyBA,MAAM,WAAW,gBAAgB;IAC/B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,wBAAsB,SAAS,CAAC,OAAO,GAAE,gBAAqB,GAAG,OAAO,CAAC,IAAI,CAAC,CA2Q7E"}
+{"version":3,"file":"blocks.d.ts","sourceRoot":"","sources":["../../src/commands/blocks.ts"],"names":[],"mappings":"AA4BA,MAAM,WAAW,gBAAgB;IAC/B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,oDAAoD;IACpD,GAAG,CAAC,EAAE,OAAO,CAAC;CACf;AAED,wBAAsB,SAAS,CAAC,OAAO,GAAE,gBAAqB,GAAG,OAAO,CAAC,IAAI,CAAC,CAya7E"}

package/dist/commands/blocks.js

@@ -1,4 +1,37 @@
 "use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
@@ -143,29 +176,88 @@ async function addBlocks(options = {}) {
         await (0, installation_tracker_1.addInstalledKit)("blocks", Object.keys(deps.dependencies || {}), Object.keys(deps.devDependencies || {}), filesToCopy);
         console.log("✓ blocks kit installed successfully!");
         let layoutUpgraded = false;
-        // Offer to auto-upgrade app/layout.tsx to use AppProviders
-        if (await (0, file_operations_1.fileExists)("app/layout.tsx")) {
-            // Dynamically load inquirer to avoid ESM/CJS interop issues when
-            // the CLI is compiled to CommonJS but inquirer is ESM-only.
-            let promptFn;
+        let pagesAppUpgraded = false;
+        // Offer to auto-upgrade the root layout to use AppProviders (App Router)
+        // (supports both root app/layout.tsx and src/app/layout.tsx)
+        const mode = await (0, file_operations_1.detectProjectRootMode)(process.cwd());
+        const detectedLayoutPath = mode === "src" ? "src/app/layout.tsx" : "app/layout.tsx";
+        const detectedPagesAppPath = mode === "src" ? "src/pages/_app.tsx" : "pages/_app.tsx";
+        // Dynamically load inquirer to avoid ESM/CJS interop issues when
+        // the CLI is compiled to CommonJS but inquirer is ESM-only.
+        let promptFn;
+        try {
+            // Use a runtime dynamic import via the Function constructor to ensure
+            // we call the native import() at runtime and avoid TypeScript
+            // transpilation turning this into a require() call.
+            const inquirerModule = await new Function('return import("inquirer")')();
+            // inquirer exports a default object with prompt; support both shapes
+            promptFn = inquirerModule?.default?.prompt ?? inquirerModule?.prompt;
+        }
+        catch (err) {
+            console.log("⚠️  Could not load optional interactive prompt (inquirer). Skipping optional layout/_app upgrades.");
+            promptFn = null;
+        }
+        const appRouterLayoutExists = await (0, file_operations_1.fileExists)(detectedLayoutPath);
+        const pagesRouterAppExists = await (0, file_operations_1.fileExists)(detectedPagesAppPath);
+        // Hybrid projects (common with create-next-app) may have both /app and /pages.
+        // In that case we should patch BOTH entrypoints so routes in either router
+        // are wrapped with providers.
+        if (appRouterLayoutExists && pagesRouterAppExists) {
             try {
-                // Use a runtime dynamic import via the Function constructor to ensure
-                // we call the native import() at runtime and avoid TypeScript
-                // transpilation turning this into a require() call.
-                const inquirerModule = await new Function('return import("inquirer")')();
-                // inquirer exports a default object with prompt; support both shapes
-                promptFn = inquirerModule?.default?.prompt ?? inquirerModule?.prompt;
+                await (0, file_operations_1.updateLayoutWithAppProviders)();
+                layoutUpgraded = true;
             }
             catch (err) {
-                console.log("⚠️  Could not load optional interactive prompt (inquirer). Skipping layout upgrade.");
-                promptFn = null;
+                console.log("⚠️  Failed to update app/layout.tsx automatically:", err);
+            }
+            try {
+                await (0, file_operations_1.updatePagesAppWithAppProviders)();
+                await (0, file_operations_1.ensurePagesDocumentSuppressHydrationWarning)();
+                // Ensure pages/_app.tsx uses the Pages-safe AppProviders implementation.
+                const candidatePagesAppProvidersPaths = [
+                    "components/app-providers.pages.tsx",
+                    "src/components/app-providers.pages.tsx",
+                ];
+                for (const appProvidersPath of candidatePagesAppProvidersPaths) {
+                    if (await (0, file_operations_1.fileExists)(appProvidersPath)) {
+                        const fsExtraModule = await Promise.resolve().then(() => __importStar(require("fs-extra")));
+                        await fsExtraModule.default.writeFile(appProvidersPath, "\"use client\";\n\nimport * as React from \"react\";\n\nimport { BlocksAppProviders } from \"./providers/BlocksAppProviders\";\n\nexport default function AppProviders({ children }: { children: React.ReactNode }) {\n  return (\n    <div className=\"antialiased\">\n      <BlocksAppProviders>{children}</BlocksAppProviders>\n    </div>\n  );\n}\n");
+                    }
+                }
+                // Ensure root components/app-providers.tsx points to the App Router variant
+                // so app/layout.tsx imports the correct implementation.
+                const candidateRootAppProvidersPaths = [
+                    "components/app-providers.tsx",
+                    "src/components/app-providers.tsx",
+                ];
+                for (const appProvidersPath of candidateRootAppProvidersPaths) {
+                    if (await (0, file_operations_1.fileExists)(appProvidersPath)) {
+                        const fsExtraModule = await Promise.resolve().then(() => __importStar(require("fs-extra")));
+                        await fsExtraModule.default.writeFile(appProvidersPath, 'export { default } from "./app-providers.app";\n');
+                    }
+                }
+                pagesAppUpgraded = true;
             }
-            if (promptFn) {
+            catch (err) {
+                console.log("⚠️  Failed to update pages/_app.tsx automatically:", err);
+            }
+        }
+        else if (appRouterLayoutExists) {
+            if (options.yes) {
+                try {
+                    await (0, file_operations_1.updateLayoutWithAppProviders)();
+                    layoutUpgraded = true;
+                }
+                catch (err) {
+                    console.log("⚠️  Failed to update app/layout.tsx automatically:", err);
+                }
+            }
+            else if (promptFn) {
                 const { upgradeLayout } = await promptFn([
                     {
                         type: "confirm",
                         name: "upgradeLayout",
-                        message: "Would you like the CLI to automatically wrap your app/layout.tsx with AppProviders and add suppressHydrationWarning to the <html> tag?",
+                        message: `Would you like the CLI to automatically wrap your ${detectedLayoutPath} with AppProviders and add suppressHydrationWarning to the <html> tag?`,
                         default: true,
                     },
                 ]);
@@ -180,21 +272,97 @@ async function addBlocks(options = {}) {
                 }
             }
         }
+        else if (await (0, file_operations_1.fileExists)(detectedPagesAppPath)) {
+            // Pages Router support:
+            // - patch pages/_app.tsx (+ ensure _document.tsx hydration safety)
+            // - switch the kit-provided app-providers entrypoint to the Pages-safe variant
+            if (options.yes) {
+                try {
+                    await (0, file_operations_1.updatePagesAppWithAppProviders)();
+                    await (0, file_operations_1.ensurePagesDocumentSuppressHydrationWarning)();
+                    // Make app-providers.tsx point at the Pages-safe implementation.
+                    // (The kit defaults to App Router; Pages Router can't import @nextworks/blocks-core/server.)
+                    //
+                    // Patch whichever path exists (some repos have src/pages but root-level components/).
+                    const candidateAppProvidersPaths = [
+                        "components/app-providers.tsx",
+                        "src/components/app-providers.tsx",
+                    ];
+                    for (const appProvidersPath of candidateAppProvidersPaths) {
+                        if (await (0, file_operations_1.fileExists)(appProvidersPath)) {
+                            const fsExtraModule = await Promise.resolve().then(() => __importStar(require("fs-extra")));
+                            await fsExtraModule.default.writeFile(appProvidersPath, 'export { default } from "./app-providers.pages";\n');
+                        }
+                    }
+                    pagesAppUpgraded = true;
+                }
+                catch (err) {
+                    console.log("⚠️  Failed to update pages/_app.tsx automatically:", err);
+                }
+            }
+            else if (promptFn) {
+                const { upgradePagesApp } = await promptFn([
+                    {
+                        type: "confirm",
+                        name: "upgradePagesApp",
+                        message: `Would you like the CLI to automatically wrap your ${detectedPagesAppPath} with AppProviders (and ensure suppressHydrationWarning in pages/_document.tsx)?`,
+                        default: true,
+                    },
+                ]);
+                if (upgradePagesApp) {
+                    try {
+                        await (0, file_operations_1.updatePagesAppWithAppProviders)();
+                        await (0, file_operations_1.ensurePagesDocumentSuppressHydrationWarning)();
+                        // Make app-providers.tsx point at the Pages-safe implementation.
+                        // (The kit defaults to App Router; Pages Router can't import @nextworks/blocks-core/server.)
+                        //
+                        // Patch whichever path exists (some repos have src/pages but root-level components/).
+                        const candidateAppProvidersPaths = [
+                            "components/app-providers.tsx",
+                            "src/components/app-providers.tsx",
+                        ];
+                        for (const appProvidersPath of candidateAppProvidersPaths) {
+                            if (await (0, file_operations_1.fileExists)(appProvidersPath)) {
+                                const fsExtraModule = await Promise.resolve().then(() => __importStar(require("fs-extra")));
+                                await fsExtraModule.default.writeFile(appProvidersPath, 'export { default } from "./app-providers.pages";\n');
+                            }
+                        }
+                        pagesAppUpgraded = true;
+                    }
+                    catch (err) {
+                        console.log("⚠️  Failed to update pages/_app.tsx automatically:", err);
+                    }
+                }
+            }
+        }
         console.log("\n📋 Next steps:");
         console.log("- Templates added. Try these routes in your browser:");
         console.log("    /templates/productlaunch");
         console.log("    /templates/saasdashboard");
         console.log("    /templates/digitalagency");
         console.log("    /templates/gallery  (blocks gallery)");
-        if (!layoutUpgraded) {
-            console.log("1. Wrap your app with the AppProviders wrapper in app/layout.tsx (or your root layout):");
-            console.log('   import AppProviders from "@/components/app-providers";');
-            console.log("   Wrap your application with <AppProviders> to enable fonts, presets, CSS variable injection, session provider, and the app toaster.");
+        // Note: depending on router type, the templates are installed into different folders,
+        // but the URLs are the same.
+        if (pagesRouterAppExists && !appRouterLayoutExists) {
+            console.log(`  (Pages Router install: files live under ${mode === "src" ? "src/pages/templates/<template>/index.tsx" : "pages/templates/<template>/index.tsx"})`);
+        }
+        else {
+            console.log(`  (App Router install: files live under ${mode === "src" ? "src/app/templates" : "app/templates"})`);
+        }
+        if (layoutUpgraded) {
+            console.log(`1. ${detectedLayoutPath} was updated to wrap the app with AppProviders and add suppressHydrationWarning.`);
             console.log("2. Ensure Tailwind is configured and app/globals.css is present (copied if available).");
             console.log("3. Install new dependencies: npm install");
         }
+        else if (pagesAppUpgraded) {
+            console.log(`1. ${detectedPagesAppPath} was updated to wrap the app with AppProviders (and fonts).`);
+            console.log("2. pages/_document.tsx was ensured/updated to include suppressHydrationWarning.");
+            console.log("3. Install new dependencies: npm install");
+        }
         else {
-            console.log("1. app/layout.tsx was updated to wrap the app with AppProviders and add suppressHydrationWarning.");
+            console.log(`1. Wrap your app with the AppProviders wrapper in ${detectedLayoutPath} (App Router) or ${detectedPagesAppPath} (Pages Router):`);
+            console.log('   import AppProviders from "@/components/app-providers";');
+            console.log("   Wrap your application with <AppProviders> to enable fonts, presets, CSS variable injection, session provider, and the app toaster.");
             console.log("2. Ensure Tailwind is configured and app/globals.css is present (copied if available).");
             console.log("3. Install new dependencies: npm install");
         }