{% load ui_assets ui_classes ui_props %}
{% ui_require_asset "trellis:radio" %}

<c-vars name=""
        value=""
        orientation="vertical"
        variant="default"
        color="neutral"
        interaction=""
        indicator="True"
        placement="leading"
        disabled="False"
        required="False"
        invalid="False"
        loop="True"
        class="" />
{% ui_class "ui.radio" "group" orientation=orientation variant=variant class=class as group_class %}
<div x-data="UiRadioGroup"
     data-ui-radio-group
     {% if variant == "menu" %}data-ui-menu-group{% endif %}
     data-orientation="{{ orientation }}"
     data-variant="{{ variant }}"
     {% if variant == "cards" or variant == "pills" %}data-ui-selection-color data-color="{{ color }}" data-interaction="{% if interaction %}{{ interaction }}{% elif variant == "cards" %}combined{% else %}tonal{% endif %}"{% endif %}
     data-placement="{{ placement }}"
     data-prop-value="{{ value }}"
     {% if not indicator|ui_bool %}data-indicator="false"{% endif %}
     {% if name %}data-name="{{ name }}"{% endif %}
     {% if disabled|ui_bool %}data-prop-disabled data-disabled{% endif %}
     {% if required|ui_bool %}data-prop-required data-required{% endif %}
     {% if invalid|ui_bool %}data-prop-invalid data-invalid{% endif %}
     {% if not loop|ui_bool %}data-loop="false"{% endif %}
     role="{% if variant == 'menu' %}group{% else %}radiogroup{% endif %}"
     aria-orientation="{{ orientation }}"
     class="{{ group_class }}"
     {{ attrs }}>
    {{ slot }}
</div>