bootstrap_italia-8.x-0.x-dev/components/components-2/accordion/accordion-item.html.twig

{#
/**
 * @file
 * Template for accordion_item component.
 * Docs: https://italia.github.io/bootstrap-italia/docs/componenti/accordion/
 * Latest revision: v2.8.7
 *
 * Parameters:
 * - item_title (string) (default: '')
 * - item_title_tag (string) (default: 'h2')
 * - item_body (string) (default: '')
 * - title_id (string) (default: 'accordion-title-' ~ random)
 * - item_show (boolean) (default: true)
 * - container_id (string) (default: '')
 *   Enable 'always open' feature
 * - item_button_classes (array) (default: '')
 * - item_button_attributes (obj attribute) (default: '')
 *
 * - accordionItemTitle (block) (default: item_title)
 * - accordionItemBody (block) (default: item_body)
 *
 * Examples:
   {% include '@bi-bcl/accordion/accordion-item.html.twig' with {
     item_title: 'Title',
     item_body: 'Body',
   } %}
 *
   {% embed '@bi-bcl/accordion/accordion-item.html.twig' with {
     item_show: true,
     container_id: 'container-id',
   } %}
     {% block accordionItemTitle %}
       {{ content.field_title }}
     {% endblock %}

     {% block accordionItemBody %}
       {{ content|without('field_title') }}
     {% endblock %}
   {% endembed %}
 *
 */
#}
{% apply spaceless %}
  {# Set defaults #}
  {% set _item_title = item_title|default('') %}
  {% set _item_title_tag = item_title_tag|default('h2') %}
  {% set _item_body = item_body|default('') %}
  {% set _title_id = title_id|default('accordion-title-' ~ random()) %}
  {% set _item_show = item_show ?? false %}
  {% set _container_id = container_id|default('') %}
  {% set _item_button_classes = item_button_classes|default('') %}
  {% set _item_button_attributes = item_button_attributes|default('') %}
  {% set _accordion_item_classes = accordion_item_classes|default('') %}
  {% set _accordion_item_attributes = accordion_item_attributes|default('') %}

  {# Set options #}
    {% set _classes = [
      'accordion-item'
    ] %}

  {% if _accordion_item_classes is not empty %}
    {% set _classes = _classes|merge(accordion_item_classes) %}
  {% endif %}

  {% if _accordion_item_attributes is empty %}
    {% set accordion_item_attributes = create_attribute() %}
  {% endif %}
  {% set accordion_item_attributes = accordion_item_attributes
    .addClass(_classes)
  %}

  {% set _button_classes = [
    'accordion-button',
    not _item_show ? 'collapsed'
  ] %}

  {% if _item_button_classes is not empty %}
    {% set _button_classes = _button_classes|merge(item_button_classes) %}
  {% endif %}

  {% if _item_button_attributes is empty %}
    {% set item_button_attributes = create_attribute() %}
  {% endif %}
  {% set item_button_attributes = item_button_attributes
    .addClass(_classes)
    .setAttribute('data-bs-toggle', 'collapse')
    .setAttribute('data-bs-target', '#collapse-' ~ _title_id)
    .setAttribute('aria-expanded', _item_show ? 'true' : 'false')
    .setAttribute('aria-controls', 'collapse-' ~ _title_id)
  %}

  {% set _title_content %}
    {% block accordionItemTitle %}
      {{ _item_title }}
    {% endblock %}
  {% endset %}

  {# Component #}
  <div{{ accordion_item_attributes }}>
    <{{ _item_title_tag }} class="accordion-header" id="heading-{{ _title_id }}">
      {% include '@bi-bcl/button/button.html.twig' with {
        label: _title_content,
        button_classes: _button_classes,
        button_attributes: item_button_attributes
      } %}
    </{{ _item_title_tag }}>
    <div id="collapse-{{ _title_id }}"
      class="accordion-collapse collapse{{ _item_show ? ' show' : '' }}"
      aria-labelledby="heading-{{ _title_id }}"
      {% if _container_id is not empty %}
        data-bs-parent="#{{ _container_id }}"
      {% endif %}
    >
      <div class="accordion-body">
        {% block accordionItemBody %}
          {{ _item_body }}
        {% endblock %}
      </div>
    </div>
  </div>
{% endapply %}