@creativault/powerdata-cli 0.0.1

package/template/nextjs_template/eslint.config.mjs

@@ -0,0 +1,16 @@
+import nextCoreWebVitals from 'eslint-config-next/core-web-vitals';
+
+const eslintConfig = [
+  ...nextCoreWebVitals,
+  {
+    ignores: [
+      'node_modules/**',
+      '.next/**',
+      'out/**',
+      'build/**',
+      'next-env.d.ts',
+    ],
+  },
+];
+
+export default eslintConfig;

package/template/nextjs_template/next.config.ts

@@ -0,0 +1,31 @@
+import type { NextConfig } from 'next';
+
+const nextConfig: NextConfig = {
+  // Standalone output for Docker deployment
+  output: 'standalone',
+
+  devIndicators: false,
+
+  // https://nextjs.org/docs/architecture/nextjs-compiler#remove-console
+  compiler: {
+    // removeConsole: process.env.NODE_ENV === 'production',
+  },
+
+  experimental: {
+    // 优化大型依赖包的 tree-shaking
+    optimizePackageImports: ['lucide-react', '@radix-ui/react-icons'],
+    // 为 next dev 启用文件系统缓存
+    turbopackFileSystemCacheForDev: true,
+    // 为 next build 启用文件系统缓存
+    turbopackFileSystemCacheForBuild: true,
+  },
+
+  images: {
+    remotePatterns: [
+      // 添加允许的远程图片域名
+      // { protocol: 'https', hostname: 'example.com' },
+    ],
+  },
+};
+
+export default nextConfig;

package/template/nextjs_template/package.json

@@ -0,0 +1,57 @@
+{
+  "name": "nextjs-template",
+  "version": "0.1.0",
+  "private": true,
+  "scripts": {
+    "dev": "next dev --port 3000",
+    "build": "next build",
+    "start": "next start",
+    "lint": "biome check .",
+    "lint:fix": "biome check --fix --unsafe .",
+    "lint:next": "next lint",
+    "format": "biome format --write .",
+    "typecheck": "tsc --noEmit",
+    "test": "vitest --run",
+    "test:watch": "vitest",
+    "test:coverage": "vitest --run --coverage"
+  },
+  "dependencies": {
+    "@radix-ui/react-slot": "^1.1.2",
+    "@t3-oss/env-nextjs": "^0.11.1",
+    "class-variance-authority": "^0.7.1",
+    "clsx": "^2.1.1",
+    "lucide-react": "^0.483.0",
+    "next": "16.1.6",
+    "next-themes": "^0.4.6",
+    "react": "19.2.4",
+    "react-dom": "19.2.4",
+    "tailwind-merge": "^3.0.2",
+    "zod": "^3.24.0"
+  },
+  "devDependencies": {
+    "@biomejs/biome": "^1.9.4",
+    "@tailwindcss/postcss": "^4",
+    "@tailwindcss/typography": "^0.5.19",
+    "@testing-library/jest-dom": "^6.6.3",
+    "@testing-library/react": "^16.3.1",
+    "@types/node": "^22",
+    "@types/react": "19.2.14",
+    "@types/react-dom": "19.2.3",
+    "@vitejs/plugin-react": "^5.1.2",
+    "eslint": "^9",
+    "eslint-config-next": "16.1.6",
+    "happy-dom": "^20.3.1",
+    "tailwindcss": "^4",
+    "tw-animate-css": "^1",
+    "typescript": "^5.8.3",
+    "vitest": "^4.0.16"
+  },
+  "pnpm": {
+    "overrides": {
+      "@types/react": "19.2.14",
+      "@types/react-dom": "19.2.3",
+      "react": "19.2.4",
+      "react-dom": "19.2.4"
+    }
+  }
+}

package/template/nextjs_template/postcss.config.mjs

@@ -0,0 +1,8 @@
+/** @type {import('postcss-load-config').Config} */
+const config = {
+  plugins: {
+    '@tailwindcss/postcss': {},
+  },
+};
+
+export default config;

package/template/nextjs_template/src/app/demo/page.tsx

