Live Demos

Each demo is a real feature app on its own origin, embedded here through its generated shell. The centered card is live; browse by dragging, scrolling, the arrow keys, or the side dial on portrait screens.

Clock

A luxury timepiece coin: navy sunburst dial on one face, a steel case-back LCD on the other. Spin it: the resting face is the clock’s format, and every flip is contract traffic.

Vue 3 feature · React hostboundary: cross-site

Source:Feature app (Vue) ↗Contract ↗Host embed (React) ↗Host console ↗

Host console (Clock)

session: connectingdirty: cleancontract 0.3.0 · protocol v1

Everything below drives the centered clock’s real session — the same wire the article describes: liveness states, dirty reports, correlated requests, polite teardown, contract-declared display modes, and a handshake denial.

center a live demo card to attach the console

Live Demos

Clock

Heartbeat

Koi Pond

Chess

Events

File Share

Views

Clock

Host console (Clock)