<% add_gem_component_stylesheet("step-by-step-nav") options = {} options[:heading_level] = heading_level ||= 2 steps ||= false small ||= false show_step ||= false remember_last_step ||= false step_nav_url ||= false highlight_step ||= false tracking_id ||= false # used to remember open steps, see docs step_nav_content_id ||= tracking_id step_count = 0 step_number = 0 step_nav_helper = GovukPublishingComponents::Presenters::StepByStepNavHelper.new disable_ga4 ||= false component_helper = GovukPublishingComponents::Presenters::ComponentWrapperHelper.new(local_assigns) component_helper.add_data_attribute({ module: "gemstepnav", show_text: t("components.step_by_step_nav.show"), hide_text: t("components.step_by_step_nav.hide"), show_all_text: t("components.step_by_step_nav.show_all"), hide_all_text: t("components.step_by_step_nav.hide_all") }) component_helper.add_data_attribute({ module: "ga4-event-tracker", ga4_expandable: "", }) unless disable_ga4 component_helper.add_data_attribute({ remember: "" }) if remember_last_step component_helper.add_data_attribute({ id: tracking_id }) if tracking_id component_helper.add_class("gem-c-step-nav js-hidden") component_helper.add_class("govuk-!-display-none-print") if small component_helper.add_class("gem-c-step-nav--large") unless small %> <% if steps %> <%= tag.div(**component_helper.all_attributes) do %>
    <% steps.each_with_index do |step, step_index| %> <% step_is_active = step_index + 1 == highlight_step step_count += 1 id = step_nav_helper.generate_step_nav_id(step[:title]) logic = false logic = step[:logic] if ["and", "or"].include? step[:logic] circle_class = "gem-c-step-nav__circle--number" circle_class = "gem-c-step-nav__circle--logic" if logic %>
  1. " <% if step_is_active %>aria-current="step"<% end %> <%= "data-show" if step_count == show_step %> id="<%= id %>" data-track-count="stepNavSection" <%= "data-optional" if step[:optional] %> >
    "> <%= content_tag("h#{heading_level}", class: 'gem-c-step-nav__title') do %> <% if logic %> <%= logic %> <% else %> <% step_number += 1 %> Step <%= step_number %> <% end %> <%= step[:title] %> <% end %>
    <% ga4_link_data = {} unless disable_ga4 ga4_link_data = { "module": "ga4-link-tracker", "ga4-track-links-only": "", "ga4-set-indexes": "", "ga4-link": { "event_name": "navigation", "type": "step by step", "index_section": step_index + 1, "index_section_count": steps.length, "section": step[:title] }.to_json } end %> <%= tag.div(class: "gem-c-step-nav__panel js-panel", id: "step-panel-#{id}-#{step_index + 1}", data: ga4_link_data) do %> <% in_substep = false options[:step_nav_content_id] = step_nav_content_id options[:step_title] = step[:title] options[:step_index] = step_index options[:link_index] = 0 options[:disable_ga4] = disable_ga4 %> <% step[:contents].each do |element| %> <%= step_nav_helper.render_step_nav_element(element, options) %> <% if element[:type] == 'list' options[:link_index] += element[:contents].length end %> <% end %> <% end %>
  2. <% end %>
<% end %> <% end %>