Dowe Views Documentation

NAVIGATION

Stepper

Guide people through an ordered workflow with numbered, selectable steps and one focused panel.

WEB · ANDROID · IOS

ORDERED WORKFLOW

Direct step entries

Stepper accepts only direct step entries. Each step owns a unique id, a visible label, and one or more view nodes for its panel. The first step starts active.

Create your account

Enter the information you will use to sign in.

Email

Stepper scheme:"primary" orientation:"horizontal"
  step id:"account" label:"Account"
    Text
      "Create your account"
  step id:"profile" label:"Profile"
    Text
      "Complete your profile"
  step id:"review" label:"Review"
    Text
      "Review and submit"

RESPONSIVE WEB

A track that stays usable on small screens

The horizontal track keeps its intrinsic width and stays bounded by its container. When labels no longer fit, the controls scroll horizontally while the active panel keeps the available width.

Name the workspace and choose its region.

On web, arrow keys move between steps and Home or End selects the first or last step.

ORIENTATION

Horizontal or vertical

Use horizontal for compact progress across a page. Use vertical when labels need more room or the workflow belongs beside its content.

Horizontal

Prepare the first version.

Vertical

Capture the incoming request.

SCHEMES

Semantic progress color

scheme selects the numbered indicator and active label family consistently on web, Android, and iOS.

Warning workflow

Danger workflow

Stepper uses scheme, not color, for its visual family.

ACCESSIBILITY

One active step on every target

Web and desktop use tablist, tab, and tabpanel roles because each numbered control selects one visible panel. The active control also exposes aria-current step.

Android and iOS generate native buttons, local state, numbered indicators, connectors, overflow behavior, and the same selected panel.

Authoring rules

Keep ids unique within one Stepper, give every step a label and content, and place ordinary view nodes under step instead of directly under Stepper.

The active step is local state in this release. Signal binding and validation gates are not part of the current contract.

API

Stepper props

Stepper also accepts applicable common identity, spacing, sizing, visibility, radius, and border props.

Prop	Type	Default
No data There are no records to display

step entry props

step is structural and is valid only as a direct child of Stepper.

Prop	Type	Behavior
No data There are no records to display

No data

No data