create-loadout 1.0.0

package/dist/integrations/sentry.js

@@ -0,0 +1,47 @@
+import fs from 'fs/promises';
+import path from 'path';
+import { sentryTemplates } from '../templates/sentry.js';
+export const sentryIntegration = {
+    id: 'sentry',
+    name: 'Sentry',
+    description: 'Error tracking and monitoring',
+    packages: ['@sentry/nextjs'],
+    envVars: [
+        {
+            key: 'NEXT_PUBLIC_SENTRY_DSN',
+            description: 'Sentry DSN',
+            example: 'https://...@sentry.io/...',
+            isPublic: true,
+        },
+        {
+            key: 'SENTRY_AUTH_TOKEN',
+            description: 'Sentry auth token for source maps',
+            example: 'sntrys_...',
+        },
+        {
+            key: 'SENTRY_ORG',
+            description: 'Sentry organization slug',
+            example: 'your-org',
+        },
+        {
+            key: 'SENTRY_PROJECT',
+            description: 'Sentry project slug',
+            example: 'your-project',
+        },
+    ],
+    setup: async (projectPath) => {
+        // instrumentation.ts and instrumentation-client.ts are generated centrally
+        // in cli.ts to handle merging with other integrations (e.g., PostHog)
+        // Create server and edge config files (imported by instrumentation.ts)
+        await fs.writeFile(path.join(projectPath, 'sentry.server.config.ts'), sentryTemplates.serverConfig);
+        await fs.writeFile(path.join(projectPath, 'sentry.edge.config.ts'), sentryTemplates.edgeConfig);
+        // Create global-error.tsx
+        await fs.writeFile(path.join(projectPath, 'app/global-error.tsx'), sentryTemplates.globalError);
+        // Update next.config.ts to wrap with Sentry
+        const nextConfigPath = path.join(projectPath, 'next.config.ts');
+        await fs.writeFile(nextConfigPath, sentryTemplates.nextConfig);
+        // No service needed - use Sentry directly:
+        // Server: import * as Sentry from '@sentry/nextjs'; Sentry.captureException(error)
+        // Client: Same import, already initialized via instrumentation-client.ts
+    },
+};

package/dist/integrations/stripe.d.ts

@@ -0,0 +1,2 @@
+import type { Integration } from '../types.js';
+export declare const stripeIntegration: Integration;

package/dist/integrations/stripe.js

@@ -0,0 +1,45 @@
+import fs from 'fs/promises';
+import path from 'path';
+import { stripeTemplates } from '../templates/stripe.js';
+export const stripeIntegration = {
+    id: 'stripe',
+    name: 'Stripe',
+    description: 'Payments and subscriptions',
+    packages: ['stripe'],
+    envVars: [
+        {
+            key: 'STRIPE_SECRET_KEY',
+            description: 'Stripe secret key',
+            example: 'sk_test_...',
+        },
+        {
+            key: 'NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY',
+            description: 'Stripe publishable key',
+            example: 'pk_test_...',
+            isPublic: true,
+        },
+        {
+            key: 'STRIPE_WEBHOOK_SECRET',
+            description: 'Stripe webhook secret',
+            example: 'whsec_...',
+        },
+    ],
+    setup: async (projectPath) => {
+        // Create payment service
+        await fs.mkdir(path.join(projectPath, 'services'), { recursive: true });
+        await fs.writeFile(path.join(projectPath, 'services/payment.service.ts'), stripeTemplates.paymentService);
+        // Create API routes
+        await fs.mkdir(path.join(projectPath, 'app/api/stripe/checkout'), {
+            recursive: true,
+        });
+        await fs.mkdir(path.join(projectPath, 'app/api/stripe/webhooks'), {
+            recursive: true,
+        });
+        await fs.mkdir(path.join(projectPath, 'app/api/stripe/portal'), {
+            recursive: true,
+        });
+        await fs.writeFile(path.join(projectPath, 'app/api/stripe/checkout/route.ts'), stripeTemplates.checkoutRoute);
+        await fs.writeFile(path.join(projectPath, 'app/api/stripe/webhooks/route.ts'), stripeTemplates.webhooksRoute);
+        await fs.writeFile(path.join(projectPath, 'app/api/stripe/portal/route.ts'), stripeTemplates.portalRoute);
+    },
+};

