@appright/funnelshift 0.0.0-stage → 0.15.0

package/dist/blocks/Cta.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+// The main button of a screen. On phones the wrapper sticks to the bottom of the screen (see blocks.css).
+// pending: the action is running — the button is blocked and marked aria-busy, the text stays as it is.
+export function Cta(p) {
+    const blocked = !!p.pending || !!p.disabled;
+    return (_jsx("div", { className: "fk-cta", children: _jsx("button", { type: "button", className: "fk-cta__button", disabled: blocked, "aria-busy": p.pending ? true : undefined, onClick: () => { if (!blocked)
+                p.onClick(); }, children: p.children }) }));
+}

package/dist/blocks/Hero.d.ts

@@ -0,0 +1,10 @@
+import { type ReactNode } from 'react';
+export declare function Hero(p: {
+    visual?: ReactNode;
+    title: string;
+    highlight?: string;
+    subtitle?: string;
+    cta: string;
+    onCta: () => void;
+    pending?: boolean;
+}): import("react").JSX.Element;

package/dist/blocks/Hero.js

@@ -0,0 +1,48 @@
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useLayoutEffect, useRef, useState } from 'react';
+import { readBootstrap } from '../bootstrap.js';
+import { Cta } from './Cta.js';
+function prefersReducedMotion() {
+    try {
+        return typeof window !== 'undefined' && typeof window.matchMedia === 'function' && window.matchMedia('(prefers-reduced-motion: reduce)').matches;
+    }
+    catch {
+        return false;
+    }
+}
+// Opening screen: a big visual, a very large headline with one fragment painted by a marker, a muted subtitle,
+// the main button at the bottom. The marker animation is pure CSS (blocks.css); `fk-brush--static` is the
+// reduced-motion hook: the final state at once.
+// A highlight that wraps onto several lines cannot be painted by one pair of pseudo-element strokes, so it gets
+// `fk-brush--wrap` (per-line background strokes). Checked after layout and whenever the headline resizes.
+function useWrapped(dep) {
+    const ref = useRef(null);
+    const [wrapped, setWrapped] = useState(false);
+    useLayoutEffect(() => {
+        const el = ref.current;
+        if (!el) {
+            setWrapped(false);
+            return;
+        }
+        const check = () => setWrapped(el.getClientRects().length > 1);
+        check();
+        if (typeof ResizeObserver === 'undefined' || !el.parentElement)
+            return;
+        const ro = new ResizeObserver(check);
+        ro.observe(el.parentElement);
+        return () => ro.disconnect();
+    }, [dep]);
+    return [ref, wrapped];
+}
+export function Hero(p) {
+    const [still] = useState(prefersReducedMotion);
+    const [markRef, wrapped] = useWrapped(p.title + '\0' + p.highlight);
+    const at = p.highlight ? p.title.indexOf(p.highlight) : -1;
+    const missing = !!p.highlight && at < 0;
+    useEffect(() => {
+        if (missing && readBootstrap().env !== 'prod')
+            console.warn(`funnel-kit: Hero highlight "${p.highlight}" is not found in the title, shown without highlight`);
+    }, [missing, p.highlight, p.title]);
+    const title = at < 0 || !p.highlight ? p.title : (_jsxs(_Fragment, { children: [p.title.slice(0, at), _jsx("mark", { ref: markRef, className: ['fk-brush', still && 'fk-brush--static', wrapped && 'fk-brush--wrap'].filter(Boolean).join(' '), children: p.highlight }), p.title.slice(at + p.highlight.length)] }));
+    return (_jsxs("section", { className: "fk-hero", children: [_jsxs("div", { className: "fk-hero__main", children: [p.visual != null && _jsx("div", { className: "fk-hero__visual", children: p.visual }), _jsx("h1", { className: "fk-hero__title", children: title }), p.subtitle && _jsx("p", { className: "fk-hero__subtitle", children: p.subtitle })] }), _jsx(Cta, { onClick: p.onCta, pending: p.pending, children: p.cta })] }));
+}

package/dist/blocks/MultiChoice.d.ts