@@ -0,0 +1,258 @@
+import { Badge } from '@/components/ui/badge';
+import { Button } from '@/components/ui/button';
+import {
+  Card,
+  CardContent,
+  CardDescription,
+  CardFooter,
+  CardHeader,
+  CardTitle,
+} from '@/components/ui/card';
+import {
+  ArrowRight,
+  Bell,
+  Check,
+  Heart,
+  Mail,
+  Settings,
+  Shield,
+  Star,
+  Zap,
+} from 'lucide-react';
+import type { Metadata } from 'next';
+
+export const metadata: Metadata = {
+  title: 'Demo',
+  description: 'Component showcase and demo page',
+};
+
+export default function DemoPage() {
+  return (
+    <div className="container mx-auto px-4 md:px-8 py-12 space-y-16">
+      {/* Page Header */}
+      <div className="space-y-2">
+        <h1 className="text-3xl font-bold tracking-tight">Component Demo</h1>
+        <p className="text-muted-foreground">
+          A showcase of available UI components and patterns.
+        </p>
+      </div>
+
+      {/* Buttons Section */}
+      <section className="space-y-4">
+        <h2 className="text-xl font-semibold">Buttons</h2>
+        <div className="flex flex-wrap gap-3">
+          <Button>Default</Button>
+          <Button variant="secondary">Secondary</Button>
+          <Button variant="destructive">Destructive</Button>
+          <Button variant="outline">Outline</Button>
+          <Button variant="ghost">Ghost</Button>
+          <Button variant="link">Link</Button>
+        </div>
+        <div className="flex flex-wrap gap-3">
+          <Button size="sm">Small</Button>
+          <Button size="default">Default</Button>
+          <Button size="lg">Large</Button>
+          <Button size="icon" aria-label="Settings">
+            <Settings className="h-4 w-4" />
+          </Button>
+        </div>
+        <div className="flex flex-wrap gap-3">
+          <Button>
+            <Mail className="mr-2 h-4 w-4" /> Login with Email
+          </Button>
+          <Button variant="outline">
+            <Bell className="mr-2 h-4 w-4" /> Notifications
+          </Button>
+          <Button disabled>Disabled</Button>
+        </div>
+      </section>
+
+      {/* Badges Section */}
+      <section className="space-y-4">
+        <h2 className="text-xl font-semibold">Badges</h2>
+        <div className="flex flex-wrap gap-3">
+          <Badge>Default</Badge>
+          <Badge variant="secondary">Secondary</Badge>
+          <Badge variant="destructive">Destructive</Badge>
+          <Badge variant="outline">Outline</Badge>
+        </div>
+      </section>
+
+      {/* Cards Section */}
+      <section className="space-y-4">
+        <h2 className="text-xl font-semibold">Cards</h2>
+        <div className="grid gap-6 sm:grid-cols-2 lg:grid-cols-3">
+          {/* Pricing Card */}
+          <Card>
+            <CardHeader>
+              <CardTitle className="flex items-center gap-2">
+                <Zap className="h-5 w-5 text-primary" />
+                Starter
+              </CardTitle>
+              <CardDescription>Perfect for side projects</CardDescription>
+            </CardHeader>
+            <CardContent>
+              <div className="text-3xl font-bold">$0</div>
+              <p className="text-sm text-muted-foreground">Free forever</p>
+              <ul className="mt-4 space-y-2 text-sm">
+                <li className="flex items-center gap-2">
+                  <Check className="h-4 w-4 text-primary" /> 3 projects
+                </li>
+                <li className="flex items-center gap-2">
+                  <Check className="h-4 w-4 text-primary" /> Basic analytics
+                </li>
+                <li className="flex items-center gap-2">
+                  <Check className="h-4 w-4 text-primary" /> Community support
+                </li>
+              </ul>
+            </CardContent>
+            <CardFooter>
+              <Button className="w-full">Get Started</Button>
+            </CardFooter>
+          </Card>
+
+          {/* Pro Card */}
+          <Card className="border-primary">
+            <CardHeader>
+              <div className="flex items-center justify-between">
+                <CardTitle className="flex items-center gap-2">
+                  <Star className="h-5 w-5 text-primary" />
+                  Pro
+                </CardTitle>
+                <Badge>Popular</Badge>
+              </div>
+              <CardDescription>For growing teams</CardDescription>
+            </CardHeader>
+            <CardContent>
+              <div className="text-3xl font-bold">$29</div>
+              <p className="text-sm text-muted-foreground">/month</p>
+              <ul className="mt-4 space-y-2 text-sm">
+                <li className="flex items-center gap-2">
+                  <Check className="h-4 w-4 text-primary" /> Unlimited projects
+                </li>
+                <li className="flex items-center gap-2">
+                  <Check className="h-4 w-4 text-primary" /> Advanced analytics
+                </li>
+                <li className="flex items-center gap-2">
+                  <Check className="h-4 w-4 text-primary" /> Priority support
+                </li>
+              </ul>
+            </CardContent>
+            <CardFooter>
+              <Button className="w-full">
+                Upgrade <ArrowRight className="ml-2 h-4 w-4" />
+              </Button>
+            </CardFooter>
+          </Card>
+
+          {/* Enterprise Card */}
+          <Card>
+            <CardHeader>
+              <CardTitle className="flex items-center gap-2">
+                <Shield className="h-5 w-5 text-primary" />
+                Enterprise
+              </CardTitle>
+              <CardDescription>For large organizations</CardDescription>
+            </CardHeader>
+            <CardContent>
+              <div className="text-3xl font-bold">Custom</div>
+              <p className="text-sm text-muted-foreground">Contact us</p>
+              <ul className="mt-4 space-y-2 text-sm">
+                <li className="flex items-center gap-2">
+                  <Check className="h-4 w-4 text-primary" /> Everything in Pro
+                </li>
+                <li className="flex items-center gap-2">
+                  <Check className="h-4 w-4 text-primary" /> SSO & SAML
+                </li>
+                <li className="flex items-center gap-2">
+                  <Check className="h-4 w-4 text-primary" /> Dedicated support
+                </li>
+              </ul>
+            </CardContent>
+            <CardFooter>
+              <Button variant="outline" className="w-full">
+                Contact Sales
+              </Button>
+            </CardFooter>
+          </Card>
+        </div>
+      </section>
+
+      {/* Typography Section */}
+      <section className="space-y-4">
+        <h2 className="text-xl font-semibold">Typography</h2>
+        <Card>
+          <CardContent className="pt-6 space-y-4">
+            <h1 className="text-4xl font-bold tracking-tight">Heading 1</h1>
+            <h2 className="text-3xl font-semibold tracking-tight">Heading 2</h2>
+            <h3 className="text-2xl font-semibold tracking-tight">Heading 3</h3>
+            <h4 className="text-xl font-semibold tracking-tight">Heading 4</h4>
+            <p className="leading-7">
+              This is a paragraph with <strong>bold text</strong>,{' '}
+              <em>italic text</em>, and{' '}
+              <code className="relative rounded bg-muted px-[0.3rem] py-[0.2rem] font-mono text-sm">
+                inline code
+              </code>
+              .
+            </p>
+            <p className="text-sm text-muted-foreground">
+              This is muted text, commonly used for descriptions and secondary
+              information.
+            </p>
+          </CardContent>
+        </Card>
+      </section>
+
+      {/* Color Palette */}
+      <section className="space-y-4">
+        <h2 className="text-xl font-semibold">Color Palette</h2>
+        <div className="grid grid-cols-2 sm:grid-cols-4 lg:grid-cols-6 gap-3">
+          {[
+            {
+              name: 'Primary',
+              bg: 'bg-primary',
+              fg: 'text-primary-foreground',
+            },
+            {
+              name: 'Secondary',
+              bg: 'bg-secondary',
+              fg: 'text-secondary-foreground',
+            },
+            { name: 'Accent', bg: 'bg-accent', fg: 'text-accent-foreground' },
+            { name: 'Muted', bg: 'bg-muted', fg: 'text-muted-foreground' },
+            {
+              name: 'Destructive',
+              bg: 'bg-destructive',
+              fg: 'text-destructive-foreground',
+            },
+            { name: 'Card', bg: 'bg-card', fg: 'text-card-foreground' },
+          ].map((color) => (
+            <div
+              key={color.name}
+              className={`${color.bg} ${color.fg} rounded-lg p-4 text-center text-sm font-medium`}
+            >
+              {color.name}
+            </div>
+          ))}
+        </div>
+      </section>
+
+      {/* Icons */}
+      <section className="space-y-4">
+        <h2 className="text-xl font-semibold">Icons (Lucide)</h2>
+        <div className="flex flex-wrap gap-4">
+          {[Heart, Star, Zap, Shield, Mail, Bell, Settings, Check].map(
+            (Icon, i) => (
+              <div
+                key={i}
+                className="flex h-12 w-12 items-center justify-center rounded-lg border bg-card"
+              >
+                <Icon className="h-5 w-5 text-muted-foreground" />
+              </div>
+            )
+          )}
+        </div>
+      </section>
+    </div>
+  );
+}

