tag.$3
Defines a form step, wrapping some contents which will be shown only when active.
Can be nested, which can be useful if the child steps have stricter conditions.
| Prop | Type | Meaning |
|-----------|---------|---------|
| step | number | The step number for this group |
| steps | array | Array of steps for this group (if shown on multiple steps) |
| condition | func | Function
(data) => boolean to check whether this step should be enabled |
| children | any | The step contents |
| nowrap | boolean | Whether to wrap the contents on a div or not |All other props will be passed through to the
tag, unless nowrap is set.$3
A render-props enabled component to get form info for your own usage.
Useful for showing form info, like the current step or previously saved values.
| Prop | Type | Meaning |
|----------|------|---------|
| children | func | Render props:
({data, step}) => any
|$3
A next/submit button to jump to the next step.
While you can use a regular
, this component allows to set the next step, in case you want to skip some steps, or even go back.| Prop | Type | Meaning |
|------------|----------------|---------|
| next | number or func | Next step number, or function
(data) => number` |
| noValidate | boolean | Skip form validation (and discard the current step inputs) |
| children | any | Button contents |