Step 1
),\n\t\tconditional: (state) => state ? true : false\n\t},\n\t{\n\t\tcomponent: ComponentThatWasImported,\n\t\tconditional: (state) => state ? true : false\n\t}\n]\n```\n\nThe only attribute that is tightly coupled to this structure is that `conditional` is a function that returns a boolean. `conditional` is used by the `getNextStep` and `getPreviousStep` selectors to determine if a step should be rendered or skipped.\n\nAnd while it doesn't make much sense to use the `Multistepper` if your steps aren't going to do something with a component you technically could.\n\n## index.js\n\nLet's start with an example of the use of our `Multistepper`.\n\n```\nimport HelloWorld from 'hello-world.js';\n\nclass App extends Component {\n initialSteps = [\n {\n component: HelloWorld,\n conditional: () => true\n },\n {\n component: (props) => (Step 2
),\n conditional: () => true\n }\n ]\n render() {\n return (\nLoading...
\n )\n }\n