appfunnel 0.1.0

package/dist/index.js

@@ -0,0 +1,1461 @@
+#!/usr/bin/env node
+#!/usr/bin/env node
+var __defProp = Object.defineProperty;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __esm = (fn, res) => function __init() {
+  return fn && (res = (0, fn[__getOwnPropNames(fn)[0]])(fn = 0)), res;
+};
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+
+// src/lib/errors.ts
+import pc from "picocolors";
+function formatError(err) {
+  const lines = [
+    `${pc.red("ERROR")} ${pc.dim(`[${err.code}]`)}: ${err.message}`
+  ];
+  if (err.hint) {
+    lines.push(`  ${pc.dim("Hint:")} ${err.hint}`);
+  }
+  return lines.join("\n");
+}
+function formatWarning(code, message, hint) {
+  const lines = [
+    `${pc.yellow("WARNING")} ${pc.dim(`[${code}]`)}: ${message}`
+  ];
+  if (hint) {
+    lines.push(`  ${pc.dim("Hint:")} ${hint}`);
+  }
+  return lines.join("\n");
+}
+var CLIError;
+var init_errors = __esm({
+  "src/lib/errors.ts"() {
+    "use strict";
+    CLIError = class extends Error {
+      code;
+      hint;
+      statusCode;
+      constructor(code, message, hint) {
+        super(message);
+        this.name = "CLIError";
+        this.code = code;
+        this.hint = hint;
+      }
+    };
+  }
+});
+
+// src/lib/logger.ts
+import { readFileSync } from "fs";
+import pc2 from "picocolors";
+import ora from "ora";
+function success(msg) {
+  console.log(`${pc2.green("\u2713")} ${msg}`);
+}
+function error(msg) {
+  console.error(`${pc2.red("\u2717")} ${msg}`);
+}
+function warn(msg) {
+  console.warn(`${pc2.yellow("!")} ${msg}`);
+}
+function info(msg) {
+  console.log(`${pc2.blue("\u2139")} ${msg}`);
+}
+function spinner(msg) {
+  return ora({ text: msg, color: "cyan" }).start();
+}
+var init_logger = __esm({
+  "src/lib/logger.ts"() {
+    "use strict";
+  }
+});
+
+// src/lib/auth.ts
+import { readFileSync as readFileSync2, writeFileSync, mkdirSync } from "fs";
+import { join } from "path";
+import { homedir } from "os";
+function readCredentials() {
+  try {
+    const raw = readFileSync2(CREDENTIALS_PATH, "utf-8");
+    const data = JSON.parse(raw);
+    if (!data.token) return null;
+    return data;
+  } catch {
+    return null;
+  }
+}
+function writeCredentials(creds) {
+  const dir = homedir();
+  mkdirSync(dir, { recursive: true });
+  writeFileSync(CREDENTIALS_PATH, JSON.stringify(creds, null, 2) + "\n", "utf-8");
+}
+function requireAuth() {
+  const creds = readCredentials();
+  if (!creds) {
+    throw new CLIError(
+      "AUTH_REQUIRED",
+      "Not logged in.",
+      "Run 'appfunnel login' to authenticate."
+    );
+  }
+  if (creds.expiresAt) {
+    const expiresAt = new Date(creds.expiresAt);
+    if (expiresAt < /* @__PURE__ */ new Date()) {
+      throw new CLIError(
+        "AUTH_EXPIRED",
+        "Token expired.",
+        "Run 'appfunnel login' to re-authenticate."
+      );
+    }
+  }
+  return creds;
+}
+var CREDENTIALS_PATH;
+var init_auth = __esm({
+  "src/lib/auth.ts"() {
+    "use strict";
+    init_errors();
+    CREDENTIALS_PATH = join(homedir(), ".appfunnelrc");
+  }
+});
+
+// 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 pc3 from "picocolors";
+import select from "@inquirer/select";
+async function fetchProjects(token) {
+  const response = await fetch(`${DEFAULT_API_BASE}/user/projects`, {
+    headers: {
+      Authorization: token,
+      "Content-Type": "application/json"
+    }
+  });
+  if (!response.ok) {
+    throw new CLIError("API_ERROR", "Failed to fetch projects.");
+  }
+  const body = await response.json();
+  return body.data;
+}
+async function initCommand(name) {
+  const creds = requireAuth();
+  const dir = join2(process.cwd(), name);
+  if (existsSync(dir)) {
+    error(`Directory '${name}' already exists.`);
+    process.exit(1);
+  }
+  const spin = spinner("Fetching projects\u2026");
+  let projects;
+  try {
+    projects = await fetchProjects(creds.token);
+  } catch (err) {
+    spin.stop();
+    if (err instanceof CLIError) throw err;
+    throw new CLIError(
+      "API_ERROR",
+      "Failed to reach the API. Check your internet connection."
+    );
+  }
+  spin.stop();
+  if (projects.length === 0) {
+    throw new CLIError(
+      "NO_PROJECTS",
+      "No projects found.",
+      "Create a project at https://appfunnel.net first."
+    );
+  }
+  const projectId = await select({
+    message: "Select a project",
+    choices: projects.map((p) => ({
+      name: `${p.name} ${pc3.dim(`(${p.id})`)}`,
+      value: p.id
+    }))
+  });
+  const project = projects.find((p) => p.id === projectId);
+  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 });
+  writeFileSync2(
+    join2(dir, "package.json"),
+    JSON.stringify(
+      {
+        name,
+        version: "0.1.0",
+        private: true,
+        type: "module",
+        scripts: {
+          dev: "appfunnel dev",
+          build: "appfunnel build",
+          publish: "appfunnel publish"
+        },
+        dependencies: {
+          "@appfunnel/sdk": "^0.1.0",
+          react: "^18.3.0",
+          "react-dom": "^18.3.0"
+        },
+        devDependencies: {
+          appfunnel: "^0.1.0",
+          typescript: "^5.4.0",
+          "@types/react": "^18.2.0",
+          "@types/react-dom": "^18.2.0",
+          vite: "^6.0.0",
+          "@vitejs/plugin-react": "^4.0.0",
+          tailwindcss: "^4.0.0",
+          "@tailwindcss/vite": "^4.0.0"
+        }
+      },
+      null,
+      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/sdk'
+
+export default defineConfig({
+  projectId: '${projectId}',
+  name: '${name}',
+  defaultLocale: 'en',
+
+  variables: {
+    'answers.goal': { type: 'string' },
+  },
+
+  queryParams: ['utm_source', 'utm_medium', 'utm_campaign'],
+
+  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, useVariable, useNavigation } from '@appfunnel/sdk'
+
+export const page = definePage({
+  name: 'Landing',
+  type: 'default',
+  routes: [],
+})
+
+export default function Landing() {
+  const [goal, setGoal] = useVariable<string>('answers.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 ${pc3.bold(name)} for project ${pc3.bold(project.name)}`);
+  console.log();
+  console.log(`  ${pc3.dim("cd")} ${name}`);
+  console.log(`  ${pc3.dim("npm install")}`);
+  console.log(`  ${pc3.dim("appfunnel dev")}`);
+  console.log();
+}
+var DEFAULT_API_BASE;
+var init_init = __esm({
+  "src/commands/init.ts"() {
+    "use strict";
+    init_logger();
+    init_auth();
+    init_errors();
+    DEFAULT_API_BASE = "https://api.appfunnel.net";
+  }
+});
+
+// src/commands/login.ts
+var login_exports = {};
+__export(login_exports, {
+  loginCommand: () => loginCommand
+});
+import { createServer } from "http";
+import { randomUUID } from "crypto";
+import open from "open";
+async function loginCommand() {
+  const state = randomUUID();
+  return new Promise((resolve5, reject) => {
+    const server = createServer((req, res) => {
+      const url = new URL(req.url || "/", `http://localhost`);
+      if (url.pathname !== "/callback") {
+        res.writeHead(404);
+        res.end("Not found");
+        return;
+      }
+      const token = url.searchParams.get("token");
+      const returnedState = url.searchParams.get("state");
+      const userId = url.searchParams.get("userId") || "";
+      const email = url.searchParams.get("email") || "";
+      const expiresAt = url.searchParams.get("expiresAt") || "";
+      if (returnedState !== state) {
+        res.writeHead(400);
+        res.end("Invalid state parameter. Please try again.");
+        return;
+      }
+      if (!token) {
+        res.writeHead(400);
+        res.end("No token received. Please try again.");
+        return;
+      }
+      writeCredentials({ token, userId, email, expiresAt });
+      res.writeHead(200, { "Content-Type": "text/html" });
+      res.end(`
+        <!DOCTYPE html>
+        <html>
+          <body style="font-family: system-ui; display: flex; align-items: center; justify-content: center; height: 100vh; margin: 0;">
+            <div style="text-align: center;">
+              <h1>Logged in!</h1>
+              <p>You can close this tab and return to the terminal.</p>
+            </div>
+          </body>
+        </html>
+      `);
+      spinner2.stop();
+      success(`Logged in as ${email || userId}`);
+      server.close();
+      resolve5();
+    });
+    server.listen(0, "127.0.0.1", () => {
+      const addr = server.address();
+      if (!addr || typeof addr === "string") {
+        reject(new Error("Failed to start local server"));
+        return;
+      }
+      const port = addr.port;
+      const authUrl = `${AUTH_BASE_URL}/cli/authorize?port=${port}&state=${state}`;
+      info("Opening browser for authentication...");
+      open(authUrl).catch(() => {
+        warn(`Could not open browser. Please visit:
+  ${authUrl}`);
+      });
+    });
+    const spinner2 = spinner("Waiting for authentication...");
+    const timeout = setTimeout(() => {
+      spinner2.stop();
+      server.close();
+      reject(new Error("Authentication timed out. Please try again."));
+    }, TIMEOUT_MS);
+    server.on("close", () => clearTimeout(timeout));
+  });
+}
+var AUTH_BASE_URL, TIMEOUT_MS;
+var init_login = __esm({
+  "src/commands/login.ts"() {
+    "use strict";
+    init_logger();
+    init_auth();
+    AUTH_BASE_URL = "https://appfunnel.net";
+    TIMEOUT_MS = 12e4;
+  }
+});
+
+// src/commands/whoami.ts
+var whoami_exports = {};
+__export(whoami_exports, {
+  whoamiCommand: () => whoamiCommand
+});
+import pc4 from "picocolors";
+async function whoamiCommand() {
+  const creds = requireAuth();
+  const spin = spinner("Verifying credentials\u2026");
+  try {
+    const response = await fetch(`${DEFAULT_API_BASE2}/user`, {
+      headers: {
+        Authorization: creds.token,
+        "Content-Type": "application/json"
+      }
+    });
+    if (!response.ok) {
+      spin.stop();
+      throw new CLIError(
+        "AUTH_EXPIRED",
+        "Token is no longer valid.",
+        "Run 'appfunnel login' to re-authenticate."
+      );
+    }
+    const user = await response.json();
+    spin.stop();
+    success(`Logged in as ${pc4.bold(user.email)}`);
+    info(`User ID: ${pc4.dim(user.id)}`);
+    if (creds.expiresAt) {
+      const expiresAt = new Date(creds.expiresAt);
+      info(`Token expires: ${pc4.dim(expiresAt.toLocaleString())}`);
+    }
+  } catch (err) {
+    spin.stop();
+    if (err instanceof CLIError) throw err;
+    throw new CLIError(
+      "API_ERROR",
+      "Failed to reach the API. Check your internet connection."
+    );
+  }
+}
+var DEFAULT_API_BASE2;
+var init_whoami = __esm({
+  "src/commands/whoami.ts"() {
+    "use strict";
+    init_auth();
+    init_errors();
+    init_logger();
+    DEFAULT_API_BASE2 = "https://api.appfunnel.net";
+  }
+});
+
+// src/lib/config.ts
+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);
+  if (!existsSync2(configPath)) {
+    throw new CLIError(
+      "CONFIG_NOT_FOUND",
+      `No ${CONFIG_FILE} found in ${cwd}.`,
+      "Run 'appfunnel init' to create a new project, or cd into your project directory."
+    );
+  }
+  const { transform } = await import("esbuild");
+  const raw = readFileSync3(configPath, "utf-8");
+  const result = await transform(raw, {
+    loader: "ts",
+    format: "esm",
+    target: "es2022"
+  });
+  const code = result.code.replace(/import\s*\{[^}]*\}\s*from\s*['"]@appfunnel\/sdk['"]\s*;?/g, "").replace(/\bdefineConfig\s*\(/g, "(");
+  const dataUri = `data:text/javascript;base64,${Buffer.from(code).toString("base64")}`;
+  const mod = await import(dataUri);
+  const config = mod.default;
+  if (!config || !config.projectId) {
+    throw new CLIError(
+      "CONFIG_NOT_FOUND",
+      `Invalid config in ${CONFIG_FILE}: missing projectId.`,
+      "Make sure your config exports a valid object with defineConfig()."
+    );
+  }
+  return config;
+}
+function resolvePagesDir(cwd) {
+  return resolve(cwd, "src", "pages");
+}
+var CONFIG_FILE;
+var init_config = __esm({
+  "src/lib/config.ts"() {
+    "use strict";
+    init_errors();
+    CONFIG_FILE = "appfunnel.config.ts";
+  }
+});
+
+// src/lib/version.ts
+import { readFileSync as readFileSync4 } from "fs";
+import { join as join4 } from "path";
+function checkVersionCompatibility(cwd) {
+  const cliVersion = getCliVersion();
+  const sdkVersion = getSdkVersion(cwd);
+  const [cliMajor, cliMinor] = cliVersion.split(".").map(Number);
+  const [sdkMajor, sdkMinor] = sdkVersion.split(".").map(Number);
+  if (cliMajor !== sdkMajor || cliMinor !== sdkMinor) {
+    throw new CLIError(
+      "VERSION_MISMATCH",
+      `CLI version ${cliVersion} requires @appfunnel/sdk ^${cliMajor}.${cliMinor}.0, but found ${sdkVersion}.`,
+      "Run 'npm install @appfunnel/sdk@latest' to update."
+    );
+  }
+}
+function getCliVersion() {
+  try {
+    const pkg = JSON.parse(
+      readFileSync4(new URL("../../package.json", import.meta.url), "utf-8")
+    );
+    return pkg.version;
+  } catch {
+    return "0.0.0";
+  }
+}
+function getSdkVersion(cwd) {
+  try {
+    const pkgPath = join4(cwd, "node_modules", "@appfunnel", "sdk", "package.json");
+    const pkg = JSON.parse(readFileSync4(pkgPath, "utf-8"));
+    return pkg.version;
+  } catch {
+    throw new CLIError(
+      "VERSION_MISMATCH",
+      "@appfunnel/sdk is not installed.",
+      "Run 'npm install @appfunnel/sdk' to install it."
+    );
+  }
+}
+var init_version = __esm({
+  "src/lib/version.ts"() {
+    "use strict";
+    init_errors();
+  }
+});
+
+// src/extract/pages.ts
+import { readdirSync, readFileSync as readFileSync5, existsSync as existsSync3 } from "fs";
+import { join as join5, basename } from "path";
+function scanPages(cwd) {
+  const pagesDir = resolvePagesDir(cwd);
+  if (!existsSync3(pagesDir)) {
+    throw new CLIError(
+      "NO_PAGES",
+      "No src/pages/ directory found.",
+      "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();
+  if (files.length === 0) {
+    throw new CLIError(
+      "NO_PAGES",
+      "No page files found in src/pages/.",
+      "Add .tsx files to src/pages/. Each file is a funnel page."
+    );
+  }
+  return files;
+}
+async function extractPageDefinitions(cwd, pageKeys) {
+  const ts = await import("typescript");
+  const pagesDir = resolvePagesDir(cwd);
+  const result = {};
+  for (const key of pageKeys) {
+    const filePath = join5(pagesDir, `${key}.tsx`);
+    const source = readFileSync5(filePath, "utf-8");
+    const definition = extractDefinePage(ts, source, filePath);
+    if (definition) {
+      result[key] = definition;
+    } else {
+      result[key] = {
+        name: key,
+        type: "default"
+      };
+    }
+  }
+  return result;
+}
+function extractDefinePage(ts, source, fileName) {
+  const sourceFile = ts.createSourceFile(
+    fileName,
+    source,
+    ts.ScriptTarget.Latest,
+    true,
+    ts.ScriptKind.TSX
+  );
+  let definition = null;
+  function visit(node) {
+    if (ts.isVariableStatement(node)) {
+      const isExported = node.modifiers?.some(
+        (m) => m.kind === ts.SyntaxKind.ExportKeyword
+      );
+      if (!isExported) return;
+      for (const decl of node.declarationList.declarations) {
+        if (ts.isIdentifier(decl.name) && decl.name.text === "page" && decl.initializer && ts.isCallExpression(decl.initializer)) {
+          const call = decl.initializer;
+          const callee = call.expression;
+          if (ts.isIdentifier(callee) && callee.text === "definePage") {
+            const arg = call.arguments[0];
+            if (arg && ts.isObjectLiteralExpression(arg)) {
+              definition = extractObjectLiteral(ts, arg);
+            }
+          }
+        }
+      }
+    }
+    ts.forEachChild(node, visit);
+  }
+  ts.forEachChild(sourceFile, visit);
+  return definition;
+}
+function extractObjectLiteral(ts, node) {
+  const result = {};
+  for (const prop of node.properties) {
+    if (!ts.isPropertyAssignment(prop)) continue;
+    if (!ts.isIdentifier(prop.name) && !ts.isStringLiteral(prop.name)) continue;
+    const key = ts.isIdentifier(prop.name) ? prop.name.text : prop.name.text;
+    result[key] = extractValue(ts, prop.initializer);
+  }
+  return result;
+}
+function extractValue(ts, node) {
+  if (ts.isStringLiteral(node) || ts.isNoSubstitutionTemplateLiteral(node)) {
+    return node.text;
+  }
+  if (ts.isNumericLiteral(node)) {
+    return Number(node.text);
+  }
+  if (node.kind === ts.SyntaxKind.TrueKeyword) return true;
+  if (node.kind === ts.SyntaxKind.FalseKeyword) return false;
+  if (node.kind === ts.SyntaxKind.NullKeyword) return null;
+  if (node.kind === ts.SyntaxKind.UndefinedKeyword) return void 0;
+  if (ts.isArrayLiteralExpression(node)) {
+    return node.elements.map((el) => extractValue(ts, el));
+  }
+  if (ts.isObjectLiteralExpression(node)) {
+    return extractObjectLiteral(ts, node);
+  }
+  if (ts.isPrefixUnaryExpression(node) && node.operator === ts.SyntaxKind.MinusToken) {
+    const operand = extractValue(ts, node.operand);
+    if (typeof operand === "number") return -operand;
+  }
+  return void 0;
+}
+var init_pages = __esm({
+  "src/extract/pages.ts"() {
+    "use strict";
+    init_config();
+    init_errors();
+  }
+});
+
+// src/vite/entry.ts
+import { join as join6 } from "path";
+function generateEntrySource(options) {
+  const { config, pages, pagesDir, funnelTsxPath, isDev } = options;
+  const pageKeys = Object.keys(pages);
+  const mergedPages = {};
+  const mergedRoutes = {};
+  for (const [key, def] of Object.entries(pages)) {
+    mergedPages[key] = {
+      name: def.name || key,
+      type: def.type || "default",
+      slug: def.slug || key
+    };
+    if (def.routes) {
+      mergedRoutes[key] = def.routes;
+    }
+  }
+  const fullConfig = {
+    ...config,
+    pages: { ...config.pages, ...mergedPages },
+    routes: { ...config.routes, ...mergedRoutes }
+  };
+  const pageImports = pageKeys.map(
+    (key) => `  '${key}': lazy(() => import('${join6(pagesDir, key + ".tsx").replace(/\\/g, "/")}')),`
+  ).join("\n");
+  const slugMap = {};
+  for (const [key, def] of Object.entries(pages)) {
+    slugMap[def.slug || key] = key;
+  }
+  const trackingCode = isDev ? `
+// Dev mode: mock tracking \u2014 log events to console
+const originalFetch = globalThis.fetch;
+globalThis.__APPFUNNEL_DEV__ = true;
+` : "";
+  return `
+import { StrictMode, lazy, Suspense, useState, useEffect, useCallback } from 'react'
+import { createRoot } from 'react-dom/client'
+import { FunnelProvider } from '@appfunnel/sdk/internal'
+import FunnelWrapper from '${funnelTsxPath.replace(/\\/g, "/")}'
+
+${trackingCode}
+
+const pages = {
+${pageImports}
+}
+
+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]))
+  )}
+
+function getInitialPage() {
+  const path = window.location.pathname.split('/').filter(Boolean).pop() || ''
+  return slugToKey[path] || '${config.initialPage || pageKeys[0] || "index"}'
+}
+
+function App() {
+  const [currentPage, setCurrentPage] = useState(getInitialPage)
+
+  useEffect(() => {
+    const handlePopState = () => {
+      const path = window.location.pathname.split('/').filter(Boolean).pop() || ''
+      const pageKey = slugToKey[path]
+      if (pageKey && pageKey !== currentPage) {
+        setCurrentPage(pageKey)
+      }
+    }
+    window.addEventListener('popstate', handlePopState)
+    return () => window.removeEventListener('popstate', handlePopState)
+  }, [currentPage])
+
+  // 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]
+
+  if (!PageComponent) {
+    return <div style={{ padding: '2rem', color: 'red' }}>Page not found: {currentPage}</div>
+  }
+
+  return (
+    <FunnelProvider
+      config={config}
+      initialPage={currentPage}
+      apiBaseUrl={${isDev ? "''" : "config.settings?.apiBaseUrl || ''"}}
+    >
+      <FunnelWrapper>
+        <Suspense fallback={null}>
+          <PageComponent />
+        </Suspense>
+      </FunnelWrapper>
+    </FunnelProvider>
+  )
+}
+
+createRoot(document.getElementById('root')).render(
+  <StrictMode>
+    <App />
+  </StrictMode>
+)
+`;
+}
+var init_entry = __esm({
+  "src/vite/entry.ts"() {
+    "use strict";
+  }
+});
+
+// src/vite/html.ts
+function generateHtml(title = "AppFunnel") {
+  return `<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>${title}</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/@appfunnel/entry"></script>
+  </body>
+</html>`;
+}
+var init_html = __esm({
+  "src/vite/html.ts"() {
+    "use strict";
+  }
+});
+
+// src/vite/plugin.ts
+import { resolve as resolve2, join as join7 } from "path";
+import { existsSync as existsSync4 } 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;
+  function getEntrySource() {
+    return generateEntrySource({
+      config,
+      pages,
+      pagesDir,
+      funnelTsxPath,
+      isDev
+    });
+  }
+  return {
+    name: "appfunnel",
+    config() {
+      return {
+        resolve: {
+          alias: {
+            "@": resolve2(cwd, "src")
+          }
+        },
+        // Ensure we can import .tsx files
+        esbuild: {
+          jsx: "automatic"
+        },
+        optimizeDeps: {
+          include: ["react", "react-dom", "react/jsx-runtime"]
+        }
+      };
+    },
+    resolveId(id) {
+      if (id === VIRTUAL_ENTRY_ID) {
+        return RESOLVED_VIRTUAL_ENTRY_ID;
+      }
+      return null;
+    },
+    load(id) {
+      if (id === RESOLVED_VIRTUAL_ENTRY_ID) {
+        return getEntrySource();
+      }
+      return null;
+    },
+    configureServer(devServer) {
+      server = devServer;
+      const watcher = devServer.watcher;
+      watcher.add(pagesDir);
+      const handlePagesChange = async () => {
+        if (options.onPagesChange) {
+          await options.onPagesChange();
+        }
+        const mod = devServer.moduleGraph.getModuleById(RESOLVED_VIRTUAL_ENTRY_ID);
+        if (mod) {
+          devServer.moduleGraph.invalidateModule(mod);
+        }
+        devServer.ws.send({ type: "full-reload" });
+      };
+      watcher.on("add", (file) => {
+        if (file.startsWith(pagesDir) && file.endsWith(".tsx")) {
+          handlePagesChange();
+        }
+      });
+      watcher.on("unlink", (file) => {
+        if (file.startsWith(pagesDir) && file.endsWith(".tsx")) {
+          handlePagesChange();
+        }
+      });
+      const configPath = join7(cwd, "appfunnel.config.ts");
+      if (existsSync4(configPath)) {
+        watcher.add(configPath);
+        watcher.on("change", (file) => {
+          if (file === configPath) {
+            devServer.ws.send({ type: "full-reload" });
+          }
+        });
+      }
+      return () => {
+        devServer.middlewares.use((req, res, next) => {
+          if (req.url?.startsWith("/@") || req.url?.startsWith("/node_modules") || req.url?.startsWith("/src") || req.url?.includes(".")) {
+            return next();
+          }
+          const html = generateHtml(config.name || "AppFunnel");
+          devServer.transformIndexHtml(req.url || "/", html).then((transformed) => {
+            res.statusCode = 200;
+            res.setHeader("Content-Type", "text/html");
+            res.end(transformed);
+          }).catch(next);
+        });
+      };
+    },
+    // For production build: inject the HTML as the input
+    transformIndexHtml(html) {
+      return html;
+    }
+  };
+}
+var VIRTUAL_ENTRY_ID, RESOLVED_VIRTUAL_ENTRY_ID;
+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;
+  }
+});
+
+// src/commands/dev.ts
+var dev_exports = {};
+__export(dev_exports, {
+  devCommand: () => devCommand
+});
+import pc5 from "picocolors";
+async function devCommand(options) {
+  const cwd = process.cwd();
+  const port = options.port || 5173;
+  requireAuth();
+  checkVersionCompatibility(cwd);
+  const s = spinner("Loading config...");
+  const config = await loadConfig(cwd);
+  let pageKeys = scanPages(cwd);
+  let pages = await extractPageDefinitions(cwd, pageKeys);
+  s.stop();
+  info(`Found ${pageKeys.length} pages: ${pageKeys.join(", ")}`);
+  const { createServer: createServer2 } = await import("vite");
+  const react = await import("@vitejs/plugin-react");
+  const server = await createServer2({
+    root: cwd,
+    server: {
+      port,
+      strictPort: false
+    },
+    plugins: [
+      react.default(),
+      appfunnelPlugin({
+        cwd,
+        config,
+        pages,
+        isDev: true,
+        async onPagesChange() {
+          pageKeys = scanPages(cwd);
+          pages = await extractPageDefinitions(cwd, pageKeys);
+          info(`Pages updated: ${pageKeys.join(", ")}`);
+        }
+      })
+    ],
+    css: {
+      postcss: cwd
+    }
+  });
+  await server.listen();
+  const address = server.resolvedUrls?.local?.[0] || `http://localhost:${port}`;
+  console.log();
+  console.log(`  ${pc5.bold(config.name || "AppFunnel")} dev server`);
+  console.log();
+  console.log(`  ${pc5.dim("Local:")}   ${pc5.cyan(address)}`);
+  console.log(`  ${pc5.dim("Pages:")}   ${pageKeys.length}`);
+  console.log(`  ${pc5.dim("Tracking:")} ${pc5.yellow("mocked (console)")}`);
+  console.log();
+  console.log(`  ${pc5.dim("Press")} ${pc5.bold("Ctrl+C")} ${pc5.dim("to stop")}`);
+  console.log();
+}
+var init_dev = __esm({
+  "src/commands/dev.ts"() {
+    "use strict";
+    init_logger();
+    init_auth();
+    init_config();
+    init_version();
+    init_pages();
+    init_plugin();
+  }
+});
+
+// src/commands/build.ts
+var build_exports = {};
+__export(build_exports, {
+  buildCommand: () => buildCommand
+});
+import { resolve as resolve3, join as join8 } from "path";
+import { readFileSync as readFileSync6, writeFileSync as writeFileSync3, statSync, readdirSync as readdirSync2 } from "fs";
+import pc6 from "picocolors";
+async function buildCommand() {
+  const cwd = process.cwd();
+  requireAuth();
+  checkVersionCompatibility(cwd);
+  const s = spinner("Analyzing pages...");
+  const config = await loadConfig(cwd);
+  const pageKeys = scanPages(cwd);
+  const pages = await extractPageDefinitions(cwd, pageKeys);
+  s.stop();
+  validateRoutes(config, pages, pageKeys);
+  info(`Building ${pageKeys.length} pages...`);
+  const outDir = resolve3(cwd, ".appfunnel");
+  const { build } = await import("vite");
+  const react = await import("@vitejs/plugin-react");
+  const htmlPath = resolve3(cwd, "index.html");
+  const htmlContent = generateHtml(config.name || "AppFunnel");
+  writeFileSync3(htmlPath, htmlContent);
+  try {
+    await build({
+      root: cwd,
+      build: {
+        outDir,
+        emptyOutDir: true,
+        sourcemap: false,
+        minify: "esbuild",
+        rollupOptions: {
+          output: {
+            manualChunks(id) {
+              if (id.includes("node_modules/react")) {
+                return "vendor-react";
+              }
+              if (id.includes("@appfunnel/sdk")) {
+                return "vendor-sdk";
+              }
+            }
+          }
+        }
+      },
+      plugins: [
+        react.default(),
+        appfunnelPlugin({
+          cwd,
+          config,
+          pages,
+          isDev: false
+        })
+      ],
+      css: {
+        postcss: cwd
+      },
+      logLevel: "warn"
+    });
+  } finally {
+    try {
+      const { unlinkSync } = await import("fs");
+      unlinkSync(htmlPath);
+    } catch {
+    }
+  }
+  const mergedPages = {};
+  const mergedRoutes = {};
+  for (const [key, def] of Object.entries(pages)) {
+    mergedPages[key] = {
+      name: def.name || key,
+      type: def.type || "default",
+      slug: def.slug || key
+    };
+    if (def.routes) {
+      mergedRoutes[key] = def.routes;
+    }
+  }
+  const assets = collectAssets(outDir);
+  const totalSize = assets.reduce((sum, a) => sum + a.size, 0);
+  const manifest = {
+    version: 1,
+    sdkVersion: getSdkVersion2(cwd),
+    projectId: config.projectId,
+    funnelId: config.funnelId,
+    pages: { ...config.pages, ...mergedPages },
+    routes: { ...config.routes, ...mergedRoutes },
+    variables: config.variables,
+    queryParams: config.queryParams || [],
+    defaultLocale: config.defaultLocale,
+    assets,
+    totalSize
+  };
+  writeFileSync3(join8(outDir, "manifest.json"), JSON.stringify(manifest, null, 2) + "\n");
+  console.log();
+  success("Build complete");
+  console.log();
+  console.log(`  ${pc6.dim("Output:")}  .appfunnel/`);
+  console.log(`  ${pc6.dim("Pages:")}   ${pageKeys.length}`);
+  console.log(`  ${pc6.dim("Size:")}    ${formatSize(totalSize)}`);
+  console.log();
+  for (const asset of assets.filter((a) => a.path.endsWith(".js"))) {
+    const sizeStr = formatSize(asset.size);
+    const isOver = asset.size > MAX_PAGE_SIZE;
+    console.log(`  ${isOver ? pc6.yellow("!") : pc6.dim("\xB7")} ${pc6.dim(asset.path)} ${isOver ? pc6.yellow(sizeStr) : pc6.dim(sizeStr)}`);
+  }
+  console.log();
+  if (totalSize > MAX_TOTAL_SIZE) {
+    console.log(formatWarning(
+      "BUNDLE_TOO_LARGE",
+      `Total bundle size (${formatSize(totalSize)}) exceeds the 2MB limit.`,
+      "This will be rejected on publish. Reduce dependencies or code-split."
+    ));
+    console.log();
+  }
+  for (const asset of assets) {
+    if (asset.size > MAX_PAGE_SIZE && asset.path.endsWith(".js")) {
+      console.log(formatWarning(
+        "PAGE_SIZE",
+        `${asset.path} is ${formatSize(asset.size)} (limit: 500KB).`,
+        "Consider reducing dependencies in this page."
+      ));
+    }
+  }
+}
+function validateRoutes(config, pages, pageKeys) {
+  const allPageKeys = new Set(pageKeys);
+  const allVariables = new Set(Object.keys(config.variables));
+  for (const [pageKey, def] of Object.entries(pages)) {
+    if (!def.routes) continue;
+    for (const route of def.routes) {
+      if (!allPageKeys.has(route.to)) {
+        throw new CLIError(
+          "INVALID_ROUTE",
+          `Page "${pageKey}" routes to "${route.to}" which does not exist.`,
+          `Available pages: ${pageKeys.join(", ")}. Check src/pages/${pageKey}.tsx.`
+        );
+      }
+      if (route.when) {
+        validateConditionVariables(route.when, pageKey, allVariables);
+      }
+    }
+  }
+}
+function validateConditionVariables(condition, pageKey, allVariables) {
+  if (!condition || typeof condition !== "object") return;
+  const cond = condition;
+  if (cond.variable && typeof cond.variable === "string") {
+    const prefix = cond.variable.split(".")[0];
+    const systemPrefixes = ["page", "device", "browser", "os", "session", "system", "metadata", "user", "query", "products", "card", "payment", "stripe", "subscription"];
+    if (!systemPrefixes.includes(prefix) && !allVariables.has(cond.variable)) {
+      throw new CLIError(
+        "UNDEFINED_VARIABLE",
+        `Route condition in "${pageKey}" references variable "${cond.variable}" which is not defined.`,
+        `Add it to variables in appfunnel.config.ts: '${cond.variable}': { type: 'string' }`
+      );
+    }
+  }
+  if (Array.isArray(cond.rules)) {
+    for (const rule of cond.rules) {
+      validateConditionVariables(rule, pageKey, allVariables);
+    }
+  }
+}
+function collectAssets(outDir) {
+  const assets = [];
+  function walk(dir, prefix = "") {
+    for (const entry of readdirSync2(dir, { withFileTypes: true })) {
+      const relPath = prefix ? `${prefix}/${entry.name}` : entry.name;
+      const fullPath = join8(dir, entry.name);
+      if (entry.isDirectory()) {
+        walk(fullPath, relPath);
+      } else if (entry.name !== "manifest.json" && !entry.name.startsWith(".")) {
+        assets.push({ path: relPath, size: statSync(fullPath).size });
+      }
+    }
+  }
+  walk(outDir);
+  return assets;
+}
+function formatSize(bytes) {
+  if (bytes < 1024) return `${bytes}B`;
+  if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(1)}KB`;
+  return `${(bytes / (1024 * 1024)).toFixed(2)}MB`;
+}
+function getSdkVersion2(cwd) {
+  try {
+    const pkg = JSON.parse(readFileSync6(join8(cwd, "node_modules", "@appfunnel", "sdk", "package.json"), "utf-8"));
+    return pkg.version;
+  } catch {
+    return "0.0.0";
+  }
+}
+var MAX_TOTAL_SIZE, MAX_PAGE_SIZE;
+var init_build = __esm({
+  "src/commands/build.ts"() {
+    "use strict";
+    init_logger();
+    init_auth();
+    init_config();
+    init_version();
+    init_pages();
+    init_plugin();
+    init_html();
+    init_errors();
+    init_errors();
+    MAX_TOTAL_SIZE = 2 * 1024 * 1024;
+    MAX_PAGE_SIZE = 500 * 1024;
+  }
+});
+
+// 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;
+  }
+}
+var DEFAULT_API_BASE3;
+var init_api = __esm({
+  "src/lib/api.ts"() {
+    "use strict";
+    init_errors();
+    DEFAULT_API_BASE3 = "https://api.appfunnel.net";
+  }
+});
+
+// src/commands/publish.ts
+var publish_exports = {};
+__export(publish_exports, {
+  publishCommand: () => publishCommand
+});
+import { resolve as resolve4, join as join9 } from "path";
+import { readFileSync as readFileSync7, existsSync as existsSync5 } from "fs";
+import pc7 from "picocolors";
+function getMimeType(path) {
+  const ext = path.substring(path.lastIndexOf("."));
+  return MIME_TYPES[ext] || "application/octet-stream";
+}
+async function publishCommand() {
+  const cwd = process.cwd();
+  const creds = requireAuth();
+  checkVersionCompatibility(cwd);
+  const config = await loadConfig(cwd);
+  const outDir = resolve4(cwd, ".appfunnel");
+  const manifestPath = join9(outDir, "manifest.json");
+  if (!existsSync5(manifestPath)) {
+    throw new CLIError(
+      "BUILD_NOT_FOUND",
+      "No build output found.",
+      "Run 'appfunnel build' first."
+    );
+  }
+  const manifest = JSON.parse(readFileSync7(manifestPath, "utf-8"));
+  const assets = manifest.assets || [];
+  const s = spinner("Uploading build...");
+  const assetPayloads = [];
+  for (const asset of assets) {
+    const fullPath = join9(outDir, asset.path);
+    if (!existsSync5(fullPath)) {
+      s.stop();
+      throw new CLIError(
+        "BUILD_NOT_FOUND",
+        `Build asset missing: ${asset.path}`,
+        "Run 'appfunnel build' to regenerate."
+      );
+    }
+    assetPayloads.push({
+      path: asset.path,
+      content: readFileSync7(fullPath),
+      contentType: getMimeType(asset.path)
+    });
+  }
+  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."
+    );
+  }
+  const result = await publishBuild(
+    projectId,
+    funnelId,
+    manifest,
+    assetPayloads,
+    { token: creds.token }
+  );
+  s.stop();
+  console.log();
+  success("Published successfully");
+  console.log();
+  console.log(`  ${pc7.dim("Build ID:")}  ${result.buildId}`);
+  console.log(`  ${pc7.dim("URL:")}       ${pc7.cyan(result.url)}`);
+  console.log(`  ${pc7.dim("Assets:")}    ${assets.length} files`);
+  console.log();
+}
+var MIME_TYPES;
+var init_publish = __esm({
+  "src/commands/publish.ts"() {
+    "use strict";
+    init_logger();
+    init_auth();
+    init_config();
+    init_version();
+    init_api();
+    init_errors();
+    MIME_TYPES = {
+      ".js": "application/javascript",
+      ".css": "text/css",
+      ".html": "text/html",
+      ".json": "application/json",
+      ".svg": "image/svg+xml",
+      ".png": "image/png",
+      ".jpg": "image/jpeg",
+      ".woff2": "font/woff2",
+      ".woff": "font/woff"
+    };
+  }
+});
+
+// src/index.ts
+init_errors();
+import { readFileSync as readFileSync8 } from "fs";
+import { Command } from "commander";
+import pc8 from "picocolors";
+function getCliVersion2() {
+  try {
+    const pkg = JSON.parse(
+      readFileSync8(new URL("../package.json", import.meta.url), "utf-8")
+    );
+    return pkg.version;
+  } catch {
+    return "0.0.0";
+  }
+}
+var program = new Command();
+program.name("appfunnel").description("Build and publish headless AppFunnel projects").version(getCliVersion2());
+program.command("init <name>").description("Create a new AppFunnel project").action(async (name) => {
+  const { initCommand: initCommand2 } = await Promise.resolve().then(() => (init_init(), init_exports));
+  await initCommand2(name);
+});
+program.command("login").description("Authenticate with AppFunnel").action(async () => {
+  const { loginCommand: loginCommand2 } = await Promise.resolve().then(() => (init_login(), login_exports));
+  await loginCommand2();
+});
+program.command("whoami").description("Show the currently authenticated user").action(async () => {
+  const { whoamiCommand: whoamiCommand2 } = await Promise.resolve().then(() => (init_whoami(), whoami_exports));
+  await whoamiCommand2();
+});
+program.command("dev").description("Start the development server").option("-p, --port <port>", "Port number", "5173").action(async (options) => {
+  const { devCommand: devCommand2 } = await Promise.resolve().then(() => (init_dev(), dev_exports));
+  await devCommand2({ port: parseInt(options.port, 10) });
+});
+program.command("build").description("Build the funnel for production").action(async () => {
+  const { buildCommand: buildCommand2 } = await Promise.resolve().then(() => (init_build(), build_exports));
+  await buildCommand2();
+});
+program.command("publish").description("Publish the build to AppFunnel").action(async () => {
+  const { publishCommand: publishCommand2 } = await Promise.resolve().then(() => (init_publish(), publish_exports));
+  await publishCommand2();
+});
+program.hook("postAction", () => {
+});
+async function main() {
+  try {
+    await program.parseAsync(process.argv);
+  } catch (err) {
+    if (err instanceof CLIError) {
+      console.error(formatError(err));
+      process.exit(1);
+    }
+    console.error(`${pc8.red("ERROR")}: ${err instanceof Error ? err.message : String(err)}`);
+    if (err instanceof Error && err.stack) {
+      console.error(pc8.dim(err.stack));
+    }
+    process.exit(1);
+  }
+}
+main();
+//# sourceMappingURL=index.js.map