diff --git a/app/components/process_list_component.rb b/app/components/process_list_component.rb
index 1ee0c5b2b7a..ea3879c26d6 100644
--- a/app/components/process_list_component.rb
+++ b/app/components/process_list_component.rb
@@ -20,11 +20,19 @@ def css_class
end
class ProcessListItemComponent < BaseComponent
- attr_reader :heading_level, :heading
+ attr_reader :heading_level, :heading, :heading_id
- def initialize(heading_level:, heading:)
+ def initialize(heading_level:, heading:, heading_id: nil)
@heading_level = heading_level
@heading = heading
+ @heading_id = heading_id
+ end
+
+ def heading_options
+ options = { class: 'usa-process-list__heading' }
+
+ options[:id] = heading_id if heading_id.present?
+ options
end
end
end
diff --git a/app/components/process_list_item_component.html.erb b/app/components/process_list_item_component.html.erb
index d8c62058fd8..a796534706f 100644
--- a/app/components/process_list_item_component.html.erb
+++ b/app/components/process_list_item_component.html.erb
@@ -1,4 +1,4 @@
- <%= content_tag(heading_level, heading, class: 'usa-process-list__heading') %>
+ <%= content_tag(heading_level, heading, **heading_options) %>
<%= content %>
diff --git a/app/views/users/totp_setup/new.html.erb b/app/views/users/totp_setup/new.html.erb
index 1f5517da8be..7055d632a9e 100644
--- a/app/views/users/totp_setup/new.html.erb
+++ b/app/views/users/totp_setup/new.html.erb
@@ -19,7 +19,7 @@
<%= simple_form_for('', method: :patch, html: { class: 'margin-bottom-4' }) do |f| %>