{#
/**
 * @file
 * Default theme implementation to display a Bootstrap Panel component.
 *
 * Available variables:
 * - attributes: An array of HTML attributes intended to be added to the main
 *   container tag of this template.
 *   - id: A valid HTML ID and guaranteed to be unique.
 * - body: The primary content of the panel.
 * - body_attributes: (optional) Same as attributes, except applied to the body
 *   container that appears in the template.
 * - collapsible: Flag indicating whether the panel is collapsible.
 * - collapsed: Flag indicating whether the panel is collapsed.
 * - description: (optional) A list of description properties containing:
 *    - content: (optional) A description of the form element, may not be set.
 *    - attributes: (optional) A list of HTML attributes to apply to the
 *      description content wrapper. Will only be set when description is set.
 *    - position: (optional) A display setting that can have these values:
 *      - before: The description is output before the element. This is the
 *        default value.
 *      - after: The description is output after the element.
 *      - invisible: The description is output after the element, hidden
 *        visually but available to screen readers.
 * - errors: (optional) Any errors for panel, may not be set.
 * - footer: (optional) Additional contents intended to be placed at the bottom.
 * - footer_attributes: (optional) Same as attributes, except applied to the
 *   footer container that appears in the template.
 * - heading: (optional) The title of the panel, may not be set.
 * - heading_attributes: (optional) Same as attributes, except applied to the
 *   heading container that appears in the template.
 * - panel_type: (optional) A contextual state. Will be one of these values:
 *   - danger
 *   - default (default value)
 *   - info
 *   - primary
 *   - success
 *   - warning
 * - target: (optional) The target of the collapsible container.
 *
 * @ingroup templates
 */
#}

{%
  set classes = [
    'panel',
    errors ? 'panel-danger' : 'panel-' ~ panel_type|clean_class,
  ]
%}
<div{{ attributes.addClass(classes) }}>

  {# Heading #}
  {% if heading %}
    {% block heading %}
      <div class="panel-heading">
        {%
          set heading_classes = [
            'panel-title',
            required ? 'form-required' : '',
          ]
        %}
        {% if collapsible %}
          <a{{ heading_attributes.addClass(heading_classes) }} href="{{ target }}">{{ heading }}</a>
        {% else %}
          <div{{ heading_attributes.addClass(heading_classes) }}>{{ heading }}</div>
        {% endif %}
      </div>
    {% endblock %}
  {% endif %}
  {# Body #}
  {% block body %}
    {% set tab_class = 'fade' %}
    {% if tab_films == 'true' %}
      {% set tab_class = 'fade in' %}
    {% endif %}
    {%
      set body_classes = [
      'panel-body',
      collapsible ? 'panel-collapse',
      collapsible ? 'collapse',
      collapsible ? tab_class,
      errors or collapsible and not collapsed ? 'in',
      ]
    %}
    {%
      set description_classes = [
        'help-block',
        description and description.position == 'invisible' ? 'sr-only',
      ]
    %}

    {% if errors %}
      <div class="alert alert-danger" role="alert">
        <strong>{{ errors }}</strong>
      </div>
    {% endif %}
    <div{{ body_attributes.addClass(body_classes) }}>
      {% if description and description.position == 'before' %}
        <p{{ description.attributes.addClass(description_classes) }}>{{ description.content }}</p>
      {% endif %}
      {{ body }}
      {% if description and description.position == 'after' or description.position == 'invisible' %}
        <p{{ description.attributes.addClass(description_classes) }}>{{ description.content }}</p>
      {% endif %}
    </div>
  {% endblock %}

  {# Footer #}
  {% if footer %}
    {% block footer %}
      {%
        set footer_classes = [
          'panel-footer',
        ]
      %}
      <div{{ footer_attributes.addClass(footer_classes) }}>{{ footer }}</div>
    {% endblock %}
  {% endif %}

</div>
