11.0.0 • Published 1 year ago
fl-react-steps v11.0.0
Step header and content components with which to make a multi step form
Usage:
import { Step, Steps, StepHeader } from 'fl-react-steps'
// Check client/style.scss for variables you can override
import 'fl-react-steps/client/style.scss'
export default class SteppedForm extends React.Component {
constructor() {
super()
this.state = {step: 1}
}
handleChangeStep = step => {
this.setState({step})
}
render() {
const { step } = this.state
return (
<div>
<StepHeader headings={['First page', 'Second page']} step={step} onChangeStep={this.handleChangeStep} />
<Steps step={step}>
<Step>
<form>
{/* the first page of your form */}
</form>
</Step>
<Step>
<form>
{/* the second page of your form, and so on */}
</form>
</Step>
</Steps>
</div>
)
}
}
StepHeader props:
step: The currenly active step
headings: A list of titles for your steps
onChangeStep: Called when a step is clicked
className: Classes to give the step header wrapper node. Defaults to 'step-header clearfix'
stepClassName: Extra classes to give the individual header nodes
stepClass: Alias of stepClassName
Steps props:
step: The currenly active step
10.1.4
1 year ago
11.0.0
1 year ago
10.0.0
1 year ago
9.0.0-rc.6
2 years ago
9.0.0-rc.4
2 years ago
9.0.0-rc.2
2 years ago
9.0.0
2 years ago
7.0.0
5 years ago
6.3.2
6 years ago
6.2.4
6 years ago
6.1.14
6 years ago
6.1.0
6 years ago
6.0.1
6 years ago
6.0.0
6 years ago
5.0.3
6 years ago
5.0.1
6 years ago
5.0.0
6 years ago
4.0.16
6 years ago
4.0.14
6 years ago
4.0.11
6 years ago
4.0.9
6 years ago
1.0.0
7 years ago
1.0.0-alpha.7
7 years ago
1.0.0-alpha.6
7 years ago
1.0.0-alpha.5
7 years ago
1.0.0-alpha.4
7 years ago
1.0.0-alpha.3
7 years ago
1.0.0-alpha.2
7 years ago
1.0.0-alpha.1
7 years ago
0.10.3
7 years ago
0.10.2
8 years ago
0.10.1
8 years ago
0.10.0
8 years ago
0.1.1
8 years ago
0.1.0
8 years ago