{# API #}
{%- set props = props | default([]) -%}
{%- set _id = props.id -%}
{%- set _labelledById = props.labelledById -%}
{%- set _parent = props.parent | default(null) -%}
{%- set _isOpen = props.isOpen | default(false) -%}

{# Class names #}
{%- set _rootClassName = _spiritClassPrefix ~ 'Collapse' -%}
{%- set _collapseClassName = _spiritClassPrefix ~ 'Collapse__content' -%}
{%- set _accordionClassName = _spiritClassPrefix ~ 'Accordion__content' -%}
{%- set _isOpenClassName = _isOpen ? 'is-open' : null -%}

{# Attributes #}
{%- set _idAttr = _id ? 'id="' ~ _id | escape('html_attr') ~ '"' : null -%}
{%- set _labelledIdAttr = _labelledById ? 'aria-labelledby="' ~ _labelledById | escape('html_attr') ~ '"' : null -%}
{%- set _dataParentAttr = _parent ? 'data-spirit-parent="' ~ _parent | escape('html_attr') ~ '"' : null -%}

{# Miscellaneous #}
{%- set _styleProps = useStyleProps(props) -%}
{%- set _collapseClassNames = [ _rootClassName, _isOpenClassName ] -%}
{%- set _contentClassNames = [ _accordionClassName, _styleProps.className ] -%}
{%- set _mainPropsWithoutId = props | filter((value, prop) => prop is not same as('id')) -%}

<div
    {{ mainProps(_mainPropsWithoutId) }}
    {{ styleProp(_styleProps) }}
    {{ _idAttr | raw }}
    {{ classProp(_collapseClassNames) }}
    {{ _labelledIdAttr | raw }}
    {{ _dataParentAttr | raw }}
>
    <div class="{{ _collapseClassName }}">
        <div {{ classProp(_contentClassNames) }}>
            {% block content %}{% endblock %}
        </div>
    </div>
</div>
