<c-ui.combobox.impl name="{{ name }}"
                    value="{{ value }}"
                    placeholder="{{ placeholder }}"
                    required="{{ required }}"
                    disabled="{{ disabled }}"
                    invalid="{{ invalid }}"
                    clearable="True"
                    auto_highlight="True"
                    label="{{ label }}"
                    class="{{ class }}"
                    :attrs="attrs">
    {% for group in groups %}
        {% if group.label %}
            <c-ui.combobox.group>
                <c-ui.combobox.label>
                    {{ group.label }}
                </c-ui.combobox.label>
                {% for option in group.options %}
                    <c-ui.combobox.option value="{{ option.value }}"
                                          selected="{{ option.selected }}"
                                          disabled="{{ option.disabled }}"
                                          :attrs="option.attrs">
                        {{ option.label }}
                    </c-ui.combobox.option>
                {% endfor %}
            </c-ui.combobox.group>
        {% else %}
            {% for option in group.options %}
                <c-ui.combobox.option value="{{ option.value }}"
                                      selected="{{ option.selected }}"
                                      disabled="{{ option.disabled }}"
                                      :attrs="option.attrs">
                    {{ option.label }}
                </c-ui.combobox.option>
            {% endfor %}
        {% endif %}
    {% endfor %}
    <c-ui.combobox.empty>
        No options found.
    </c-ui.combobox.empty>
</c-ui.combobox.impl>