appfunnel 0.5.0 → 0.7.0

package/dist/index.js

@@ -175,28 +175,308 @@ var init_projects = __esm({
   }
 });
 
+// src/lib/api.ts
+async function apiFetch(path, options) {
+  const { token, apiBaseUrl, ...fetchOpts } = options;
+  const base = apiBaseUrl || DEFAULT_API_BASE2;
+  const url = `${base}${path}`;
+  const isFormData = fetchOpts.body instanceof FormData;
+  const headers = {
+    Authorization: token,
+    ...fetchOpts.headers || {}
+  };
+  if (!isFormData) {
+    headers["Content-Type"] = "application/json";
+  }
+  const response = await fetch(url, {
+    ...fetchOpts,
+    headers
+  });
+  if (!response.ok) {
+    const body = await response.text().catch(() => "");
+    let message = `API request failed: ${response.status} ${response.statusText}`;
+    try {
+      const parsed = JSON.parse(body);
+      if (parsed.error) message = parsed.error;
+      if (parsed.message) message = parsed.message;
+    } catch {
+    }
+    const error2 = new CLIError("API_ERROR", message);
+    error2.statusCode = response.status;
+    throw error2;
+  }
+  return response;
+}
+async function fetchPrices(projectId, storePriceIds, options) {
+  if (storePriceIds.length === 0) return /* @__PURE__ */ new Map();
+  const response = await apiFetch(`/project/${projectId}/headless/prices`, {
+    ...options,
+    method: "POST",
+    body: JSON.stringify({ storePriceIds })
+  });
+  const data = await response.json();
+  return new Map(Object.entries(data.prices || {}));
+}
+async function fetchStores(projectId, options) {
+  const response = await apiFetch(`/project/${projectId}/stores`, {
+    ...options,
+    method: "GET"
+  });
+  const data = await response.json();
+  return data.data || [];
+}
+async function fetchStorePrices(projectId, storeId, options) {
+  const response = await apiFetch(
+    `/project/${projectId}/stores/${storeId}/prices`,
+    { ...options, method: "GET" }
+  );
+  const data = await response.json();
+  return data.data || [];
+}
+async function publishBuild(projectId, funnelId, manifest, assets, options, promote) {
+  const formData = new FormData();
+  formData.set("manifest", JSON.stringify(manifest));
+  if (funnelId) {
+    formData.set("funnelId", funnelId);
+  }
+  if (promote) {
+    formData.set("promote", "true");
+  }
+  for (const asset of assets) {
+    formData.append(
+      "assets",
+      new Blob([new Uint8Array(asset.content)], { type: asset.contentType }),
+      asset.path
+    );
+  }
+  try {
+    const response = await apiFetch(`/project/${projectId}/headless/publish`, {
+      ...options,
+      method: "POST",
+      body: formData
+    });
+    return await response.json();
+  } catch (err) {
+    if (err instanceof CLIError && err.code === "API_ERROR") {
+      if (err.statusCode === 413) {
+        throw new CLIError(
+          "BUNDLE_TOO_LARGE",
+          err.message,
+          "Reduce page bundle sizes. Check for large dependencies."
+        );
+      }
+      if (err.statusCode === 409) {
+        throw new CLIError(
+          "FUNNEL_NOT_HEADLESS",
+          err.message,
+          "Remove funnelId from config to create a new headless funnel."
+        );
+      }
+      throw new CLIError("PUBLISH_FAILED", err.message);
+    }
+    throw err;
+  }
+}
+var DEFAULT_API_BASE2;
+var init_api = __esm({
+  "src/lib/api.ts"() {
+    "use strict";
+    init_errors();
+    DEFAULT_API_BASE2 = "https://api.appfunnel.net";
+  }
+});
+
 // src/commands/init.ts
 var init_exports = {};
 __export(init_exports, {
   initCommand: () => initCommand
 });
-import { mkdirSync as mkdirSync2, writeFileSync as writeFileSync2, existsSync } from "fs";
-import { join as join2 } from "path";
+import { cpSync, existsSync, readFileSync as readFileSync2, writeFileSync as writeFileSync2, readdirSync } from "fs";
+import { join as join2, dirname } from "path";
+import { fileURLToPath } from "url";
 import pc4 from "picocolors";
