{# LIBRARIES #}
{{ attach_library('ui_patterns/menu_strip.menu_strip_lib') }}

{# VARIABLES #}
{% set mid = mid|default(random()) %}
{% set outline = outline|default(false) %}
{% set size = size|default('md') %}
{% set status = status|default('default') %}
{% set expanded = expanded|default(false) %}
{% set button_classes = button_classes|default('mb-0') %}
{% set row_classes = row_classes|default('mb-0') %}
{% set cols = cols|default(2) %}
{# Set responsive column classes: 4 in a row on desktop, 2 per row on md/mobile #}
{% set col_classes = col_classes|default('col-lg-3 col-md-6 col-6 mb-3') %}

{# TEMPLATE #}
{% if links %}
<div class="menu-buttons-wrapper">
  {% set nav_items = [] %}
  {% for link in links %}
    {% set nav_item %}
      {% include '@atoms/form/button/button.twig' with {
        'text': link['title'],
        'url': link['url'],
        'icon': link['icon'],
        'icon_position': link['icon_position'] ?? 'left',
        'outline': outline,
        'expanded': expanded,
        'size': size,
        'status': status,
        'class': button_classes,
      } %}
    {% endset %}
    {% set nav_items = nav_items|merge([nav_item]) %}
  {% endfor %}

  {% include "@organisms/tm-scaffold/rows-cols/rows-cols.twig" with {
    'wrapper_class': ['nav-buttons', wrapper_class]|join(' '),
    'auto_height': true,
    'batch': cols,
    'items': nav_items,
    'col_class': col_classes,
    'row_class': row_classes,
  } %}
</div>
{% endif %}
