{{if config.sort}}
  <div>
    <div class="custom_sbox select position-relative">
      <div class="sbox btn py-1" type="button" data-bs-toggle="collapse"
           data-bs-target="#drilldown_sbox_dropdown_sorting" aria-expanded="false"
           aria-controls="drilldown_sbox_dropdown_sorting">
           <i class="fa-light fa-bars-sort"></i> {{if selection.sort}}{{>config.sort.criteria[selection.sort]}}{{else}}{{>config.sort.criteria[config.sort.default]}}{{/if}}
        <i class="fa-light fa-chevron-down fa-xs ms-1"></i>
      </div>

      <div class="sbox_dropdown collapse position-absolute" id="drilldown_sbox_dropdown_sorting">
        <div class="sbox_inner info p-2 d-flex flex-column">
          <ul>
          {{props config.sort.criteria ~i18n=i18n ~config=config ~selection=selection}}
            <li class="d-flex nowrap {{if (~selection.sort && ~selection.sort == key) || (!~selection.sort && key == ~config.sort.default)}}active fw-bold{{/if}}" onclick="$objPage.$objSearch.change('sort', '{{>key}}', false);">
              {{>prop}}
            </li>
          {{/props}}
          </ul>
        </div>
      </div>
    </div>
  </div>
{{/if}}


<!-- <div class="d-none d-md-flex trppr-results-view-mode btn-group btn-group-sm mb-1">
  <div class="btn btn-outline-primary trppr-results-view-mode-list" onclick="$objPage.$objSearch.setViewMode('list');">
    <i class="fa-solid fa-sm fa-bars-staggered"></i> {{>i18n('List')}}
  </div>
  <div class="btn btn-outline-primary trppr-results-view-mode-map" onclick="$objPage.$objSearch.setViewMode('map');">
    <i class="fa-solid fa-sm fa-location-dot"></i> {{>i18n('Map')}}
  </div>
</div> -->