Numable authoring docsthe same content is available in the terminal: `numable docs <topic>`中文

form-fields — form field types and their props (generated)

Straight from the form SDK's property catalog: every prop the runtime actually reads is here, and the Notes column is what it means. How to use them, how validation works and how to wire a fetch live in numable docs params; a prop that is not listed here does nothing and reports nothing.

Field types

type Name Purpose Default value Props
textInput Text Free-form text entry "" placeholder maxLength maxLines pattern errorMessage
numberInput Number A numeric field with a range and a step "" min max step decimal
datePicker Date Picks a date as a string "" format min max
timePicker Time Returns HH:mm "" (no props)
colorPicker Colour Preset swatches plus a custom colour "#1677FF" recommended items
progressBar Slider Picks a number by sliding "0" min max step decimal
switch Switch Toggles a boolean "false" (no props)
radio Radio A list where one is chosen "" items
checkBox Checkboxes A list where several may be chosen [] items minCount maxCount
select Select A dropdown or multi-select list "" items minCount maxCount
imageSelect Images Uploads one or more images [] imageAccept maxCount compress
searchSelect Search select Local or remote search "" placeholder items dataSource
cascader Cascader Picks through a fixed hierarchy "" items minCount maxCount
dynamicCascader Dynamic cascader Loads each level on demand "" dataSource initialItems minCount maxCount

textInput

Prop Name Type / values Default Notes
placeholder Placeholder string 请输入内容 The grey text shown while the field is empty.
maxLength Maximum length count (written as a string) — Maximum number of characters. Checked on submit — it does not stop more characters being typed.
maxLines Maximum lines count (written as a string) — Maximum number of lines, counted by line breaks and checked on submit.
pattern Format check string — A regular expression. Both forms work: the bare expression ^\d{6}$, or /^abc$/i with flags. An empty value always passes — it only judges what was typed, so use required for mandatory. ⚠️ A broken expression is not reported as an error but treated as "no match", which shows up as "nothing I type is accepted".
errorMessage Message when it fails string — Shown when the format check fails; without it the platform's own "wrong format" is used.

numberInput

Prop Name Type / values Default Notes
min Minimum number (written as a string) 0 Inclusive.
max Maximum number (written as a string) — Inclusive. Without it there is no upper bound.
step Step number (written as a string) 1 How much the stepper moves per press.
decimal Decimal places count (written as a string) — Checked on submit; "0" means integers only.

datePicker

Prop Name Type / values Default Notes
format Date format string YYYY-MM-DD The value is stored as a string in this shape.
min Earliest string — Parsed with this field's own format, so write it the same way.
max Latest string — Same as above — write it in this field's format.

colorPicker

Prop Name Type / values Default Notes
recommended Suggested colours array of strings — A row of preset swatches; the user can still pick a custom colour.
items Allowed colours array of strings — When present, the choice is limited to these.

progressBar

Prop Name Type / values Default Notes
min Minimum number (written as a string) 0 The left end of the slider.
max Maximum number (written as a string) 100 The right end of the slider.
step Step number (written as a string) 1 The smallest increment the slider moves in.
decimal Decimal places count (written as a string) — Checked on submit.

radio

Prop Name Type / values Default Notes
items Options array of options — Each entry is { label?, value, image? }: value is required (it is what gets stored), label is what the user sees (falls back to the value), and image gives the option a picture.

checkBox

Prop Name Type / values Default Notes
items Options array of options — Each entry is { label?, value, image? }: value is required (it is what gets stored), label is what the user sees (falls back to the value), and image gives the option a picture.
minCount Minimum selected count (written as a string) — Lower bound on how many may be selected, checked on submit. Use it for "at least one", not required, which only checks for emptiness.
maxCount Maximum selected count (written as a string) — Upper bound on how many may be selected, checked on submit. Anything above 1 makes it multi-select, and the value becomes an array instead of a string.

select

Prop Name Type / values Default Notes
items Options array of options — Each entry is { label?, value, image? }: value is required (it is what gets stored), label is what the user sees (falls back to the value), and image gives the option a picture.
minCount Minimum selected count (written as a string) — Lower bound on how many may be selected, checked on submit. Use it for "at least one", not required, which only checks for emptiness.
maxCount Maximum selected count (written as a string) — Upper bound on how many may be selected, checked on submit. Anything above 1 makes it multi-select, and the value becomes an array instead of a string.

imageSelect

Prop Name Type / values Default Notes
imageAccept Accepted file types string image/* The same syntax as HTML's accept, e.g. image/png,image/jpeg.
maxCount Maximum images count (written as a string) 1 The cap; anything above 1 allows picking several.
compress Compression object — An object (its keys are in the table below). Without it the original file is used — a phone photo is several megabytes and will blow up the write-back.

searchSelect

Prop Name Type / values Default Notes
placeholder Placeholder string 请输入关键字 The grey text in the empty search box.
items Options array of options — Each entry is { label?, value, image? }: value is required (it is what gets stored), label is what the user sees (falls back to the value), and image gives the option a picture.
dataSource Remote search string — With this set, every keystroke asks a flow, with the term in ${@event.keyword}; without it, filtering happens locally over items.

cascader

Prop Name Type / values Default Notes
items Levels array of options — On top of { label?, value, image? }, each entry takes two more keys: children is the next level and isLeaf marks it as final. The whole tree is written out at once.
minCount Minimum selected count (written as a string) — Lower bound on how many may be selected, checked on submit. Use it for "at least one", not required, which only checks for emptiness.
maxCount Maximum selected count (written as a string) — Upper bound on how many may be selected, checked on submit. Anything above 1 makes it multi-select, and the value becomes an array instead of a string.

dynamicCascader

Prop Name Type / values Default Notes
dataSource Per-level fetch string — Asks a flow each time a level opens, with the chosen path in ${@event.path} and the level number in ${@event.level} (starting at 0).
initialItems First level array of options — The level shown before anything is fetched, saving one round trip. isLeaf on an entry decides whether another level is requested — leave it out and it keeps asking.
minCount Minimum selected count (written as a string) — Lower bound on how many may be selected, checked on submit. Use it for "at least one", not required, which only checks for emptiness.
maxCount Maximum selected count (written as a string) — Upper bound on how many may be selected, checked on submit. Anything above 1 makes it multi-select, and the value becomes an array instead of a string.

Keys of imageSelect.compress

Prop Name Type / values Default Notes
targetSizeKB Target size (KB) count (written as a string) — Compresses until the file fits within this size. Without it, size is not targeted.
maxLongSide Long-edge cap (px) count (written as a string) — Scales the long edge down to this many pixels before compressing. Anything under 320 is treated as 320.
minQuality Minimum quality number (written as a string) 0.55 A decimal 0–1. The lowest quality it will drop to while chasing the target size.
maxQuality Maximum quality number (written as a string) 0.9 A decimal 0–1; compression starts here. If you swap it with the minimum they are put back in order.
format Output format enum auto / jpeg / png auto auto picks by the source; for a transparent image you want small, write jpeg and set the alpha policy below.
alphaPolicy Alpha channel enum preserve / drop preserve preserve keeps transparency; drop discards it and compresses further (common for screenshots).
failPolicy If the target cannot be met enum use_min_quality / keep_original use_min_quality When even the minimum quality is still too big: use_min_quality ships that attempt, keep_original uploads the untouched file (which may be large).