package/template/nextjs_template/src/app/layout.tsx

@@ -0,0 +1,46 @@
+import { Footer } from '@/components/layout/footer';
+import { Header } from '@/components/layout/header';
+import { ThemeProvider } from '@/components/theme-provider';
+import type { Metadata } from 'next';
+import { Geist, Geist_Mono } from 'next/font/google';
+import '@/styles/globals.css';
+
+const geistSans = Geist({
+  variable: '--font-geist-sans',
+  subsets: ['latin'],
+});
+
+const geistMono = Geist_Mono({
+  variable: '--font-geist-mono',
+  subsets: ['latin'],
+});
+
+export const metadata: Metadata = {
+  title: {
+    default: 'MyApp',
+    template: '%s | MyApp',
+  },
+  description: 'A modern Next.js application',
+};
+
+export default function RootLayout({
+  children,
+}: Readonly<{
+  children: React.ReactNode;
+}>) {
+  return (
+    <html lang="en" suppressHydrationWarning>
+      <body
+        className={`${geistSans.variable} ${geistMono.variable} min-h-screen bg-background font-sans antialiased`}
+      >
+        <ThemeProvider>
+          <div className="relative flex min-h-screen flex-col">
+            <Header />
+            <main className="flex-1">{children}</main>
+            <Footer />
+          </div>
+        </ThemeProvider>
+      </body>
+    </html>
+  );
+}

