{% set headings = [] %}
{% if heading_selectors %}
  {% for heading_selector in heading_selectors %}
    {% set headings = headings|merge(['h' ~ heading_selector]) %}
  {% endfor %}
{% endif %}

<div{{ attributes.addClass('usa-in-page-nav-container') }}>
  <aside
    class="usa-in-page-nav"
    data-heading-elements="{{ headings|join(' ') }}"
    data-title-text="{{ title_text }}"
    data-title-heading-level="h{{ title_heading_level|default(4) }}"
    data-scroll-offset="{{ scroll_offset|default(0) }}"
    data-root-margin="{{ root_margin|default('0px 0px 0px 0px') }}"
    data-threshold="{{ threshold|default(1) }}"
    data-main-content-selector="{{ content_selector|default('<main>') }}"
    data-minimum-heading-count="{{ minimum_heading_count|default('2') }}"
  >
  </aside>

  <main id="main-content" class="main-content">
    {{ content }}
  </main>
</div>
