sul-dlss/argo

<div class="facet-pagination top row justify-content-between">
  <%= render 'facet_pagination' %>
</div>

<div data-controller="facet-filter">
  <%= render BlacklightModalComponent.new do |component| %>
    <% component.header do %>
      <%= facet_field_label(@facet.key) %>
      <a class="copy-button" data-controller="copy" data-action="copy#copy" aria-label="Copy this list" title="Copy this list" href="#"><span class="bi bi-clipboard"></span></a>
     <% end %>
    <% component.body do %>

      <%= render 'facet_index_navigation' if @facet.index_range && @display_facet.index? %>
      <div data-facet-filter-target="list">
        <%= render_facet_limit(@display_facet, layout: false) %>
      </div>
    <% end %>
    <% component.footer do %>
      <div class="facet_pagination bottom row">
        <div class="col-sm-4">
          <input type="text" id="filterInput" data-action="keyup->facet-filter#filter" placeholder="Filter..." class="form-control form-control-sm" autocomplete="off">
        </div>
        <%= render 'facet_pagination' %>
      </div>
    <% end %>
  <% end %>
</div>