{# Each item submits its form with field = the value chosen; with `multiple`, field.value is comma-separated and each item submits the set with itself toggled. #}
{% props field: Field, options: Vec<(String, String)>, label: String, multiple: bool = false, variant: String = "", size: String = "" %}
{%- let chosen: Vec<&str> = field.value.split(',').filter(|v| !v.is_empty()).collect() %}
{%- if multiple %}
<div class="ui-toggle-group"{% if !variant.is_empty() %} data-variant="{{ variant }}"{% end %} role="group" aria-label="{{ label }}" data-ui="toggle-group" data-type="multiple">
{%- for (value, text) in options.iter() %}
{%- let on = chosen.contains(&value.as_str()) %}
{%- let next = options.iter().filter(|(v, _)| (v == value) != chosen.contains(&v.as_str())).map(|(v, _)| v.as_str()).collect::<Vec<_>>().join(",") %}
<button class="ui-toggle"{% if !size.is_empty() %} data-size="{{ size }}"{% end %} name="{{ field.name }}" value="{{ next }}" aria-pressed="{{ on }}">{{ text }}</button>
{%- end %}
</div>
{%- else %}
<div class="ui-toggle-group"{% if !variant.is_empty() %} data-variant="{{ variant }}"{% end %} role="radiogroup" aria-label="{{ label }}" data-ui="toggle-group" data-type="single">
{%- for (value, text) in options.iter() %}
<button class="ui-toggle"{% if !size.is_empty() %} data-size="{{ size }}"{% end %} name="{{ field.name }}" value="{{ value }}" role="radio" aria-checked="{{ *value == field.value }}"{% if *value == field.value %} data-state="on"{% end %}>{{ text }}</button>
{%- end %}
</div>
{%- end %}