package/template/nextjs_template/src/app/page.tsx

@@ -0,0 +1,101 @@
+import { Badge } from '@/components/ui/badge';
+import { Button } from '@/components/ui/button';
+import {
+  Card,
+  CardContent,
+  CardDescription,
+  CardHeader,
+  CardTitle,
+} from '@/components/ui/card';
+import { ArrowRight, Code2, Layers, Palette } from 'lucide-react';
+import Link from 'next/link';
+
+export default function HomePage() {
+  return (
+    <div className="container mx-auto px-4 md:px-8 py-16">
+      {/* Hero */}
+      <section className="flex flex-col items-center text-center space-y-6 py-16">
+        <Badge variant="secondary" className="text-sm">
+          Next.js Template
+        </Badge>
+        <h1 className="text-4xl font-bold tracking-tight sm:text-5xl md:text-6xl">
+          Build Something
+          <span className="text-primary"> Amazing</span>
+        </h1>
+        <p className="max-w-[600px] text-lg text-muted-foreground">
+          A clean, modern Next.js starter with Tailwind CSS, shadcn/ui
+          components, dark mode, and best practices baked in.
+        </p>
+        <div className="flex gap-4">
+          <Button asChild size="lg">
+            <Link href="/demo">
+              View Demo <ArrowRight className="ml-2 h-4 w-4" />
+            </Link>
+          </Button>
+          <Button variant="outline" size="lg" asChild>
+            <a
+              href="https://nextjs.org/docs"
+              target="_blank"
+              rel="noopener noreferrer"
+            >
+              Documentation
+            </a>
+          </Button>
+        </div>
+      </section>
+
+      {/* Features */}
+      <section className="grid gap-6 sm:grid-cols-2 lg:grid-cols-3 py-16">
+        <Card>
+          <CardHeader>
+            <Code2 className="h-10 w-10 text-primary mb-2" />
+            <CardTitle>TypeScript First</CardTitle>
+            <CardDescription>
+              Strict TypeScript configuration with path aliases and modern
+              module resolution.
+            </CardDescription>
+          </CardHeader>
+          <CardContent>
+            <p className="text-sm text-muted-foreground">
+              Biome for linting and formatting, ensuring consistent code quality
+              across the project.
+            </p>
+          </CardContent>
+        </Card>
+
+        <Card>
+          <CardHeader>
+            <Palette className="h-10 w-10 text-primary mb-2" />
+            <CardTitle>Theme System</CardTitle>
+            <CardDescription>
+              shadcn/ui design tokens with light and dark mode support out of
+              the box.
+            </CardDescription>
+          </CardHeader>
+          <CardContent>
+            <p className="text-sm text-muted-foreground">
+              CSS variables based theming with oklch colors for consistent,
+              accessible design.
+            </p>
+          </CardContent>
+        </Card>
+
+        <Card>
+          <CardHeader>
+            <Layers className="h-10 w-10 text-primary mb-2" />
+            <CardTitle>Component Library</CardTitle>
+            <CardDescription>
+              Pre-configured shadcn/ui with Button, Card, Badge and more ready
+              to use.
+            </CardDescription>
+          </CardHeader>
+          <CardContent>
+            <p className="text-sm text-muted-foreground">
+              Easily extend with additional shadcn/ui components using the CLI.
+            </p>
+          </CardContent>
+        </Card>
+      </section>
+    </div>
+  );
+}

