What the wizard writes
The tree the wizard leaves on disk, why the design system and the API client are copied in as source, and what that costs you.
Nothing in the project's package.json points back at our repository. That is deliberate, and
everything below follows from it: the design system, the API client and the proxy are copied in
as source, so nothing we publish can break your app — and an upgrade is a re-run of the wizard
or a diff you apply yourself, never npm update.
The tree
src/modules/<id>/— one directory per module you picked, each mounting as its own root.index.tsbeside them is the registry, generated from what you chose;navGroups.tsxis the sidebar's grouping table, filtered to the same set.src/vendor/ui— the design system, imported as~ui.src/vendor/api— the typed GraphQL client, imported as~api. Both aliases are declared invite.config.tsandtsconfig.json.vendor/chatfuel-proxy— one proxy source tree with three hosts. In development it runs as a Vite plugin inside the dev server;server/entry.tsis the Node HTTP server that also serves the built client;api/chatfuel.tsis the Vercel function behind a rewrite. All three share the request handling, the WebSocket relay and the log scrubber..env— your Chatfuel token, the workspace id, the app's name and mark. Written with mode0600, with.env.examplebeside it as the readable list of what the app takes..claude/skills/chatfuel-<id>/(Codex:.agents/skills/chatfuel-<id>/) — one skill per installed module, each carrying that module's operations and the edges of the API behind it.CLAUDE.md(Codex:AGENTS.md) is the instructions file, with each module's handoff note inlined into it.supabase/— only when you installauth. The migrations for the tenant tables and forcf_my_bot_ids(), the function the proxy's gate asks which bots a session may open.public/logo.svgis the markVITE_APP_LOGOpoints at. Replace that one file and the app is marked; point the variable elsewhere to use a different name or an absolute URL.Dockerfileandscripts/deploy-vercel.mjsare the two production paths that ship with the app. Deploy covers both.
Nothing you did not pick
Scaffolding is subtractive. The wizard copies apps/shell whole, deletes the modules you did
not choose, regenerates the registry, filters the navigation table and prunes the tsconfig
paths that no longer resolve.
So a module you left out leaves no dead import, no commented-out route and no tsconfig path
pointing at nothing. What you get is not a template with holes in it — it is a project where the
code you did not ask for was never written. Adding one later is a re-run with --embed.
Vendored, not depended on
| In our repository | In your app | Imported as |
|---|---|---|
packages/ui/src | src/vendor/ui | ~ui |
packages/api-client/src | src/vendor/api | ~api |
packages/vite-plugin-proxy/src | vendor/chatfuel-proxy | relative paths |
Two rules keep those trees portable, and pnpm validate in our repository enforces both: every
internal import is relative, and ~ui may import nothing but react and react-dom. Break
either upstream and the tree stops being copyable.
The copy is not quite byte-for-byte: the packages' own unit tests are filtered out, because those tests are ours and shipping them would hand you failing runs for code you did not write.
What it costs you: when we fix something in ~ui, your copy does not change. Re-run the wizard
into a scratch directory and diff, or take the patch from the repository. In exchange, a
component you disagree with is a file you can edit, and a release of ours cannot break a
deployment of yours.
Standalone, or into a project you already have
npx @chatfuel/wizardThe default. You get the tree above: a Vite + React + TypeScript app, its dependencies
installed, .env written, skills in place, and npm run dev ready to run.
Next: your first change, or deploy.