{{#unless flatMode}}
  <div class='buttons'>
    <button class='decrease-btn' {{action 'decreaseMonth'}} disabled='{{if decreaseMonthButtonDisabled "disabled"}}'>
      {{{decreaseButtonText}}}
    </button>

    <button class='picker-toggle-btn rl-dropdown-toggle' {{action 'toggleDropdown'}}>
      {{#if monthText}}
        {{monthText}}
      {{else}}
        {{{monthPlaceholderText}}}
      {{/if}}
      <i class='caret'></i>
    </button>

    <button class='increase-btn' {{action 'increaseMonth'}} disabled='{{if increaseMonthButtonDisabled "disabled"}}'>
      {{{increaseButtonText}}}
    </button>
  </div>
{{/unless}}

{{#if pickerVisible}}
  <div class='picker rl-dropdown'>
    {{#if yearPickerMode}}
      {{rl-year-picker flatMode=true year=year previousPageButtonText=previousPageButtonText nextPageButtonText=nextPageButtonText pickedYear="pickedYear" minYear=minYear maxYear=maxYear}}
    {{else}}
      <div class='page-controls'>
        <button class='previous-page-btn' {{action 'previousPage'}} disabled='{{if previousPageButtonDisabled "disabled"}}'>
          {{{previousPageButtonText}}}
        </button>

        <button class='year-picker-toggle-btn' {{action 'openYearPicker'}}>
          {{displayedYear}} <i class='caret'></i>
        </button>

        <button class='next-page-btn' {{action 'nextPage'}} disabled='{{if nextPageButtonDisabled "disabled"}}'>
          {{{nextPageButtonText}}}
        </button>
      </div>

      <ul class='month-list'>
        {{#each months as |month|}}
          <li class='{{if month.isActive "active"}} {{if month.outOfRange "out-of-range"}}' {{action 'pickedMonth' displayedYear month.monthNumber}}>
            {{month.label}}
          </li>
        {{/each}}
      </ul>
    {{/if}}
  </div>
{{/if}}