---
url:
  type: 'string'
placeholder:
  type: 'hash'
  default:
    es: 'Buscar'
    en: 'Search'
    pt_BR: 'Pesquisar'
categories:
  type: 'array'
tags:
  type: 'array'
topics:
  type: 'array'
status:
  type: 'array'
sort:
  type: 'array'
categories_title:
  type: 'hash'
  default:
    en: 'Any category'
topics_title:
  type: 'hash'
  default:
    en: 'Any topic'
status_title:
  type: 'hash'
  default:
    en: 'Any status'
tags_title:
  type: 'hash'
  default:
    en: 'Any tag'
value:
  type: 'string'
  default: ''
name:
  type: 'string'
  default: ''
---
{% assign selected_value = value %}
<form
  class="w-100 mr-4"
  action="{{ url | component_escape }}"
  method="get"
  data-pagefind-target="form"
  data-action="pagefind#search:prevent"
>
  <div class="row">
    <div class="col-12 col-lg-8 mb-3">
      <input type="search" class="form-control w-100" placeholder="{{ placeholder[locale] | escape_once }}" name="q">
    </div>

    <div class="col-12 col-lg-4 mb-3">
      {% render 'forms/select.html', id: 'sort', items: sort, value: 'score/desc', placeholder: 'Sort by' %}
    </div>

    <div class="col-12 col-lg-3 mb-3">
      {% assign value = name | equals: 'categories' | ternary: selected_value, '' %}
      {% render 'forms/select.html', id: 'categories', items: categories, placeholder: categories_title[locale], value: %}
    </div>

    <div class="col-12 col-lg-3 mb-3">
      {% assign value = name | equals: 'topics' | ternary: selected_value, '' %}
      {% render 'forms/select.html', id: 'topics', items: topics, placeholder: topics_title[locale], value: %}
    </div>

    <div class="col-12 col-lg-3 mb-3">
      {% assign value = name | equals: 'status' | ternary: selected_value, '' %}
      {% render 'forms/select.html', id: 'status', items: status, placeholder: status_title[locale], value: %}
    </div>

    <div class="col-12 col-lg-3 mb-3">
      {% assign value = name | equals: 'tags' | ternary: selected_value, '' %}
      {% render 'forms/select.html', id: 'tags', items: tags, placeholder: tags_title[locale], value: %}
    </div>

    <div class="col-12 mb-3">
      <input type="submit" class="btn btn-primary w-100" value="{{ placeholder[locale] | escape_once }}">
    </div>
  </div>
</form>