package/dist/integrations/uploadthing.d.ts

@@ -0,0 +1,2 @@
+import type { Integration } from '../types.js';
+export declare const uploadthingIntegration: Integration;

package/dist/integrations/uploadthing.js

@@ -0,0 +1,34 @@
+import fs from 'fs/promises';
+import path from 'path';
+import { uploadthingTemplates } from '../templates/uploadthing.js';
+export const uploadthingIntegration = {
+    id: 'uploadthing',
+    name: 'UploadThing',
+    description: 'File uploads',
+    packages: ['uploadthing', '@uploadthing/react'],
+    envVars: [
+        {
+            key: 'UPLOADTHING_TOKEN',
+            description: 'UploadThing token',
+            example: '...',
+        },
+    ],
+    setup: async (projectPath) => {
+        // Create lib directory
+        await fs.mkdir(path.join(projectPath, 'lib'), { recursive: true });
+        // Create UploadThing client helpers
+        await fs.writeFile(path.join(projectPath, 'lib/uploadthing.client.ts'), uploadthingTemplates.uploadthingClient);
+        // Create file service
+        await fs.mkdir(path.join(projectPath, 'services'), { recursive: true });
+        await fs.writeFile(path.join(projectPath, 'services/file.service.ts'), uploadthingTemplates.fileService);
+        // Create API routes
+        await fs.mkdir(path.join(projectPath, 'app/api/uploadthing'), {
+            recursive: true,
+        });
+        await fs.writeFile(path.join(projectPath, 'app/api/uploadthing/core.ts'), uploadthingTemplates.uploadthingCore);
+        await fs.writeFile(path.join(projectPath, 'app/api/uploadthing/route.ts'), uploadthingTemplates.uploadthingRoute);
+        // Create upload button component
+        await fs.mkdir(path.join(projectPath, 'components'), { recursive: true });
+        await fs.writeFile(path.join(projectPath, 'components/upload-button.tsx'), uploadthingTemplates.uploadButton);
+    },
+};

package/dist/landing-page.d.ts

@@ -0,0 +1,2 @@
+import type { ProjectConfig } from './types.js';
+export declare function generateLandingPage(projectPath: string, config: ProjectConfig): Promise<void>;

package/dist/landing-page.js