@@ -0,0 +1,13 @@
+import { type ReactNode } from 'react';
+import type { PickHandlers } from './Choice.js';
+export declare function MultiChoice<T extends string>(p: {
+    options: {
+        value: T;
+        label: string;
+        icon?: ReactNode;
+    }[];
+    value?: T[];
+    name: string;
+    labelledBy?: string;
+    label?: string;
+} & PickHandlers<T[], string[]>): import("react").JSX.Element;

package/dist/blocks/MultiChoice.js

@@ -0,0 +1,47 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useContext, useRef, useState } from 'react';
+import { LabelCtx } from '../offer.js';
+// Several answers to one question: large tappable rows, each a checkbox. A group with a roving tab stop: Tab enters on the
+// first chosen row (or the first one), arrows move the focus only, Enter/Space turn the focused row on or off.
+// onChange gets the chosen values in the order of options, not in the order they were tapped.
+//
+// The group's accessible name: labelledBy (the id of the heading that asks the question, preferred) or label (aria-label).
+// Inside a funnel, onChange={v => f.set('grades', v)} records the option texts too, as with Choice; onPick(values, labels)
+// gets them directly (onPick alone is enough: onPick={(v, texts) => f.set('grades', v, texts)}).
+export function MultiChoice(p) {
+    const refs = useRef([]);
+    const withLabel = useContext(LabelCtx);
+    const chosen = new Set(p.value ?? []);
+    const first = p.options.findIndex(o => chosen.has(o.value));
+    const [focus, setFocus] = useState(null);
+    const stop = focus !== null && focus < p.options.length ? focus : first >= 0 ? first : 0;
+    function toggle(i) {
+        const v = p.options[i].value;
+        const picked = p.options.filter(o => (o.value === v ? !chosen.has(v) : chosen.has(o.value)));
+        const values = picked.map(o => o.value);
+        const labels = picked.map(o => o.label);
+        p.onPick?.(values, labels);
+        withLabel(values, labels, () => p.onChange?.(values));
+    }
+    function onKeyDown(e, i) {
+        const n = p.options.length;
+        // Alt+Arrow is "back/forward" in browsers, Cmd/Ctrl+Arrow is an OS or browser shortcut: arrows with them are left alone.
+        const plain = !e.altKey && !e.metaKey && !e.ctrlKey;
+        let to = -1;
+        if (plain && (e.key === 'ArrowDown' || e.key === 'ArrowRight'))
+            to = (i + 1) % n;
+        else if (plain && (e.key === 'ArrowUp' || e.key === 'ArrowLeft'))
+            to = (i - 1 + n) % n;
+        else if (e.key === 'Enter' || e.key === ' ') {
+            e.preventDefault();
+            toggle(i);
+            return;
+        }
+        else
+            return;
+        e.preventDefault();
+        setFocus(to);
+        refs.current[to]?.focus();
+    }
+    return (_jsxs("div", { className: "fk-choice fk-choice--multi", role: "group", "aria-labelledby": p.labelledBy, "aria-label": p.label, children: [p.options.filter(o => chosen.has(o.value)).map(o => _jsx("input", { type: "hidden", name: p.name, value: o.value }, o.value)), p.options.map((o, i) => (_jsxs("button", { ref: el => { refs.current[i] = el; }, type: "button", role: "checkbox", "aria-checked": chosen.has(o.value), tabIndex: i === stop ? 0 : -1, className: "fk-choice__option", onClick: () => { setFocus(i); toggle(i); }, onKeyDown: e => onKeyDown(e, i), children: [o.icon != null && _jsx("span", { className: "fk-choice__icon", "aria-hidden": "true", children: o.icon }), _jsx("span", { className: "fk-choice__label", children: o.label }), _jsx("span", { className: "fk-choice__mark", "aria-hidden": "true" })] }, o.value)))] }));
+}

package/dist/blocks/Section.d.ts

@@ -0,0 +1,6 @@
+import type { HTMLAttributes } from 'react';
+export type SectionProps = HTMLAttributes<HTMLElement> & {
+    name: string;
+    as?: 'section' | 'div' | 'header' | 'footer' | 'main' | 'article' | 'aside';
+};
+export declare function Section({ name, as: Tag, ...rest }: SectionProps): import("react").JSX.Element;

