{% set id = id|default('default-id') %}
{% set name = name|default('default-name') %}
{% set checked = checked|default(false) %}
{% set _css_class = 'ecl-radio' %}
{% set _extra_attributes = '' %}
{% if has_error is defined and has_error == true %}
{% set _css_class = _css_class ~ ' ecl-radio--has-error' %}
{% endif %}
{% if is_disabled is defined and is_disabled == true %}
{% set _css_class = _css_class ~ ' ecl-radio--is-disabled' %}
{% endif %}
{% if extra_classes is defined %}
{% set _css_class = _css_class ~ ' ' ~ extra_classes %}
{% endif %}
{% if extra_attributes is defined %}
{% for attr in extra_attributes %}
{% set _extra_attributes = _extra_attributes ~ ' ' ~ attr.name ~ '="' ~ attr.value ~'"' %}
{% endfor %}
{% endif %}
{% embed '@ec-europa/ecl-forms-labels' with { 'for': id, 'extra_classes': _css_class, 'extra_attributes': _extra_attributes, _id: id, _value: value, _name: name, _label: label, _checked: checked, _is_disabled: is_disabled } only %}
{% block label %}{% spaceless %}
<input class="ecl-radio__input ecl-u-sr-only" type="radio" id="{{ _id }}" value="{{ _value }}" name="{{ _name }}"{{ _checked ? ' checked' : '' }}{{ (_is_disabled is defined and _is_disabled == true) ? ' disabled' : '' }} />
<span class="ecl-radio__label">{{ _label }}</span>
{% endspaceless %}{% endblock %}
{% endembed %}
{
"id": "opt-1",
"name": "opt-1",
"value": "opt-1",
"label": "Default"
}
{
"id": "opt-2",
"name": "opt-2",
"value": "opt-2",
"label": "Checked option",
"checked": true
}
{
"id": "opt-3",
"name": "opt-3",
"value": "opt-3",
"label": "Disabled option",
"is_disabled": true
}
{
"id": "opt-4",
"name": "opt-4",
"value": "opt-4",
"label": "Option with error",
"has_error": true
}
<label class="ecl-form-label ecl-radio"><input class="ecl-radio__input ecl-u-sr-only" type="radio" id="opt-1" value="opt-1" name="opt-1" /><span class="ecl-radio__label">Default</span></label>
<label class="ecl-form-label ecl-radio"><input class="ecl-radio__input ecl-u-sr-only" type="radio" id="opt-2" value="opt-2" name="opt-2" checked /><span class="ecl-radio__label">Checked option</span></label>
<label class="ecl-form-label ecl-radio ecl-radio--is-disabled"><input class="ecl-radio__input ecl-u-sr-only" type="radio" id="opt-3" value="opt-3" name="opt-3" disabled /><span class="ecl-radio__label">Disabled option</span></label>
<label class="ecl-form-label ecl-radio ecl-radio--has-error"><input class="ecl-radio__input ecl-u-sr-only" type="radio" id="opt-4" value="opt-4" name="opt-4" /><span class="ecl-radio__label">Option with error</span></label>