{% load ui_assets ui_classes %}
{% ui_require_asset "trellis:panels" %}

<c-vars target="" action="toggle" icon="menu" label="Expand" class="" />
{% ui_class "ui.panels" "toggle" class=class as toggle_class %}
{% ui_class "ui.panels" "toggleIcon" as icon_class %}
<button type="button"
        x-data="UiPanelToggle"
        x-bind="root"
        data-ui-panel-toggle
        data-target="{{ target }}"
        data-action="{{ action }}"
        data-class="{{ class }}"
        aria-label="{{ label }}"
        aria-expanded="false"
        class="{{ toggle_class }}"
        {{ attrs }}>
    <c-component is="icons.{{ icon }}"
                 class="{{ icon_class }}"
                 data-ui-panel-toggle-icon
                 data-icon="{{ icon }}"
                 aria-hidden="true" />
</button>