package/dist/blocks/Section.js

@@ -0,0 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+export function Section({ name, as: Tag = 'section', ...rest }) {
+    return _jsx(Tag, { ...rest, "data-section": name });
+}

package/dist/bootstrap.d.ts

@@ -0,0 +1,33 @@
+export type Env = 'prod' | 'preview' | 'dev';
+export type Creator = {
+    code: string;
+    name: string;
+    avatar_url: string | null;
+};
+export type Bootstrap = {
+    project: string;
+    funnel: string;
+    release_id: string;
+    build_id: string;
+    env: Env;
+    ingest_url: string | null;
+    ingest_key: string;
+    visitor_id: string;
+    content?: Record<string, string>;
+    ingest_fallback_url?: string | null;
+    fn_preview?: string;
+    creator?: Creator;
+    variants?: Record<string, string>;
+    content_overrides?: Record<string, string | number | boolean>;
+    fn_arm?: string;
+    fn_base?: string;
+    geo?: string;
+    request_id?: string;
+    meta_pixel?: {
+        id: string;
+        lead_step?: string;
+        checkout_step?: string;
+    };
+};
+export declare function readBootstrap(win?: Window): Bootstrap;
+export declare function readCreator(win?: Window): Creator | null;

package/dist/bootstrap.js

@@ -0,0 +1,19 @@
+// The edge router injects window.__FUNNEL__ into index.html; without it (vite dev) events stay local.
+export function readBootstrap(win = window) {
+    const b = win.__FUNNEL__;
+    if (b)
+        return b;
+    return { project: 'dev', funnel: 'dev', release_id: '', build_id: 'dev', env: 'dev', ingest_url: null,
+        ingest_key: '', visitor_id: crypto.randomUUID() };
+}
+const CODE = /^[a-z0-9._-]{1,64}$/;
+// The creator of the bootstrap, or null when there is none or it is malformed.
+export function readCreator(win = window) {
+    const c = win.__FUNNEL__?.creator;
+    if (!c || typeof c !== 'object' || Array.isArray(c))
+        return null;
+    const { code, name, avatar_url } = c;
+    if (typeof code !== 'string' || !CODE.test(code) || typeof name !== 'string' || name === '')
+        return null;
+    return { code, name, avatar_url: typeof avatar_url === 'string' && avatar_url.startsWith('https://') ? avatar_url : null };
+}

package/dist/bucket.d.ts

@@ -0,0 +1,13 @@
+export declare const BUCKETS = 10000;
+export declare function fnv1a64(s: string): bigint;
+export declare function bucketOf(salt: string, visitor: string): number;
+export declare function pickArm<A extends {
+    weight: number;
+}>(arms: readonly A[], bucket: number): A | null;
+export declare function assignArm<A extends {
+    weight: number;
+}>(arms: readonly A[], salt: string, visitor: string): A | null;
+export declare function pickRange<R extends {
+    from: number;
+    to: number;
+}>(ranges: readonly R[], bucket: number): R | null;

package/dist/bucket.js

@@ -0,0 +1,41 @@
+// A/B assignment (spec 2026-10-20 «A/B» §2): bucket = FNV-1a 64 of the UTF-8 string "<salt>:<visitor_id>" mod 10000, the arm is
+// the first whose running sum of weights (basis points, in the order of arms) is above the bucket. The router assigns with this
+// file (edge/router/src/experiment.ts imports it); the server's Go copy must give the same buckets
+// (docs/superpowers/specs/2026-10-20-ab-bucket-vectors.json). No imports: the router bundles this file as it is.
+const OFFSET = 0xcbf29ce484222325n;
+const PRIME = 0x100000001b3n;
+const MASK = 0xffffffffffffffffn;
+const utf8 = new TextEncoder();
+export const BUCKETS = 10000;
+export function fnv1a64(s) {
+    let h = OFFSET;
+    for (const b of utf8.encode(s))
+        h = ((h ^ BigInt(b)) * PRIME) & MASK;
+    return h;
+}
+export function bucketOf(salt, visitor) {
+    return Number(fnv1a64(`${salt}:${visitor}`) % BigInt(BUCKETS));
+}
+// The arm the bucket falls in, or null when the weights add up to no more than the bucket (the server keeps the sum at 10000).
+export function pickArm(arms, bucket) {
+    let sum = 0;
+    for (const a of arms) {
+        sum += Number.isFinite(a.weight) && a.weight > 0 ? a.weight : 0;
+        if (bucket < sum)
+            return a;
+    }
+    return null;
+}
+export function assignArm(arms, salt, visitor) {
+    return pickArm(arms, bucketOf(salt, visitor));
+}
+// Layers (v2 track D): a layer gives the visitor one bucket, bucketOf(layer_salt, visitor), and each experiment of the layer owns a
+// range [from, to) of the 10000 buckets (the server allocates them when it starts an experiment). The key of the first range the
+// bucket falls in, or null when it falls in none (a gap: the visitor is in no experiment of the layer).
+// Shared vectors: docs/superpowers/specs/2026-10-24-ab-layer-vectors.json.
+export function pickRange(ranges, bucket) {
+    for (const r of ranges)
+        if (bucket >= r.from && bucket < r.to)
+            return r;
+    return null;
+}