@@ -0,0 +1,97 @@
+import fs from 'fs/promises';
+import path from 'path';
+const coreTechnologies = [
+    { name: 'Next.js', href: 'https://nextjs.org/docs', description: 'App Router & React 19' },
+    { name: 'Tailwind', href: 'https://tailwindcss.com/docs', description: 'Utility-first CSS' },
+    { name: 'shadcn/ui', href: 'https://ui.shadcn.com', description: 'Component primitives' },
+    { name: 'Zod', href: 'https://zod.dev', description: 'Schema validation' },
+    { name: 'Zustand', href: 'https://zustand.docs.pmnd.rs', description: 'State management' },
+    { name: 'Luxon', href: 'https://moment.github.io/luxon', description: 'Date/time' },
+];
+const integrationTechnologies = {
+    clerk: { name: 'Clerk', href: 'https://clerk.com/docs', description: 'Authentication' },
+    'neon-drizzle': { name: 'Neon + Drizzle', href: 'https://neon.tech/docs', description: 'Serverless Postgres' },
+    'ai-sdk': { name: 'AI SDK', href: 'https://sdk.vercel.ai/docs', description: 'AI integration' },
+    resend: { name: 'Resend', href: 'https://resend.com/docs', description: 'Email API' },
+    firecrawl: { name: 'Firecrawl', href: 'https://docs.firecrawl.dev', description: 'Web scraping' },
+    inngest: { name: 'Inngest', href: 'https://www.inngest.com/docs', description: 'Background jobs' },
+    uploadthing: { name: 'UploadThing', href: 'https://docs.uploadthing.com', description: 'File uploads' },
+    stripe: { name: 'Stripe', href: 'https://docs.stripe.com', description: 'Payments' },
+    posthog: { name: 'PostHog', href: 'https://posthog.com/docs', description: 'Analytics' },
+    sentry: { name: 'Sentry', href: 'https://docs.sentry.io', description: 'Error tracking' },
+};
+export async function generateLandingPage(projectPath, config) {
+    const technologies = [
+        ...coreTechnologies,
+        ...config.integrations.map((id) => integrationTechnologies[id]),
+    ];
+    const techArrayString = technologies
+        .map((tech) => `    { name: '${tech.name}', href: '${tech.href}', description: '${tech.description}' },`)
+        .join('\n');
+    const content = `import { ExternalLink } from 'lucide-react';
+
+export default function Home() {
+  const technologies = [
+${techArrayString}
+  ];
+
+  return (
+    <main className="min-h-screen bg-stone-50 text-stone-900 selection:bg-amber-200">
+      <div className="max-w-2xl mx-auto px-6 py-24">
+        <header className="mb-16 text-center">
+          <div className="inline-flex items-center gap-2 px-3 py-1 mb-6 text-xs font-medium tracking-wide text-amber-700 bg-amber-100 rounded-full">
+            <span className="w-1.5 h-1.5 bg-amber-500 rounded-full" />
+            Setup complete
+          </div>
+          <h1 className="text-4xl sm:text-5xl font-light tracking-tight mb-4 text-stone-800">
+            You&apos;re ready to build.
+          </h1>
+          <p className="text-stone-500 max-w-md mx-auto">
+            Your project is configured and running. Delete this page and start creating.
+          </p>
+        </header>
+
+        <section className="mb-16">
+          <h2 className="text-xs font-semibold tracking-widest text-stone-400 uppercase mb-6 text-center">
+            Your Stack
+          </h2>
+
+          <div className="grid grid-cols-2 sm:grid-cols-3 gap-3">
+            {technologies.map((tech) => (
+              <a
+                key={tech.name}
+                href={tech.href}
+                target="_blank"
+                rel="noopener noreferrer"
+                className="group p-4 rounded-lg border border-stone-200 bg-white hover:border-stone-300 hover:shadow-sm transition-all duration-200"
+              >
+                <div className="flex items-center justify-between mb-1">
+                  <span className="font-medium text-stone-800 text-sm">{tech.name}</span>
+                  <ExternalLink className="w-3 h-3 text-stone-300 group-hover:text-amber-500 transition-colors" />
+                </div>
+                <span className="text-xs text-stone-400">{tech.description}</span>
+              </a>
+            ))}
+          </div>
+        </section>
+
+        <footer className="text-center pt-8 border-t border-stone-200">
+          <p className="text-xs text-stone-400">
+            Scaffolded with{' '}
+            <a
+              href="https://github.com/KylerD/loadout"
+              target="_blank"
+              rel="noopener noreferrer"
+              className="text-stone-500 hover:text-amber-600 transition-colors"
+            >
+              create-loadout
+            </a>
+          </p>
+        </footer>
+      </div>
+    </main>
+  );
+}
+`;
+    await fs.writeFile(path.join(projectPath, 'app/page.tsx'), content);
+}

package/dist/prompts.d.ts

@@ -0,0 +1,7 @@
+import type { IntegrationId, ProjectConfig, AIProviderChoice } from './types.js';
+export interface AddIntegrationConfig {
+    integrations: IntegrationId[];
+    aiProvider?: AIProviderChoice;
+}
+export declare function getProjectConfig(): Promise<ProjectConfig>;
+export declare function getAddIntegrationConfig(available: IntegrationId[]): Promise<AddIntegrationConfig>;

package/dist/prompts.js

