Stepper v0.21.0+ HelixUI v0.21.0 or later required

Basic Stepper

A basic stepper will allow a user to expand and collapse as many panels as desired.

Account Acme Corp Inc.

Content Goes Here

Topic Technical Incident

Content Goes Here

Issue Details

Content Goes Here

<hx-accordion class="hxStepper" current-panel="0">
  <hx-accordion-panel>
    <header slot="header">
      <span class="hxStepCounter">
        <!-- CSS will handle filling in the step number -->
      </span>
      <span class="hxStepLabel">Account</span>
      <span class="hxStepValue">Acme Corp Inc.</span>
    </header>
    <div class="hxBox hxMd">
      <p>
        <em>Content Goes Here</em>
      </p>
      <p class="hxStepButton">
        <button class="hxBtn hxPrimary">Next Step</button>
        <button class="hxBtn">Prev Step</button>
        <button class="hxBtn hxLink">Cancel</button>
      </p>
    </div>
  </hx-accordion-panel>
  <hx-accordion-panel>...</hx-accordion-panel>
  <hx-accordion-panel>...</hx-accordion-panel>
  ...
</hx-accordion>

See Also