shadcn-nextjs-page-generator 1.0.0

package/dist/index.cjs

@@ -0,0 +1,1900 @@
+#!/usr/bin/env node
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/cli/index.ts
+var index_exports = {};
+__export(index_exports, {
+  run: () => run
+});
+module.exports = __toCommonJS(index_exports);
+var import_ora = __toESM(require("ora"), 1);
+
+// src/cli/prompts.ts
+var import_prompts = __toESM(require("prompts"), 1);
+
+// src/utils/string-transforms.ts
+function toPascalCase(str) {
+  return str.replace(/[^a-zA-Z0-9]+(.)/g, (_, chr) => chr.toUpperCase()).replace(/^[a-z]/, (c) => c.toUpperCase()).replace(/[^a-zA-Z0-9]/g, "");
+}
+function toKebabCase(str) {
+  return str.toLowerCase().replace(/[^a-z0-9]+/g, "-").replace(/(^-|-$)+/g, "");
+}
+
+// src/cli/validators.ts
+function validateNotEmpty(value) {
+  return value.length > 0 || "This field is required";
+}
+function validateRoutePath(value) {
+  if (!value || value.length === 0) {
+    return "Route path is required";
+  }
+  if (!/^[a-z0-9\-\/]+$/.test(value)) {
+    return "Route path can only contain lowercase letters, numbers, dashes, and slashes";
+  }
+  return true;
+}
+function validateColumnKey(value) {
+  if (!value || value.length === 0) {
+    return "Column key is required";
+  }
+  if (!/^[a-zA-Z_$][a-zA-Z0-9_$]*$/.test(value)) {
+    return "Column key must be a valid JavaScript identifier (camelCase recommended)";
+  }
+  return true;
+}
+
+// src/cli/prompts.ts
+async function collectConfiguration() {
+  import_prompts.default.override({ onCancel: () => process.exit(0) });
+  console.log("\n\u{1F680} Welcome to shadcn-page-gen!\n");
+  const { pageName } = await (0, import_prompts.default)({
+    type: "text",
+    name: "pageName",
+    message: 'What is the name of the page? (e.g., "User Management")',
+    validate: validateNotEmpty
+  });
+  if (!pageName) return null;
+  const defaultRoute = toKebabCase(pageName);
+  const { routePath } = await (0, import_prompts.default)({
+    type: "text",
+    name: "routePath",
+    message: `What is the route path? (e.g., "admin/users")`,
+    initial: defaultRoute,
+    validate: validateRoutePath
+  });
+  if (!routePath) return null;
+  const cleanRoutePath = routePath.replace(/^\/+|\/+$/g, "");
+  const defaultModuleName = cleanRoutePath.replace(/\//g, "-");
+  const { moduleName } = await (0, import_prompts.default)({
+    type: "text",
+    name: "moduleName",
+    message: `Module name?`,
+    initial: defaultModuleName
+  });
+  if (!moduleName) return null;
+  const { architecture } = await (0, import_prompts.default)({
+    type: "select",
+    name: "architecture",
+    message: "Choose architecture pattern:",
+    choices: [
+      {
+        title: "DDD (Domain-Driven Design)",
+        value: "ddd",
+        description: "Full layers: Domain, Application, Infrastructure, Presentation"
+      },
+      {
+        title: "Simplified",
+        value: "simplified",
+        description: "Just components and pages - cleaner, faster"
+      }
+    ],
+    initial: 0
+  });
+  if (!architecture) return null;
+  const pascalName = toPascalCase(pageName);
+  let entityName = pascalName;
+  if (architecture === "ddd") {
+    const response = await (0, import_prompts.default)({
+      type: "text",
+      name: "entityName",
+      message: `Entity name? (e.g., Product, Ticket)`,
+      initial: pascalName
+    });
+    if (!response.entityName) return null;
+    entityName = response.entityName;
+  }
+  const columns = [];
+  let addColumn = true;
+  console.log("\n--- Table Columns (ID is automatic) ---");
+  const { useDefaultColumns } = await (0, import_prompts.default)({
+    type: "confirm",
+    name: "useDefaultColumns",
+    message: "Use default columns? (Name, Status, Created At)",
+    initial: true
+  });
+  if (useDefaultColumns) {
+    columns.push(
+      { label: "Name", key: "name", type: "string", sortable: true },
+      { label: "Status", key: "status", type: "string", sortable: true },
+      { label: "Created At", key: "createdAt", type: "date", sortable: true }
+    );
+  } else {
+    while (addColumn) {
+      const { continueAdding } = await (0, import_prompts.default)({
+        type: "confirm",
+        name: "continueAdding",
+        message: columns.length === 0 ? "Add a column?" : "Add another column?",
+        initial: true
+      });
+      if (!continueAdding) break;
+      const columnData = await (0, import_prompts.default)([
+        {
+          type: "text",
+          name: "label",
+          message: 'Column Label (e.g., "Email Address"):',
+          validate: validateNotEmpty
+        },
+        {
+          type: "text",
+          name: "key",
+          message: 'Column Key (e.g., "email"):',
+          validate: validateColumnKey
+        },
+        {
+          type: "select",
+          name: "type",
+          message: "Column Type:",
+          choices: [
+            { title: "String", value: "string" },
+            { title: "Number", value: "number" },
+            { title: "Boolean", value: "boolean" },
+            { title: "Date", value: "date" }
+          ],
+          initial: 0
+        }
+      ]);
+      if (columnData.label && columnData.key && columnData.type) {
+        columns.push({
+          ...columnData,
+          sortable: false
+          // Will be set later
+        });
+      }
+    }
+    if (columns.length === 0) {
+      columns.push(
+        { label: "Name", key: "name", type: "string", sortable: true },
+        { label: "Status", key: "status", type: "string", sortable: true },
+        { label: "Created At", key: "createdAt", type: "date", sortable: true }
+      );
+    }
+  }
+  const filters = [];
+  console.log("\n--- Filters ---");
+  const { addFilters } = await (0, import_prompts.default)({
+    type: "confirm",
+    name: "addFilters",
+    message: "Add filters?",
+    initial: true
+  });
+  if (addFilters) {
+    let addFilterLoop = true;
+    while (addFilterLoop) {
+      const { continueAddingFilter } = await (0, import_prompts.default)({
+        type: "confirm",
+        name: "continueAddingFilter",
+        message: filters.length === 0 ? "Add a filter?" : "Add another filter?",
+        initial: filters.length === 0
+      });
+      if (!continueAddingFilter) break;
+      const filterData = await (0, import_prompts.default)([
+        {
+          type: "select",
+          name: "type",
+          message: "Filter type:",
+          choices: [
+            { title: "Dropdown (Select)", value: "select" },
+            { title: "Date Picker", value: "date" },
+            { title: "Text Input", value: "input" }
+          ]
+        },
+        {
+          type: "text",
+          name: "label",
+          message: 'Filter Label (e.g., "Status"):',
+          validate: validateNotEmpty
+        },
+        {
+          type: "text",
+          name: "key",
+          message: 'Filter Key (URL param, e.g., "status"):',
+          validate: validateColumnKey
+        }
+      ]);
+      if (filterData.type && filterData.label && filterData.key) {
+        filters.push(filterData);
+      }
+    }
+  }
+  console.log("\n--- UI Options ---");
+  const uiOptions = await (0, import_prompts.default)([
+    {
+      type: "confirm",
+      name: "includeStats",
+      message: "Include Stats Cards at the top?",
+      initial: true
+    },
+    {
+      type: "confirm",
+      name: "includeRowSelection",
+      message: "Include Row Selection (Checkboxes)?",
+      initial: false
+    }
+  ]);
+  const { dataFetching } = await (0, import_prompts.default)({
+    type: "select",
+    name: "dataFetching",
+    message: "Data Fetching Strategy:",
+    choices: [
+      { title: "Mock Data (Repository Pattern)", value: "mock", description: "Default mock data with repository pattern" },
+      { title: "TanStack Query (React Query)", value: "tanstack", description: "Modern data fetching with caching" },
+      { title: "Standard (fetch/useEffect)", value: "fetch", description: "Basic fetch with useEffect" }
+    ],
+    initial: 0
+  });
+  const { enableSorting } = await (0, import_prompts.default)({
+    type: "confirm",
+    name: "enableSorting",
+    message: "Enable Column Sorting?",
+    initial: true
+  });
+  let sortableColumns = [];
+  if (enableSorting && columns.length > 0) {
+    const { selected } = await (0, import_prompts.default)({
+      type: "multiselect",
+      name: "selected",
+      message: "Select columns to enable sorting (Space to select, Enter to submit):",
+      choices: columns.map((c) => ({ title: c.label, value: c.key, selected: true })),
+      min: 0
+    });
+    sortableColumns = selected || [];
+    columns.forEach((col) => {
+      col.sortable = sortableColumns.includes(col.key);
+    });
+  }
+  console.log("\n--- Animations (Framer Motion) ---");
+  const animationOptions = await (0, import_prompts.default)([
+    {
+      type: "confirm",
+      name: "pageTransitions",
+      message: "Add page transition animations?",
+      initial: true
+    },
+    {
+      type: "confirm",
+      name: "listAnimations",
+      message: "Animate table rows on load?",
+      initial: true
+    },
+    {
+      type: "confirm",
+      name: "cardAnimations",
+      message: "Animate stats cards?",
+      initial: uiOptions.includeStats
+    },
+    {
+      type: "select",
+      name: "intensity",
+      message: "Animation intensity:",
+      choices: [
+        { title: "Subtle (professional)", value: "subtle" },
+        { title: "Moderate (balanced)", value: "moderate" },
+        { title: "Bold (eye-catching)", value: "bold" }
+      ],
+      initial: 1
+    }
+  ]);
+  const config = {
+    pageName,
+    routePath: cleanRoutePath,
+    moduleName,
+    architecture,
+    entityName,
+    columns,
+    filters,
+    includeStats: uiOptions.includeStats,
+    includeRowSelection: uiOptions.includeRowSelection,
+    includeSearch: true,
+    // Always include search
+    dataFetching,
+    sortableColumns,
+    animations: {
+      pageTransitions: animationOptions.pageTransitions,
+      listAnimations: animationOptions.listAnimations,
+      cardAnimations: animationOptions.cardAnimations,
+      intensity: animationOptions.intensity
+    }
+  };
+  return config;
+}
+
+// src/utils/logger.ts
+var import_chalk = __toESM(require("chalk"), 1);
+var logger = {
+  success(message) {
+    console.log(import_chalk.default.green("\u2713"), message);
+  },
+  error(message) {
+    console.log(import_chalk.default.red("\u2717"), message);
+  },
+  info(message) {
+    console.log(import_chalk.default.blue("\u2139"), message);
+  },
+  warning(message) {
+    console.log(import_chalk.default.yellow("\u26A0"), message);
+  },
+  log(message) {
+    console.log(message);
+  },
+  title(message) {
+    console.log(import_chalk.default.bold.cyan(`
+${message}
+`));
+  },
+  step(step, total, message) {
+    console.log(import_chalk.default.gray(`[${step}/${total}]`), message);
+  },
+  dim(message) {
+    console.log(import_chalk.default.dim(message));
+  }
+};
+
+// src/generators/ddd-generator.ts
+var import_path2 = __toESM(require("path"), 1);
+
+// src/utils/file-system.ts
+var import_fs_extra = __toESM(require("fs-extra"), 1);
+var import_path = __toESM(require("path"), 1);
+async function ensureDir(dirPath) {
+  await import_fs_extra.default.ensureDir(dirPath);
+}
+async function writeFile(filePath, content) {
+  const dir = import_path.default.dirname(filePath);
+  await ensureDir(dir);
+  await import_fs_extra.default.writeFile(filePath, content, "utf-8");
+}
+async function createDirectories(dirs) {
+  for (const dir of dirs) {
+    await ensureDir(dir);
+  }
+}
+async function writeFiles(files) {
+  for (const file of files) {
+    await writeFile(file.path, file.content);
+    logger.dim(`  Created: ${file.path}`);
+  }
+}
+
+// src/templates/ddd/entity.ts
+function generateEntity(config) {
+  const { entityName, moduleName, columns } = config;
+  const columnFields = columns.map((c) => {
+    const typeMap = {
+      "string": "string",
+      "number": "number",
+      "boolean": "boolean",
+      "date": "string"
+      // ISO string for dates
+    };
+    return `  ${c.key}: ${typeMap[c.type]};`;
+  }).join("\n");
+  const createDTOFields = columns.filter((c) => !["id", "createdAt", "updatedAt"].includes(c.key)).map((c) => {
+    const typeMap = {
+      "string": "string",
+      "number": "number",
+      "boolean": "boolean",
+      "date": "string"
+    };
+    return `  ${c.key}: ${typeMap[c.type]};`;
+  }).join("\n");
+  return `/**
+ * Domain Entity: ${entityName}
+ * Generated by shadcn-page-gen
+ */
+export interface ${entityName} {
+  id: string;
+${columnFields}
+  updatedAt: Date;
+}
+
+export interface Create${entityName}DTO {
+${createDTOFields || "  // Add your fields here"}
+}
+
+export interface Update${entityName}DTO extends Partial<Create${entityName}DTO> {
+  id: string;
+}
+`;
+}
+
+// src/templates/ddd/repository-interface.ts
+function generateRepositoryInterface(config) {
+  const { entityName, moduleName } = config;
+  return `import { ${entityName}, Create${entityName}DTO, Update${entityName}DTO } from '../entities/${moduleName}.entity';
+
+/**
+ * Repository Interface: ${entityName}
+ * Generated by shadcn-page-gen
+ */
+export interface I${entityName}Repository {
+  findAll(params?: any): Promise<${entityName}[]>;
+  findById(id: string): Promise<${entityName} | null>;
+  create(data: Create${entityName}DTO): Promise<${entityName}>;
+  update(data: Update${entityName}DTO): Promise<${entityName}>;
+  delete(id: string): Promise<void>;
+}
+`;
+}
+
+// src/templates/ddd/repository-impl.ts
+function generateRepositoryImpl(config) {
+  const { entityName, moduleName, columns } = config;
+  const mockFields = columns.map((c) => {
+    if (c.key === "createdAt") {
+      return `      createdAt: new Date().toISOString(),`;
+    }
+    if (c.key === "status") {
+      return `      status: Math.random() > 0.5 ? 'Active' : 'Inactive',`;
+    }
+    if (c.key === "name") {
+      return `      name: \`${entityName} \${i + 1}\`,`;
+    }
+    if (c.type === "number") {
+      return `      ${c.key}: (i + 1) * 100,`;
+    }
+    if (c.type === "boolean") {
+      return `      ${c.key}: Math.random() > 0.5,`;
+    }
+    if (c.type === "date") {
+      return `      ${c.key}: new Date().toISOString(),`;
+    }
+    return `      ${c.key}: \`${c.label} \${i + 1}\`,`;
+  }).join("\n");
+  return `import { ${entityName}, Create${entityName}DTO, Update${entityName}DTO } from '../../domain/entities/${moduleName}.entity';
+import { I${entityName}Repository } from '../../domain/repositories/${moduleName}.repository.interface';
+
+/**
+ * Repository Implementation: ${entityName}
+ * Generated by shadcn-page-gen
+ *
+ * This is a mock implementation with in-memory data.
+ * Replace with your actual API calls.
+ */
+export class ${entityName}Repository implements I${entityName}Repository {
+  // Mock data - replace with real API calls
+  private items: ${entityName}[] = Array.from({ length: 10 }).map((_, i) => ({
+    id: (i + 1).toString(),
+${mockFields}
+    updatedAt: new Date(),
+  })) as unknown as ${entityName}[];
+
+  async findAll(params?: any): Promise<${entityName}[]> {
+    // Simulate API delay
+    await new Promise(resolve => setTimeout(resolve, 500));
+
+    // TODO: Implement sorting, filtering, pagination
+    // const { sortBy, order, page, limit } = params || {};
+
+    return [...this.items];
+  }
+
+  async findById(id: string): Promise<${entityName} | null> {
+    await new Promise(resolve => setTimeout(resolve, 300));
+    const item = this.items.find(i => i.id === id);
+    return item || null;
+  }
+
+  async create(data: Create${entityName}DTO): Promise<${entityName}> {
+    await new Promise(resolve => setTimeout(resolve, 500));
+
+    const newItem: ${entityName} = {
+      id: Date.now().toString(),
+      ...data,
+      updatedAt: new Date(),
+      ${columns.some((c) => c.key === "createdAt") ? "createdAt: new Date().toISOString()," : ""}
+    } as unknown as ${entityName};
+
+    this.items.push(newItem);
+    return newItem;
+  }
+
+  async update(data: Update${entityName}DTO): Promise<${entityName}> {
+    await new Promise(resolve => setTimeout(resolve, 500));
+
+    const index = this.items.findIndex(i => i.id === data.id);
+    if (index === -1) {
+      throw new Error(\`${entityName} with id \${data.id} not found\`);
+    }
+
+    this.items[index] = {
+      ...this.items[index],
+      ...data,
+      updatedAt: new Date(),
+    } as ${entityName};
+
+    return this.items[index];
+  }
+
+  async delete(id: string): Promise<void> {
+    await new Promise(resolve => setTimeout(resolve, 500));
+
+    const index = this.items.findIndex(i => i.id === id);
+    if (index === -1) {
+      throw new Error(\`${entityName} with id \${id} not found\`);
+    }
+
+    this.items.splice(index, 1);
+  }
+}
+`;
+}
+
+// src/templates/ddd/use-case.ts
+function generateUseCase(config) {
+  const { entityName, moduleName } = config;
+  return `import { ${entityName} } from '../../domain/entities/${moduleName}.entity';
+import { I${entityName}Repository } from '../../domain/repositories/${moduleName}.repository.interface';
+
+/**
+ * Use Case: Get ${entityName}s
+ * Generated by shadcn-page-gen
+ */
+export class Get${entityName}sUseCase {
+  constructor(private readonly repository: I${entityName}Repository) {}
+
+  async execute(params?: any): Promise<${entityName}[]> {
+    return await this.repository.findAll(params);
+  }
+}
+`;
+}
+
+// src/templates/ddd/component.ts
+function generateComponent(config) {
+  const {
+    entityName,
+    moduleName,
+    pageName,
+    routePath,
+    columns,
+    filters,
+    includeStats,
+    includeRowSelection,
+    dataFetching,
+    sortableColumns,
+    animations
+  } = config;
+  const isTanStack = dataFetching === "tanstack";
+  const hasAnimations = animations.listAnimations || animations.cardAnimations;
+  const imports = `'use client';
+
+${hasAnimations ? `import { motion } from 'framer-motion';` : ""}
+import { useEffect, useState } from 'react';
+import { ${entityName} } from '../../domain/entities/${moduleName}.entity';
+import { Get${entityName}sUseCase } from '../../application/use-cases/get-${moduleName}s.use-case';
+import { ${entityName}Repository } from '../../infrastructure/repositories/${moduleName}.repository';
+${isTanStack ? `import { useQuery } from '@tanstack/react-query';` : ""}
+import { Button } from '@/components/ui/button';
+import {
+  Table,
+  TableBody,
+  TableCell,
+  TableHead,
+  TableHeader,
+  TableRow,
+} from '@/components/ui/table';
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+} from '@/components/ui/select';
+import { Input } from '@/components/ui/input';
+${filters.some((f) => f.type === "date") ? `import { Calendar } from '@/components/ui/calendar';
+import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover';
+import { Calendar as CalendarIcon } from 'lucide-react';
+import { format } from 'date-fns';` : ""}
+import { Badge } from '@/components/ui/badge';
+${includeStats ? `import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';` : ""}
+import {
+  Search,
+  Plus,
+  X,
+  RefreshCcw,
+  Eye,
+  Pencil,
+  Trash2,
+  MoreHorizontal,
+  ${sortableColumns.length > 0 ? "ArrowUpDown, ArrowUp, ArrowDown," : ""}
+} from 'lucide-react';
+import { cn } from '@/lib/utils';
+import { useRouter, useSearchParams } from 'next/navigation';
+import {
+  Pagination,
+  PaginationContent,
+  PaginationItem,
+  PaginationLink,
+  PaginationNext,
+  PaginationPrevious,
+} from "@/components/ui/pagination";
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuLabel,
+  DropdownMenuTrigger,
+} from "@/components/ui/dropdown-menu";
+${includeRowSelection ? `import { Checkbox } from "@/components/ui/checkbox";` : ""}`;
+  const animationVariants = hasAnimations ? `
+// Framer Motion animation variants
+const containerVariants = {
+  hidden: { opacity: 0 },
+  visible: {
+    opacity: 1,
+    transition: {
+      staggerChildren: ${animations.intensity === "bold" ? "0.1" : animations.intensity === "subtle" ? "0.03" : "0.05"}
+    }
+  }
+};
+
+const itemVariants = {
+  hidden: { opacity: 0, x: -20 },
+  visible: {
+    opacity: 1,
+    x: 0,
+    transition: { duration: ${animations.intensity === "bold" ? "0.3" : animations.intensity === "subtle" ? "0.15" : "0.2"} }
+  }
+};
+` : "";
+  const dataFetchingCode = isTanStack ? `
+  // TanStack Query data fetching
+  const { data, isLoading: loading, refetch } = useQuery({
+    queryKey: ['${moduleName}', searchParams.toString()],
+    queryFn: async () => {
+      const repo = new ${entityName}Repository();
+      const useCase = new Get${entityName}sUseCase(repo);
+      return await useCase.execute({
+        q: searchParams.get('q'),
+        page: searchParams.get('page'),
+        limit: pageSize,
+        sortBy: searchParams.get('sortBy'),
+        order: searchParams.get('order'),
+        ...Object.fromEntries(searchParams.entries())
+      });
+    }
+  });` : `
+  const [data, setData] = useState<${entityName}[]>([]);
+  const [loading, setLoading] = useState(true);
+
+  const fetchData = async () => {
+    setLoading(true);
+    try {
+      const repo = new ${entityName}Repository();
+      const useCase = new Get${entityName}sUseCase(repo);
+      const result = await useCase.execute({
+        q: searchParams.get('q'),
+        page: searchParams.get('page'),
+        limit: pageSize,
+        sortBy: searchParams.get('sortBy'),
+        order: searchParams.get('order'),
+        ...Object.fromEntries(searchParams.entries())
+      });
+      setData(result);
+    } catch (error) {
+      console.error(error);
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  useEffect(() => {
+    fetchData();
+  }, [searchParams]);`;
+  const rowSelectionCode = includeRowSelection ? `
+  const [selectedRows, setSelectedRows] = useState<Set<string>>(new Set());
+
+  const toggleRow = (id: string) => {
+    const newSelected = new Set(selectedRows);
+    if (newSelected.has(id)) newSelected.delete(id);
+    else newSelected.add(id);
+    setSelectedRows(newSelected);
+  };
+
+  const toggleAll = () => {
+    if (selectedRows.size === (data?.length || 0)) {
+      setSelectedRows(new Set());
+    } else {
+      setSelectedRows(new Set(data?.map(i => i.id) || []));
+    }
+  };` : "";
+  const statsCards = includeStats ? `
+      {/* Stats Cards */}
+      ${animations.cardAnimations ? `<motion.div
+        className="grid gap-4 md:grid-cols-2 lg:grid-cols-4"
+        variants={containerVariants}
+        initial="hidden"
+        animate="visible"
+      >` : `<div className="grid gap-4 md:grid-cols-2 lg:grid-cols-4">`}
+        ${animations.cardAnimations ? `<motion.div variants={itemVariants}>` : ""}
+          <Card>
+            <CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
+              <CardTitle className="text-sm font-medium">Total ${entityName}s</CardTitle>
+            </CardHeader>
+            <CardContent>
+              <div className="text-2xl font-bold">128</div>
+              <p className="text-xs text-muted-foreground">+20.1% from last month</p>
+            </CardContent>
+          </Card>
+        ${animations.cardAnimations ? `</motion.div>` : ""}
+
+        ${animations.cardAnimations ? `<motion.div variants={itemVariants}>` : ""}
+          <Card>
+            <CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
+              <CardTitle className="text-sm font-medium">Active</CardTitle>
+            </CardHeader>
+            <CardContent>
+              <div className="text-2xl font-bold">12</div>
+              <p className="text-xs text-muted-foreground">+4 since yesterday</p>
+            </CardContent>
+          </Card>
+        ${animations.cardAnimations ? `</motion.div>` : ""}
+
+        ${animations.cardAnimations ? `<motion.div variants={itemVariants}>` : ""}
+          <Card>
+            <CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
+              <CardTitle className="text-sm font-medium">Pending</CardTitle>
+            </CardHeader>
+            <CardContent>
+              <div className="text-2xl font-bold">4</div>
+              <p className="text-xs text-muted-foreground">-2 since yesterday</p>
+            </CardContent>
+          </Card>
+        ${animations.cardAnimations ? `</motion.div>` : ""}
+
+        ${animations.cardAnimations ? `<motion.div variants={itemVariants}>` : ""}
+          <Card>
+            <CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
+              <CardTitle className="text-sm font-medium">Closed</CardTitle>
+            </CardHeader>
+            <CardContent>
+              <div className="text-2xl font-bold">2</div>
+              <p className="text-xs text-muted-foreground">+1 since yesterday</p>
+            </CardContent>
+          </Card>
+        ${animations.cardAnimations ? `</motion.div>` : ""}
+      ${animations.cardAnimations ? `</motion.div>` : `</div>`}
+` : "";
+  const filterComponents = filters.map((f) => {
+    if (f.type === "select") {
+      return `
+            <Select
+              value={searchParams.get('${f.key}') || 'all'}
+              onValueChange={(value) => updateParam('${f.key}', value === 'all' ? null : value)}
+            >
+              <SelectTrigger className="w-[150px]">
+                <SelectValue placeholder="${f.label}" />
+              </SelectTrigger>
+              <SelectContent>
+                <SelectItem value="all">All ${f.label}</SelectItem>
+                <SelectItem value="active">Active</SelectItem>
+                <SelectItem value="inactive">Inactive</SelectItem>
+              </SelectContent>
+            </Select>`;
+    } else if (f.type === "date") {
+      return `
+            <Popover>
+              <PopoverTrigger asChild>
+                <Button
+                  variant="outline"
+                  className={cn(
+                    "w-[200px] justify-start text-left font-normal",
+                    !searchParams.get('${f.key}') && "text-muted-foreground"
+                  )}
+                >
+                  <CalendarIcon className="mr-2 h-4 w-4" />
+                  {searchParams.get('${f.key}') ? (
+                    format(new Date(searchParams.get('${f.key}')!), "PPP")
+                  ) : (
+                    <span>${f.label}</span>
+                  )}
+                </Button>
+              </PopoverTrigger>
+              <PopoverContent className="w-auto p-0" align="start">
+                <Calendar
+                  mode="single"
+                  selected={searchParams.get('${f.key}') ? new Date(searchParams.get('${f.key}')!) : undefined}
+                  onSelect={(date) => updateParam('${f.key}', date ? date.toISOString() : null)}
+                  initialFocus
+                />
+              </PopoverContent>
+            </Popover>`;
+    }
+    return "";
+  }).join("\n");
+  const tableHeaders = columns.map((c) => {
+    const isSortable = sortableColumns.includes(c.key);
+    if (isSortable) {
+      return `                <TableHead className="cursor-pointer" onClick={() => handleSort('${c.key}')}>
+                  <div className="flex items-center gap-1">
+                    ${c.label.toUpperCase()}
+                    {searchParams.get('sortBy') === '${c.key}' ? (
+                      searchParams.get('order') === 'asc' ? <ArrowUp className="h-3 w-3" /> : <ArrowDown className="h-3 w-3" />
+                    ) : <ArrowUpDown className="h-3 w-3 text-muted-foreground" />}
+                  </div>
+                </TableHead>`;
+    }
+    return `                <TableHead>${c.label.toUpperCase()}</TableHead>`;
+  }).join("\n");
+  const tableCells = columns.map((c) => {
+    if (c.key === "status") {
+      return `                            <TableCell>
+                              <Badge variant={item.status === 'Active' ? 'default' : 'secondary'} className="rounded-full">
+                                {item.status}
+                              </Badge>
+                            </TableCell>`;
+    }
+    if (c.type === "date") {
+      return `                            <TableCell className="text-muted-foreground">{new Date(item.${c.key}).toLocaleDateString()}</TableCell>`;
+    }
+    return `                            <TableCell>{item.${c.key}}</TableCell>`;
+  }).join("\n");
+  const colSpan = columns.length + 2 + (includeRowSelection ? 1 : 0);
+  return `${imports}
+
+/**
+ * ${entityName} List Component
+ * Generated by shadcn-page-gen
+ *
+ * Features:
+ * - Search and filters
+ * - Sorting: ${sortableColumns.length > 0 ? sortableColumns.join(", ") : "None"}
+ * - Pagination
+ * - Row actions (View, Edit, Delete)
+ * ${includeStats ? "- Stats cards" : ""}
+ * ${includeRowSelection ? "- Row selection" : ""}
+ * ${animations.listAnimations || animations.cardAnimations ? `- Framer Motion animations (${animations.intensity})` : ""}
+ */
+${animationVariants}
+export function ${entityName}List() {
+  const router = useRouter();
+  const searchParams = useSearchParams();
+
+  const [searchTerm, setSearchTerm] = useState(searchParams.get('q') || '');
+  const pageSize = Number(searchParams.get('limit')) || 10;
+${dataFetchingCode}
+${rowSelectionCode}
+
+  const updateParam = (key: string, value: string | null) => {
+    const params = new URLSearchParams(searchParams.toString());
+    if (value) params.set(key, value);
+    else params.delete(key);
+
+    if (key !== 'page') params.set('page', '1');
+
+    router.push('?' + params.toString());
+  };
+
+  ${sortableColumns.length > 0 ? `const handleSort = (key: string) => {
+    const currentSort = searchParams.get('sortBy');
+    const currentOrder = searchParams.get('order');
+
+    let newOrder = 'asc';
+    if (currentSort === key && currentOrder === 'asc') {
+      newOrder = 'desc';
+    }
+
+    const params = new URLSearchParams(searchParams.toString());
+    params.set('sortBy', key);
+    params.set('order', newOrder);
+    router.push('?' + params.toString());
+  };` : ""}
+
+  return (
+    <div className="space-y-6">
+${statsCards}
+      {/* Actions Bar */}
+      <div className="flex flex-col gap-4 md:flex-row md:items-center md:justify-between">
+        <div className="flex flex-1 items-center gap-2">
+          <div className="relative flex-1">
+            <Search className="absolute left-2.5 top-2.5 h-4 w-4 text-muted-foreground" />
+            <Input
+              placeholder="Search..."
+              value={searchTerm}
+              onChange={(e) => setSearchTerm(e.target.value)}
+              onBlur={() => updateParam('q', searchTerm)}
+              className="pl-9 w-full md:max-w-md"
+            />
+          </div>
+${filterComponents}
+          {(searchParams.toString().length > 0) && (
+            <Button variant="ghost" size="icon" onClick={() => router.push('/${routePath}')} title="Reset Filters">
+              <X className="h-4 w-4" />
+            </Button>
+          )}
+        </div>
+
+        <div className="flex items-center gap-2">
+          <Button variant="outline" size="sm" onClick={() => ${isTanStack ? "refetch()" : "fetchData()"}}>
+            <RefreshCcw className="mr-2 h-4 w-4" /> Refresh
+          </Button>
+          <Button size="sm">
+            <Plus className="mr-2 h-4 w-4" /> New ${entityName}
+          </Button>
+        </div>
+      </div>
+
+      {/* Main Table */}
+      <Card>
+        <CardContent className="p-0">
+          <Table>
+            <TableHeader>
+              <TableRow>
+                ${includeRowSelection ? `<TableHead className="w-[50px]"><Checkbox checked={data?.length > 0 && selectedRows.size === data?.length} onCheckedChange={toggleAll} /></TableHead>` : ""}
+                <TableHead className="w-[100px]">ID</TableHead>
+${tableHeaders}
+                <TableHead className="text-right">ACTIONS</TableHead>
+              </TableRow>
+            </TableHeader>
+            <TableBody>
+              {loading ? (
+                <TableRow>
+                  <TableCell colSpan={${colSpan}} className="text-center h-24 text-muted-foreground">Loading data...</TableCell>
+                </TableRow>
+              ) : !data || data.length === 0 ? (
+                <TableRow>
+                  <TableCell colSpan={${colSpan}} className="text-center h-24 text-muted-foreground">No results found.</TableCell>
+                </TableRow>
+              ) : (
+                ${animations.listAnimations ? `
+                data.map((item, index) => (
+                  <motion.tr
+                    key={item.id}
+                    variants={itemVariants}
+                    initial="hidden"
+                    animate="visible"
+                    custom={index}
+                    className="group"
+                  >` : `data.map((item) => (
+                  <TableRow key={item.id} className="group">`}
+                    ${includeRowSelection ? `<TableCell><Checkbox checked={selectedRows.has(item.id)} onCheckedChange={() => toggleRow(item.id)} /></TableCell>` : ""}
+                    <TableCell className="font-medium">{item.id}</TableCell>
+${tableCells}
+                    <TableCell className="text-right">
+                      <div className="flex justify-end gap-2">
+                        <Button variant="ghost" size="icon" className="h-8 w-8 text-blue-500 hover:text-blue-600 hover:bg-blue-50 dark:hover:bg-blue-950">
+                          <Eye className="h-4 w-4" />
+                        </Button>
+                        <Button variant="ghost" size="icon" className="h-8 w-8 text-green-500 hover:text-green-600 hover:bg-green-50 dark:hover:bg-green-950">
+                          <Pencil className="h-4 w-4" />
+                        </Button>
+                        <Button variant="ghost" size="icon" className="h-8 w-8 text-red-500 hover:text-red-600 hover:bg-red-50 dark:hover:bg-red-950">
+                          <Trash2 className="h-4 w-4" />
+                        </Button>
+                        <DropdownMenu>
+                          <DropdownMenuTrigger asChild>
+                            <Button variant="ghost" size="icon" className="h-8 w-8">
+                              <MoreHorizontal className="h-4 w-4" />
+                            </Button>
+                          </DropdownMenuTrigger>
+                          <DropdownMenuContent align="end">
+                            <DropdownMenuLabel>Actions</DropdownMenuLabel>
+                            <DropdownMenuItem>View Details</DropdownMenuItem>
+                            <DropdownMenuItem>Edit Record</DropdownMenuItem>
+                          </DropdownMenuContent>
+                        </DropdownMenu>
+                      </div>
+                    </TableCell>
+                  ${animations.listAnimations ? `</motion.tr>` : `</TableRow>`}
+                ))
+              )}
+            </TableBody>
+          </Table>
+        </CardContent>
+      </Card>
+
+      {/* Pagination */}
+      <div className="flex flex-col gap-4 md:flex-row md:items-center md:justify-between">
+        <div className="flex items-center gap-2 text-sm text-muted-foreground">
+          <span>Show</span>
+          <Select value={pageSize.toString()} onValueChange={(v) => updateParam('limit', v)}>
+            <SelectTrigger className="h-8 w-[70px]">
+              <SelectValue placeholder={pageSize.toString()} />
+            </SelectTrigger>
+            <SelectContent side="top">
+              {[10, 20, 30, 50, 100].map((size) => (
+                <SelectItem key={size} value={size.toString()}>
+                  {size}
+                </SelectItem>
+              ))}
+            </SelectContent>
+          </Select>
+          <span>entries</span>
+        </div>
+        <Pagination className="justify-end w-auto">
+          <PaginationContent>
+            <PaginationItem>
+              <PaginationPrevious href="#" />
+            </PaginationItem>
+            <PaginationItem>
+              <PaginationLink href="#" isActive>1</PaginationLink>
+            </PaginationItem>
+            <PaginationItem>
+              <PaginationLink href="#">2</PaginationLink>
+            </PaginationItem>
+            <PaginationItem>
+              <PaginationLink href="#">3</PaginationLink>
+            </PaginationItem>
+            <PaginationItem>
+              <PaginationNext href="#" />
+            </PaginationItem>
+          </PaginationContent>
+        </Pagination>
+      </div>
+    </div>
+  );
+}
+`;
+}
+
+// src/templates/ddd/page.ts
+function generatePage(config) {
+  const { pageName, moduleName, entityName } = config;
+  return `import { Suspense } from 'react';
+import { ${entityName}List } from '@/modules/${moduleName}/presentation/components/${moduleName}-list';
+
+/**
+ * ${pageName} Page
+ * Generated by shadcn-page-gen
+ */
+export default function ${entityName}Page() {
+  return (
+    <div className="container mx-auto py-10 space-y-8">
+      <div>
+        <h1 className="text-3xl font-bold tracking-tight">${pageName}</h1>
+        <p className="text-muted-foreground">
+          Manage your ${pageName.toLowerCase()}.
+        </p>
+      </div>
+
+      <Suspense fallback={<div>Loading...</div>}>
+        <${entityName}List />
+      </Suspense>
+    </div>
+  );
+}
+`;
+}
+
+// src/templates/ddd/template.ts
+function generateTemplate(config) {
+  const { animations } = config;
+  const getAnimationConfig = () => {
+    switch (animations.intensity) {
+      case "subtle":
+        return {
+          initial: "{ opacity: 0, y: 10 }",
+          animate: "{ opacity: 1, y: 0 }",
+          transition: "{ duration: 0.2 }"
+        };
+      case "bold":
+        return {
+          initial: "{ opacity: 0, scale: 0.95, y: 30 }",
+          animate: "{ opacity: 1, scale: 1, y: 0 }",
+          transition: "{ duration: 0.4, ease: [0.43, 0.13, 0.23, 0.96] }"
+        };
+      default:
+        return {
+          initial: "{ opacity: 0, y: 20 }",
+          animate: "{ opacity: 1, y: 0 }",
+          transition: '{ duration: 0.3, ease: "easeInOut" }'
+        };
+    }
+  };
+  const animConfig = getAnimationConfig();
+  return `'use client';
+
+import { motion } from 'framer-motion';
+
+/**
+ * Page Template with Framer Motion transitions
+ * Generated by shadcn-page-gen
+ */
+export default function Template({ children }: { children: React.ReactNode }) {
+  return (
+    <motion.div
+      initial=${animConfig.initial}
+      animate=${animConfig.animate}
+      exit={{ opacity: 0, y: -20 }}
+      transition=${animConfig.transition}
+    >
+      {children}
+    </motion.div>
+  );
+}
+`;
+}
+
+// src/generators/ddd-generator.ts
+var DDDGenerator = class {
+  constructor(config) {
+    this.config = config;
+  }
+  async generate() {
+    const files = [];
+    const cwd = process.cwd();
+    const { moduleName, routePath } = this.config;
+    const moduleDir = import_path2.default.join(cwd, "modules", moduleName);
+    const appDir = import_path2.default.join(cwd, "app", "(dashboard)", routePath);
+    const dirs = [
+      import_path2.default.join(moduleDir, "domain", "entities"),
+      import_path2.default.join(moduleDir, "domain", "repositories"),
+      import_path2.default.join(moduleDir, "application", "use-cases"),
+      import_path2.default.join(moduleDir, "infrastructure", "repositories"),
+      import_path2.default.join(moduleDir, "presentation", "components"),
+      appDir
+    ];
+    await createDirectories(dirs);
+    files.push({
+      path: import_path2.default.join(moduleDir, "domain", "entities", `${moduleName}.entity.ts`),
+      content: generateEntity(this.config)
+    });
+    files.push({
+      path: import_path2.default.join(moduleDir, "domain", "repositories", `${moduleName}.repository.interface.ts`),
+      content: generateRepositoryInterface(this.config)
+    });
+    files.push({
+      path: import_path2.default.join(moduleDir, "infrastructure", "repositories", `${moduleName}.repository.ts`),
+      content: generateRepositoryImpl(this.config)
+    });
+    files.push({
+      path: import_path2.default.join(moduleDir, "application", "use-cases", `get-${moduleName}s.use-case.ts`),
+      content: generateUseCase(this.config)
+    });
+    files.push({
+      path: import_path2.default.join(moduleDir, "presentation", "components", `${moduleName}-list.tsx`),
+      content: generateComponent(this.config)
+    });
+    files.push({
+      path: import_path2.default.join(appDir, "page.tsx"),
+      content: generatePage(this.config)
+    });
+    if (this.config.animations.pageTransitions) {
+      files.push({
+        path: import_path2.default.join(appDir, "template.tsx"),
+        content: generateTemplate(this.config)
+      });
+    }
+    await writeFiles(files);
+    const instructions = this.generateInstructions();
+    return { files, instructions };
+  }
+  generateInstructions() {
+    const instructions = [];
+    instructions.push(`Navigate to your page: http://localhost:3000/${this.config.routePath}`);
+    const deps = [];
+    if (this.config.dataFetching === "tanstack") {
+      deps.push("@tanstack/react-query");
+    }
+    if (this.config.animations.pageTransitions || this.config.animations.listAnimations) {
+      deps.push("framer-motion");
+    }
+    if (deps.length > 0) {
+      instructions.push(`Install dependencies: npm install ${deps.join(" ")}`);
+    }
+    instructions.push("Customize the generated code to fit your needs");
+    instructions.push("Connect to your real API (replace mock repository)");
+    if (this.config.dataFetching === "tanstack") {
+      instructions.push("Ensure your app is wrapped in <QueryClientProvider>");
+    }
+    return instructions;
+  }
+};
+
+// src/generators/simplified-generator.ts
+var import_path3 = __toESM(require("path"), 1);
+
+// src/templates/simplified/component.ts
+function generateSimplifiedComponent(config) {
+  const {
+    entityName,
+    moduleName,
+    pageName,
+    routePath,
+    columns,
+    filters,
+    includeStats,
+    includeRowSelection,
+    dataFetching,
+    sortableColumns,
+    animations
+  } = config;
+  const isTanStack = dataFetching === "tanstack";
+  const hasAnimations = animations.listAnimations || animations.cardAnimations;
+  const mockDataInterface = `interface ${entityName} {
+  id: string;
+${columns.map((c) => {
+    const typeMap = {
+      "string": "string",
+      "number": "number",
+      "boolean": "boolean",
+      "date": "string"
+    };
+    return `  ${c.key}: ${typeMap[c.type]};`;
+  }).join("\n")}
+  updatedAt: Date;
+}`;
+  const mockDataFields = columns.map((c) => {
+    if (c.key === "createdAt") {
+      return `    createdAt: new Date().toISOString(),`;
+    }
+    if (c.key === "status") {
+      return `    status: Math.random() > 0.5 ? 'Active' : 'Inactive',`;
+    }
+    if (c.key === "name") {
+      return `    name: \`${entityName} \${i + 1}\`,`;
+    }
+    if (c.type === "number") {
+      return `    ${c.key}: (i + 1) * 100,`;
+    }
+    if (c.type === "boolean") {
+      return `    ${c.key}: Math.random() > 0.5,`;
+    }
+    if (c.type === "date") {
+      return `    ${c.key}: new Date().toISOString(),`;
+    }
+    return `    ${c.key}: \`${c.label} \${i + 1}\`,`;
+  }).join("\n");
+  const mockData = `// Mock data - replace with your API call
+const MOCK_DATA: ${entityName}[] = Array.from({ length: 10 }).map((_, i) => ({
+  id: (i + 1).toString(),
+${mockDataFields}
+  updatedAt: new Date(),
+})) as unknown as ${entityName}[];`;
+  const fetchFunction = isTanStack ? "" : `
+  // Fetch data function - replace with your API call
+  const fetchData = async () => {
+    setLoading(true);
+    try {
+      // Simulate API delay
+      await new Promise(resolve => setTimeout(resolve, 500));
+
+      // TODO: Replace with real API call
+      // const response = await fetch('/api/${moduleName}');
+      // const result = await response.json();
+
+      setData(MOCK_DATA);
+    } catch (error) {
+      console.error('Error fetching data:', error);
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  useEffect(() => {
+    fetchData();
+  }, [searchParams]);`;
+  const dataFetchingSetup = isTanStack ? `
+  // TanStack Query data fetching
+  const { data, isLoading: loading, refetch } = useQuery({
+    queryKey: ['${moduleName}', searchParams.toString()],
+    queryFn: async () => {
+      // Simulate API delay
+      await new Promise(resolve => setTimeout(resolve, 500));
+
+      // TODO: Replace with real API call
+      // const response = await fetch('/api/${moduleName}');
+      // return await response.json();
+
+      return MOCK_DATA;
+    }
+  });` : `
+  const [data, setData] = useState<${entityName}[]>([]);
+  const [loading, setLoading] = useState(true);
+${fetchFunction}`;
+  const imports = `'use client';
+
+${hasAnimations ? `import { motion } from 'framer-motion';` : ""}
+import { useEffect, useState } from 'react';
+${isTanStack ? `import { useQuery } from '@tanstack/react-query';` : ""}
+import { Button } from '@/components/ui/button';
+import {
+  Table,
+  TableBody,
+  TableCell,
+  TableHead,
+  TableHeader,
+  TableRow,
+} from '@/components/ui/table';
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+} from '@/components/ui/select';
+import { Input } from '@/components/ui/input';
+${filters.some((f) => f.type === "date") ? `import { Calendar } from '@/components/ui/calendar';
+import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover';
+import { Calendar as CalendarIcon } from 'lucide-react';
+import { format } from 'date-fns';` : ""}
+import { Badge } from '@/components/ui/badge';
+${includeStats ? `import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';` : ""}
+import {
+  Search,
+  Plus,
+  X,
+  RefreshCcw,
+  Eye,
+  Pencil,
+  Trash2,
+  MoreHorizontal,
+  ${sortableColumns.length > 0 ? "ArrowUpDown, ArrowUp, ArrowDown," : ""}
+} from 'lucide-react';
+import { cn } from '@/lib/utils';
+import { useRouter, useSearchParams } from 'next/navigation';
+import {
+  Pagination,
+  PaginationContent,
+  PaginationItem,
+  PaginationLink,
+  PaginationNext,
+  PaginationPrevious,
+} from "@/components/ui/pagination";
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuLabel,
+  DropdownMenuTrigger,
+} from "@/components/ui/dropdown-menu";
+${includeRowSelection ? `import { Checkbox } from "@/components/ui/checkbox";` : ""}`;
+  const animationVariants = hasAnimations ? `
+// Framer Motion animation variants
+const containerVariants = {
+  hidden: { opacity: 0 },
+  visible: {
+    opacity: 1,
+    transition: {
+      staggerChildren: ${animations.intensity === "bold" ? "0.1" : animations.intensity === "subtle" ? "0.03" : "0.05"}
+    }
+  }
+};
+
+const itemVariants = {
+  hidden: { opacity: 0, x: -20 },
+  visible: {
+    opacity: 1,
+    x: 0,
+    transition: { duration: ${animations.intensity === "bold" ? "0.3" : animations.intensity === "subtle" ? "0.15" : "0.2"} }
+  }
+};
+` : "";
+  const rowSelectionCode = includeRowSelection ? `
+  const [selectedRows, setSelectedRows] = useState<Set<string>>(new Set());
+
+  const toggleRow = (id: string) => {
+    const newSelected = new Set(selectedRows);
+    if (newSelected.has(id)) newSelected.delete(id);
+    else newSelected.add(id);
+    setSelectedRows(newSelected);
+  };
+
+  const toggleAll = () => {
+    if (selectedRows.size === (data?.length || 0)) {
+      setSelectedRows(new Set());
+    } else {
+      setSelectedRows(new Set(data?.map(i => i.id) || []));
+    }
+  };` : "";
+  const statsCards = includeStats ? `
+      {/* Stats Cards */}
+      ${animations.cardAnimations ? `<motion.div
+        className="grid gap-4 md:grid-cols-2 lg:grid-cols-4"
+        variants={containerVariants}
+        initial="hidden"
+        animate="visible"
+      >` : `<div className="grid gap-4 md:grid-cols-2 lg:grid-cols-4">`}
+        ${animations.cardAnimations ? `<motion.div variants={itemVariants}>` : ""}
+          <Card>
+            <CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
+              <CardTitle className="text-sm font-medium">Total ${entityName}s</CardTitle>
+            </CardHeader>
+            <CardContent>
+              <div className="text-2xl font-bold">128</div>
+              <p className="text-xs text-muted-foreground">+20.1% from last month</p>
+            </CardContent>
+          </Card>
+        ${animations.cardAnimations ? `</motion.div>` : ""}
+
+        ${animations.cardAnimations ? `<motion.div variants={itemVariants}>` : ""}
+          <Card>
+            <CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
+              <CardTitle className="text-sm font-medium">Active</CardTitle>
+            </CardHeader>
+            <CardContent>
+              <div className="text-2xl font-bold">12</div>
+              <p className="text-xs text-muted-foreground">+4 since yesterday</p>
+            </CardContent>
+          </Card>
+        ${animations.cardAnimations ? `</motion.div>` : ""}
+
+        ${animations.cardAnimations ? `<motion.div variants={itemVariants}>` : ""}
+          <Card>
+            <CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
+              <CardTitle className="text-sm font-medium">Pending</CardTitle>
+            </CardHeader>
+            <CardContent>
+              <div className="text-2xl font-bold">4</div>
+              <p className="text-xs text-muted-foreground">-2 since yesterday</p>
+            </CardContent>
+          </Card>
+        ${animations.cardAnimations ? `</motion.div>` : ""}
+
+        ${animations.cardAnimations ? `<motion.div variants={itemVariants}>` : ""}
+          <Card>
+            <CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
+              <CardTitle className="text-sm font-medium">Closed</CardTitle>
+            </CardHeader>
+            <CardContent>
+              <div className="text-2xl font-bold">2</div>
+              <p className="text-xs text-muted-foreground">+1 since yesterday</p>
+            </CardContent>
+          </Card>
+        ${animations.cardAnimations ? `</motion.div>` : ""}
+      ${animations.cardAnimations ? `</motion.div>` : `</div>`}
+` : "";
+  const filterComponents = filters.map((f) => {
+    if (f.type === "select") {
+      return `
+            <Select
+              value={searchParams.get('${f.key}') || 'all'}
+              onValueChange={(value) => updateParam('${f.key}', value === 'all' ? null : value)}
+            >
+              <SelectTrigger className="w-[150px]">
+                <SelectValue placeholder="${f.label}" />
+              </SelectTrigger>
+              <SelectContent>
+                <SelectItem value="all">All ${f.label}</SelectItem>
+                <SelectItem value="active">Active</SelectItem>
+                <SelectItem value="inactive">Inactive</SelectItem>
+              </SelectContent>
+            </Select>`;
+    } else if (f.type === "date") {
+      return `
+            <Popover>
+              <PopoverTrigger asChild>
+                <Button
+                  variant="outline"
+                  className={cn(
+                    "w-[200px] justify-start text-left font-normal",
+                    !searchParams.get('${f.key}') && "text-muted-foreground"
+                  )}
+                >
+                  <CalendarIcon className="mr-2 h-4 w-4" />
+                  {searchParams.get('${f.key}') ? (
+                    format(new Date(searchParams.get('${f.key}')!), "PPP")
+                  ) : (
+                    <span>${f.label}</span>
+                  )}
+                </Button>
+              </PopoverTrigger>
+              <PopoverContent className="w-auto p-0" align="start">
+                <Calendar
+                  mode="single"
+                  selected={searchParams.get('${f.key}') ? new Date(searchParams.get('${f.key}')!) : undefined}
+                  onSelect={(date) => updateParam('${f.key}', date ? date.toISOString() : null)}
+                  initialFocus
+                />
+              </PopoverContent>
+            </Popover>`;
+    }
+    return "";
+  }).join("\n");
+  const tableHeaders = columns.map((c) => {
+    const isSortable = sortableColumns.includes(c.key);
+    if (isSortable) {
+      return `                <TableHead className="cursor-pointer" onClick={() => handleSort('${c.key}')}>
+                  <div className="flex items-center gap-1">
+                    ${c.label.toUpperCase()}
+                    {searchParams.get('sortBy') === '${c.key}' ? (
+                      searchParams.get('order') === 'asc' ? <ArrowUp className="h-3 w-3" /> : <ArrowDown className="h-3 w-3" />
+                    ) : <ArrowUpDown className="h-3 w-3 text-muted-foreground" />}
+                  </div>
+                </TableHead>`;
+    }
+    return `                <TableHead>${c.label.toUpperCase()}</TableHead>`;
+  }).join("\n");
+  const tableCells = columns.map((c) => {
+    if (c.key === "status") {
+      return `                            <TableCell>
+                              <Badge variant={item.status === 'Active' ? 'default' : 'secondary'} className="rounded-full">
+                                {item.status}
+                              </Badge>
+                            </TableCell>`;
+    }
+    if (c.type === "date") {
+      return `                            <TableCell className="text-muted-foreground">{new Date(item.${c.key}).toLocaleDateString()}</TableCell>`;
+    }
+    return `                            <TableCell>{item.${c.key}}</TableCell>`;
+  }).join("\n");
+  const colSpan = columns.length + 2 + (includeRowSelection ? 1 : 0);
+  return `${imports}
+
+/**
+ * ${entityName} List Component (Simplified Architecture)
+ * Generated by shadcn-page-gen
+ */
+
+${mockDataInterface}
+
+${mockData}
+${animationVariants}
+export function ${entityName}List() {
+  const router = useRouter();
+  const searchParams = useSearchParams();
+
+  const [searchTerm, setSearchTerm] = useState(searchParams.get('q') || '');
+  const pageSize = Number(searchParams.get('limit')) || 10;
+${dataFetchingSetup}
+${rowSelectionCode}
+
+  const updateParam = (key: string, value: string | null) => {
+    const params = new URLSearchParams(searchParams.toString());
+    if (value) params.set(key, value);
+    else params.delete(key);
+
+    if (key !== 'page') params.set('page', '1');
+
+    router.push('?' + params.toString());
+  };
+
+  ${sortableColumns.length > 0 ? `const handleSort = (key: string) => {
+    const currentSort = searchParams.get('sortBy');
+    const currentOrder = searchParams.get('order');
+
+    let newOrder = 'asc';
+    if (currentSort === key && currentOrder === 'asc') {
+      newOrder = 'desc';
+    }
+
+    const params = new URLSearchParams(searchParams.toString());
+    params.set('sortBy', key);
+    params.set('order', newOrder);
+    router.push('?' + params.toString());
+  };` : ""}
+
+  return (
+    <div className="space-y-6">
+${statsCards}
+      {/* Actions Bar */}
+      <div className="flex flex-col gap-4 md:flex-row md:items-center md:justify-between">
+        <div className="flex flex-1 items-center gap-2">
+          <div className="relative flex-1">
+            <Search className="absolute left-2.5 top-2.5 h-4 w-4 text-muted-foreground" />
+            <Input
+              placeholder="Search..."
+              value={searchTerm}
+              onChange={(e) => setSearchTerm(e.target.value)}
+              onBlur={() => updateParam('q', searchTerm)}
+              className="pl-9 w-full md:max-w-md"
+            />
+          </div>
+${filterComponents}
+          {(searchParams.toString().length > 0) && (
+            <Button variant="ghost" size="icon" onClick={() => router.push('/${routePath}')} title="Reset Filters">
+              <X className="h-4 w-4" />
+            </Button>
+          )}
+        </div>
+
+        <div className="flex items-center gap-2">
+          <Button variant="outline" size="sm" onClick={() => ${isTanStack ? "refetch()" : "fetchData()"}}>
+            <RefreshCcw className="mr-2 h-4 w-4" /> Refresh
+          </Button>
+          <Button size="sm">
+            <Plus className="mr-2 h-4 w-4" /> New ${entityName}
+          </Button>
+        </div>
+      </div>
+
+      {/* Main Table */}
+      <Card>
+        <CardContent className="p-0">
+          <Table>
+            <TableHeader>
+              <TableRow>
+                ${includeRowSelection ? `<TableHead className="w-[50px]"><Checkbox checked={data?.length > 0 && selectedRows.size === data?.length} onCheckedChange={toggleAll} /></TableHead>` : ""}
+                <TableHead className="w-[100px]">ID</TableHead>
+${tableHeaders}
+                <TableHead className="text-right">ACTIONS</TableHead>
+              </TableRow>
+            </TableHeader>
+            <TableBody>
+              {loading ? (
+                <TableRow>
+                  <TableCell colSpan={${colSpan}} className="text-center h-24 text-muted-foreground">Loading data...</TableCell>
+                </TableRow>
+              ) : !data || data.length === 0 ? (
+                <TableRow>
+                  <TableCell colSpan={${colSpan}} className="text-center h-24 text-muted-foreground">No results found.</TableCell>
+                </TableRow>
+              ) : (
+                ${animations.listAnimations ? `
+                data.map((item, index) => (
+                  <motion.tr
+                    key={item.id}
+                    variants={itemVariants}
+                    initial="hidden"
+                    animate="visible"
+                    custom={index}
+                    className="group"
+                  >` : `data.map((item) => (
+                  <TableRow key={item.id} className="group">`}
+                    ${includeRowSelection ? `<TableCell><Checkbox checked={selectedRows.has(item.id)} onCheckedChange={() => toggleRow(item.id)} /></TableCell>` : ""}
+                    <TableCell className="font-medium">{item.id}</TableCell>
+${tableCells}
+                    <TableCell className="text-right">
+                      <div className="flex justify-end gap-2">
+                        <Button variant="ghost" size="icon" className="h-8 w-8 text-blue-500 hover:text-blue-600 hover:bg-blue-50 dark:hover:bg-blue-950">
+                          <Eye className="h-4 w-4" />
+                        </Button>
+                        <Button variant="ghost" size="icon" className="h-8 w-8 text-green-500 hover:text-green-600 hover:bg-green-50 dark:hover:bg-green-950">
+                          <Pencil className="h-4 w-4" />
+                        </Button>
+                        <Button variant="ghost" size="icon" className="h-8 w-8 text-red-500 hover:text-red-600 hover:bg-red-50 dark:hover:bg-red-950">
+                          <Trash2 className="h-4 w-4" />
+                        </Button>
+                        <DropdownMenu>
+                          <DropdownMenuTrigger asChild>
+                            <Button variant="ghost" size="icon" className="h-8 w-8">
+                              <MoreHorizontal className="h-4 w-4" />
+                            </Button>
+                          </DropdownMenuTrigger>
+                          <DropdownMenuContent align="end">
+                            <DropdownMenuLabel>Actions</DropdownMenuLabel>
+                            <DropdownMenuItem>View Details</DropdownMenuItem>
+                            <DropdownMenuItem>Edit Record</DropdownMenuItem>
+                          </DropdownMenuContent>
+                        </DropdownMenu>
+                      </div>
+                    </TableCell>
+                  ${animations.listAnimations ? `</motion.tr>` : `</TableRow>`}
+                ))
+              )}
+            </TableBody>
+          </Table>
+        </CardContent>
+      </Card>
+
+      {/* Pagination */}
+      <div className="flex flex-col gap-4 md:flex-row md:items-center md:justify-between">
+        <div className="flex items-center gap-2 text-sm text-muted-foreground">
+          <span>Show</span>
+          <Select value={pageSize.toString()} onValueChange={(v) => updateParam('limit', v)}>
+            <SelectTrigger className="h-8 w-[70px]">
+              <SelectValue placeholder={pageSize.toString()} />
+            </SelectTrigger>
+            <SelectContent side="top">
+              {[10, 20, 30, 50, 100].map((size) => (
+                <SelectItem key={size} value={size.toString()}>
+                  {size}
+                </SelectItem>
+              ))}
+            </SelectContent>
+          </Select>
+          <span>entries</span>
+        </div>
+        <Pagination className="justify-end w-auto">
+          <PaginationContent>
+            <PaginationItem>
+              <PaginationPrevious href="#" />
+            </PaginationItem>
+            <PaginationItem>
+              <PaginationLink href="#" isActive>1</PaginationLink>
+            </PaginationItem>
+            <PaginationItem>
+              <PaginationLink href="#">2</PaginationLink>
+            </PaginationItem>
+            <PaginationItem>
+              <PaginationLink href="#">3</PaginationLink>
+            </PaginationItem>
+            <PaginationItem>
+              <PaginationNext href="#" />
+            </PaginationItem>
+          </PaginationContent>
+        </Pagination>
+      </div>
+    </div>
+  );
+}
+`;
+}
+
+// src/templates/simplified/page.ts
+function generateSimplifiedPage(config) {
+  const { pageName, moduleName, entityName } = config;
+  return `import { Suspense } from 'react';
+import { ${entityName}List } from '@/components/${moduleName}/${moduleName}-list';
+
+/**
+ * ${pageName} Page
+ * Generated by shadcn-page-gen (Simplified Architecture)
+ */
+export default function ${entityName}Page() {
+  return (
+    <div className="container mx-auto py-10 space-y-8">
+      <div>
+        <h1 className="text-3xl font-bold tracking-tight">${pageName}</h1>
+        <p className="text-muted-foreground">
+          Manage your ${pageName.toLowerCase()}.
+        </p>
+      </div>
+
+      <Suspense fallback={<div>Loading...</div>}>
+        <${entityName}List />
+      </Suspense>
+    </div>
+  );
+}
+`;
+}
+
+// src/generators/simplified-generator.ts
+var SimplifiedGenerator = class {
+  constructor(config) {
+    this.config = config;
+  }
+  async generate() {
+    const files = [];
+    const cwd = process.cwd();
+    const { moduleName, routePath } = this.config;
+    const componentDir = import_path3.default.join(cwd, "components", moduleName);
+    const appDir = import_path3.default.join(cwd, "app", "(dashboard)", routePath);
+    await createDirectories([componentDir, appDir]);
+    files.push({
+      path: import_path3.default.join(componentDir, `${moduleName}-list.tsx`),
+      content: generateSimplifiedComponent(this.config)
+    });
+    files.push({
+      path: import_path3.default.join(appDir, "page.tsx"),
+      content: generateSimplifiedPage(this.config)
+    });
+    if (this.config.animations.pageTransitions) {
+      files.push({
+        path: import_path3.default.join(appDir, "template.tsx"),
+        content: generateTemplate(this.config)
+      });
+    }
+    await writeFiles(files);
+    const instructions = this.generateInstructions();
+    return { files, instructions };
+  }
+  generateInstructions() {
+    const instructions = [];
+    instructions.push(`Navigate to your page: http://localhost:3000/${this.config.routePath}`);
+    const deps = [];
+    if (this.config.dataFetching === "tanstack") {
+      deps.push("@tanstack/react-query");
+    }
+    if (this.config.animations.pageTransitions || this.config.animations.listAnimations) {
+      deps.push("framer-motion");
+    }
+    if (deps.length > 0) {
+      instructions.push(`Install dependencies: npm install ${deps.join(" ")}`);
+    }
+    instructions.push("Customize the generated code to fit your needs");
+    instructions.push("Replace mock data with your real API");
+    if (this.config.dataFetching === "tanstack") {
+      instructions.push("Ensure your app is wrapped in <QueryClientProvider>");
+    }
+    return instructions;
+  }
+};
+
+// src/generators/index.ts
+var PageGenerator = class {
+  constructor(config) {
+    this.config = config;
+    this.generator = config.architecture === "ddd" ? new DDDGenerator(config) : new SimplifiedGenerator(config);
+  }
+  generator;
+  /**
+   * Generates all files and returns result
+   */
+  async generate() {
+    return await this.generator.generate();
+  }
+};
+
+// src/cli/index.ts
+async function run() {
+  try {
+    console.clear();
+    logger.title("\u{1F3A8} shadcn-page-gen");
+    logger.dim("Generate production-ready Next.js pages with shadcn/ui, Tailwind v4, and Framer Motion\n");
+    const config = await collectConfiguration();
+    if (!config) {
+      logger.warning("Operation cancelled");
+      process.exit(0);
+    }
+    console.log("\n");
+    logger.title("\u{1F4CB} Configuration Summary");
+    logger.info(`Page Name: ${config.pageName}`);
+    logger.info(`Route: /${config.routePath}`);
+    logger.info(`Architecture: ${config.architecture.toUpperCase()}`);
+    logger.info(`Data Fetching: ${config.dataFetching}`);
+    logger.info(`Animations: ${config.animations.intensity} intensity`);
+    console.log("");
+    const spinner = (0, import_ora.default)("Generating files...").start();
+    try {
+      const generator = new PageGenerator(config);
+      const result = await generator.generate();
+      spinner.succeed("Files generated successfully!");
+      console.log("");
+      logger.title("\u{1F4C1} Generated Files");
+      result.files.forEach((file) => {
+        logger.dim(`  ${file.path}`);
+      });
+      console.log("");
+      logger.title("\u{1F389} Success!");
+      logger.success("Your page has been generated!");
+      console.log("");
+      logger.title("\u{1F4DD} Next Steps");
+      result.instructions.forEach((instruction, index) => {
+        logger.step(index + 1, result.instructions.length, instruction);
+      });
+      console.log("");
+      logger.dim("Happy coding! \u{1F680}\n");
+    } catch (error) {
+      spinner.fail("Generation failed");
+      throw error;
+    }
+  } catch (error) {
+    logger.error("An error occurred:");
+    console.error(error);
+    process.exit(1);
+  }
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  run
+});
+//# sourceMappingURL=index.cjs.map