create-whop-kit 0.4.0 → 0.5.0

package/README.md

@@ -1,41 +1,104 @@
 # create-whop-kit
 
-Scaffold a new [Whop](https://whop.com)-powered app with [whop-kit](https://www.npmjs.com/package/whop-kit).
+Scaffold and manage [Whop](https://whop.com)-powered apps with [whop-kit](https://www.npmjs.com/package/whop-kit).
 
-## Usage
+## Create a new project
 
 ```bash
 npx create-whop-kit my-app
 ```
 
-You'll be prompted to choose:
+Interactive prompts guide you through:
 
-1. **What you're building** — SaaS, Course, Community, or Blank
-2. **Framework** — Next.js (more coming soon)
-3. **Database** — Neon, Supabase, Local PostgreSQL, or configure later
+1. **What are you building?** — SaaS (full dashboard + billing) or Blank (just auth + webhooks)
+2. **Which framework?** — Next.js or Astro
+3. **Which database?** — Neon (auto-provisioned), Prisma Postgres (instant), Supabase, manual URL, or skip
+4. **Whop credentials** — App ID, API key, webhook secret (optional, can use setup wizard later)
 
-The CLI clones the template, installs dependencies, configures your `.env.local`, and initializes a git repo.
+The CLI clones a template, provisions your database, writes `.env.local`, installs dependencies, and initializes git.
 
-## Options
+### Non-interactive mode
 
 ```bash
-# Provide the project name as an argument
-npx create-whop-kit my-app
+# Skip all prompts
+npx create-whop-kit my-app --framework nextjs --type saas --db neon --yes
+
+# With credentials
+npx create-whop-kit my-app --framework nextjs --db later --app-id "app_xxx" --api-key "apik_xxx"
 
-# Or run interactively
-npx create-whop-kit
+# Preview without creating files
+npx create-whop-kit my-app --framework nextjs --db later --dry-run
 ```
 
+### All flags
+
+| Flag | Description |
+|------|-------------|
+| `--framework` | `nextjs` or `astro` |
+| `--type` | `saas` or `blank` (default: `saas`) |
+| `--db` | `neon`, `prisma-postgres`, `supabase`, `manual`, `later` |
+| `--db-url` | PostgreSQL connection URL (skips DB provisioning) |
+| `--app-id` | Whop App ID |
+| `--api-key` | Whop API Key |
+| `--webhook-secret` | Whop webhook secret |
+| `-y, --yes` | Skip optional prompts |
+| `--dry-run` | Show what would be created |
+| `--verbose` | Detailed output |
+
+## Manage your project
+
+After creating a project, use `whop-kit` to add features and check status:
+
+```bash
+# Check project health
+npx whop-kit status
+
+# Add email (Resend or SendGrid)
+npx whop-kit add email
+
+# Add analytics (PostHog, Google Analytics, or Plausible)
+npx whop-kit add analytics
+
+# Add a webhook event handler
+npx whop-kit add webhook-event
+
+# Open provider dashboards
+npx whop-kit open whop
+npx whop-kit open neon
+npx whop-kit open vercel
+
+# Update whop-kit to latest
+npx whop-kit upgrade
+```
+
+## Database provisioning
+
+The CLI can provision databases automatically — no need to leave the terminal:
+
+| Provider | How it works |
+|----------|-------------|
+| **Neon** | Installs `neonctl` → authenticates (browser) → creates project → gets connection string |
+| **Prisma Postgres** | Runs `npx create-db` → instant database, no account needed |
+| **Supabase** | Installs CLI → authenticates → creates project → guides you to get connection string |
+
 ## Templates
 
-| Template | Framework | Status |
-|----------|-----------|--------|
-| SaaS | Next.js | Available |
-| SaaS | Astro | Coming soon |
-| SaaS | TanStack Start | Coming soon |
-| Course | — | Coming soon |
-| Community | — | Coming soon |
-| Blank | — | Coming soon |
+| App Type | Framework | Template | Status |
+|----------|-----------|----------|--------|
+| SaaS | Next.js | Full dashboard, pricing, billing, docs | Available |
+| SaaS | Astro | Auth, payments, webhooks | Available |
+| Blank | Next.js | Just auth + webhooks — build anything | Available |
+| Course | — | — | Coming soon |
+| Community | — | — | Coming soon |
+
+## How it works
+
+1. **Template** — clones a starter repo from GitHub
+2. **Database** — optionally provisions via provider CLI
+3. **Environment** — writes `.env.local` from the template's `.env.example`
+4. **Manifest** — creates `.whop/config.json` tracking your project state
+5. **Dependencies** — installs with your preferred package manager
+6. **Git** — initializes a fresh repo
 
 ## License
 

package/dist/chunk-BR467LBM.js

@@ -0,0 +1,370 @@
+#!/usr/bin/env node
+
+// src/templates.ts
+var FRAMEWORKS = {
+  nextjs: {
+    name: "Next.js",
+    description: "Full-stack React with App Router, SSR, and API routes",
+    available: true
+  },
+  astro: {
+    name: "Astro",
+    description: "Content-focused with islands architecture",
+    available: true
+  },
+  tanstack: {
+    name: "TanStack Start",
+    description: "Full-stack React with TanStack Router",
+    available: false
+  },
+  vite: {
+    name: "Vite + React",
+    description: "Lightweight SPA with Vite bundler",
+    available: false
+  }
+};
+var TEMPLATES = {
+  "saas:nextjs": {
+    name: "Next.js SaaS",
+    description: "Full SaaS with dashboard, pricing, billing, and docs",
+    repo: "colinmcdermott/whop-saas-starter-v2",
+    available: true
+  },
+  "saas:astro": {
+    name: "Astro SaaS",
+    description: "SaaS with auth, payments, and webhooks",
+    repo: "colinmcdermott/whop-astro-starter",
+    available: true
+  },
+  "blank:nextjs": {
+    name: "Next.js Blank",
+    description: "Just auth + webhooks \u2014 build anything",
+    repo: "colinmcdermott/whop-blank-starter",
+    available: true
+  }
+};
+function getTemplate(appType, framework) {
+  return TEMPLATES[`${appType}:${framework}`] ?? null;
+}
+var APP_TYPES = {
+  saas: {
+    name: "SaaS",
+    description: "Subscription tiers, dashboard, billing portal",
+    available: true
+  },
+  blank: {
+    name: "Blank",
+    description: "Just auth + payments, you build the rest",
+    available: true
+  },
+  course: {
+    name: "Course",
+    description: "Lessons, progress tracking, drip content",
+    available: false
+  },
+  community: {
+    name: "Community",
+    description: "Member feeds, gated content, roles",
+    available: false
+  }
+};
+
+// src/utils/exec.ts
+import { execSync } from "child_process";
+function exec(cmd, cwd) {
+  try {
+    const stdout = execSync(cmd, {
+      cwd,
+      stdio: "pipe",
+      encoding: "utf-8",
+      timeout: 12e4
+    }).trim();
+    return { stdout, success: true };
+  } catch {
+    return { stdout: "", success: false };
+  }
+}
+function execInteractive(cmd, cwd) {
+  try {
+    execSync(cmd, { cwd, stdio: "inherit", timeout: 3e5 });
+    return true;
+  } catch {
+    return false;
+  }
+}
+function hasCommand(cmd) {
+  return exec(`which ${cmd}`).success;
+}
+function detectPackageManager() {
+  if (hasCommand("pnpm")) return "pnpm";
+  if (hasCommand("yarn")) return "yarn";
+  if (hasCommand("bun")) return "bun";
+  return "npm";
+}
+
+// src/scaffolding/manifest.ts
+import { readFileSync, writeFileSync, existsSync, mkdirSync } from "fs";
+import { join } from "path";
+var MANIFEST_DIR = ".whop";
+var MANIFEST_FILE = "config.json";
+function getManifestPath(projectDir) {
+  return join(projectDir, MANIFEST_DIR, MANIFEST_FILE);
+}
+function createManifest(projectDir, data) {
+  const dir = join(projectDir, MANIFEST_DIR);
+  if (!existsSync(dir)) {
+    mkdirSync(dir, { recursive: true });
+  }
+  const manifest = {
+    version: 1,
+    ...data,
+    createdAt: (/* @__PURE__ */ new Date()).toISOString()
+  };
+  writeFileSync(getManifestPath(projectDir), JSON.stringify(manifest, null, 2) + "\n");
+}
+function readManifest(projectDir) {
+  const path = getManifestPath(projectDir);
+  if (!existsSync(path)) return null;
+  try {
+    return JSON.parse(readFileSync(path, "utf-8"));
+  } catch {
+    return null;
+  }
+}
+function addFeatureToManifest(projectDir, feature) {
+  const manifest = readManifest(projectDir);
+  if (!manifest) return;
+  if (!manifest.features.includes(feature)) {
+    manifest.features.push(feature);
+  }
+  writeFileSync(getManifestPath(projectDir), JSON.stringify(manifest, null, 2) + "\n");
+}
+
+// src/scaffolding/skills.ts
+import { writeFileSync as writeFileSync2, mkdirSync as mkdirSync2, existsSync as existsSync2 } from "fs";
+import { join as join2 } from "path";
+var PROVIDER_SKILLS = {
+  neon: [
+    { repo: "https://github.com/neondatabase/agent-skills", skill: "neon-postgres" },
+    { repo: "https://github.com/neondatabase/ai-rules", skill: "neon-serverless" }
+  ],
+  supabase: [
+    { repo: "https://github.com/supabase/agent-skills", skill: "supabase-postgres-best-practices" }
+  ],
+  "prisma-postgres": [
+    // Prisma skill is typically bundled in the template already
+  ]
+};
+function installProviderSkills(projectDir, provider) {
+  const skills = PROVIDER_SKILLS[provider];
+  if (!skills || skills.length === 0) return;
+  for (const { repo, skill } of skills) {
+    const result = exec(
+      `npx -y skills add ${repo} --skill ${skill}`,
+      projectDir
+    );
+    if (!result.success) {
+      console.log(`  (Could not install ${skill} skill \u2014 you can add it later)`);
+    }
+  }
+}
+function writeProjectContext(projectDir, manifest, envVars) {
+  const dir = join2(projectDir, ".whop");
+  if (!existsSync2(dir)) mkdirSync2(dir, { recursive: true });
+  const lines = [
+    "# Project Context",
+    "",
+    "Auto-generated by create-whop-kit. Helps AI coding assistants understand",
+    "your project. Regenerated by `whop-kit status`. Do not edit manually.",
+    "",
+    "## Project",
+    "",
+    `- **Framework:** ${manifest.framework}`,
+    `- **App Type:** ${manifest.appType}`,
+    `- **Database:** ${manifest.database}`,
+    `- **Template Version:** ${manifest.templateVersion}`,
+    `- **Created:** ${manifest.createdAt}`,
+    "",
+    "## Configuration Status",
+    ""
+  ];
+  const checks = [
+    ["DATABASE_URL", "Database", true],
+    ["NEXT_PUBLIC_WHOP_APP_ID", "Whop App ID", true],
+    ["WHOP_API_KEY", "Whop API Key", true],
+    ["WHOP_WEBHOOK_SECRET", "Webhook Secret", true],
+    ["EMAIL_PROVIDER", "Email", false],
+    ["ANALYTICS_PROVIDER", "Analytics", false]
+  ];
+  for (const [key, label, required] of checks) {
+    const set = envVars[key] ?? false;
+    const icon = set ? "\u2713" : required ? "\u2717" : "\u25CB";
+    lines.push(`- ${icon} ${label} (\`${key}\`)`);
+  }
+  if (manifest.features.length > 0) {
+    lines.push("");
+    lines.push("## Installed Features");
+    lines.push("");
+    for (const feature of manifest.features) {
+      lines.push(`- ${feature}`);
+    }
+  }
+  lines.push("");
+  lines.push("## Key Files");
+  lines.push("");
+  if (manifest.framework === "nextjs") {
+    lines.push("- `lib/auth.ts` \u2014 session management (whop-kit/auth)");
+    lines.push("- `lib/adapters/next.ts` \u2014 Next.js cookie adapter");
+    lines.push("- `lib/adapters/prisma.ts` \u2014 Prisma DB + config adapters");
+    lines.push("- `app/api/webhooks/whop/route.ts` \u2014 webhook handler");
+    lines.push("- `app/api/auth/` \u2014 OAuth login/callback/logout");
+    lines.push("- `db/schema.prisma` \u2014 database schema");
+  } else if (manifest.framework === "astro") {
+    lines.push("- `src/lib/auth.ts` \u2014 session management (whop-kit/auth)");
+    lines.push("- `src/lib/adapters/astro.ts` \u2014 Astro cookie adapter");
+    lines.push("- `src/lib/adapters/prisma.ts` \u2014 Prisma DB adapter");
+    lines.push("- `src/pages/api/webhooks/whop.ts` \u2014 webhook handler");
+    lines.push("- `src/pages/api/auth/` \u2014 OAuth login/callback/logout");
+  }
+  lines.push("");
+  lines.push("## CLI Commands");
+  lines.push("");
+  lines.push("```bash");
+  lines.push("npx whop-kit status        # check project health");
+  lines.push("npx whop-kit add email     # add email provider");
+  lines.push("npx whop-kit add analytics # add analytics");
+  lines.push("npx whop-kit catalog       # list available services");
+  lines.push("npx whop-kit open whop     # open Whop dashboard");
+  lines.push("npx whop-kit upgrade       # update whop-kit");
+  lines.push("```");
+  lines.push("");
+  writeFileSync2(join2(dir, "project-context.md"), lines.join("\n"));
+}
+function writeFeatureSkill(projectDir, featureKey, provider) {
+  const dir = join2(projectDir, ".agents", "skills", "whop-kit-features");
+  if (!existsSync2(dir)) mkdirSync2(dir, { recursive: true });
+  const content = generateFeatureSkill(featureKey, provider);
+  if (content) {
+    writeFileSync2(join2(dir, `${featureKey}-${provider}.md`), content);
+  }
+}
+function generateFeatureSkill(featureKey, provider) {
+  const key = `${featureKey}:${provider}`;
+  const skills = {
+    "email:resend": `---
+name: resend-email
+description: Resend transactional email integration. Use when working with email sending, templates, or email configuration.
+---
+
+# Resend Email
+
+This project uses Resend for transactional email via whop-kit/email.
+
+## Usage
+\`\`\`typescript
+import { sendEmail } from "@/lib/email";
+await sendEmail({ to: "user@example.com", subject: "Hello", html: "<p>Hi!</p>" });
+\`\`\`
+
+## Config
+- \`EMAIL_PROVIDER=resend\`
+- \`EMAIL_API_KEY\` \u2014 Resend API key
+- \`EMAIL_FROM_ADDRESS\` \u2014 verified sender
+
+## Templates
+Edit \`lib/email-templates.ts\`. Each function returns \`{ subject, html }\`.
+
+## Dashboard
+https://resend.com/overview
+`,
+    "email:sendgrid": `---
+name: sendgrid-email
+description: SendGrid transactional email integration. Use when working with email sending, templates, or email configuration.
+---
+
+# SendGrid Email
+
+This project uses SendGrid for transactional email via whop-kit/email.
+
+## Usage
+\`\`\`typescript
+import { sendEmail } from "@/lib/email";
+await sendEmail({ to: "user@example.com", subject: "Hello", html: "<p>Hi!</p>" });
+\`\`\`
+
+## Config
+- \`EMAIL_PROVIDER=sendgrid\`
+- \`EMAIL_API_KEY\` \u2014 SendGrid API key
+- \`EMAIL_FROM_ADDRESS\` \u2014 verified sender
+
+## Dashboard
+https://app.sendgrid.com
+`,
+    "analytics:posthog": `---
+name: posthog-analytics
+description: PostHog product analytics integration. Use when working with analytics, events, or feature flags.
+---
+
+# PostHog Analytics
+
+Injected via whop-kit/analytics \`getAnalyticsScript()\`. No client SDK needed.
+
+## Config
+- \`ANALYTICS_PROVIDER=posthog\`
+- \`ANALYTICS_ID\` \u2014 project API key (phc_xxx)
+
+## Dashboard
+https://us.posthog.com
+`,
+    "analytics:google": `---
+name: google-analytics
+description: Google Analytics 4 integration.
+---
+
+# Google Analytics 4
+
+Injected via whop-kit/analytics \`getAnalyticsScript()\`.
+
+## Config
+- \`ANALYTICS_PROVIDER=google\`
+- \`ANALYTICS_ID\` \u2014 measurement ID (G-XXXXXXXXXX)
+
+## Dashboard
+https://analytics.google.com
+`,
+    "analytics:plausible": `---
+name: plausible-analytics
+description: Plausible privacy-friendly analytics integration.
+---
+
+# Plausible Analytics
+
+Injected via whop-kit/analytics \`getAnalyticsScript()\`. No cookies, GDPR compliant.
+
+## Config
+- \`ANALYTICS_PROVIDER=plausible\`
+- \`ANALYTICS_ID\` \u2014 your domain
+
+## Dashboard
+https://plausible.io/sites
+`
+  };
+  return skills[key] ?? null;
+}
+
+export {
+  FRAMEWORKS,
+  TEMPLATES,
+  getTemplate,
+  APP_TYPES,
+  exec,
+  execInteractive,
+  hasCommand,
+  detectPackageManager,
+  createManifest,
+  readManifest,
+  addFeatureToManifest,
+  installProviderSkills,
+  writeProjectContext,
+  writeFeatureSkill
+};

package/dist/cli-create.js

@@ -1,10 +1,16 @@
 #!/usr/bin/env node
 import {
+  APP_TYPES,
+  FRAMEWORKS,
   createManifest,
   detectPackageManager,
   exec,
-  hasCommand
-} from "./chunk-M4AXERQP.js";
+  execInteractive,
+  getTemplate,
+  hasCommand,
+  installProviderSkills,
+  writeProjectContext
+} from "./chunk-BR467LBM.js";
 
 // src/cli-create.ts
 import { runMain } from "citty";
@@ -16,75 +22,6 @@ import * as p5 from "@clack/prompts";
 import pc5 from "picocolors";
 import { defineCommand } from "citty";
 
-// src/templates.ts
-var FRAMEWORKS = {
-  nextjs: {
-    name: "Next.js",
-    description: "Full-stack React with App Router, SSR, and API routes",
-    available: true
-  },
-  astro: {
-    name: "Astro",
-    description: "Content-focused with islands architecture",
-    available: true
-  },
-  tanstack: {
-    name: "TanStack Start",
-    description: "Full-stack React with TanStack Router",
-    available: false
-  },
-  vite: {
-    name: "Vite + React",
-    description: "Lightweight SPA with Vite bundler",
-    available: false
-  }
-};
-var TEMPLATES = {
-  "saas:nextjs": {
-    name: "Next.js SaaS",
-    description: "Full SaaS with dashboard, pricing, billing, and docs",
-    repo: "colinmcdermott/whop-saas-starter-v2",
-    available: true
-  },
-  "saas:astro": {
-    name: "Astro SaaS",
-    description: "SaaS with auth, payments, and webhooks",
-    repo: "colinmcdermott/whop-astro-starter",
-    available: true
-  },
-  "blank:nextjs": {
-    name: "Next.js Blank",
-    description: "Just auth + webhooks \u2014 build anything",
-    repo: "colinmcdermott/whop-blank-starter",
-    available: true
-  }
-};
-function getTemplate(appType, framework) {
-  return TEMPLATES[`${appType}:${framework}`] ?? null;
-}
-var APP_TYPES = {
-  saas: {
-    name: "SaaS",
-    description: "Subscription tiers, dashboard, billing portal",
-    available: true
-  },
-  blank: {
-    name: "Blank",
-    description: "Just auth + payments, you build the rest",
-    available: true
-  },
-  course: {
-    name: "Course",
-    description: "Lessons, progress tracking, drip content",
-    available: false
-  },
-  community: {
-    name: "Community",
-    description: "Member feeds, gated content, roles",
-    available: false
-  }
-};
-
 // src/providers/neon.ts
 import * as p from "@clack/prompts";
 import pc from "picocolors";
@@ -108,38 +45,72 @@ var neonProvider = {
   },
   async provision(projectName) {
     const cli = hasCommand("neonctl") ? "neonctl" : "neon";
-    const whoami = exec(`${cli} me`);
+    const whoami = exec(`${cli} me --output json`);
     if (!whoami.success) {
-      p.log.info("You need to authenticate with Neon.");
-      p.log.info(`Running ${pc.bold(`${cli} auth`)} \u2014 this will open your browser.`);
-      const authResult = exec(`${cli} auth`);
-      if (!authResult.success) {
+      p.log.info("You need to authenticate with Neon. This will open your browser.");
+      console.log("");
+      const authOk = execInteractive(`${cli} auth`);
+      if (!authOk) {
         p.log.error("Neon authentication failed. Try running manually:");
         p.log.info(pc.bold(`  ${cli} auth`));
         return null;
       }
+      console.log("");
     }
-    const s = p.spinner();
-    s.start(`Creating Neon project "${projectName}"...`);
-    const createResult = exec(
-      `${cli} projects create --name "${projectName}" --set-context --output json`
+    p.log.info(`Creating Neon project "${projectName}"...`);
+    console.log("");
+    const createOk = execInteractive(
+      `${cli} projects create --name "${projectName}" --set-context`
     );
-    if (!createResult.success) {
-      s.stop("Failed to create Neon project");
-      p.log.error("Try creating manually at https://console.neon.tech");
+    if (!createOk) {
+      p.log.error("Failed to create Neon project. Try manually at https://console.neon.tech");
       return null;
     }
-    s.stop("Neon project created");
-    s.start("Getting connection string...");
-    const connResult = exec(`${cli} connection-string --prisma`);
-    if (!connResult.success) {
-      s.stop("Could not retrieve connection string");
-      p.log.error("Get it from: https://console.neon.tech");
+    console.log("");
+    p.log.success("Neon project created");
+    let connString = "";
+    const connResult = exec(`${cli} connection-string --prisma --output json`);
+    if (connResult.success) {
+      try {
+        const parsed = JSON.parse(connResult.stdout);
+        connString = parsed.connection_string || parsed.connectionString || connResult.stdout;
+      } catch {
+        connString = connResult.stdout.trim();
+      }
+    }
+    if (!connString) {
+      const fallback = exec(`${cli} connection-string --prisma`);
+      if (fallback.success && fallback.stdout.startsWith("postgres")) {
+        connString = fallback.stdout.trim();
+      }
+    }
+    if (!connString) {
+      const raw = exec(`${cli} connection-string`);
+      if (raw.success && raw.stdout.startsWith("postgres")) {
+        connString = raw.stdout.trim();
+      }
+    }
+    if (!connString) {
+      p.log.warning("Could not extract connection string automatically.");
+      console.log("");
+      execInteractive(`${cli} connection-string`);
+      console.log("");
+      const manual = await p.text({
+        message: "Paste the connection string shown above",
+        placeholder: "postgresql://...",
+        validate: (v) => {
+          if (!v?.startsWith("postgres")) return "Must be a PostgreSQL connection string";
+        }
+      });
+      if (p.isCancel(manual)) return null;
+      connString = manual;
+    }
+    if (!connString) {
+      p.log.error("Could not get connection string. Get it from: https://console.neon.tech");
       return null;
     }
-    s.stop("Connection string retrieved");
     return {
-      connectionString: connResult.stdout,
+      connectionString: connString,
       provider: "neon"
     };
   }
@@ -705,6 +676,28 @@ var init_default = defineCommand({
       features: [],
       templateVersion: "0.2.0"
     });
+    if (database !== "later" && database !== "manual") {
+      s.start("Installing provider skills for AI assistants...");
+      installProviderSkills(projectDir, database);
+      s.stop("Provider skills installed");
+    }
+    const envStatus = {};
+    if (dbUrl) envStatus["DATABASE_URL"] = true;
+    if (appId) {
+      envStatus["NEXT_PUBLIC_WHOP_APP_ID"] = true;
+      envStatus["WHOP_APP_ID"] = true;
+    }
+    if (apiKey) envStatus["WHOP_API_KEY"] = true;
+    if (webhookSecret) envStatus["WHOP_WEBHOOK_SECRET"] = true;
+    const manifest = {
+      framework,
+      appType,
+      database,
+      features: [],
+      templateVersion: "0.4.0",
+      createdAt: (/* @__PURE__ */ new Date()).toISOString()
+    };
+    writeProjectContext(projectDir, { version: 1, ...manifest }, envStatus);
     const pm = detectPackageManager();
     s.start(`Installing dependencies with ${pm}...`);
     const installResult = exec(`${pm} install`, projectDir);
@@ -733,7 +726,7 @@ var init_default = defineCommand({
     if (missing.length > 0) {
       summary += `${pc5.yellow("\u25CB")} Missing: ${missing.join(", ")}
 `;
-      summary += `  ${pc5.dim("Configure via the setup wizard or .env.local")}
+      summary += `  ${pc5.dim("The setup wizard at http://localhost:3000 will guide you through it")}
 `;
     }
     if (dbNote) {
@@ -745,10 +738,14 @@ var init_default = defineCommand({
     summary += `  ${pc5.bold("cd")} ${basename2(projectName)}
 `;
     if (dbUrl) {
-      summary += `  ${pc5.bold(`${pm} run db:push`)}
+      summary += `  ${pc5.bold(`${pm} run db:push`)}   ${pc5.dim("# push schema to database")}
 `;
     }
-    summary += `  ${pc5.bold(`${pm} run dev`)}`;
+    summary += `  ${pc5.bold(`${pm} run dev`)}      ${pc5.dim("# start dev server")}
+`;
+    summary += `
+`;
+    summary += `  ${pc5.dim("Then open http://localhost:3000")}`;
     p5.note(summary, "Your app is ready");
     p5.outro(`${pc5.green("Happy building!")} ${pc5.dim("\u2014 whop-kit")}`);
   }

package/dist/cli-kit.js

@@ -1,13 +1,17 @@
 #!/usr/bin/env node
 import {
+  APP_TYPES,
+  FRAMEWORKS,
+  TEMPLATES,
   addFeatureToManifest,
   detectPackageManager,
   exec,
-  readManifest
-} from "./chunk-M4AXERQP.js";
+  readManifest,
+  writeFeatureSkill
+} from "./chunk-BR467LBM.js";
 
 // src/cli-kit.ts
-import { defineCommand as defineCommand5, runMain } from "citty";
+import { defineCommand as defineCommand7, runMain } from "citty";
 
 // src/commands/add.ts
 import * as p4 from "@clack/prompts";
@@ -78,6 +82,7 @@ var emailFeature = {
     if (fromAddress) {
       appendEnvVar(projectDir, "EMAIL_FROM_ADDRESS", fromAddress);
     }
+    writeFeatureSkill(projectDir, "email", provider);
   }
 };
 
@@ -116,6 +121,7 @@ var analyticsFeature = {
     }
     appendEnvVar(projectDir, "ANALYTICS_PROVIDER", provider);
     appendEnvVar(projectDir, "ANALYTICS_ID", id);
+    writeFeatureSkill(projectDir, "analytics", provider);
   }
 };
 
@@ -304,10 +310,152 @@ var status_default = defineCommand2({
   }
 });
 
-// src/commands/open.ts
+// src/commands/env.ts
+import { readFileSync as readFileSync3, existsSync as existsSync3 } from "fs";
+import { join as join3 } from "path";
 import * as p6 from "@clack/prompts";
 import pc4 from "picocolors";
 import { defineCommand as defineCommand3 } from "citty";
+function parseEnvFile(projectDir) {
+  for (const name of [".env.local", ".env"]) {
+    const path = join3(projectDir, name);
+    if (existsSync3(path)) {
+      const content = readFileSync3(path, "utf-8");
+      const vars = {};
+      for (const line of content.split("\n")) {
+        const trimmed = line.trim();
+        if (!trimmed || trimmed.startsWith("#")) continue;
+        const match = trimmed.match(/^([A-Z_][A-Z0-9_]*)=["']?(.*)["']?$/);
+        if (match) vars[match[1]] = match[2].replace(/["']$/, "");
+      }
+      return vars;
+    }
+  }
+  return {};
+}
+function maskValue(value) {
+  if (value.length <= 8) return "****";
+  return value.substring(0, 8) + "..." + "*".repeat(4);
+}
+var env_default = defineCommand3({
+  meta: {
+    name: "env",
+    description: "View environment variables (masked by default)"
+  },
+  args: {
+    reveal: {
+      type: "boolean",
+      description: "Show actual values instead of masked",
+      default: false
+    }
+  },
+  async run({ args }) {
+    console.log("");
+    p6.intro(`${pc4.bgCyan(pc4.black(" whop-kit env "))}`);
+    const manifest = readManifest(".");
+    if (!manifest) {
+      p6.log.error("No .whop/config.json found. Are you in a whop-kit project?");
+      process.exit(1);
+    }
+    const vars = parseEnvFile(".");
+    if (Object.keys(vars).length === 0) {
+      p6.log.warning("No environment variables found. Create .env.local with your configuration.");
+      p6.outro("");
+      return;
+    }
+    if (args.reveal) {
+      p6.log.warning("Revealing secret values:");
+      console.log("");
+    }
+    for (const [key, value] of Object.entries(vars)) {
+      const displayValue = args.reveal ? pc4.cyan(value) : pc4.dim(maskValue(value));
+      console.log(`  ${pc4.bold(key.padEnd(40))} ${displayValue}`);
+    }
+    console.log("");
+    if (!args.reveal) {
+      p6.log.info(`Use ${pc4.bold("whop-kit env --reveal")} to show actual values`);
+    }
+    p6.outro("");
+  }
+});
+
+// src/commands/catalog.ts
+import * as p7 from "@clack/prompts";
+import pc5 from "picocolors";
+import { defineCommand as defineCommand4 } from "citty";
+var catalog_default = defineCommand4({
+  meta: {
+    name: "catalog",
+    description: "List available templates, frameworks, databases, and features"
+  },
+  async run() {
+    console.log("");
+    p7.intro(`${pc5.bgCyan(pc5.black(" whop-kit catalog "))} Available services`);
+    console.log(`
+  ${pc5.bold(pc5.underline("App Types"))}
+`);
+    for (const [key, type] of Object.entries(APP_TYPES)) {
+      const status = type.available ? pc5.green("available") : pc5.dim("coming soon");
+      console.log(`  ${pc5.bold(key.padEnd(15))} ${type.description.padEnd(45)} ${status}`);
+    }
+    console.log(`
+  ${pc5.bold(pc5.underline("Frameworks"))}
+`);
+    for (const [key, fw] of Object.entries(FRAMEWORKS)) {
+      const status = fw.available ? pc5.green("available") : pc5.dim("coming soon");
+      console.log(`  ${pc5.bold(key.padEnd(15))} ${fw.description.padEnd(45)} ${status}`);
+    }
+    console.log(`
+  ${pc5.bold(pc5.underline("Templates"))}
+`);
+    for (const [key, tmpl] of Object.entries(TEMPLATES)) {
+      const status = tmpl.available ? pc5.green("available") : pc5.dim("coming soon");
+      console.log(`  ${pc5.bold(key.padEnd(20))} ${tmpl.description.padEnd(40)} ${status}`);
+    }
+    console.log(`
+  ${pc5.bold(pc5.underline("Database Providers"))}
+`);
+    const dbProviders = [
+      { key: "neon", name: "Neon", desc: "Serverless Postgres, auto-provisioned", status: "auto" },
+      { key: "prisma-postgres", name: "Prisma Postgres", desc: "Instant database, no auth needed", status: "auto" },
+      { key: "supabase", name: "Supabase", desc: "Open-source Firebase alternative", status: "guided" },
+      { key: "manual", name: "Manual", desc: "Paste any PostgreSQL connection string", status: "manual" }
+    ];
+    for (const db of dbProviders) {
+      const badge = db.status === "auto" ? pc5.green("auto-provision") : db.status === "guided" ? pc5.yellow("guided setup") : pc5.dim("manual");
+      console.log(`  ${pc5.bold(db.key.padEnd(20))} ${db.desc.padEnd(40)} ${badge}`);
+    }
+    console.log(`
+  ${pc5.bold(pc5.underline("Features (whop-kit add)"))}
+`);
+    const features = [
+      { key: "email", desc: "Transactional email", providers: "Resend, SendGrid" },
+      { key: "analytics", desc: "Product analytics", providers: "PostHog, Google Analytics, Plausible" },
+      { key: "webhook-event", desc: "Add webhook event handler", providers: "\u2014" }
+    ];
+    for (const feat of features) {
+      console.log(`  ${pc5.bold(feat.key.padEnd(20))} ${feat.desc.padEnd(30)} ${pc5.dim(feat.providers)}`);
+    }
+    console.log(`
+  ${pc5.bold(pc5.underline("Agent Skills (auto-installed)"))}
+`);
+    const skills = [
+      { provider: "Neon", skills: "neon-postgres, neon-serverless" },
+      { provider: "Supabase", skills: "supabase-postgres-best-practices" },
+      { provider: "Whop", skills: "whop-saas-starter, whop-dev" }
+    ];
+    for (const s of skills) {
+      console.log(`  ${pc5.bold(s.provider.padEnd(20))} ${pc5.dim(s.skills)}`);
+    }
+    console.log("");
+    p7.outro(`Run ${pc5.bold("npx create-whop-kit")} to get started`);
+  }
+});
+
+// src/commands/open.ts
+import * as p8 from "@clack/prompts";
+import pc6 from "picocolors";
+import { defineCommand as defineCommand5 } from "citty";
 var DASHBOARDS = {
   whop: { name: "Whop Developer Dashboard", url: "https://whop.com/dashboard/developer" },
   neon: { name: "Neon Console", url: "https://console.neon.tech" },
@@ -320,7 +468,7 @@ function openUrl(url) {
   else if (platform === "win32") exec(`start "${url}"`);
   else exec(`xdg-open "${url}"`);
 }
-var open_default = defineCommand3({
+var open_default = defineCommand5({
   meta: {
     name: "open",
     description: "Open a provider dashboard in your browser"
@@ -335,7 +483,7 @@ var open_default = defineCommand3({
   async run({ args }) {
     let target = args.target;
     if (!target) {
-      const result = await p6.select({
+      const result = await p8.select({
         message: "Which dashboard?",
         options: Object.entries(DASHBOARDS).map(([value, d]) => ({
           value,
@@ -343,43 +491,43 @@ var open_default = defineCommand3({
           hint: d.url
         }))
       });
-      if (p6.isCancel(result)) {
-        p6.cancel("Cancelled.");
+      if (p8.isCancel(result)) {
+        p8.cancel("Cancelled.");
         process.exit(0);
       }
       target = result;
     }
     const dashboard = DASHBOARDS[target];
     if (!dashboard) {
-      p6.log.error(`Unknown dashboard "${target}". Options: ${Object.keys(DASHBOARDS).join(", ")}`);
+      p8.log.error(`Unknown dashboard "${target}". Options: ${Object.keys(DASHBOARDS).join(", ")}`);
       process.exit(1);
     }
     openUrl(dashboard.url);
     console.log(`
-  Opening ${pc4.bold(dashboard.name)} \u2192 ${pc4.cyan(dashboard.url)}
+  Opening ${pc6.bold(dashboard.name)} \u2192 ${pc6.cyan(dashboard.url)}
 `);
   }
 });
 
 // src/commands/upgrade.ts
-import * as p7 from "@clack/prompts";
-import pc5 from "picocolors";
-import { defineCommand as defineCommand4 } from "citty";
-var upgrade_default = defineCommand4({
+import * as p9 from "@clack/prompts";
+import pc7 from "picocolors";
+import { defineCommand as defineCommand6 } from "citty";
+var upgrade_default = defineCommand6({
   meta: {
     name: "upgrade",
     description: "Update whop-kit to the latest version in your project"
   },
   async run() {
     console.log("");
-    p7.intro(`${pc5.bgCyan(pc5.black(" whop-kit upgrade "))}`);
+    p9.intro(`${pc7.bgCyan(pc7.black(" whop-kit upgrade "))}`);
     const manifest = readManifest(".");
     if (!manifest) {
-      p7.log.error("No .whop/config.json found. Are you in a whop-kit project?");
+      p9.log.error("No .whop/config.json found. Are you in a whop-kit project?");
       process.exit(1);
     }
     const pm = detectPackageManager();
-    const s = p7.spinner();
+    const s = p9.spinner();
     s.start("Checking for updates...");
     const latest = exec("npm view whop-kit version");
     s.stop(latest.success ? `Latest: whop-kit@${latest.stdout}` : "Could not check latest version");
@@ -387,25 +535,27 @@ var upgrade_default = defineCommand4({
     const cmd = pm === "npm" ? "npm install whop-kit@latest" : pm === "yarn" ? "yarn add whop-kit@latest" : pm === "bun" ? "bun add whop-kit@latest" : "pnpm add whop-kit@latest";
     const result = exec(cmd);
     if (result.success) {
-      s.stop(pc5.green("whop-kit upgraded"));
+      s.stop(pc7.green("whop-kit upgraded"));
     } else {
-      s.stop(pc5.red("Upgrade failed"));
-      p7.log.error("Try running manually: " + pc5.bold(cmd));
+      s.stop(pc7.red("Upgrade failed"));
+      p9.log.error("Try running manually: " + pc7.bold(cmd));
     }
-    p7.outro("Done");
+    p9.outro("Done");
   }
 });
 
 // src/cli-kit.ts
-var main = defineCommand5({
+var main = defineCommand7({
   meta: {
     name: "whop-kit",
-    version: "0.2.0",
+    version: "0.5.0",
     description: "Manage your Whop project"
   },
   subCommands: {
     add: add_default,
     status: status_default,
+    env: env_default,
+    catalog: catalog_default,
     open: open_default,
     upgrade: upgrade_default
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-whop-kit",
-  "version": "0.4.0",
+  "version": "0.5.0",
   "description": "Scaffold and manage Whop-powered apps with whop-kit",
   "type": "module",
   "license": "MIT",

package/dist/chunk-M4AXERQP.js

@@ -1,73 +0,0 @@
-#!/usr/bin/env node
-
-// src/utils/exec.ts
-import { execSync } from "child_process";
-function exec(cmd, cwd) {
-  try {
-    const stdout = execSync(cmd, {
-      cwd,
-      stdio: "pipe",
-      encoding: "utf-8",
-      timeout: 12e4
-    }).trim();
-    return { stdout, success: true };
-  } catch {
-    return { stdout: "", success: false };
-  }
-}
-function hasCommand(cmd) {
-  return exec(`which ${cmd}`).success;
-}
-function detectPackageManager() {
-  if (hasCommand("pnpm")) return "pnpm";
-  if (hasCommand("yarn")) return "yarn";
-  if (hasCommand("bun")) return "bun";
-  return "npm";
-}
-
-// src/scaffolding/manifest.ts
-import { readFileSync, writeFileSync, existsSync, mkdirSync } from "fs";
-import { join } from "path";
-var MANIFEST_DIR = ".whop";
-var MANIFEST_FILE = "config.json";
-function getManifestPath(projectDir) {
-  return join(projectDir, MANIFEST_DIR, MANIFEST_FILE);
-}
-function createManifest(projectDir, data) {
-  const dir = join(projectDir, MANIFEST_DIR);
-  if (!existsSync(dir)) {
-    mkdirSync(dir, { recursive: true });
-  }
-  const manifest = {
-    version: 1,
-    ...data,
-    createdAt: (/* @__PURE__ */ new Date()).toISOString()
-  };
-  writeFileSync(getManifestPath(projectDir), JSON.stringify(manifest, null, 2) + "\n");
-}
-function readManifest(projectDir) {
-  const path = getManifestPath(projectDir);
-  if (!existsSync(path)) return null;
-  try {
-    return JSON.parse(readFileSync(path, "utf-8"));
-  } catch {
-    return null;
-  }
-}
-function addFeatureToManifest(projectDir, feature) {
-  const manifest = readManifest(projectDir);
-  if (!manifest) return;
-  if (!manifest.features.includes(feature)) {
-    manifest.features.push(feature);
-  }
-  writeFileSync(getManifestPath(projectDir), JSON.stringify(manifest, null, 2) + "\n");
-}
-
-export {
-  exec,
-  hasCommand,
-  detectPackageManager,
-  createManifest,
-  readManifest,
-  addFeatureToManifest
-};