@@ -0,0 +1,99 @@
+import { input, confirm, select } from '@inquirer/prompts';
+export async function getProjectConfig() {
+    const name = await input({
+        message: 'Project name:',
+        default: 'my-app',
+        validate: (value) => {
+            if (!value.trim())
+                return 'Project name is required';
+            if (!/^[a-z0-9-]+$/.test(value)) {
+                return 'Project name can only contain lowercase letters, numbers, and hyphens';
+            }
+            return true;
+        },
+    });
+    const integrations = [];
+    let aiProvider;
+    // Authentication
+    if (await confirm({ message: 'Add Clerk for authentication?', default: false })) {
+        integrations.push('clerk');
+    }
+    // Database
+    if (await confirm({ message: 'Add Neon + Drizzle for database?', default: false })) {
+        integrations.push('neon-drizzle');
+    }
+    // AI
+    if (await confirm({ message: 'Add Vercel AI SDK?', default: false })) {
+        integrations.push('ai-sdk');
+        aiProvider = await select({
+            message: 'Which AI provider?',
+            choices: [
+                { value: 'openai', name: 'OpenAI (GPT-4o)' },
+                { value: 'anthropic', name: 'Anthropic (Claude)' },
+                { value: 'google', name: 'Google (Gemini)' },
+            ],
+        });
+    }
+    // Email
+    if (await confirm({ message: 'Add Resend for email?', default: false })) {
+        integrations.push('resend');
+    }
+    // Scraping
+    if (await confirm({ message: 'Add Firecrawl for web scraping?', default: false })) {
+        integrations.push('firecrawl');
+    }
+    // Background Jobs
+    if (await confirm({ message: 'Add Inngest for background jobs?', default: false })) {
+        integrations.push('inngest');
+    }
+    // File Uploads
+    if (await confirm({ message: 'Add UploadThing for file uploads?', default: false })) {
+        integrations.push('uploadthing');
+    }
+    // Payments
+    if (await confirm({ message: 'Add Stripe for payments?', default: false })) {
+        integrations.push('stripe');
+    }
+    // Analytics
+    if (await confirm({ message: 'Add PostHog for analytics?', default: false })) {
+        integrations.push('posthog');
+    }
+    // Error Tracking
+    if (await confirm({ message: 'Add Sentry for error tracking?', default: false })) {
+        integrations.push('sentry');
+    }
+    return { name, integrations, aiProvider };
+}
+const integrationPrompts = {
+    clerk: 'Add Clerk for authentication?',
+    'neon-drizzle': 'Add Neon + Drizzle for database?',
+    'ai-sdk': 'Add Vercel AI SDK?',
+    resend: 'Add Resend for email?',
+    firecrawl: 'Add Firecrawl for web scraping?',
+    inngest: 'Add Inngest for background jobs?',
+    uploadthing: 'Add UploadThing for file uploads?',
+    stripe: 'Add Stripe for payments?',
+    posthog: 'Add PostHog for analytics?',
+    sentry: 'Add Sentry for error tracking?',
+};
+export async function getAddIntegrationConfig(available) {
+    const integrations = [];
+    let aiProvider;
+    for (const id of available) {
+        const message = integrationPrompts[id];
+        if (await confirm({ message, default: false })) {
+            integrations.push(id);
+            if (id === 'ai-sdk') {
+                aiProvider = await select({
+                    message: 'Which AI provider?',
+                    choices: [
+                        { value: 'openai', name: 'OpenAI (GPT-4o)' },
+                        { value: 'anthropic', name: 'Anthropic (Claude)' },
+                        { value: 'google', name: 'Google (Gemini)' },
+                    ],
+                });
+            }
+        }
+    }
+    return { integrations, aiProvider };
+}

package/dist/setup-shadcn.d.ts

@@ -0,0 +1 @@
+export declare function setupShadcn(projectPath: string): Promise<void>;

package/dist/setup-shadcn.js

@@ -0,0 +1,27 @@
+import { execa } from 'execa';
+export async function setupShadcn(projectPath) {
+    // Initialize shadcn/ui with defaults
+    await execa('npx', [
+        'shadcn@latest',
+        'init',
+        '-y',
+        '--base-color', 'neutral',
+    ], {
+        cwd: projectPath,
+        stdio: 'pipe',
+    });
+    // Add commonly used components
+    await execa('npx', [
+        'shadcn@latest',
+        'add',
+        'button',
+        'input',
+        'card',
+        'form',
+        'label',
+        '-y',
+    ], {
+        cwd: projectPath,
+        stdio: 'pipe',
+    });
+}