package/dist/cli/args.d.ts

@@ -0,0 +1,5 @@
+declare function value(argv: string[], name: string): string | undefined;
+export declare function arg(argv: string[], name: string): string;
+export declare const opt: typeof value;
+export declare const flag: (argv: string[], name: string) => boolean;
+export {};

package/dist/cli/args.js

@@ -0,0 +1,18 @@
+// A flag with a value: `--name value`. A missing value or another flag in its place (`--dir --force`) is an error, never swallowed.
+function value(argv, name) {
+    const i = argv.indexOf('--' + name);
+    if (i < 0)
+        return undefined;
+    const v = argv[i + 1];
+    if (v === undefined || v.startsWith('--'))
+        throw new Error(`--${name} needs a value`);
+    return v;
+}
+export function arg(argv, name) {
+    const v = value(argv, name);
+    if (v === undefined)
+        throw new Error(`--${name} is required`);
+    return v;
+}
+export const opt = value;
+export const flag = (argv, name) => argv.includes('--' + name);

package/dist/cli/build.d.ts

@@ -0,0 +1,6 @@
+export declare function buildFunnel(root: string, slug: string, info: {
+    commit: string;
+    branch: string;
+}, opts?: {
+    warn?: (text: string) => void;
+}): Promise<string>;

package/dist/cli/build.js

