Directory

← Back

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.

Author

Contributors

Rating

[ This description is mirrored from README.md at github.com/MaritzSTL/mtz-wizard on 2019-05-10 ]

Build Status Published on webcomponents.org

<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.

Compatibility

(Loading compatibility data...)

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
Online