⚠️ Alpha · testnets only. ChainRender is in active alpha and deployed on testnets only — Ethereum Sepolia, the Robinhood Chain Testnet, and the Circle Arc Testnet — not on any mainnet. Contracts, addresses, and APIs may change. Do not use with real funds or production assets.
Reference

Reference: Node Fields (what compile() reads)

Generated for @chainrender/client 0.21.0 — these are the fields its compile() reads, exactly. Using another version? Check yours with npm ls @chainrender/client.

Every field the compiler encodes, per node type. It is generated from chainc/node-schema.ts — the same table behind nodeJsonSchema(), checkNode(), vocabulary().nodeTypes and the MCP chainrender_check_node tool. That table is drift-locked to compile() in both directions: the TypeScript build fails if the compiler's node type gains a field the table doesn't list, and test/node-schema.ts changes every listed field and checks the compiled bytes change.

Why check a tree before compiling. compile() is lenient on purpose: it silently drops anything it doesn't read — an unknown field, a misspelled enum value (direction: "vertical", role: "note"), a11y fields on an image, args on a batch member. The tree still compiles, and the component ships without what was written. checkNode(tree) reports each of those with its path. See The Vocabulary.

Value kinds: address = 0x + 20 bytes · bytes32 = 0x + 32 bytes · hex = 0x + whole bytes · arg = hex bytes when resolver is set, otherwise free text for a client hook · integer = whole number ≥ 1 · number|string = a positive number or the same as a decimal string · record = a string-keyed map.

text

Field Value Required Note
content string
children node[]

Also takes the accessibility fields and the behaviour fields (below).

box

Field Value Required Note
direction one of row, column
children node[]

Also takes the accessibility fields and the behaviour fields (below).

button

Field Value Required Note
variant one of primary, secondary, ghost, danger
content string
children node[]
action object declared submit — gated by the enforcer (R3-R6); the label is never a guarantee on its own
action.to address
action.sig string yes function signature, e.g. "mint(uint256)"
action.value string wei, decimal string
action.args string template the client fills, e.g. "$amount,0xSpender"
batch object[] atomic multi-action under one signature; requires BATCH_EXECUTE, each member gated individually; '|' and ';' are stripped from member fields
batch[].to address yes
batch[].sig string yes
batch[].value string wei, decimal string; defaults to 0
batch[].label string consent-list label; defaults to sig
sign object EIP-712 typed-data signature; requires SIGN_MESSAGE; decoded before signing, never a blind hex sign
sign.domain object yes
sign.domain.name string
sign.domain.version string
sign.domain.chainId integer
sign.domain.verifyingContract address
sign.primaryType string yes
sign.types record yes
sign.message record yes

Also takes the accessibility fields and the behaviour fields (below).

input

Field Value Required Note
inputType one of text, number, password, search
placeholder string
content string
name string what $name in a button's action args is filled from (data-cr-name)

Also takes the accessibility fields and the behaviour fields (below).

icon

Field Value Required Note
name string

Also takes the accessibility fields and the behaviour fields (below).

link

Field Value Required Note
href string
content string
children node[]

Also takes the accessibility fields and the behaviour fields (below).

slot

