mtz-wizard
All of the elements required to implement a stepper controlled series of forms that support lazy-loading steps upon activation as well as validation and bulk submission tasks.
[ This description is mirrored from README.md at github.com/MaritzSTL/mtz-wizard on 2019-05-10 ]
<mtz-wizard>
Generates a wizard flow from steps provided. Allows for validation across all steps.
<mtz-wizard-stepper steps="[[steps]]" selected="{{selected}}"></mtz-wizard-stepper>
<mtz-wizard id="wizard" steps="{{steps}}" selected="{{selected}}">
<mtz-wizard-step name="step-1" label="Select campaign settings">
Step 1 - Prebuilt step
</mtz-wizard-step>
<div wizard-step name="step-2" label="Create ad" invalid>
Step 2 - Generic div using attribute w/ invalid styling applied
</div>
<mtz-wizard-step name="step-3" label="Preview ad" optional>
<iron-form wizard-form>
<form>
<label>
Age:
<input required type="number" name="age" />
</label>
</form>
</iron-form>
</mtz-wizard-step>
</mtz-wizard>
Install the Polymer-CLI
First, make sure you have the Polymer CLI installed. Then run polymer install --variants
to install all dependencies for both 1.x and 2.x (mainline)
Viewing Your Element
$ polymer serve
Running Tests
$ polymer test
Your application is already set up to be tested via web-component-tester. Run polymer test
to run your application's test suite locally.
Links
Compatibility
Was this helpful? Need more help?
Leave a comment or a question below. You can also join
the chat on Discord or
ask questions on StackOverflow.
Version
Dependencies
Polymer/polymer#^1.9 || ^2.0
- PolymerElements/iron-form#^2.0
- PolymerElements/iron-icon#^1.0 || ^2.0
- PolymerElements/iron-icons#^1.0 || ^2.0
- PolymerElements/iron-pages#^1.0 || ^2.0
- PolymerElements/paper-ripple#^1.0 || ^2.0
- Released
- 2017-11-01
- Maturity
- IMPORTED
- License
- Other
Compatibility
- Framework
- Polymer 2.0+
- Browser
- Browser Independent