{% load ui_classes ui_props %}
<c-vars id="" heading="" variant="heading" heading_size="inherit" heading_as="div" expandable="False" expanded="True" icon="" actions_visibility="always" class="" />
{% ui_class "ui.sidebar" "group" class=class as group_class %}
{% ui_class "ui.sidebar" "row" as row_class %}
{% if heading_size == "inherit" %}
{% ui_class "ui.sidebar" "groupHeadingWrapper" inherit=True as heading_wrapper_class %}
{% else %}
{% ui_class "ui.sidebar" "groupHeadingWrapper" inherit=False as heading_wrapper_class %}
{% endif %}
{% ui_class "ui.sidebar" "groupTrigger" as trigger_class %}
{% ui_class "ui.sidebar" "groupHeading" as heading_class %}
{% ui_class "ui.sidebar" "main" as main_class %}
{% ui_class "ui.sidebar" "leading" as leading_class %}
{% ui_class "ui.sidebar" "itemIcon" as icon_class %}
{% ui_class "ui.sidebar" "groupChevron" as chevron_class %}
{% ui_class "ui.sidebar" "groupLabel" as label_class %}
{% ui_class "ui.sidebar" "trailing" as trailing_class %}
{% ui_class "ui.sidebar" "actions" as actions_class %}
{% ui_class "ui.sidebar" "groupContent" as content_class %}
{% partialdef group_control %}
                {% if expandable|ui_bool %}
                    <button type="button" class="{{ trigger_class }}" data-ui-sidebar-group-trigger data-ui-sidebar-control aria-controls="{{ group_id }}-content" aria-expanded="{{ expanded|ui_bool|yesno:'true,false' }}">
                {% else %}
                    <{{ content_tag }} class="{{ heading_class }}" data-ui-sidebar-group-static data-ui-sidebar-control>
                {% endif %}
                    <{{ content_tag }} class="{{ main_class }}">
                    <span class="{{ leading_class }}" data-ui-sidebar-leading data-ui-sidebar-group-leading {% if leading or icon %}data-filled{% endif %}>
                        {% if leading %}{{ leading }}{% elif icon %}<c-component is="icons.{{ icon }}" class="{{ icon_class }}" data-ui-sidebar-group-icon data-icon="{{ icon }}" aria-hidden="true" />{% endif %}
                    </span>
                    <{{ content_tag }} class="{{ label_class }}" data-ui-sidebar-group-label>{% if label %}{{ label }}{% else %}{{ heading }}{% endif %}</{{ content_tag }}>
                    {% if expandable|ui_bool %}<c-icons.chevron__right class="{{ chevron_class }}" data-ui-sidebar-group-chevron aria-hidden="true" />{% endif %}
                    </{{ content_tag }}>
                    {% if trailing %}<span class="{{ trailing_class }}" data-ui-sidebar-group-trailing data-ui-sidebar-trailing>{{ trailing }}</span>{% endif %}
                {% if expandable|ui_bool %}</button>{% else %}</{{ content_tag }}>{% endif %}
{% endpartialdef %}
{% ui_unique_id "ui-sidebar-group" as group_uid %}
{% with group_id=id|default:group_uid %}
<li {% if id %}id="{{ id }}"{% endif %} class="{{ group_class }}" data-ui-sidebar-group data-variant="{{ variant }}"
    {% if expandable|ui_bool %}data-expandable data-state="{% if expanded|ui_bool %}open{% else %}closed{% endif %}"{% endif %}
    {{ attrs }}>
    {% if heading or label or actions or expandable|ui_bool %}
        <div class="{{ row_class }}" data-ui-sidebar-row data-ui-sidebar-group-heading data-actions-visibility="{{ actions_visibility }}">
            {% if label and not expandable|ui_bool %}
                <div class="{{ heading_wrapper_class }}">{% with content_tag="div" %}{% partial group_control %}{% endwith %}</div>
            {% else %}
                <c-ui.heading as="{{ heading_as }}" size="{% if heading_size != "inherit" %}{{ heading_size }}{% else %}2{% endif %}" color="inherit" class="{{ heading_wrapper_class }}">
                    {% with content_tag="span" %}{% partial group_control %}{% endwith %}
                </c-ui.heading>
            {% endif %}
            {% if actions %}<div class="{{ actions_class }}" data-ui-sidebar-group-actions data-ui-sidebar-actions>{{ actions }}</div>{% endif %}
        </div>
    {% endif %}
    <div id="{{ group_id }}-content" class="{{ content_class }}" data-ui-sidebar-group-content {% if expandable|ui_bool and not expanded|ui_bool %}hidden inert aria-hidden="true"{% endif %}>
        <div data-ui-sidebar-group-content-inner>{{ slot }}</div>
    </div>
</li>

{% endwith %}