{% load ui_classes ui_props %}

<c-vars side="bottom"
        align="start"
        offset="0"
        gap="4"
        open="False"
        disabled="False"
        class="" />
{% ui_class "ui.dropdown" "root" class=class as root_class %}
<div x-data="UiDropdown"
     x-bind="root"
     data-ui-dropdown
     data-state="closed"
     data-side="{{ side }}"
     data-align="{{ align }}"
     data-offset="{{ offset }}"
     data-gap="{{ gap }}"
     data-open="{{ open }}"
     {% if disabled|ui_bool %}data-disabled="true"{% endif %}
     data-class="{{ class }}"
     class="{{ root_class }}"
     {{ attrs }}>
    {{ slot }}
</div>