package/dist/templates/ai-sdk.d.ts

@@ -0,0 +1,12 @@
+export type AIProvider = 'openai' | 'anthropic' | 'google';
+export declare function getAiServiceTemplate(provider: AIProvider): string;
+export declare function getAiPackages(provider: AIProvider): string[];
+export declare function getAiEnvVar(provider: AIProvider): {
+    key: string;
+    example: string;
+    description: string;
+};
+export declare function getAiConfigVar(provider: AIProvider): {
+    name: string;
+    envKey: string;
+};

package/dist/templates/ai-sdk.js

@@ -0,0 +1,96 @@
+const providerConfigs = {
+    openai: {
+        package: '@ai-sdk/openai',
+        import: "import { createOpenAI, type OpenAIProvider } from '@ai-sdk/openai';",
+        createFn: 'createOpenAI',
+        providerType: 'OpenAIProvider',
+        configVar: 'OPENAI_API_KEY',
+        defaultModel: 'gpt-4o-mini',
+    },
+    anthropic: {
+        package: '@ai-sdk/anthropic',
+        import: "import { createAnthropic, type AnthropicProvider } from '@ai-sdk/anthropic';",
+        createFn: 'createAnthropic',
+        providerType: 'AnthropicProvider',
+        configVar: 'ANTHROPIC_API_KEY',
+        defaultModel: 'claude-sonnet-4-5',
+    },
+    google: {
+        package: '@ai-sdk/google',
+        import: "import { createGoogleGenerativeAI, type GoogleGenerativeAIProvider } from '@ai-sdk/google';",
+        createFn: 'createGoogleGenerativeAI',
+        providerType: 'GoogleGenerativeAIProvider',
+        configVar: 'GOOGLE_API_KEY',
+        defaultModel: 'gemini-2.0-flash',
+    },
+};
+export function getAiServiceTemplate(provider) {
+    const config = providerConfigs[provider];
+    return `import { generateText, Output } from 'ai';
+${config.import}
+import { z } from 'zod';
+import { ${config.configVar} } from '@/lib/config';
+
+export class AIService {
+  private provider: ${config.providerType};
+
+  constructor(apiKey: string) {
+    this.provider = ${config.createFn}({ apiKey });
+  }
+
+  async generateObject() {
+    const model = this.provider('${config.defaultModel}');
+
+    const { output } = await generateText({
+      model: model,
+      output: Output.object({
+        schema: z.object({
+          recipe: z.object({
+            name: z.string(),
+            ingredients: z.array(
+              z.object({ name: z.string(), amount: z.string() }),
+            ),
+            steps: z.array(z.string()),
+          }),
+        }),
+      }),
+      prompt: 'Generate a lasagna recipe.',
+    });
+
+    return output;
+  }
+
+  async generateText() {
+    const model = this.provider('${config.defaultModel}');
+
+    const { text } = await generateText({
+      model: model,
+      prompt: 'Generate a lasagna recipe.',
+    });
+
+    return text;
+  }
+}
+
+export const aiService = new AIService(${config.configVar});
+`;
+}
+export function getAiPackages(provider) {
+    return ['ai', providerConfigs[provider].package];
+}
+export function getAiEnvVar(provider) {
+    const vars = {
+        openai: { key: 'OPENAI_API_KEY', example: 'sk-...', description: 'OpenAI API key' },
+        anthropic: { key: 'ANTHROPIC_API_KEY', example: 'sk-ant-...', description: 'Anthropic API key' },
+        google: { key: 'GOOGLE_API_KEY', example: 'AI...', description: 'Google AI API key' },
+    };
+    return vars[provider];
+}
+export function getAiConfigVar(provider) {
+    const vars = {
+        openai: { name: 'OPENAI_API_KEY', envKey: 'OPENAI_API_KEY' },
+        anthropic: { name: 'ANTHROPIC_API_KEY', envKey: 'ANTHROPIC_API_KEY' },
+        google: { name: 'GOOGLE_API_KEY', envKey: 'GOOGLE_API_KEY' },
+    };
+    return vars[provider];
+}