-async function initCommand(name) {
+import select2 from "@inquirer/select";
+import input from "@inquirer/input";
+function getTemplatesDir() {
+  const dir = join2(__dirname, "..", "templates");
+  if (!existsSync(dir)) {
+    throw new Error(`Templates directory not found at ${dir}`);
+  }
+  return dir;
+}
+function listTemplates() {
+  const root = getTemplatesDir();
+  return readdirSync(root, { withFileTypes: true }).filter((d) => d.isDirectory()).map((d) => {
+    const configPath = join2(root, d.name, "template.json");
+    const config = existsSync(configPath) ? JSON.parse(readFileSync2(configPath, "utf-8")) : { name: d.name, description: "", products: [] };
+    return { dir: d.name, config };
+  });
+}
+function formatInterval(interval, count) {
+  if (!interval) return " one-time";
+  const label = INTERVAL_LABELS[interval]?.[count];
+  if (label) return `/${label}`;
+  return `/${count} ${interval}${count > 1 ? "s" : ""}`;
+}
+function formatPrice(price) {
+  const amount = (price.amount / 100).toFixed(2);
+  const currency = price.currency.toUpperCase();
+  const interval = formatInterval(price.interval, price.intervalCount);
+  const productName = price.name || "Unnamed product";
+  const priceName = price.priceName ? ` \u2014 ${price.priceName}` : "";
+  return `${currency} ${amount}${interval}  ${pc4.dim(`${productName}${priceName}`)}  ${pc4.dim(`(${price.id})`)}`;
+}
+function formatStoreName(store) {
+  const test = store.isTestMode ? pc4.yellow(" (test)") : "";
+  return `${store.name || store.type}${test}`;
+}
+async function initCommand() {
   const creds = requireAuth();
-  const dir = join2(process.cwd(), name);
-  if (existsSync(dir)) {
-    error(`Directory '${name}' already exists.`);
-    process.exit(1);
-  }
+  const apiOpts = { token: creds.token };
+  const name = await input({
+    message: "Funnel name",
+    validate: (value) => {
+      if (!value.trim()) return "Name is required";
+      if (!/^[a-z0-9-]+$/.test(value.trim()))
+        return "Use lowercase letters, numbers, and hyphens only";
+      if (existsSync(join2(process.cwd(), value.trim())))
+        return `Directory '${value.trim()}' already exists`;
+      return true;
+    }
+  });
+  const dir = join2(process.cwd(), name.trim());
   const projectId = await promptForProject(creds.token);
   const projects = await fetchProjects(creds.token);
   const project = projects.find((p) => p.id === projectId);
+  const templates = listTemplates();
+  const selectedDir = await select2({
+    message: "Choose a template",
+    choices: templates.map((t) => ({
+      name: t.config.description ? `${t.config.name} \u2014 ${pc4.dim(t.config.description)}` : t.config.name,
+      value: t.dir
+    }))
+  });
+  const chosen = templates.find((t) => t.dir === selectedDir);
+  const templateConfig = chosen.config;
+  const templateDir = join2(getTemplatesDir(), chosen.dir);
+  const productBindings = [];
+  if (templateConfig.products.length > 0) {
+    const storesSpinner = spinner("Fetching stores...");
+    const stores = await fetchStores(projectId, apiOpts);
+    storesSpinner.stop();
+    if (stores.length === 0) {
+      warn("No stores found for this project.");
+      info("Products will use empty IDs \u2014 create a store in the dashboard and update appfunnel.config.ts.");
+    } else {
+      let store;
+      if (stores.length === 1) {
+        store = stores[0];
+        info(`Using store: ${formatStoreName(store)}`);
+      } else {
+        const storeId = await select2({
+          message: "Choose a store",
+          choices: stores.map((s2) => ({
+            name: formatStoreName(s2),
+            value: s2.id
+          }))
+        });
+        store = stores.find((s2) => s2.id === storeId);
+      }
+      const pricesSpinner = spinner("Fetching prices...");
+      const prices = await fetchStorePrices(projectId, store.id, apiOpts);
+      pricesSpinner.stop();
+      if (prices.length === 0) {
+        warn("No prices found in this store.");
+        info("Import prices in the dashboard, then update appfunnel.config.ts.");
+      } else {
+        console.log();
+        info(`Configuring ${templateConfig.products.length} product(s)...`);
+        console.log();
+        for (const product of templateConfig.products) {
+          if (product.description) {
+            console.log(`  ${pc4.dim(product.description)}`);
+          }
+          const storePriceId = await select2({
+            message: `${product.label} \u2014 select a price`,
+            choices: prices.map((p) => ({
+              name: formatPrice(p),
+              value: p.id
+            }))
+          });
+          const binding = {
+            id: product.id,
+            name: product.id,
+            storePriceId
+          };
+          if (product.paidTrial) {
+            const trialStorePriceId = await select2({
+              message: `${product.label} \u2014 select a trial price`,
+              choices: [
+                ...prices.map((p) => ({
+                  name: formatPrice(p),
+                  value: p.id
+                })),
+                { name: pc4.dim("Skip (no trial)"), value: "" }
+              ]
+            });
+            if (trialStorePriceId) {
+              binding.trialStorePriceId = trialStorePriceId;
+              const trialDaysStr = await select2({
+                message: `${product.label} \u2014 trial duration`,
+                choices: [
+                  { name: "3 days", value: "3" },
+                  { name: "7 days", value: "7" },
+                  { name: "14 days", value: "14" },
+                  { name: "30 days", value: "30" },
+                  { name: "90 days", value: "90" }
+                ]
+              });
+              binding.trialDays = parseInt(trialDaysStr, 10);
+            }
+          }
+          productBindings.push(binding);
+        }
+      }
+    }
+  }
   const s = spinner(`Creating ${name}...`);
-  mkdirSync2(join2(dir, "src", "pages"), { recursive: true });
-  mkdirSync2(join2(dir, "src", "components"), { recursive: true });
-  mkdirSync2(join2(dir, "locales"), { recursive: true });
+  cpSync(templateDir, dir, { recursive: true });
+  const templateJsonPath = join2(dir, "template.json");
+  if (existsSync(templateJsonPath)) {
+    const { unlinkSync } = await import("fs");
+    unlinkSync(templateJsonPath);
+  }
+  const configPath = join2(dir, "appfunnel.config.ts");
+  if (existsSync(configPath)) {
+    let config = readFileSync2(configPath, "utf-8");
+    config = config.replace("__PROJECT_ID__", projectId);
+    config = config.replace("__NAME__", name);
+    if (productBindings.length > 0) {
+      const itemsStr = productBindings.map((b) => {
+        const fields = [
+          `			{ id: '${b.id}'`,
+          `name: '${b.name}'`,
+          `storePriceId: '${b.storePriceId}'`
+        ];
+        if (b.trialDays) fields.push(`trialDays: ${b.trialDays}`);
+        if (b.trialStorePriceId)
+          fields.push(`trialStorePriceId: '${b.trialStorePriceId}'`);
+        return fields.join(", ") + " }";
+      }).join(",\n");
+      const defaultId = productBindings[0].id;
+      config = config.replace(
+        /products:\s*\{[^}]*items:\s*\[[^\]]*\][^}]*\}/s,
+        `products: {
+		items: [
+${itemsStr},
+		],
+		defaultId: '${defaultId}',
+	}`
+      );
+    }
+    writeFileSync2(configPath, config);
+  }
+  const sdkVersion = `^${"0.7.0"}`;
   writeFileSync2(
     join2(dir, "package.json"),
     JSON.stringify(
@@ -211,12 +491,12 @@ async function initCommand(name) {
           publish: "appfunnel publish"
         },
         dependencies: {
-          "@appfunnel-dev/sdk": "^0.5.0",
+          "@appfunnel-dev/sdk": sdkVersion,
           react: "^18.3.0",
           "react-dom": "^18.3.0"
         },
         devDependencies: {
-          appfunnel: "^0.5.0",
+          appfunnel: sdkVersion,
           typescript: "^5.4.0",
           "@types/react": "^18.2.0",
           "@types/react-dom": "^18.2.0",
@@ -230,112 +510,6 @@ async function initCommand(name) {
       2
     ) + "\n"
   );
-  writeFileSync2(
-    join2(dir, "tsconfig.json"),
-    JSON.stringify(
-      {
-        compilerOptions: {
-          target: "ES2020",
-          module: "ESNext",
-          moduleResolution: "bundler",
-          jsx: "react-jsx",
-          strict: true,
-          esModuleInterop: true,
-          skipLibCheck: true,
-          paths: {
-            "@/*": ["./src/*"]
-          },
-          baseUrl: "."
-        },
-        include: ["src"]
-      },
-      null,
-      2
-    ) + "\n"
-  );
-  writeFileSync2(join2(dir, "src", "app.css"), `@import "tailwindcss";
-`);
-  writeFileSync2(
-    join2(dir, "appfunnel.config.ts"),
-    `import { defineConfig } from '@appfunnel-dev/sdk'
-
-export default defineConfig({
-  projectId: '${projectId}',
-  name: '${name}',
-  defaultLocale: 'en',
-
-  responses: {
-    goal: { type: 'string' },
-  },
-
-  products: {
-    items: [],
-  },
-})
-`
-  );
-  writeFileSync2(
-    join2(dir, "src", "funnel.tsx"),
-    `import './app.css'
-
-export default function Funnel({ children }: { children: React.ReactNode }) {
-  return (
-    <div className="min-h-screen">
-      {children}
-    </div>
-  )
-}
-`
-  );
-  writeFileSync2(
-    join2(dir, "src", "pages", "index.tsx"),
-    `import { definePage, useResponse, useNavigation } from '@appfunnel-dev/sdk'
-
-export const page = definePage({
-  name: 'Landing',
-  type: 'default',
-  routes: [],
-})
-
-export default function Landing() {
-  const [goal, setGoal] = useResponse<string>('goal')
-  const { goToNextPage } = useNavigation()
-
-  return (
-    <div className="flex min-h-screen items-center justify-center p-4">
-      <div className="w-full max-w-md space-y-6">
-        <h1 className="text-3xl font-bold text-center">Welcome</h1>
-        <input
-          type="text"
-          value={goal}
-          onChange={(e) => setGoal(e.target.value)}
-          placeholder="What's your goal?"
-          className="w-full rounded-xl border p-4 text-lg"
-        />
-        <button
-          onClick={goToNextPage}
-          disabled={!goal.trim()}
-          className="w-full rounded-xl bg-blue-600 py-4 text-lg font-bold text-white disabled:opacity-50"
-        >
-          Continue
-        </button>
-      </div>
-    </div>
-  )
-}
-`
-  );
-  writeFileSync2(
-    join2(dir, "locales", "en.json"),
-    JSON.stringify({ welcome: "Welcome" }, null, 2) + "\n"
-  );
-  writeFileSync2(
-    join2(dir, ".gitignore"),
-    `node_modules
-dist
-.appfunnel
-`
-  );
   s.stop();
   console.log();
   success(`Created ${pc4.bold(name)} for project ${pc4.bold(project.name)}`);
@@ -345,12 +519,21 @@ dist
   console.log(`  ${pc4.dim("appfunnel dev")}`);
   console.log();
 }
+var __dirname, INTERVAL_LABELS;
 var init_init = __esm({
   "src/commands/init.ts"() {
     "use strict";
     init_logger();
     init_auth();
     init_projects();
+    init_api();
+    __dirname = dirname(fileURLToPath(import.meta.url));
+    INTERVAL_LABELS = {
+      day: { 1: "day", 7: "week", 14: "2 weeks", 30: "month" },
+      week: { 1: "week", 2: "2 weeks", 4: "month", 12: "quarter", 52: "year" },
+      month: { 1: "month", 3: "quarter", 6: "6 months", 12: "year" },
+      year: { 1: "year" }
+    };
   }
 });
 
@@ -364,7 +547,7 @@ import { randomUUID } from "crypto";
 import open from "open";
 async function loginCommand() {
   const state = randomUUID();
-  return new Promise((resolve6, reject) => {
+  return new Promise((resolve5, reject) => {
     const server = createServer((req, res) => {
       const url = new URL(req.url || "/", `http://localhost`);
       if (url.pathname !== "/callback") {
@@ -403,7 +586,7 @@ async function loginCommand() {
       spinner2.stop();
       success(`Logged in as ${email || userId}`);
       server.close();
-      resolve6();
+      resolve5();
     });
     server.listen(0, "127.0.0.1", () => {
       const addr = server.address();
@@ -449,7 +632,7 @@ async function whoamiCommand() {
   const creds = requireAuth();
   const spin = spinner("Verifying credentials\u2026");
   try {
-    const response = await fetch(`${DEFAULT_API_BASE2}/user`, {
+    const response = await fetch(`${DEFAULT_API_BASE3}/user`, {
       headers: {
         Authorization: creds.token,
         "Content-Type": "application/json"
@@ -480,19 +663,19 @@ async function whoamiCommand() {
     );
   }
 }
-var DEFAULT_API_BASE2;
+var DEFAULT_API_BASE3;
 var init_whoami = __esm({
   "src/commands/whoami.ts"() {
     "use strict";
     init_auth();
     init_errors();
     init_logger();
-    DEFAULT_API_BASE2 = "https://api.appfunnel.net";
+    DEFAULT_API_BASE3 = "https://api.appfunnel.net";
   }
 });
 
 // src/lib/config.ts
-import { existsSync as existsSync2, readFileSync as readFileSync2 } from "fs";
+import { existsSync as existsSync2, readFileSync as readFileSync3 } from "fs";
 import { join as join3, resolve } from "path";
 async function loadConfig(cwd) {
   const configPath = join3(cwd, CONFIG_FILE);
@@ -504,7 +687,7 @@ async function loadConfig(cwd) {
     );
   }
   const { transform } = await import("esbuild");
-  const raw = readFileSync2(configPath, "utf-8");
+  const raw = readFileSync3(configPath, "utf-8");
   const result = await transform(raw, {
     loader: "ts",
     format: "esm",
@@ -536,10 +719,10 @@ var init_config = __esm({
 });
 
 // src/lib/version.ts
-import { readFileSync as readFileSync3 } from "fs";
+import { readFileSync as readFileSync4 } from "fs";
 import { join as join4 } from "path";
 function checkVersionCompatibility(cwd) {
-  const cliVersion = "0.5.0";
+  const cliVersion = "0.7.0";
   const sdkVersion = getSdkVersion(cwd);
   const [cliMajor, cliMinor] = cliVersion.split(".").map(Number);
   const [sdkMajor, sdkMinor] = sdkVersion.split(".").map(Number);
@@ -560,7 +743,7 @@ function getSdkVersion(cwd) {
       "sdk",
       "package.json"
     );
-    const pkg = JSON.parse(readFileSync3(pkgPath, "utf-8"));
+    const pkg = JSON.parse(readFileSync4(pkgPath, "utf-8"));
     return pkg.version;
   } catch {
     throw new CLIError(
@@ -578,7 +761,7 @@ var init_version = __esm({
 });
 
 // src/extract/pages.ts
-import { readdirSync, readFileSync as readFileSync4, existsSync as existsSync3 } from "fs";
+import { readdirSync as readdirSync2, readFileSync as readFileSync5, existsSync as existsSync3 } from "fs";
 import { join as join5, basename } from "path";
 function scanPages(cwd) {
   const pagesDir = resolvePagesDir(cwd);
@@ -589,7 +772,7 @@ function scanPages(cwd) {
       "Create src/pages/ and add at least one .tsx page file."
     );
   }
-  const files = readdirSync(pagesDir).filter((f) => f.endsWith(".tsx") && !f.startsWith("_")).map((f) => basename(f, ".tsx")).sort();
+  const files = readdirSync2(pagesDir).filter((f) => f.endsWith(".tsx") && !f.startsWith("_")).map((f) => basename(f, ".tsx")).sort();
   if (files.length === 0) {
     throw new CLIError(
       "NO_PAGES",
@@ -605,7 +788,7 @@ async function extractPageDefinitions(cwd, pageKeys) {
   const result = {};
   for (const key of pageKeys) {
     const filePath = join5(pagesDir, `${key}.tsx`);
-    const source = readFileSync4(filePath, "utf-8");
+    const source = readFileSync5(filePath, "utf-8");
     const definition = extractDefinePage(ts, source, filePath);
     if (definition) {
       result[key] = definition;
@@ -694,6 +877,7 @@ var init_pages = __esm({
 
 // src/vite/entry.ts
 import { join as join6 } from "path";
+import { existsSync as existsSync4 } from "fs";
 function generateEntrySource(options) {
   const { config, pages, pagesDir, funnelTsxPath, isDev } = options;
   const pageKeys = Object.keys(pages);
@@ -721,76 +905,197 @@ function generateEntrySource(options) {
   for (const [key, def] of Object.entries(pages)) {
     slugMap[def.slug || key] = key;
   }
+  const priceDataCode = isDev ? options.priceData && options.priceData.size > 0 ? `const priceData = new Map(${JSON.stringify([...options.priceData.entries()])});` : `const priceData = undefined;` : `const priceData = (() => {
+  const rd = typeof window !== 'undefined' && window.__APPFUNNEL_DATA__;
+  if (!rd || !rd.products?.items) return undefined;
+  // Build price map from server-injected product data
+  const map = new Map();
+  for (const item of rd.products.items) {
+    if (item.priceData && item.storePriceId) map.set(item.storePriceId, item.priceData);
+    if (item.trialPriceData && item.trialStorePriceId) map.set(item.trialStorePriceId, item.trialPriceData);
+  }
+  return map.size > 0 ? map : undefined;
+})();`;
   const trackingCode = isDev ? `
 // Dev mode: mock tracking \u2014 log events to console
-const originalFetch = globalThis.fetch;
 globalThis.__APPFUNNEL_DEV__ = true;
 ` : "";
+  const appCssPath = join6(pagesDir, "..", "app.css").replace(/\\/g, "/");
+  const hasAppCss = existsSync4(join6(pagesDir, "..", "app.css"));
   return `
-import { StrictMode, lazy, Suspense, useState, useEffect, useCallback } from 'react'
+import { StrictMode, Component, lazy, Suspense, useState, useCallback, useEffect, useTransition, useDeferredValue, useSyncExternalStore } from 'react'
 import { createRoot } from 'react-dom/client'
-import { FunnelProvider } from '@appfunnel-dev/sdk/internal'
+import { FunnelProvider, useNavigation } from '@appfunnel-dev/sdk'
+${hasAppCss ? `import '${appCssPath}'` : ""}
 import FunnelWrapper from '${funnelTsxPath.replace(/\\/g, "/")}'
 
 ${trackingCode}
 
-const pages = {
+const pageComponents = {
 ${pageImports}
 }
 
+${priceDataCode}
+
 const config = ${JSON.stringify(fullConfig, null, 2)}
 
-const slugToKey = ${JSON.stringify(slugMap)}
 const keyToSlug = ${JSON.stringify(
     Object.fromEntries(Object.entries(slugMap).map(([s, k]) => [k, s]))
   )}
+const slugToKey = ${JSON.stringify(slugMap)}
+
+const DEV_CAMPAIGN_SLUG = 'campaign'
+const DEFAULT_INITIAL = '${config.initialPageKey || pageKeys[0] || "index"}'
 
-function getInitialPage() {
-  const path = window.location.pathname.split('/').filter(Boolean).pop() || ''
-  return slugToKey[path] || '${config.initialPage || pageKeys[0] || "index"}'
+/**
+ * Parse the URL to extract basePath, campaignSlug, and initial page.
+ *
+ * URL pattern: /f/<campaignSlug>[/<pageSlug>]
+ *
+ * In dev, redirects bare / to /f/<projectId> so the URL matches production.
+ */
+function parseUrl() {
+  const parts = window.location.pathname.split('/').filter(Boolean)
+
+  // /f/<campaignSlug>[/<pageSlug>]
+  if (parts[0] === 'f' && parts.length >= 2) {
+    const campaignSlug = parts[1]
+    const pageSlug = parts[2] || ''
+    const pageKey = pageSlug ? (slugToKey[pageSlug] || '') : ''
+    return {
+      basePath: '/f/' + campaignSlug,
+      campaignSlug,
+      initialPage: pageKey || DEFAULT_INITIAL,
+    }
+  }
+
+  // Bare URL \u2192 redirect to /f/<slug> in dev
+  ${isDev ? `
+  window.history.replaceState(null, '', '/f/' + DEV_CAMPAIGN_SLUG)
+  return {
+    basePath: '/f/' + DEV_CAMPAIGN_SLUG,
+    campaignSlug: DEV_CAMPAIGN_SLUG,
+    initialPage: DEFAULT_INITIAL,
+  }` : `
+  return {
+    basePath: '',
+    campaignSlug: '',
+    initialPage: DEFAULT_INITIAL,
+  }`}
 }
 
-function App() {
-  const [currentPage, setCurrentPage] = useState(getInitialPage)
+const { basePath, campaignSlug, initialPage } = parseUrl()
+
+${isDev ? `
+class ErrorBoundary extends Component {
+  constructor(props) {
+    super(props)
+    this.state = { error: null }
+  }
+  static getDerivedStateFromError(error) {
+    return { error }
+  }
+  componentDidCatch(error, info) {
+    console.error('[AppFunnel] Render error:', error, info)
+  }
+  render() {
+    if (this.state.error) {
+      return (
+        <div style={{ padding: '2rem', fontFamily: 'monospace' }}>
+          <h2 style={{ color: 'red' }}>AppFunnel Error</h2>
+          <pre style={{ whiteSpace: 'pre-wrap', color: '#333' }}>{this.state.error.message}</pre>
+          <pre style={{ whiteSpace: 'pre-wrap', color: '#666', fontSize: '12px' }}>{this.state.error.stack}</pre>
+        </div>
+      )
+    }
+    return this.props.children
+  }
+}
+` : ""}
+
+/**
+ * PageRenderer lives inside FunnelProvider so it can use SDK hooks.
+ * Subscribes to the router \u2014 re-renders when the page changes.
+ * Uses useTransition to keep showing the current page while the next one loads.
+ */
+function PageRenderer() {
+  const { currentPage, goToPage } = useNavigation()
+  const routerPageKey = currentPage?.key || ''
+
+  // Track the displayed page separately so we can transition smoothly
+  const [displayedKey, setDisplayedKey] = useState(routerPageKey)
+  const [isPending, startTransition] = useTransition()
+
+  // When the router's page changes, transition to the new page
+  useEffect(() => {
+    if (routerPageKey && routerPageKey !== displayedKey) {
+      startTransition(() => {
+        setDisplayedKey(routerPageKey)
+      })
+    }
+  }, [routerPageKey, displayedKey])
+
+  // Sync URL with current page
+  const slug = currentPage?.slug || routerPageKey
+  useEffect(() => {
+    const expectedPath = basePath ? basePath + '/' + slug : '/' + slug
+    if (slug && window.location.pathname !== expectedPath) {
+      window.history.pushState(null, '', expectedPath)
+    }
+  }, [slug])
 
+  // Handle browser back/forward
   useEffect(() => {
     const handlePopState = () => {
       const path = window.location.pathname.split('/').filter(Boolean).pop() || ''
-      const pageKey = slugToKey[path]
-      if (pageKey && pageKey !== currentPage) {
-        setCurrentPage(pageKey)
+      const key = slugToKey[path]
+      if (key && key !== routerPageKey) {
+        goToPage(key)
       }
     }
     window.addEventListener('popstate', handlePopState)
     return () => window.removeEventListener('popstate', handlePopState)
-  }, [currentPage])
+  }, [routerPageKey, goToPage])
 
-  // Expose navigation to FunnelProvider's router
-  useEffect(() => {
-    window.__APPFUNNEL_NAVIGATE__ = (pageKey) => {
-      setCurrentPage(pageKey)
-      const slug = keyToSlug[pageKey] || pageKey
-      window.history.pushState(null, '', '/' + slug)
-    }
-    return () => { delete window.__APPFUNNEL_NAVIGATE__ }
-  }, [])
-
-  const PageComponent = pages[currentPage]
+  const PageComponent = pageComponents[displayedKey]
 
   if (!PageComponent) {
-    return <div style={{ padding: '2rem', color: 'red' }}>Page not found: {currentPage}</div>
+    return <div style={{ padding: '2rem', color: 'red' }}>Page not found: {displayedKey}</div>
   }
 
+  return (
+    <Suspense fallback={null}>
+      <PageComponent />
+    </Suspense>
+  )
+}
+
+// Runtime data injected by the server (production only)
+const __rd = typeof window !== 'undefined' && window.__APPFUNNEL_DATA__
+
+function App() {
+  // In production, merge server-injected integrations into config
+  const runtimeConfig = __rd && __rd.integrations
+    ? { ...config, integrations: { ...config.integrations, ...__rd.integrations } }
+    : config
+
+  const sessionData = __rd ? {
+    campaignId: __rd.campaignId || '',
+    funnelId: __rd.funnelId || config.funnelId || '',
+    experimentId: __rd.experimentId || null,
+  } : undefined
+
   return (
     <FunnelProvider
-      config={config}
-      initialPage={currentPage}
-      apiBaseUrl={${isDev ? "''" : "config.settings?.apiBaseUrl || ''"}}
+      config={runtimeConfig}
+      initialPage={initialPage}
+      basePath={basePath}
+      campaignSlug={campaignSlug}
+      priceData={priceData}
+      sessionData={sessionData}
     >
       <FunnelWrapper>
-        <Suspense fallback={null}>
-          <PageComponent />
-        </Suspense>
+        <PageRenderer />
       </FunnelWrapper>
     </FunnelProvider>
   )
@@ -798,9 +1103,14 @@ function App() {
 
 createRoot(document.getElementById('root')).render(
   <StrictMode>
-    <App />
+    ${isDev ? "<ErrorBoundary>" : ""}
+      <App />
+    ${isDev ? "</ErrorBoundary>" : ""}
   </StrictMode>
 )
+
+// Reveal body (the host page may set opacity:0 for a loading transition)
+document.body.style.opacity = '1'
 `;
 }
 var init_entry = __esm({
@@ -832,54 +1142,66 @@ var init_html = __esm({
 
 // src/vite/plugin.ts
 import { resolve as resolve2, join as join7 } from "path";
-import { existsSync as existsSync4 } from "fs";
+import { existsSync as existsSync5, writeFileSync as writeFileSync3, mkdirSync as mkdirSync2, readFileSync as readFileSync6 } from "fs";
 function appfunnelPlugin(options) {
   const { cwd, config, isDev } = options;
   let pages = options.pages;
   const pagesDir = resolve2(cwd, "src", "pages");
   const funnelTsxPath = resolve2(cwd, "src", "funnel.tsx");
-  let server;
+  const appfunnelDir = join7(cwd, APPFUNNEL_DIR);
+  const htmlPath = join7(appfunnelDir, "index.html");
   function getEntrySource() {
     return generateEntrySource({
       config,
       pages,
       pagesDir,
       funnelTsxPath,
-      isDev
+      isDev,
+      priceData: options.priceData
     });
   }
   return {
     name: "appfunnel",
     config() {
+      mkdirSync2(appfunnelDir, { recursive: true });
+      writeFileSync3(htmlPath, generateHtml(config.name || "AppFunnel"));
       return {
+        // Don't let Vite auto-serve index.html — we handle it ourselves
+        appType: "custom",
         resolve: {
           alias: {
             "@": resolve2(cwd, "src")
           }
         },
-        // Ensure we can import .tsx files
         esbuild: {
           jsx: "automatic"
         },
         optimizeDeps: {
-          include: ["react", "react-dom", "react/jsx-runtime"]
+          include: ["react", "react-dom", "react/jsx-runtime"],
+          force: true
         }
       };
     },
     resolveId(id) {
-      if (id === VIRTUAL_ENTRY_ID) {
+      if (id === VIRTUAL_ENTRY_ID || id === "/" + VIRTUAL_ENTRY_ID) {
         return RESOLVED_VIRTUAL_ENTRY_ID;
       }
       return null;
     },
-    load(id) {
+    async load(id) {
       if (id === RESOLVED_VIRTUAL_ENTRY_ID) {
-        return getEntrySource();
+        const { transform } = await import("esbuild");
+        const source = getEntrySource();
+        const result = await transform(source, {
+          loader: "tsx",
+          jsx: "automatic",
+          sourcefile: "appfunnel-entry.tsx"
+        });
+        return result.code;
       }
       return null;
     },
     configureServer(devServer) {
-      server = devServer;
       const watcher = devServer.watcher;
       watcher.add(pagesDir);
       const handlePagesChange = async () => {
@@ -903,7 +1225,7 @@ function appfunnelPlugin(options) {
         }
       });
       const configPath = join7(cwd, "appfunnel.config.ts");
-      if (existsSync4(configPath)) {
+      if (existsSync5(configPath)) {
         watcher.add(configPath);
         watcher.on("change", (file) => {
           if (file === configPath) {
@@ -912,33 +1234,37 @@ function appfunnelPlugin(options) {
         });
       }
       return () => {
-        devServer.middlewares.use((req, res, next) => {
-          if (req.url?.startsWith("/@") || req.url?.startsWith("/node_modules") || req.url?.startsWith("/src") || req.url?.includes(".")) {
+        devServer.middlewares.use(async (req, res, next) => {
+          const url = req.url?.split("?")[0] || "";
+          if (url.includes(".") || url.startsWith("/@") || url.startsWith("/node_modules")) {
             return next();
           }
-          const html = generateHtml(config.name || "AppFunnel");
-          devServer.transformIndexHtml(req.url || "/", html).then((transformed) => {
+          try {
+            const rawHtml = readFileSync6(htmlPath, "utf-8");
+            const html = await devServer.transformIndexHtml(req.url || "/", rawHtml);
             res.statusCode = 200;
             res.setHeader("Content-Type", "text/html");
-            res.end(transformed);
-          }).catch(next);
+            res.end(html);
+          } catch (err) {
+            next(err);
+          }
         });
       };
     },
-    // For production build: inject the HTML as the input
     transformIndexHtml(html) {
       return html;
     }
   };
 }
-var VIRTUAL_ENTRY_ID, RESOLVED_VIRTUAL_ENTRY_ID;
+var VIRTUAL_ENTRY_ID, RESOLVED_VIRTUAL_ENTRY_ID, APPFUNNEL_DIR;
 var init_plugin = __esm({
   "src/vite/plugin.ts"() {
     "use strict";
     init_entry();
     init_html();
     VIRTUAL_ENTRY_ID = "@appfunnel/entry";
-    RESOLVED_VIRTUAL_ENTRY_ID = "\0" + VIRTUAL_ENTRY_ID;
+    RESOLVED_VIRTUAL_ENTRY_ID = "\0" + VIRTUAL_ENTRY_ID + ".tsx";
+    APPFUNNEL_DIR = ".appfunnel";
   }
 });
 
@@ -947,7 +1273,7 @@ var dev_exports = {};
 __export(dev_exports, {
   devCommand: () => devCommand
 });
-import { readFileSync as readFileSync5, writeFileSync as writeFileSync3 } from "fs";
+import { readFileSync as readFileSync7, writeFileSync as writeFileSync4 } from "fs";
 import { join as join8 } from "path";
 import pc6 from "picocolors";
 async function devCommand(options) {
@@ -963,13 +1289,22 @@ async function devCommand(options) {
     const projectId = await promptForProject(creds.token);
     config.projectId = projectId;
     const configPath = join8(cwd, "appfunnel.config.ts");
-    const configSource = readFileSync5(configPath, "utf-8");
-    const updated = configSource.replace(
-      /projectId:\s*['"].*?['"]/,
-      `projectId: '${projectId}'`
-    );
+    const configSource = readFileSync7(configPath, "utf-8");
+    let updated;
+    if (/projectId:\s*['"]/.test(configSource)) {
+      updated = configSource.replace(
+        /projectId:\s*['"].*?['"]/,
+        `projectId: '${projectId}'`
+      );
+    } else {
+      updated = configSource.replace(
+        /(defineConfig\(\{[\t ]*\n)/,
+        `$1	projectId: '${projectId}',
+`
+      );
+    }
     if (updated !== configSource) {
-      writeFileSync3(configPath, updated);
+      writeFileSync4(configPath, updated);
       success(`Updated projectId in appfunnel.config.ts`);
     } else {
       warn(`Could not auto-update appfunnel.config.ts \u2014 add projectId: '${projectId}' manually.`);
@@ -980,8 +1315,43 @@ async function devCommand(options) {
   let pages = await extractPageDefinitions(cwd, pageKeys);
   s2.stop();
   info(`Found ${pageKeys.length} pages: ${pageKeys.join(", ")}`);
+  let priceData = /* @__PURE__ */ new Map();
+  if (config.projectId && config.products?.items?.length) {
+    try {
+      const storePriceIds = [
+        ...new Set(
+          config.products.items.flatMap(
+            (item) => [item.storePriceId, item.trialStorePriceId].filter(Boolean)
+          )
+        )
+      ];
+      info(`Fetching ${storePriceIds.length} store prices: ${storePriceIds.join(", ")}`);
+      const s3 = spinner("Fetching store prices...");
+      priceData = await fetchPrices(config.projectId, storePriceIds, { token: creds.token });
+      s3.stop();
+      const missingIds = storePriceIds.filter((id) => !priceData.has(id));
+      if (missingIds.length > 0) {
+        error(`Missing store prices: ${missingIds.join(", ")}`);
+        error("Make sure these storePriceId values in your config match prices in your project.");
+        process.exit(1);
+      }
+      success(`Fetched ${priceData.size}/${storePriceIds.length} store prices`);
+    } catch (err) {
+      error(`Failed to fetch store prices: ${err.message}`);
+      process.exit(1);
+    }
+  }
   const { createServer: createServer2 } = await import("vite");
   const react = await import("@vitejs/plugin-react");
+  let tailwindPlugin = null;
+  try {
+    const { createRequire } = await import("module");
+    const require2 = createRequire(join8(cwd, "package.json"));
+    const tailwindPath = require2.resolve("@tailwindcss/vite");
+    const tailwindVite = await import(tailwindPath);
+    tailwindPlugin = tailwindVite.default;
+  } catch {
+  }
   const server = await createServer2({
     root: cwd,
     server: {
@@ -990,11 +1360,13 @@ async function devCommand(options) {
     },
     plugins: [
       react.default(),
+      ...tailwindPlugin ? [tailwindPlugin()] : [],
       appfunnelPlugin({
         cwd,
         config,
         pages,
         isDev: true,
+        priceData,
         async onPagesChange() {
           pageKeys = scanPages(cwd);
           pages = await extractPageDefinitions(cwd, pageKeys);
@@ -1028,6 +1400,7 @@ var init_dev = __esm({
     init_pages();
     init_plugin();
     init_projects();
+    init_api();
   }
 });
 
@@ -1036,8 +1409,9 @@ var build_exports = {};
 __export(build_exports, {
   buildCommand: () => buildCommand
 });
-import { resolve as resolve4, join as join9 } from "path";
-import { readFileSync as readFileSync6, writeFileSync as writeFileSync4, statSync, readdirSync as readdirSync2 } from "fs";
+import { resolve as resolve3, join as join9 } from "path";
+import { randomUUID as randomUUID2 } from "crypto";
+import { readFileSync as readFileSync8, writeFileSync as writeFileSync5, statSync, readdirSync as readdirSync3 } from "fs";
 import pc7 from "picocolors";
 async function buildCommand() {
   const cwd = process.cwd();
@@ -1058,15 +1432,25 @@ async function buildCommand() {
   s.stop();
   validateRoutes(config, pages, pageKeys);
   info(`Building ${pageKeys.length} pages...`);
-  const outDir = resolve4(cwd, ".appfunnel");
+  const outDir = resolve3(cwd, "dist");
   const { build } = await import("vite");
   const react = await import("@vitejs/plugin-react");
-  const htmlPath = resolve4(cwd, "index.html");
+  let tailwindPlugin = null;
+  try {
+    const { createRequire } = await import("module");
+    const require2 = createRequire(join9(cwd, "package.json"));
+    const tailwindPath = require2.resolve("@tailwindcss/vite");
+    const tailwindVite = await import(tailwindPath);
+    tailwindPlugin = tailwindVite.default;
+  } catch {
+  }
+  const htmlPath = resolve3(cwd, "index.html");
   const htmlContent = generateHtml(config.name || "AppFunnel");
-  writeFileSync4(htmlPath, htmlContent);
+  writeFileSync5(htmlPath, htmlContent);
   try {
     await build({
       root: cwd,
+      base: "./",
       build: {
         outDir,
         emptyOutDir: true,
@@ -1087,6 +1471,7 @@ async function buildCommand() {
       },
       plugins: [
         react.default(),
+        ...tailwindPlugin ? [tailwindPlugin()] : [],
         appfunnelPlugin({
           cwd,
           config,
@@ -1122,9 +1507,12 @@ async function buildCommand() {
   const totalSize = assets.reduce((sum, a) => sum + a.size, 0);
   const manifest = {
     version: 1,
+    buildHash: randomUUID2(),
     sdkVersion: getSdkVersion2(cwd),
     projectId: config.projectId,
     funnelId: config.funnelId,
+    name: config.name,
+    initialPageKey: config.initialPageKey,
     pages: { ...config.pages, ...mergedPages },
     routes: { ...config.routes, ...mergedRoutes },
     responses: config.responses || {},
@@ -1134,15 +1522,15 @@ async function buildCommand() {
     assets,
     totalSize
   };
-  writeFileSync4(join9(outDir, "manifest.json"), JSON.stringify(manifest, null, 2) + "\n");
+  writeFileSync5(join9(outDir, "manifest.json"), JSON.stringify(manifest, null, 2) + "\n");
   console.log();
   success("Build complete");
   console.log();
-  console.log(`  ${pc7.dim("Output:")}  .appfunnel/`);
+  console.log(`  ${pc7.dim("Output:")}  dist/`);
   console.log(`  ${pc7.dim("Pages:")}   ${pageKeys.length}`);
   console.log(`  ${pc7.dim("Size:")}    ${formatSize(totalSize)}`);
   console.log();
-  for (const asset of assets.filter((a) => a.path.endsWith(".js"))) {
+  for (const asset of assets) {
     const sizeStr = formatSize(asset.size);
     const isOver = asset.size > MAX_PAGE_SIZE;
     console.log(`  ${isOver ? pc7.yellow("!") : pc7.dim("\xB7")} ${pc7.dim(asset.path)} ${isOver ? pc7.yellow(sizeStr) : pc7.dim(sizeStr)}`);
@@ -1234,7 +1622,7 @@ function validateConditionVariables(condition, pageKey, allVariables) {
 function collectAssets(outDir) {
   const assets = [];
   function walk(dir, prefix = "") {
-    for (const entry of readdirSync2(dir, { withFileTypes: true })) {
+    for (const entry of readdirSync3(dir, { withFileTypes: true })) {
       const relPath = prefix ? `${prefix}/${entry.name}` : entry.name;
       const fullPath = join9(dir, entry.name);
       if (entry.isDirectory()) {
@@ -1254,7 +1642,7 @@ function formatSize(bytes) {
 }
 function getSdkVersion2(cwd) {
   try {
-    const pkg = JSON.parse(readFileSync6(join9(cwd, "node_modules", "@appfunnel", "sdk", "package.json"), "utf-8"));
+    const pkg = JSON.parse(readFileSync8(join9(cwd, "node_modules", "@appfunnel", "sdk", "package.json"), "utf-8"));
     return pkg.version;
   } catch {
     return "0.0.0";
@@ -1285,83 +1673,25 @@ var init_build = __esm({
   }
 });
 
-// src/lib/api.ts
-async function apiFetch(path, options) {
-  const { token, apiBaseUrl, ...fetchOpts } = options;
-  const base = apiBaseUrl || DEFAULT_API_BASE3;
-  const url = `${base}${path}`;
-  const isFormData = fetchOpts.body instanceof FormData;
-  const headers = {
-    Authorization: token,
-    ...fetchOpts.headers || {}
-  };
-  if (!isFormData) {
-    headers["Content-Type"] = "application/json";
-  }
-  const response = await fetch(url, {
-    ...fetchOpts,
-    headers
-  });
-  if (!response.ok) {
-    const body = await response.text().catch(() => "");
-    let message = `API request failed: ${response.status} ${response.statusText}`;
-    try {
-      const parsed = JSON.parse(body);
-      if (parsed.error) message = parsed.error;
-      if (parsed.message) message = parsed.message;
-    } catch {
-    }
-    const error2 = new CLIError("API_ERROR", message);
-    error2.statusCode = response.status;
-    throw error2;
-  }
-  return response;
-}
-async function publishBuild(projectId, funnelId, manifest, assets, options) {
-  const formData = new FormData();
-  formData.set("manifest", JSON.stringify(manifest));
-  formData.set("funnelId", funnelId);
-  for (const asset of assets) {
-    formData.append(
-      "assets",
-      new Blob([new Uint8Array(asset.content)], { type: asset.contentType }),
-      asset.path
-    );
-  }
-  try {
-    const response = await apiFetch(`/project/${projectId}/headless/publish`, {
-      ...options,
-      method: "POST",
-      body: formData
-    });
-    return await response.json();
-  } catch (err) {
-    if (err instanceof CLIError && err.code === "API_ERROR") {
-      if (err.statusCode === 413) {
-        throw new CLIError(
-          "BUNDLE_TOO_LARGE",
-          err.message,
-          "Reduce page bundle sizes. Check for large dependencies."
-        );
-      }
-      if (err.statusCode === 409) {
-        throw new CLIError(
-          "FUNNEL_NOT_HEADLESS",
-          err.message,
-          "Create a new headless funnel from the dashboard, or remove funnelId from config."
-        );
-      }
-      throw new CLIError("PUBLISH_FAILED", err.message);
-    }
-    throw err;
+// src/lib/config-patch.ts
+import { join as join10 } from "path";
+import { readFileSync as readFileSync9, writeFileSync as writeFileSync6 } from "fs";
+function patchConfigFunnelId(cwd, funnelId) {
+  const configPath = join10(cwd, "appfunnel.config.ts");
+  let content = readFileSync9(configPath, "utf-8");
+  if (content.includes("funnelId")) return;
+  const patched = content.replace(
+    /(projectId:\s*['"][^'"]+['"],?\s*\n)/,
+    `$1  funnelId: '${funnelId}',
+`
+  );
+  if (patched !== content) {
+    writeFileSync6(configPath, patched, "utf-8");
   }
 }
-var DEFAULT_API_BASE3;
-var init_api = __esm({
-  "src/lib/api.ts"() {
+var init_config_patch = __esm({
+  "src/lib/config-patch.ts"() {
     "use strict";
-    init_errors();
-    DEFAULT_API_BASE3 = "https://api.appfunnel.net";
   }
 });
 
@@ -1370,34 +1700,49 @@ var publish_exports = {};
 __export(publish_exports, {
   publishCommand: () => publishCommand
 });
-import { resolve as resolve5, join as join10 } from "path";
-import { readFileSync as readFileSync7, existsSync as existsSync5 } from "fs";
+import { resolve as resolve4, join as join11 } from "path";
+import { readFileSync as readFileSync10, existsSync as existsSync6 } from "fs";
 import pc8 from "picocolors";
 function getMimeType(path) {
   const ext = path.substring(path.lastIndexOf("."));
   return MIME_TYPES[ext] || "application/octet-stream";
 }
-async function publishCommand() {
+function formatSize2(bytes) {
+  if (bytes < 1024) return `${bytes}B`;
+  if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(1)}KB`;
+  return `${(bytes / (1024 * 1024)).toFixed(2)}MB`;
+}
+async function publishCommand(options) {
   const cwd = process.cwd();
   const creds = requireAuth();
   checkVersionCompatibility(cwd);
   const config = await loadConfig(cwd);
-  const outDir = resolve5(cwd, ".appfunnel");
-  const manifestPath = join10(outDir, "manifest.json");
-  if (!existsSync5(manifestPath)) {
+  const projectId = config.projectId;
+  if (!projectId) {
+    throw new CLIError(
+      "CONFIG_NOT_FOUND",
+      "No projectId in appfunnel.config.ts.",
+      "Add projectId to your config. You can find it in the dashboard."
+    );
+  }
+  const outDir = resolve4(cwd, "dist");
+  const manifestPath = join11(outDir, "manifest.json");
+  if (!existsSync6(manifestPath)) {
     throw new CLIError(
       "BUILD_NOT_FOUND",
       "No build output found.",
       "Run 'appfunnel build' first."
     );
   }
-  const manifest = JSON.parse(readFileSync7(manifestPath, "utf-8"));
+  const manifest = JSON.parse(readFileSync10(manifestPath, "utf-8"));
   const assets = manifest.assets || [];
-  const s = spinner("Uploading build...");
+  const s = spinner("Preparing assets...");
   const assetPayloads = [];
-  for (const asset of assets) {
-    const fullPath = join10(outDir, asset.path);
-    if (!existsSync5(fullPath)) {
+  let totalBytes = 0;
+  for (let i = 0; i < assets.length; i++) {
+    const asset = assets[i];
+    const fullPath = join11(outDir, asset.path);
+    if (!existsSync6(fullPath)) {
       s.stop();
       throw new CLIError(
         "BUILD_NOT_FOUND",
@@ -1405,44 +1750,42 @@ async function publishCommand() {
         "Run 'appfunnel build' to regenerate."
       );
     }
+    const content = readFileSync10(fullPath);
+    totalBytes += content.length;
     assetPayloads.push({
       path: asset.path,
-      content: readFileSync7(fullPath),
+      content,
       contentType: getMimeType(asset.path)
     });
+    s.text = `Preparing assets... ${i + 1}/${assets.length} ${pc8.dim(`(${formatSize2(totalBytes)})`)}`;
   }
-  const projectId = config.projectId;
-  const funnelId = config.funnelId;
-  if (!projectId) {
-    s.stop();
-    throw new CLIError(
-      "CONFIG_NOT_FOUND",
-      "No projectId in appfunnel.config.ts.",
-      "Add projectId to your config. You can find it in the dashboard."
-    );
-  }
-  if (!funnelId) {
-    s.stop();
-    throw new CLIError(
-      "CONFIG_NOT_FOUND",
-      "No funnelId in appfunnel.config.ts.",
-      "Add funnelId to your config, or create a new funnel from the dashboard."
-    );
-  }
+  s.text = `Uploading ${assets.length} assets ${pc8.dim(`(${formatSize2(totalBytes)})`)}`;
   const result = await publishBuild(
     projectId,
-    funnelId,
+    config.funnelId || "",
     manifest,
     assetPayloads,
-    { token: creds.token }
+    { token: creds.token },
+    options?.promote
   );
   s.stop();
+  if (result.created && result.funnelId) {
+    patchConfigFunnelId(cwd, result.funnelId);
+    info(`Funnel created \u2014 funnelId added to appfunnel.config.ts`);
+  }
   console.log();
-  success("Published successfully");
+  success(result.activated ? "Published and activated" : "Published successfully");
   console.log();
-  console.log(`  ${pc8.dim("Build ID:")}  ${result.buildId}`);
-  console.log(`  ${pc8.dim("URL:")}       ${pc8.cyan(result.url)}`);
-  console.log(`  ${pc8.dim("Assets:")}    ${assets.length} files`);
+  console.log(`  ${pc8.dim("Build ID:")}   ${result.buildId}`);
+  if (result.funnelId && !config.funnelId) {
+    console.log(`  ${pc8.dim("Funnel:")}     ${result.funnelId}`);
+  }
+  console.log(`  ${pc8.dim("Dashboard:")}  ${pc8.cyan(result.dashboardUrl)}`);
+  console.log(`  ${pc8.dim("Assets:")}     ${assets.length} files ${pc8.dim(`(${formatSize2(totalBytes)})`)}`);
+  if (!result.activated) {
+    console.log();
+    console.log(`  ${pc8.dim("Tip:")} Use ${pc8.cyan("--promote")} to activate immediately, or promote from the dashboard.`);
+  }
   console.log();
 }
 var MIME_TYPES;
@@ -1455,6 +1798,7 @@ var init_publish = __esm({
     init_version();
     init_api();
     init_errors();
+    init_config_patch();
     MIME_TYPES = {
       ".js": "application/javascript",
       ".css": "text/css",
@@ -1474,10 +1818,10 @@ init_errors();
 import { Command } from "commander";
 import pc9 from "picocolors";
 var program = new Command();
-program.name("appfunnel").description("Build and publish headless AppFunnel projects").version("0.5.0");
-program.command("init <name>").description("Create a new AppFunnel project").action(async (name) => {
+program.name("appfunnel").description("Build and publish headless AppFunnel projects").version("0.7.0");
+program.command("init").description("Create a new AppFunnel project").action(async () => {
   const { initCommand: initCommand2 } = await Promise.resolve().then(() => (init_init(), init_exports));
-  await initCommand2(name);
+  await initCommand2();
 });
 program.command("login").description("Authenticate with AppFunnel").action(async () => {
   const { loginCommand: loginCommand2 } = await Promise.resolve().then(() => (init_login(), login_exports));
@@ -1495,9 +1839,9 @@ program.command("build").description("Build the funnel for production").action(a
   const { buildCommand: buildCommand2 } = await Promise.resolve().then(() => (init_build(), build_exports));
   await buildCommand2();
 });
-program.command("publish").description("Publish the build to AppFunnel").action(async () => {
+program.command("publish").description("Publish the build to AppFunnel").option("--promote", "Activate the build immediately after publishing").action(async (options) => {
   const { publishCommand: publishCommand2 } = await Promise.resolve().then(() => (init_publish(), publish_exports));
-  await publishCommand2();
+  await publishCommand2({ promote: options.promote });
 });
 program.hook("postAction", () => {
 });