{% macro field(field) %}
  {% set required = field.required ?? false %}
  <label for="contact-{{ field.handle }}-{{ field.id }}"
    class="form-label freeform-label  {{ required ? 'required freeform-required' : null }}">
    {{ field.label }}
  </label>

  {% if field.type == 'select' %}
    <select id="contact-{{ field.handle }}-{{ field.id }}"
      class="freeform-input form-select"
      name="{{ field.handle }}"
      {{ required ? 'data-required' : null }}>
      {% for option in field.options %}
        <option value="{{ option.value }}"
          {{ loop.first ? 'selected' : null }}>
          {{ option.label }}
        </option>
      {% endfor %}
    </select>
  {% endif %}

  {% if field.type in ['email', 'text'] %}
    <input type="{{ field.type }}"
      {{ required ? 'data-required' : null }}
      class="freeform-input form-control"
      name="{{ field.handle }}"
      placeholder="{{ field.placeholder }}"
      id="contact-{{ field.handle }}-{{ field.id }}" />
  {% endif %}

  {% if field.type == 'textarea' %}
    <textarea class=" freeform-input form-control"
      id="contact-{{ field.handle }}-{{ field.id }}"
      placeholder="{{ field.placeholder }}"
      name="{{ field.handle }}"
      rows="5"></textarea>
  {% endif %}
  {{ field.renderErrors() }}
{% endmacro %}