Props

Overview

This page covers the props fields of each control type / semantic group, and the props leaf fields that bindings can target. Public JSON uses camelCase; bindings keys also use public camelCase dotted paths.

This page does not cover layout / placement / style / events / animations. See their respective pages.

General Rules

Public JSON uses explicit props fields:

Props field	Applicable control types	Subdocument
`commonProps`	All control types	Commonprops
`labelProps`	`label` / `checkbox`	Labelprops
`imageProps`	`image`	Imageprops
`textInputProps`	`textInput`	Textinputprops
`rangeProps`	`slider` / `progressBar` / `arc`	Rangeprops
`toggleProps`	`switch` / `checkbox`	Toggleprops
`dropdownProps`	`dropdown`	Dropdownprops
`tableProps`	`table`	Tableprops
`lineProps`	`line`	Lineprops
`keyboardProps`	`keyboard`	Keyboardprops
`canvasProps`	`canvas`	Canvasprops
`frameViewProps`	`frameView`	Frameviewprops

Subdocument

Binding Path

To bind props, bindings must use a public camelCase dotted path, for example:

"bindings": {
    "labelProps.text": "status",
    "textInputProps.placeholder": "placeholder",
    "rangeProps.value": "value"
}

Each subdocument's field table lists whether a field supports binding.

Control Types That Do Not Use Proprietary Props

The following control types currently have no exclusive props field and usually use only commonProps and fields from other modules:

screen
container
button
spinner

Where:

button still recommends adding an explicit child label when text is needed
spinner has no exclusive JSON props yet