ui-components

One Rust definition per component, rendered twice on every page: the real web component beside the same element in a terminal. Slide the width, flip the theme, resize the window; both variants respond.

demo

The composed form: every input around one state object, shared across panes and browser tabs.

<app-root>: The form

Every input in one component around one state object: commits trickle up, state trickles down, and browser tabs share it.

components

One page per catalog component: the web component beside the same element in a terminal.

<input-date>: Date input

Partial dates complete themselves; the calendar and zone list open on F4.

<input-date-range>: Date range

Two dates, one interval: the end never precedes the start.

<input-text>: Text input

A single line, trimmed on commit; empty becomes null.

<input-number>: Number input

Locale-tolerant decimals with a unit suffix.

<input-textarea>: Textarea

Grows with its content up to max-lines; commits on leave.

<input-select>: Select

Options are data rows, not markup; empty commits null once a default is set.

<input-timezone>: Time zone

The platform zone list behind the select, UTC first.

<input-suggestion>: Suggestion

Typeahead over rows the page answers from an editable word pool; both panes query the same source.

<nav-tabs>: Tabs

A value-backed tab bar; the panes stay the host's job.

<uic-tree>: Tree

An expandable tree over nested rows; the collapse markers are generated content, drawn and rotated by the stylesheet in both targets.

<nav-breadcrumb>: Breadcrumb

A static trail from data rows; dividers are data, not CSS.

examples

Maintained end-to-end examples: foreign npm elements in both panes, the terminal side on the browser's own engine in a worker.

<json-viewer>: Foreign element: json-viewer

A third-party npm lit element, byte-unmodified in both panes: the real lit in the browser, the browser's own engine in a worker for the terminal, its stylesheet parsed into the cascade.

apps

A hand-written Lit app around the same runtime, deployed beside this gallery (locally: cargo run -p uic_lit_demo -- serve).

<todo-app>: pair two browsers over WebRTC

The lit-todo app with symmetric link pairing: each side sends one link (QR, message or paste) and both connect, with no server carrying state or signaling.