Field Value Required Note
bind string yes the resolver kind (e.g. "ensText") or a client hook name
resolver address on-chain resolver; resolved during render
arg arg 0x-hex resolver args when resolver is set (encode per the kind's descriptor); otherwise a display string a client hook reads
content string fallback text

Also takes the accessibility fields and the behaviour fields (below).

image

Field Value Required Note
bind string
resolver address
arg arg 0x-hex resolver args when resolver is set (encode per the kind's descriptor); otherwise a display string a client hook reads
alt string the image's accessible text (images take no role/label)
provenance one of inline-vector, computed, onchain-blob, hash-pointer, external, onchain-vector-nft, computed-gpu

Also takes the behaviour fields (below).

Images take no role/label/ARIA fields — alt is the image's accessible text. Those fields are dropped by compile() and reported by checkNode().

ref

Field Value Required Note
hash bytes32 yes ComponentRegistry content hash

A ref takes only type and hash.

Accessibility fields

On every element type except image and ref.

Field Value Required Note
role one of button, textbox, link, img, group, heading, tablist, tab, tabpanel, switch, dialog, listbox, option, radiogroup, radio, menu, menuitem, checkbox, region, alert, status, separator, tooltip, alertdialog, article, banner, blockquote, caption, cell, code, columnheader, combobox, complementary, contentinfo, definition, deletion, document, emphasis, feed, figure, form, grid, gridcell, insertion, list, listitem, log, main, marquee, math, menubar, menuitemcheckbox, menuitemradio, meter, navigation, note, paragraph, progressbar, row, rowgroup, rowheader, scrollbar, search, searchbox, slider, spinbutton, strong, subscript, superscript, table, term, time, timer, toolbar, tree, treegrid, treeitem ARIA role; tablist..separator opt the component into format V3, tooltip into V4
label string aria-label
state object one ARIA state, emitted as aria-; opts into V3
state.name one of selected, checked, expanded, modal, current, disabled, pressed yes
state.value bool yes
id string element id for relationships; opts into V3
controls string aria-controls target id; opts into V3
describedby string aria-describedby target id; opts into V4
labelledby string aria-labelledby target id; opts into V4
activedescendant string aria-activedescendant target id; opts into V4
haspopup string aria-haspopup token ("menu" | "dialog" | ...); opts into V4

Presentation fields (VERSION_5, Enhanced mode)

docs/202. Read by compile(tree, { mode: "enhanced" }) only; the default (classic) drops them and checkNode() reports each as mode. Any of them opts the component into format VERSION_5, which renders only where the chain's RenderRouter has the V5 interpreter. What each style value means is on Style Tokens.

text

Field Value Required Note
size one of xs, sm, md, lg, xl, 2xl the type scale, relative to the theme's body size
weight one of regular, medium, bold font weight
tone one of default, muted, primary, success, warning, danger, info text colour from the theme palette, contrast-checked (AA) on every built-in theme
talign one of start, center, end text alignment (logical: start/end flip in right-to-left)
mono one of mono the theme's monospace font (addresses, hashes, code)
nums one of tabular tabular figures: digits line up in columns
badge one of neutral, primary, success, warning, danger, info a pill for a status or a count ("ACTIVE", "14")
marker one of dot-default, dot-muted, dot-primary, dot-success, dot-warning, dot-danger, dot-info, ring-default, ring-muted, ring-primary, ring-success, ring-warning, ring-danger, ring-info, bar-default, bar-muted, bar-primary, bar-success, bar-warning, bar-danger, bar-info a decorative shape before the content (legends, coloured row markers): dot / ring / bar in a tone. Never text.
style styleList raw style tokens for what the family fields do not name yet; an unknown token is inert
hints hints viewer-only presentation help (argnames, units, unitname, format, playback); never changes what is signed or read
lang lang the language of this node and its children (BCP-47, e.g. "en", "ar", "pt-BR")
dir one of ltr, rtl, auto text direction; rtl for Arabic / Hebrew
level level a heading's level 1..6 (aria-level); use with role "heading"

box

Field Value Required Note
layout one of stack, row, grid, flow, split how a box arranges its children: stack (column), row, grid (responsive: see mincol), flow (wrapping row, as LayoutRenderer's FLOW), split (two ends pushed apart)
gap one of none, xs, sm, md, lg, xl space between a box's children (theme spacing scale)
pad one of none, xs, sm, md, lg, xl space inside a box (theme spacing scale)
align one of start, center, end, stretch, baseline cross-axis alignment of a box's children
justify one of start, center, end, between, around main-axis distribution of a box's children
wrap one of wrap, nowrap whether a row's children wrap
mincol one of xs, sm, md, lg a grid's minimum column width: the grid fits as many columns as the space allows, one on a phone
collapse one of sm, md, lg a row becomes a column when the app is narrower than the theme breakpoint sm 480px / md 768px / lg 1024px (container query on the app)
surface one of none, card, inset, outline, band panel chrome from the theme: card (raised), inset (sunken), outline, band (full-width strip)
width one of full, readable, narrow full width, a readable measure (about 70 characters) or narrow (about 40)
scroll one of sm, md, lg a panel that scrolls on its own (16 / 28 / 44 rem tall). Give the box role "region" and a label; nothing is hidden, everything stays reachable by scrolling
divider one of before, after a rule above (before) or below (after) a section
tone one of default, muted, primary, success, warning, danger, info text colour from the theme palette, contrast-checked (AA) on every built-in theme
talign one of start, center, end text alignment (logical: start/end flip in right-to-left)
marker one of dot-default, dot-muted, dot-primary, dot-success, dot-warning, dot-danger, dot-info, ring-default, ring-muted, ring-primary, ring-success, ring-warning, ring-danger, ring-info, bar-default, bar-muted, bar-primary, bar-success, bar-warning, bar-danger, bar-info a decorative shape before the content (legends, coloured row markers): dot / ring / bar in a tone. Never text.
style styleList raw style tokens for what the family fields do not name yet; an unknown token is inert
hints hints viewer-only presentation help (argnames, units, unitname, format, playback); never changes what is signed or read
lang lang the language of this node and its children (BCP-47, e.g. "en", "ar", "pt-BR")
dir one of ltr, rtl, auto text direction; rtl for Arabic / Hebrew
level level a heading's level 1..6 (aria-level); use with role "heading"

button

Field Value Required Note
size one of xs, sm, md, lg, xl, 2xl the type scale, relative to the theme's body size
style styleList raw style tokens for what the family fields do not name yet; an unknown token is inert
hints hints viewer-only presentation help (argnames, units, unitname, format, playback); never changes what is signed or read
lang lang the language of this node and its children (BCP-47, e.g. "en", "ar", "pt-BR")
dir one of ltr, rtl, auto text direction; rtl for Arabic / Hebrew
level level a heading's level 1..6 (aria-level); use with role "heading"

input

Field Value Required Note
style styleList raw style tokens for what the family fields do not name yet; an unknown token is inert
hints hints viewer-only presentation help (argnames, units, unitname, format, playback); never changes what is signed or read
lang lang the language of this node and its children (BCP-47, e.g. "en", "ar", "pt-BR")
dir one of ltr, rtl, auto text direction; rtl for Arabic / Hebrew
level level a heading's level 1..6 (aria-level); use with role "heading"

icon

Field Value Required Note
tone one of default, muted, primary, success, warning, danger, info text colour from the theme palette, contrast-checked (AA) on every built-in theme
style styleList raw style tokens for what the family fields do not name yet; an unknown token is inert
hints hints viewer-only presentation help (argnames, units, unitname, format, playback); never changes what is signed or read
lang lang the language of this node and its children (BCP-47, e.g. "en", "ar", "pt-BR")
dir one of ltr, rtl, auto text direction; rtl for Arabic / Hebrew
level level a heading's level 1..6 (aria-level); use with role "heading"

link

Field Value Required Note
size one of xs, sm, md, lg, xl, 2xl the type scale, relative to the theme's body size
weight one of regular, medium, bold font weight
style styleList raw style tokens for what the family fields do not name yet; an unknown token is inert
hints hints viewer-only presentation help (argnames, units, unitname, format, playback); never changes what is signed or read
lang lang the language of this node and its children (BCP-47, e.g. "en", "ar", "pt-BR")
dir one of ltr, rtl, auto text direction; rtl for Arabic / Hebrew
level level a heading's level 1..6 (aria-level); use with role "heading"

slot

Field Value Required Note
size one of xs, sm, md, lg, xl, 2xl the type scale, relative to the theme's body size
weight one of regular, medium, bold font weight
tone one of default, muted, primary, success, warning, danger, info text colour from the theme palette, contrast-checked (AA) on every built-in theme
mono one of mono the theme's monospace font (addresses, hashes, code)
nums one of tabular tabular figures: digits line up in columns
badge one of neutral, primary, success, warning, danger, info a pill for a status or a count ("ACTIVE", "14")
marker one of dot-default, dot-muted, dot-primary, dot-success, dot-warning, dot-danger, dot-info, ring-default, ring-muted, ring-primary, ring-success, ring-warning, ring-danger, ring-info, bar-default, bar-muted, bar-primary, bar-success, bar-warning, bar-danger, bar-info a decorative shape before the content (legends, coloured row markers): dot / ring / bar in a tone. Never text.
style styleList raw style tokens for what the family fields do not name yet; an unknown token is inert
hints hints viewer-only presentation help (argnames, units, unitname, format, playback); never changes what is signed or read
lang lang the language of this node and its children (BCP-47, e.g. "en", "ar", "pt-BR")
dir one of ltr, rtl, auto text direction; rtl for Arabic / Hebrew
level level a heading's level 1..6 (aria-level); use with role "heading"

image

Field Value Required Note
media one of icon, avatar, thumb, card, full image size: icon (the theme's icon size), avatar (40px round), thumb (96px), card (up to 320px), full (the container's width)
style styleList raw style tokens for what the family fields do not name yet; an unknown token is inert
hints hints viewer-only presentation help (argnames, units, unitname, format, playback); never changes what is signed or read
lang lang the language of this node and its children (BCP-47, e.g. "en", "ar", "pt-BR")
dir one of ltr, rtl, auto text direction; rtl for Arabic / Hebrew

Behaviour fields

On every element type except ref (images included).

Field Value Required Note
cond object render only when one resolver read matches; fail-closed
cond.resolver address yes
cond.bind string yes
cond.arg hex
cond.equals string omit for a truthy test
cond.not bool
step object a button's 1-based position in a state-driven flow (labels progress only)
step.index integer yes
step.total integer yes
anim object bounded declarative animation (no script)
anim.kind one of fade, pulse, spin, slide, blink, breathe yes
anim.duration `number string`
anim.repeat one of once, infinite defaults to infinite
live bool viewer re-reads this element on new blocks (real chain state, never a stream)

Fields compile() ignores

Allowed by the TypeScript type but never encoded; checkNode() reports them as ignored-field:

  • image: role, label, state, id, controls, describedby, labelledby, activedescendant, haspopup
  • button.batch[]: args

Builder authoring fields

Read by the visual builder and grade(), never by compile(). checkNode(tree) reports them as authoring-field; checkNode(tree, { authoring: true }) and nodeJsonSchema({ authoring: true }) accept them.

  • argValues on slot and image (an object): the resolver args typed in the builder, by name; the builder encodes them into arg at export.
  • image.scene (an object, on an image whose bind is p5 or three): the rich-media sketch that runs above the on-chain floor. Its fields are below.
  • pinnedDep on the root node (an object): the pinned-dependency declaration grade() reads (Grade B).
  • Any key starting with _ (for example _multiview, _view, _mvId): design-time metadata such as multi-view tabs.

image.scene (rich-media sketch)

An image becomes a rich-media app when its bind is p5 or three and it carries a scene. checkNode(tree, { authoring: true }) checks these exact fields (unknown keys are reported), the p5/three bind, and that libHash is not the zero hash. An empty string means "not set" for seed, libHash and entry. At deploy the builder uploads source to SourceStore (chunked when large) and registers a scene in SceneComponentRegistry: floor = SceneFloor's sigilFloor(seed), binding = encodeSceneBinding({ libHash, seed, entry: <SourceStore id>, meta }). The app is labelled ⚙ Above-floor; grade(tree) returns the floor's letter plus aboveFloor. See Rich Media: p5.js & three.js.

Field Value Required Note
source string yes the p5/three sketch code to run above the floor (p5 global mode / three via the global THREE, never import). Uploaded to SourceStore at deploy; it becomes the binding's entry.
seed bytes32 bytes32, the sketch's ONLY entropy source (exposed to the sketch as CR_SEED). Empty = the builder's default 0x…01. Anything the app claims the seed determines must actually read it.
libHash bytes32 DependencyRegistry content hash of the on-chain p5/three library. Empty = the builder discovers the deployed library by name. The zero hash is the canvas-only tier: a p5 or three sketch would have no library.
entry string leave empty: at deploy the builder sets the binding's entry to the SourceStore id of source.
mobile bool CR-Stage mobile-ready full page in the viewer (default true)

Limits

  • At most 1024 nodes and depth 64 (the interpreter's bounds).
  • At most 255 children and 255 attributes on one node.
  • Each literal value at most 65535 UTF-8 bytes.