@@ -0,0 +1,200 @@
+import { build } from 'vite';
+import react from '@vitejs/plugin-react';
+import { existsSync, mkdirSync, readdirSync, readFileSync, statSync, writeFileSync } from 'node:fs';
+import { isBuiltin } from 'node:module';
+import { join, relative } from 'node:path';
+import { fileURLToPath, pathToFileURL } from 'node:url';
+import { extractContent, extractPrerender, extractSteps } from './extract.js';
+import { check, formatLint, formatWarnings } from './lint.js';
+// The source files under dir, without node_modules; noTests also leaves out *.test.* and *.spec.* (functions/ may keep its tests
+// next to the code, and they are not part of the bundle).
+function sources(dir, noTests = false) {
+    if (!existsSync(dir))
+        return [];
+    return readdirSync(dir).flatMap(n => {
+        const p = join(dir, n);
+        if (statSync(p).isDirectory())
+            return n === 'node_modules' ? [] : sources(p, noTests);
+        return /\.(tsx?|jsx?)$/.test(n) && !(noTests && /\.(test|spec)\.[^.]+$/.test(n)) ? [p] : [];
+    });
+}
+const kitPackage = JSON.parse(readFileSync(new URL('../../package.json', import.meta.url), 'utf8'));
+const kitVersion = kitPackage.version;
+// The kit is @appright/funnelshift since 0.15.0 (Руслан 01.11: the product is FunnelShift); before it was @appright/funnel-kit. A
+// funnel's code may import either name: the old one is read as the new one everywhere below, so a project only renames its
+// dependency. KIT is the name of this very package, which the generated entries import.
+const KIT = kitPackage.name;
+const OLD_KIT = '@appright/funnel-kit';
+// An import of the kit (either name) with the given subpath, e.g. kitImport('/functions').
+const kitImport = (sub = '') => new RegExp(`^@appright\\/(funnelshift|funnel-kit)${sub.replace('/', '\\/')}$`);
+const MAX_FUNCTIONS_BUNDLE = 1 << 20; // the server's limit for _functions.js (spec §6)
+const MAX_FUNCTIONS = 64; // the server's limit for manifest.functions
+const FUNCTION_NAME = /^[a-z][a-z0-9_]{0,63}$/;
+// The kit's own functions module, next to this cli folder: dist/functions.js when installed, src/functions.ts when the tests
+// run the sources. The bundle always inlines this copy, so the marker read below and the helpers in _functions.js come from
+// the same kit version, whatever the project's node_modules hold.
+function kitFunctionsModule() {
+    for (const n of ['../functions.js', '../functions.ts']) {
+        const p = fileURLToPath(new URL(n, import.meta.url));
+        if (existsSync(p))
+            return p;
+    }
+    throw new Error(`funnelshift is missing its functions module (reinstall ${KIT})`);
+}
+// functions/index.ts (or .js) -> one self-contained ESM file for a Worker isolate (spec §3, §5): every import inlined, no node
+// builtins (an isolate has none), es2022. Vite's SSR build with ssr.target 'webworker' resolves packages with their worker/
+// browser conditions; it would quietly leave a builtin as an external import, so any import left in the chunk fails the build.
+async function bundleFunctions(root, entry) {
+    const rel = relative(root, entry);
+    const res = await build({
+        configFile: false, root, logLevel: 'error', publicDir: false,
+        resolve: { alias: [{ find: kitImport('/functions'), replacement: kitFunctionsModule() }] },
+        // Libraries branch on process.env.NODE_ENV, and `process` does not exist in the isolate.
+        define: { 'process.env.NODE_ENV': JSON.stringify('production') },
+        ssr: { noExternal: true, target: 'webworker' },
+        build: {
+            ssr: entry, write: false, minify: false, target: 'es2022', copyPublicDir: false, ssrManifest: false,
+            // No `//#region <path>` markers: they carry paths of the building machine, which would make the same code a different
+            // artifact on CI and on a laptop.
+            rolldownOptions: { experimental: { attachDebugInfo: 'none' }, output: { format: 'es', codeSplitting: false } },
+        },
+    });
+    const outputs = (Array.isArray(res) ? res : [res]).flatMap(r => 'output' in r ? r.output : []);
+    const chunks = outputs.filter(o => o.type === 'chunk');
+    if (chunks.length !== 1 || outputs.length !== 1) {
+        throw new Error(`${rel}: the functions bundle must be one JS file, got ${outputs.map(o => o.fileName).join(', ')}`);
+    }
+    const chunk = chunks[0];
+    const left = [...chunk.imports, ...chunk.dynamicImports];
+    if (left.length) {
+        const builtins = left.filter(m => m.startsWith('node:') || isBuiltin(m));
+        throw new Error(builtins.length
+            ? `${rel} needs node built-in modules (${builtins.join(', ')}): functions run in a Worker isolate without them; use fetch and Web APIs`
+            : `${rel}: the functions bundle still imports ${left.join(', ')}; every dependency must be bundled`);
+    }
+    const size = Buffer.byteLength(chunk.code);
+    if (size > MAX_FUNCTIONS_BUNDLE)
+        throw new Error(`${rel}: the functions bundle is ${size} bytes, the limit is ${MAX_FUNCTIONS_BUNDLE}`);
+    return chunk.code;
+}
+// A module of the kit itself (dist/<name>.js when installed, src/<name>.ts(x) when the tests run the sources): the prerender bundles
+// the kit's own copy and aliases the funnel's imports of the kit (either name) to it, so the funnel and the renderer share one
+// FunnelCtx whatever the project's node_modules hold.
+function kitModule(name) {
+    for (const n of [`../${name}.js`, `../${name}.tsx`, `../${name}.ts`]) {
+        const p = fileURLToPath(new URL(n, import.meta.url));
+        if (existsSync(p))
+            return p;
+    }
+    throw new Error(`funnelshift is missing its ${name} module (reinstall ${KIT})`);
+}
+// `prerender: true`: the landing step drawn at build time (react-dom/server) and put inside <div id="root"> of index.html, which the
+// kit hydrates (mount()). The funnel's code is bundled for Node and run once; a landing that touches window or document while it
+// renders fails the build with the error, so the author guards it (or turns prerender off).
+async function prerenderLanding(tmp, entry, slug, out) {
+    const ssrEntry = join(tmp, 'ssr.tsx');
+    writeFileSync(ssrEntry, `import funnel from '${relative(tmp, entry).replace(/\.tsx$/, '')}'\nimport { renderLanding } from '${KIT}/prerender'\nexport const render = () => renderLanding(funnel)\n`);
+    const ssrOut = join(tmp, 'ssr');
+    await build({
+        configFile: false, root: tmp, logLevel: 'error', publicDir: false, plugins: [react()],
+        resolve: { alias: [
+                { find: kitImport('/prerender'), replacement: kitModule('prerender') },
+                { find: kitImport(), replacement: kitModule('index') },
+            ] },
+        define: { 'process.env.NODE_ENV': JSON.stringify('production') },
+        ssr: { noExternal: [KIT, OLD_KIT] },
+        build: { ssr: ssrEntry, outDir: ssrOut, emptyOutDir: true, minify: false, target: 'node20', copyPublicDir: false,
+            rolldownOptions: { output: { format: 'es', codeSplitting: false, entryFileNames: 'ssr.mjs' } } },
+    });
+    let html;
+    try {
+        const mod = await import(pathToFileURL(join(ssrOut, 'ssr.mjs')).href + '?t=' + Date.now());
+        html = mod.render();
+    }
+    catch (e) {
+        throw new Error(`prerender of funnels/${slug} failed: ${e.message}\n` +
+            `The landing step is drawn once at build time in Node, without a window or a document: read the browser's objects in useEffect, ` +
+            `or remove "prerender: true" from defineFunnel().`);
+    }
+    const page = join(out, 'index.html');
+    const shell = readFileSync(page, 'utf8');
+    const marker = '<div id="root"></div>';
+    if (shell.split(marker).length !== 2)
+        throw new Error(`prerender: index.html of funnels/${slug} does not hold exactly one ${marker}`);
+    writeFileSync(page, shell.replace(marker, () => `<div id="root" data-prerendered="landing">${html}</div>`));
+}
+// The names come from the built module itself, the same object the router's host will call, so the manifest cannot drift
+// from the code. Importing runs the module's top level in Node, which also surfaces defineFunctions' name checks here.
+async function functionNames(file, rel) {
+    let mod;
+    try {
+        mod = await import(pathToFileURL(file).href + '?t=' + Date.now());
+    }
+    catch (e) {
+        throw new Error(`${rel} failed to load: ${e.message}`);
+    }
+    const def = mod?.default;
+    if (!def || def.__funnelFunctions !== 1 || !def.functions || typeof def.functions !== 'object') {
+        throw new Error(`${rel} must \`export default defineFunctions({...})\` from '${KIT}/functions'`);
+    }
+    const names = Object.keys(def.functions).sort();
+    const bad = names.filter(n => !FUNCTION_NAME.test(n) || typeof def.functions[n] !== 'function');
+    if (bad.length)
+        throw new Error(`${rel}: bad functions ${bad.join(', ')} (names match ${FUNCTION_NAME.source}, values are functions)`);
+    if (!names.length)
+        throw new Error(`${rel}: defineFunctions({}) has no functions; remove the functions folder instead`);
+    if (names.length > MAX_FUNCTIONS)
+        throw new Error(`${rel}: ${names.length} functions, the limit is ${MAX_FUNCTIONS}`);
+    return names;
+}
+// warn gets the lint warnings as one text (console.warn by default, so stdout keeps only the output path); they never stop the build.
+export async function buildFunnel(root, slug, info, opts = {}) {
+    const entry = join(root, 'funnels', slug, 'index.tsx');
+    if (!existsSync(entry))
+        throw new Error(`no funnels/${slug}/index.tsx`);
+    const read = (p) => ({ path: relative(root, p), code: readFileSync(p, 'utf8') });
+    const srcs = [...sources(join(root, 'funnels', slug)), ...sources(join(root, 'components'))].map(read);
+    // functions/ is checked for its event names only (lint's own scope); its texts are not the funnel's content.
+    const { errors, warnings } = check([...srcs, ...sources(join(root, 'functions'), true).map(read)]);
+    if (warnings.length)
+        (opts.warn ?? console.warn)(formatWarnings(warnings));
+    if (errors.length)
+        throw new Error(formatLint(errors));
+    const content = extractContent(srcs);
+    const steps = extractSteps(srcs);
+    const prerender = extractPrerender(srcs);
+    if (prerender && steps[0]?.role !== 'landing') {
+        throw new Error(`funnels/${slug}: prerender: true draws the landing step into index.html, so the first step needs role: 'landing'`);
+    }
+    const tmp = join(root, '.funnel-kit', slug);
+    mkdirSync(tmp, { recursive: true });
+    // The blocks stylesheet goes first: theme.css comes later and overrides its --fk-* variables.
+    const theme = existsSync(join(root, 'theme.css')) ? `import '${relative(tmp, join(root, 'theme.css'))}'\n` : '';
+    writeFileSync(join(tmp, 'main.tsx'), `import '${KIT}/blocks.css'\n${theme}import { mount } from '${KIT}'\nimport funnel from '${relative(tmp, entry).replace(/\.tsx$/, '')}'\nmount(funnel)\n`);
+    writeFileSync(join(tmp, 'index.html'), `<!doctype html><html><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1,viewport-fit=cover"></head>` +
+        `<body><div id="root"></div><script type="module" src="./main.tsx"></script></body></html>`);
+    // Functions are bundled and checked before the page build, so a broken functions/ leaves no half-built dist behind; the file
+    // is copied in afterwards because the page build empties the out dir.
+    const fnEntry = ['index.ts', 'index.js'].map(n => join(root, 'functions', n)).find(p => existsSync(p));
+    let fn;
+    if (fnEntry) {
+        const code = await bundleFunctions(root, fnEntry);
+        const staged = join(tmp, '_functions.js');
+        writeFileSync(staged, code);
+        fn = { code, names: await functionNames(staged, relative(root, fnEntry)) };
+    }
+    const out = join(root, 'dist', slug);
+    // the funnel's imports of the old name resolve to the installed kit
+    await build({ root: tmp, base: './', logLevel: 'warn', plugins: [react()], resolve: { alias: [{ find: /^@appright\/funnel-kit(?=\/|$)/, replacement: KIT }] },
+        build: { outDir: out, emptyOutDir: true } });
+    if (prerender)
+        await prerenderLanding(tmp, entry, slug, out);
+    if (fn)
+        writeFileSync(join(out, '_functions.js'), fn.code);
+    writeFileSync(join(out, 'manifest.json'), JSON.stringify({
+        funnel: slug, kit_version: kitVersion, built_at: new Date().toISOString(), commit: info.commit, branch: info.branch, steps, content,
+        ...(prerender ? { prerender: true } : {}),
+        ...(fn ? { functions: fn.names } : {}),
+    }, null, 2));
+    return out;
+}

package/dist/cli/extract.d.ts

@@ -0,0 +1,32 @@
+import { type StepRole } from '../nav.js';
+type Item = {
+    key: string;
+    default: string;
+};
+export declare function literal(n: any): string | null;
+export declare function walk(node: any, visit: (n: any) => void): void;
+export declare function parseSource(f: {
+    path: string;
+    code: string;
+}): {
+    program: any;
+};
+export declare function extractContent(files: {
+    path: string;
+    code: string;
+}[]): Item[];
+type Src = {
+    path: string;
+    code: string;
+};
+export type ManifestStep = {
+    id: string;
+    role?: StepRole;
+    sensitive?: true;
+    conditional?: true;
+    when_keys?: string[];
+};
+export declare function whenKeys(fn: any): string[] | null;
+export declare function extractSteps(files: Src[]): ManifestStep[];
+export declare function extractPrerender(files: Src[]): boolean;
+export {};