Back to Overview

Browse the shared ViewNode primitive catalog and building blocks.

View library

Components

The ViewNode vocabulary every CRE8 surface renders. Each primitive declares one contract; the server, the browser, the terminal and native shells project it.

Primitives
76
Shared writer
55 of 76
Categories
8
Style recipes
4

Layout

14 components · Pages, sections and containers that give a view its structure.

AppShell

Top-level layout composer with optional Nav, Sidebar, Drawer, Footer slots and a main content area. Slots stored as named children (slot=nav|sidebar|drawer|footer).

Shared writerweb · runtime-node

AttentionScope

Inert SSR wrapper that marks a view region for opt-in attention aggregation.

Shared writerweb · native · runtime-node

Card

Section-like surface with optional title, badge, and body slots.

Shared writerweb · native · runtime-node

Container

Constrained grouping primitive with no intrinsic meaning.

Shared writerweb · native · runtime-node

DetailHostFrame

Detail-pane shell with header (title/subtitle/back), scrollable body, and optional footer.

Legacy writerweb

Divider

Visual separator between sections. Variants: line, dots, space.

Shared writerweb

List

Ordered or unordered collection display.

Shared writerweb · native · runtime-node

ListItem

List child with optional icon, title, subtitle, and body.

Shared writerweb · native · runtime-node

LiveSlot

Progressive SSR slot with meaningful fallback children and optional live patch transport.

Shared writerweb · native · runtime-node

Page

Top-level document landmark for a runtime-rendered view.

Shared writerweb · native · runtime-node

RoomScope

Inert SSR wrapper that places a view region inside an ephemeral live room.

Shared writerweb · native · runtime-node

Row

Inline layout primitive for small groups of related children.

Shared writerweb · native · runtime-node

Section

Semantic <section> grouping primitive. Accepts a `variant` prop that emits a BEM modifier class (e.g. primitive-section--hero) so recipes can compose section-level layouts without dedicated renderers.

Shared writerweb · native · runtime-node

SplitPreview

Two-pane preview grid (left visual / right info) with a static placeholder class for loading states.

Legacy writerweb

Content

5 components · Text, cards and media that carry the record itself.

Icon

Named symbolic glyph that inherits text color and can be decorative or labelled.

Shared writerweb · native · runtime-node

ImgSlot

Image placeholder with optional tag and dimensions overlay.

Shared writerweb · runtime-node

InfoCard

Small bordered card with optional uppercase eyebrow, strong title, and body content.

Legacy writerweb

MediaPlayer

Server-rendered <audio>/<video> mount with placeholder, aspect, and HLS/MJPEG enhancement via window.CRE8_MEDIA.

Shared writerweb · runtime-node

Text

Text span that can carry semantic tone without a visual dependency.

Shared writerweb · native · runtime-node

Visualization

3 components · Charts, graphs and scenes drawn from series and topology.

ClientIsland

SSR fallback shell for browser-only components loaded from a client bundle.

Shared writerweb · runtime-node · canvas

VirtualSceneWorkbench

Scene viewport, hierarchy, and inspector for durable Virtual scene documents.

Legacy writerweb

VirtualWorldCanvas

WebGPU world renderer for virtual entities. Auto-detects WASM or HTTP data source.

Legacy writerweb