<div class="c-dropdown-menu
  {{#if dropdown.theme}} c-dropdown-menu--{{dropdown.theme}} {{/if}}
  {{#if dropdown.text}} c-dropdown-menu--with-text {{/if}}
  {{#if dropdown.position}}{{#each dropdown.position}} c-dropdown-menu--pos-{{this}} {{/each}}{{/if}}
  {{#if dropdown.hoverEnabled}} js-dropdown-menu-hover-enabled {{/if}}"
  id="{{dropdownId}}"
  aria-labelledby="{{dropdownTriggerId}}"
  role="menu">

  <div class="c-dropdown-menu__inner{{#if dropdown.width}} c-dropdown-menu__inner--{{dropdown.width}}{{/if}}">
    {{#if dropdown.text}}
      <span class="c-dropdown-menu__text{{#if dropdown.dismissButton}} c-dropdown-menu__text--dismiss{{/if}}">{{dropdown.text}}</span>
    {{/if}}
    {{#if dropdown.dismissButton}}
      {{> button buttonIconId="#close-x"
        buttonModifierClasses="c-button--icon-only c-button--no-border c-dropdown-menu__dismiss js-dropdown-menu-close"
        buttonAttributes="type=\"button\" aria-label=\"Close message\""
      }}
    {{/if}}
    {{#each dropdown.links}}
      {{> button buttonText=this
        buttonModifierClasses="c-button--white-secondary c-button--full-width c-button--no-border-radius"
        buttonAttributes="type=\"button\""
      }}
    {{/each}}
    {{#each dropdown.customButtonLinks}}
      {{> button this}}
    {{/each}}
    {{#if dropdown.closeButton}}
      {{> button buttonText="Close <span class='u-visually-hidden'>message</span>"
        buttonModifierClasses="c-button--full-width c-button--no-border-radius c-dropdown-menu__close js-dropdown-menu-close"
        buttonAttributes="type=\"button\""
      }}
    {{/if}}
  </div>
</div>
