<!-- eslint-disable-next-line sw-deprecation-rules/no-twigjs-blocks -->
{% block sw_context_button %}
<button
    ref="swContextButton"
    class="sw-context-button"
    :class="contextClass"
    :aria-label="ariaLabel && $tc(ariaLabel)"
    @click="onClickButton"
    @keydown.enter="onClickButton"
>
    <!-- eslint-disable-next-line sw-deprecation-rules/no-twigjs-blocks -->
    {% block sw_context_button_button %}
    <slot name="button">
        <div
            class="sw-context-button__button"
            :class="contextButtonClass"
            tabindex="-1"
        >
            <sw-icon
                :name="icon"
                decorative
            />
        </div>
    </slot>
    {% endblock %}

    <!-- eslint-disable-next-line sw-deprecation-rules/no-twigjs-blocks -->
    {% block sw_context_button_menu %}
    <sw-popover
        v-if="showMenu"
        class="sw-context-button__menu-position"
        popover-class="sw-context-button__menu-popover"
        :z-index="zIndex"
    >
        <sw-context-menu
            ref="swContextMenu"
            :class="contextMenuClass"
            :style="menuStyles"
        >
            <slot>
            <!-- eslint-disable-next-line sw-deprecation-rules/no-twigjs-blocks -->
            {% block sw_context_button_menu_slot_default %}{% endblock %}
            </slot>
        </sw-context-menu>
    </sw-popover>
    {% endblock %}
</button>
{% endblock %}
