Kanshō/Task lifecycle row

Task lifecycle row

A horizontal stepper for the A2A-style task journey. The happy path renders as a connected spine; fork states (input required, blocked, failed, cancelled) freeze the spine at working and trail off in their own tone.

Included in the single kansho full pack. Components are not offered as separate installs.

Interactive

Pick a phase
  1. Done: Created
  2. Done: Submitted
  3. Current: Working
  4. Upcoming: Completed

All phases

Each phase rendered in place
Created
  1. Current: Created
  2. Upcoming: Submitted
  3. Upcoming: Working
  4. Upcoming: Completed
Submitted
  1. Done: Created
  2. Current: Submitted
  3. Upcoming: Working
  4. Upcoming: Completed
Working
  1. Done: Created
  2. Done: Submitted
  3. Current: Working
  4. Upcoming: Completed
Input required
  1. Done: Created
  2. Done: Submitted
  3. Reached: Working
  4. Upcoming: Completed
  5. Current: Input required
Blocked
  1. Done: Created
  2. Done: Submitted
  3. Reached: Working
  4. Upcoming: Completed
  5. Current: Blocked
Completed
  1. Done: Created
  2. Done: Submitted
  3. Done: Working
  4. Current: Completed
Failed
  1. Done: Created
  2. Done: Submitted
  3. Reached: Working
  4. Upcoming: Completed
  5. Current: Failed
Cancelled
  1. Done: Created
  2. Done: Submitted
  3. Reached: Working
  4. Upcoming: Completed
  5. Current: Cancelled

Component documentation

Task Lifecycle Row

components/tasks/task-lifecycle-row.tsx

Purpose

Shows the current task phase across an ordered horizontal lifecycle.

Appropriate use

Use for a compact progress summary when one current phase is known.

Example

components/tasks/task-lifecycle-row.tsx has a representative live example in the "Interactive" section on /components/task-lifecycle-row.

States

Phases are created, submitted, working, input-required, blocked, completed, failed, and cancelled.

API and props

TaskLifecycleRow accepts current and className and exports the LifecyclePhase type.

Dependencies

Its only direct import is cn.

Accessibility

Every step has a visible label and the current phase uses aria-current step; colour and connector fill are supplemental.

Limitations

It is read-only, assumes the built-in phase ordering, and does not expose timestamps, history, or transition controls.

Source

Source: components/tasks/task-lifecycle-row.tsx.

Full pack

components/tasks/task-lifecycle-row.tsx is documented at /components/task-lifecycle-row and installs only through the single Kansho full pack; no individual component install is offered.