{% set singleType = entryTypes|length == 1 %}

{% import '_includes/forms.twig' as forms %}

{{ hiddenInput(name, '') }}

<div class="matrix matrix-field" id="{{ id }}">
  <span role="status" class="visually-hidden" data-status-message></span>
  <div class="blocks" role="list">
    {% for entry in entries %}
      {% include '_components/fieldtypes/Matrix/block.twig' %}
    {% endfor %}
  </div>
  {% if not static and not staticEntries %}
    <div class="buttons">
      {% if singleType %}
        {{ forms.button({
          label: createButtonLabel,
          class: ['dashed', 'add', 'icon', 'wrap'],
          spinner: true,
          attributes: {
            data: {
              type: entryTypes|first.handle,
            },
            aria: {
              describedby: labelId,
            },
          },
        }) }}
      {% else %}
        {% set groupedEntryTypes = collect(entryTypes).groupBy(et => et.group ?? 'General'|t('app')) %}
        {% if groupedEntryTypes.count() > 1 %}
          {% set items = groupedEntryTypes.map((entryTypes, group) => [
            {hr: true, padded: false},
            {
              heading: group|t('site'),
              padded: false,
              items: entryTypes|map(entryType => {
                icon: entryType.icon,
                color: entryType.color,
                label: entryType.name|t('site'),
                value: entryType.handle,
                attributes: {
                  data: {
                    type: entryType.handle,
                  },
                },
              }),
            },
          ]).flatten(1).all() %}
        {% else %}
          {% set items = groupedEntryTypes.map((entryTypes) => entryTypes|map(entryType => {
            icon: entryType.icon,
            color: entryType.color,
            label: entryType.name|t('site'),
            value: entryType.handle,
            attributes: {
              data: {
                type: entryType.handle,
              },
            },
          })).flatten(1).all() %}
        {% endif %}
        {{ disclosureMenu(items, {
          buttonLabel: createButtonLabel,
          buttonSpinner: true,
          buttonAttributes: {
            class: ['dashed', 'add', 'icon'],
          },
          withSearchInput: entryTypes|length > 5,
        }) }}
      {% endif %}
    </div>
  {% endif %}
</div>
