building-canvases

Resolve the target canvas with canvas-list or create one with canvas-create in the task's channel, then edit the project source, validate with canvas-validate-create, and publish with canvas-publish-create or stage a draft with canvas-draft-create. Poll canvas-builds-retrieve until the build is ready.

Use React + Quill for dashboards, forms, tools, and anything that should look native to PostHog. Use plain HTML and browser APIs for documents, generative graphics, and WebGL experiments where application components add no structure. The two approaches can be mixed.

Canvases read PostHog data through the ph SDK, preferring saved insights loaded by short id, with support for ad-hoc inline queries, variables, and date ranges. Every ph call must be declared in project.capabilities or validation rejects it and the host blocks it at runtime.

Yes, ph.state provides durable key-value memory with user or shared scope, and ph.actions.invoke performs write actions as the viewer when wired to explicit clicks. Both must be declared in capabilities, and state values are capped at 64 KB with 256 keys per scope.

Use composing-grid-canvases when the target is a grid or home canvas, a widget placement, or a reusable component, since it owns the store search, configure, fork, and layout patch flow. building-canvases owns standalone freeform canvas apps only.

Validation fails when the image origin is not declared in project.capabilities.network.origins, since the published artifact's Content Security Policy depends on that declaration. Upload images through the media library flow and add the returned URL's exact origin to the capabilities.