web

js/ui/web.ts

fino:ui/web — server-driven HTML views for fino:net/http/app.

This module renders fino:ui VNodes into real HTML pages and handles form actions by rehydrating durable view snapshots. It is intentionally hypermedia-first: forms keep real action and method attributes, enhanced requests receive short-lived SSE patch streams, and plain browser submits use POST-redirect-GET.

import { App } from 'fino:net/http/app';
import { h, Signal } from 'fino:ui';
import { page, view, webUI } from 'fino:ui/web';
import { InMemoryViewStore } from 'fino:ui/web/state';

const app = new App();
const ui = app.layer(webUI({ store: new InMemoryViewStore(), secret: 'dev-secret' }));
ui.get('/').handle(page(() => h('main', null, 'Hello')));

Interfaces

`interface WebUIOptions {`

Properties

`store: ViewStateStore`

Durable snapshot store used for view state.

`secret: string`

Secret used to seal CSRF tokens and sealed embedded state.

`ttlMs?: number`

Snapshot lifetime in milliseconds. Defaults to one hour.

`interface ViewDefinition {`

Definition passed to view().

Properties

`id: string`

Stable id used in action URLs and stored snapshots.

`state: () => StateRecord`

Factory called for each render or action event to create fresh signals.

`embed?: EmbedSpec[]`

Signal keys carried in HTML instead of the snapshot.

`actions?: Record<string, { handler: ActionHandler; stale?: 'reject' | 'rebase'; }>`

Server actions addressable from rendered forms.

`render: ViewRender`

Render function for the view's current state.

Functions

`function view(def: ViewDefinition): ServerView`

Create a server-driven view definition.

`function clientScriptPath(): string`

Return the content-hashed browser runtime path served by webUI().

`function webUI(options: WebUIOptions): LayerMiddleware`

Middleware that installs server-driven UI handling for an App.

`function page(render: (ctx: HttpContext) => VNode): Handler`

Create a page route handler that renders VNodes to a full HTML response.