Skip to content

Build ViewComponent class for Step Indicator #329

Description

@baonguyenNava

Overview

The step indicator is currently implemented as an ERB partial at app/views/strata/shared/_step_indicator.html.erb with no backing ViewComponent class. This means host apps must use the render partial: syntax with a locals hash, which is harder to document, test, and extend than a proper ViewComponent.

Current Usage

<%= render partial: "strata/shared/step_indicator", locals: {
  steps: [:before_you_start, :personal_info, :contact, :household, :employment, :review, :submit],
  current_step: :personal_info,
  type: :counters
} %>

Proposed API

<%= render Strata::StepIndicatorComponent.new(
  steps: [:before_you_start, :personal_info, :contact],
  current_step: :personal_info,
  type: :counters,
  translation_scope: "strata.application_forms.steps"
) %>

Acceptance Criteria

  • Create Strata::StepIndicatorComponent backed by the existing partial template
  • Support all current locals as constructor arguments: steps, current_step, translation_scope, large_header, header_first, type
  • Retain existing segment-state logic: complete / current / future
  • i18n display names pulled from translation_scope; fall back to humanized symbol
  • Unit tests covering each segment state and the type: :counters variant
  • Update ui-kit-components.md reference to document the component API
  • Backward-compatible: retain the existing partial so host apps that already use render partial: do not break (deprecated notice in partial is acceptable)

Context

The step indicator appears on every question page of every multi-step form in the SDK. Converting it to a ViewComponent improves testability, enables slot-based extension, and aligns it with the rest of the SDK's component architecture (TaskListComponent, AccordionComponent, etc.).

Metadata

Metadata

Assignees

Labels

enhancementNew feature or requestfrontendFrontend changes

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions