{# API #}
{%- set props = props | default([]) -%}
{%- set _className = props.className -%}
{%- set _elementType = props.elementType | default('div') -%}
{%- set _id = props.id | default(null) -%}
{%- set _unsafeValidationText = props.UNSAFE_validationText | default(null) -%}
{%- set _validationState = props.validationState | default(null) -%}
{%- set _validationText = props.validationText | default(null) -%}

{# Attributes #}
{%- set _idAttr = _id ? 'id="' ~ _id | escape('html_attr') ~ '"' : null -%}

{% if _validationState and _validationText and not _unsafeValidationText %}
    {%- if _validationText is iterable -%}
        <{{ _elementType }} class="{{ _className }}" {{ _idAttr | raw }}>
            <ul>
                {% for _validationTextItem in _validationText %}
                    <li>{{ _validationTextItem }}</li>
                {% endfor %}
            </ul>
        </{{ _elementType }}>
    {% else %}
        <{{ _elementType }} class="{{ _className }}" {{ _idAttr | raw }}>
            {{ _validationText }}
        </{{ _elementType }}>
    {%- endif -%}
{% endif %}
{% if _validationState and _unsafeValidationText %}
    {%- if _unsafeValidationText is iterable -%}
        <{{ _elementType }} class="{{ _className }}" {{ _idAttr | raw }}>
            <ul>
                {% for _validationTextItem in _unsafeValidationText %}
                    <li>{{ _validationTextItem | raw }}</li>
                {% endfor %}
            </ul>
        </{{ _elementType }}>
    {% else %}
        <{{ _elementType }} class="{{ _className }}" {{ _idAttr | raw }}>
            {{ _unsafeValidationText | raw }}
        </{{ _elementType }}>
    {%- endif -%}
{% endif %}
