{% load crispy_forms_field %}

{% if field.is_hidden %}
    {{ field }}
{% else %}
    <div id="div_{{ field.auto_id }}" class="form-group{% if wrapper_class %} {{ wrapper_class }}{% endif %}{% if 'form-horizontal' in form_class %} row{% endif %}{% if form_group_wrapper_class %} {{ form_group_wrapper_class }}{% endif %}{% if form_show_errors and field.errors %} has-danger{% endif %}{% if field.css_classes %} {{ field.css_classes }}{% endif %}">

        {% if field.label and form_show_labels %}
            <label for="{{ field.id_for_label }}" class="col-form-label {{ label_class }}{% if field.field.required %} requiredField{% endif %}">
                {{ field.label|safe }}{% if field.field.required %}<span class="asteriskField">*</span>{% endif %}
            </label>
        {% endif %}

        <div class="{{ field_class }}">
            {% if field|is_select %}
                {% if crispy_prepended_text %}<span class="input-group{% if active %} active{% endif %}{% if input_size %} {{ input_size }}{% endif %}">{{ crispy_prepended_text|safe }}</span>{% endif %}
                {% crispy_field field %}
                {% if crispy_appended_text %}<span class="input-group{% if active %} active{% endif %}{% if input_size %} {{ input_size }}{% endif %}">{{ crispy_appended_text|safe }}</span>{% endif %}
            {% else %}
                <div class="input-group">
                    {% if crispy_prepended_text %}
                      <div class="input-group-prepend{% if active %} active{% endif %}{% if input_size %} {{ input_size }}{% endif %}">
                        <span class="input-group-text">{{ crispy_prepended_text|safe }}</span>
                      </div>
                    {% endif %}
                    {% crispy_field field %}
                    {% if crispy_appended_text %}
                      <div class="input-group-append{% if active %} active{% endif %}{% if input_size %} {{ input_size }}{% endif %}">
                        <span class="input-group-text">{{ crispy_appended_text|safe }}</span>
                      </div>
                    {% endif %}
                </div>
            {% endif %}

            {% include 'bootstrap4/layout/help_text_and_errors.html' %}
        </div>

    </div>
{% endif %}
