Reference: Node Fields (what compile() reads)
Generated for
@chainrender/client0.21.0 — these are the fields its compile() reads, exactly. Using another version? Check yours withnpm 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- |
|
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,haspopupbutton.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.
argValuesonslotandimage(an object): the resolver args typed in the builder, by name; the builder encodes them intoargat export.image.scene(an object, on an image whosebindisp5orthree): the rich-media sketch that runs above the on-chain floor. Its fields are below.pinnedDepon the root node (an object): the pinned-dependency declarationgrade()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.