Function: render()

function render<T>(
   ctx: Context, 
   element: Block, 
options?: RenderOptions): RenderSession<T>;

Defined in: src/renderer/render.ts:890

Render a Block tree into the browser page.

This is the default entry point for skills using Puppeteer. For other targets, use createRender with a custom adapter.

Type Parameters

Type Parameter	Default type
T	any

Parameters

Parameter	Type	Description
ctx	Context	The SDK context (provides the browser page).
element	Block	A Block tree (from block functions or callable component refs).
options?	RenderOptions	Optional settings (e.g. { sessionId } for shared state).

Returns

RenderSession<T>

A thenable session.

Example

const { data } = await render(ctx, Bubble([
  Input({ name: 'email', validate: async ({ value }) => value.includes('@') ? false : 'Invalid' }),
  NavigationBar({ buttons: [{ label: 'Submit', value: 'submit' }] }),
]));

// Shared state between two UIs
const s1 = render(ctx, FormUI());
const s2 = render(ctx, StatusUI(), { sessionId: s1.sessionId });