@alexlafroscia/ember-wizard

    0.9.0 • Public • Published

    ember-wizard

    Build Status dependencies Status devDependencies Status Ember Versions

    “Pay no attention to the man behind the curtain!”

    Features

    • Provides an extremely generic way of describing a series of views that should be shown in succession
    • Provides absolutely CSS styling and the bare minimum HTML to stay out of the way of your code

    Installation

    ember install @alexlafroscia/ember-wizard

    Basic Usage

    Using ember-wizard starts with creating a step-manager

    {{#step-manager as |w|}}
      We'll put some cool stuff in here in a moment
    {{/step-manager}}

    Cool, right? Ehh, it doesn't do much yet -- we need to add some steps

    {{#step-manager as |w|}}
      {{#w.step name='a'}}
        This is the first step!
      {{/w.step}}
    
      {{#w.step name='b'}}
        This is the second step!
      {{/w.step}}
    {{/step-manager}}

    As you may have guessed, the first w.step component, a, will be visible initially, and b will be invisible. Note that these names are important. Why? Because we need a way to transition between them!

    {{#step-manager as |w|}}
      {{#w.step name='a'}}
        This is the first step!
    
        <button {{action w.transition-to 'b'}}>
          Next, please!
        </button>
      {{/w.step}}
    
      {{#w.step name='b'}}
        This is the second step!
    
        <button {{action w.transition-to 'a'}}>
          Wait, go back!
        </button>
      {{/w.step}}
    {{/step-manager}}

    The step-manager provides a closure action that can be called with the name of a step to show that one, instead. One of the neat features of ember-wizard is that there is no explicit order to the steps; show all of them, or only some. It's entirely up to you.

    Not-So-Basic Usage

    The above examples show the basic idea, but there's more configuration (and power) available if you need it. Head over to the wiki to read more about what ember-wizard can do!

    Compatibility Note

    This addon uses the hash helper, so Ember 2.3.0+ is required.

    Keywords

    Install

    npm i @alexlafroscia/ember-wizard

    DownloadsWeekly Downloads

    1

    Version

    0.9.0

    License

    MIT

    Last publish

    Collaborators

    • alexlafroscia