{# templates/components/DropdownMenu.html.twig #}
<div {{ attributes }} >
    <div data-controller="dropdown" class="relative inline-block">
        <twig:ToolBarButton
            icon="{{ icon }}"
            text="{{ text }}"
            action="dropdown#toggle"
            data-dropdown-target="button"
            controller=""
        />
        <div class="absolute left-0 mt-2 w-max z-10 bg-gray-800 rounded-sm shadow-lg hidden"
             data-dropdown-target="menu">
            <div class="py-1" data-controller="toolbar">
                {% for item in items %}
                    <a href="#"
                       class="block px-4 py-2 text-sm text-white hover:text-green-500"
                       data-action="toolbar#{{ item.action }}"
                        {% if item.data is defined %}
                            {% for key, value in item.data %}
                                data-{{ key }}="{{ value }}"
                            {% endfor %}
                        {% endif %}
                    >
                        {{ item.text }}
                    </a>
                {% endfor %}
            </div>
        </div>
    </div>
</div>