package/dist/templates/clerk.d.ts

@@ -0,0 +1,6 @@
+export declare const clerkTemplates: {
+    userService: string;
+    proxy: string;
+    authComponents: string;
+    wrapLayout: (content: string) => string;
+};

package/dist/templates/clerk.js

@@ -0,0 +1,96 @@
+export const clerkTemplates = {
+    userService: `import { clerkClient, User } from '@clerk/nextjs/server';
+
+export class UserService {
+  async getUserById(userId: string): Promise<User> {
+    const client = await clerkClient();
+    return client.users.getUser(userId);
+  }
+
+  async getUserByEmail(email: string): Promise<User | null> {
+    const client = await clerkClient();
+    const users = await client.users.getUserList({
+      emailAddress: [email],
+    });
+    return users.data[0] ?? null;
+  }
+
+  async updateUserMetadata(
+    userId: string,
+    metadata: {
+      publicMetadata?: Record<string, unknown>;
+      privateMetadata?: Record<string, unknown>;
+    }
+  ): Promise<User> {
+    const client = await clerkClient();
+    return client.users.updateUserMetadata(userId, metadata);
+  }
+
+  async deleteUser(userId: string): Promise<User> {
+    const client = await clerkClient();
+    return client.users.deleteUser(userId);
+  }
+}
+
+export const userService = new UserService();
+`,
+    // proxy.ts for Next.js 16+
+    proxy: `import { clerkMiddleware } from '@clerk/nextjs/server';
+
+export default clerkMiddleware();
+
+export const config = {
+  matcher: [
+    // Skip Next.js internals and all static files, unless found in search params
+    '/((?!_next|[^?]*\\.(?:html?|css|js(?!on)|jpe?g|webp|png|gif|svg|ttf|woff2?|ico|csv|docx?|xlsx?|zip|webmanifest)).*)',
+    // Always run for API routes
+    '/(api|trpc)(.*)',
+  ],
+};
+`,
+    // Auth components using native Clerk buttons
+    authComponents: `'use client';
+
+import {
+  SignInButton,
+  SignUpButton,
+  SignedIn,
+  SignedOut,
+  UserButton,
+} from '@clerk/nextjs';
+import { Button } from '@/components/ui/button';
+
+export function AuthButtons() {
+  return (
+    <div className="flex items-center gap-4">
+      <SignedOut>
+        <SignInButton mode="modal">
+          <Button variant="ghost">Sign In</Button>
+        </SignInButton>
+        <SignUpButton mode="modal">
+          <Button>Sign Up</Button>
+        </SignUpButton>
+      </SignedOut>
+      <SignedIn>
+        <UserButton afterSignOutUrl="/" />
+      </SignedIn>
+    </div>
+  );
+}
+`,
+    wrapLayout: (content) => {
+        const importStatement = "import { ClerkProvider } from '@clerk/nextjs';\n";
+        const importMatch = content.match(/^(import[\s\S]*?from\s+['"][^'"]+['"];\n*)+/m);
+        let newContent = content;
+        if (importMatch) {
+            const lastImportIndex = importMatch.index + importMatch[0].length;
+            newContent =
+                content.slice(0, lastImportIndex) + importStatement + content.slice(lastImportIndex);
+        }
+        else {
+            newContent = importStatement + content;
+        }
+        newContent = newContent.replace(/(<body[^>]*>)([\s\S]*?)(<\/body>)/, '$1\n        <ClerkProvider>$2</ClerkProvider>\n      $3');
+        return newContent;
+    },
+};

package/dist/templates/firecrawl.d.ts

@@ -0,0 +1,4 @@
+export declare const firecrawlTemplates: {
+    scrapeService: string;
+    scrapeRoute: string;
+};