{{#unless this.selectKit.isHidden}}
  {{component
    this.selectKit.options.headerComponent
    tabindex=this.tabindex
    value=this.value
    selectedContent=this.selectedContent
    selectKit=this.selectKit
    id=(concat this.selectKit.uniqueID "-header")
  }}

  <SelectKit::SelectKitBody
    @selectKit={{this.selectKit}}
    @id={{concat this.selectKit.uniqueID "-body"}}
  >
    {{#unless this.selectKit.options.useHeaderFilter}}
      {{component
        this.selectKit.options.filterComponent
        selectKit=this.selectKit
        id=(concat this.selectKit.uniqueID "-filter")
      }}

      {{#if this.selectedContent.length}}
        <div class="selected-content">
          {{#each this.selectedContent as |item|}}
            {{component
              this.selectKit.options.selectedChoiceComponent
              item=item
              selectKit=this.selectKit
              mandatoryValues=@mandatoryValues
            }}
          {{/each}}
        </div>
      {{/if}}
    {{/unless}}

    {{#each this.collections as |collection|}}
      {{component
        (component-for-collection collection.identifier this.selectKit)
        collection=collection
        selectKit=this.selectKit
        value=this.value
      }}
    {{/each}}

    {{#if this.selectKit.filter}}
      {{#if (and this.selectKit.hasNoContent (not this.selectKit.isLoading))}}
        <span class="no-content" role="alert">
          {{i18n "select_kit.no_content"}}
        </span>
      {{else}}
        <span class="results-count" role="alert">
          {{i18n "select_kit.results_count" count=this.mainCollection.length}}
        </span>
      {{/if}}
    {{/if}}
  </SelectKit::SelectKitBody>
{{/unless}}