package/template/nextjs_template/src/components/layout/footer.tsx

@@ -0,0 +1,11 @@
+export function Footer() {
+  return (
+    <footer className="border-t py-6 md:py-0">
+      <div className="container flex flex-col items-center justify-between gap-4 md:h-14 md:flex-row px-4 md:px-8">
+        <p className="text-sm text-muted-foreground">
+          Built with Next.js & Tailwind CSS
+        </p>
+      </div>
+    </footer>
+  );
+}

package/template/nextjs_template/src/components/layout/header.tsx

@@ -0,0 +1,25 @@
+import { ThemeToggle } from '@/components/theme-toggle';
+import Link from 'next/link';
+
+export function Header() {
+  return (
+    <header className="sticky top-0 z-50 w-full border-b bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/60">
+      <div className="container flex h-14 max-w-screen-2xl items-center px-4 md:px-8">
+        <Link href="/" className="mr-6 flex items-center space-x-2">
+          <span className="text-lg font-bold">MyApp</span>
+        </Link>
+        <nav className="flex flex-1 items-center space-x-6 text-sm font-medium">
+          <Link
+            href="/demo"
+            className="transition-colors hover:text-foreground/80 text-foreground/60"
+          >
+            Demo
+          </Link>
+        </nav>
+        <div className="flex items-center space-x-2">
+          <ThemeToggle />
+        </div>
+      </div>
+    </header>
+  );
+}

package/template/nextjs_template/src/components/theme-provider.tsx

@@ -0,0 +1,17 @@
+'use client';
+
+import { ThemeProvider as NextThemesProvider } from 'next-themes';
+import type { ReactNode } from 'react';
+
+export function ThemeProvider({ children }: { children: ReactNode }) {
+  return (
+    <NextThemesProvider
+      attribute="class"
+      defaultTheme="system"
+      enableSystem
+      disableTransitionOnChange
+    >
+      {children}
+    </NextThemesProvider>
+  );
+}

package/template/nextjs_template/src/components/theme-toggle.tsx

@@ -0,0 +1,21 @@
+'use client';
+
+import { Button } from '@/components/ui/button';
+import { Moon, Sun } from 'lucide-react';
+import { useTheme } from 'next-themes';
+
+export function ThemeToggle() {
+  const { theme, setTheme } = useTheme();
+
+  return (
+    <Button
+      variant="ghost"
+      size="icon"
+      onClick={() => setTheme(theme === 'dark' ? 'light' : 'dark')}
+      aria-label="Toggle theme"
+    >
+      <Sun className="h-5 w-5 rotate-0 scale-100 transition-all dark:-rotate-90 dark:scale-0" />
+      <Moon className="absolute h-5 w-5 rotate-90 scale-0 transition-all dark:rotate-0 dark:scale-100" />
+    </Button>
+  );
+}

package/template/nextjs_template/src/components/ui/badge.tsx

@@ -0,0 +1,35 @@
+import * as React from 'react';
+import { cva, type VariantProps } from 'class-variance-authority';
+import { cn } from '@/lib/utils';
+
+const badgeVariants = cva(
+  'inline-flex items-center rounded-md border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2',
+  {
+    variants: {
+      variant: {
+        default:
+          'border-transparent bg-primary text-primary-foreground shadow hover:bg-primary/80',
+        secondary:
+          'border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80',
+        destructive:
+          'border-transparent bg-destructive text-destructive-foreground shadow hover:bg-destructive/80',
+        outline: 'text-foreground',
+      },
+    },
+    defaultVariants: {
+      variant: 'default',
+    },
+  }
+);
+
+export interface BadgeProps
+  extends React.HTMLAttributes<HTMLDivElement>,
+    VariantProps<typeof badgeVariants> {}
+
+function Badge({ className, variant, ...props }: BadgeProps) {
+  return (
+    <div className={cn(badgeVariants({ variant }), className)} {...props} />
+  );
+}
+
+export { Badge, badgeVariants };