{%- macro onsMessageList(params) -%}
    <ul class="ons-message-list" aria-label="{{ params.ariaLabel | default("Message List") }}">
        {% for message in params.messages %}
            <li class="ons-message-item" aria-labelledby="{{ message.id }}">
                <h3 class="ons-message-item__subject" id="{{ message.id }}">
                    <a href="{{ message.subject.url }}" class="ons-u-fs-r--b">{{ message.subject.text }}</a>
                    {% if message.unread %}<span class="ons-message-item__unread ons-u-fs-s">({{ params.unreadText }})</span>{% endif %}
                </h3>
                <dl class="ons-message-item__metadata" aria-label="{{ params.ariaLabelMetaData | default('Message metadata') }}">
                    <dt class="ons-message-item__metadata-term ons-message-item__metadata-term--from ons-u-vh">{{ params.fromLabel }}:</dt>
                    <dd class="ons-message-item__metadata-value ons-message-item__metadata-value--from ons-u-fs-r--b">
                        {{ message.fromText }}
                    </dd>
                    <dt class="ons-message-item__metadata-term ons-message-item__metadata-term--date ons-u-vh">{{ params.dateLabel }}:</dt>
                    <dd class="ons-message-item__metadata-value ons-message-item__metadata-value--date ons-u-fs-s">
                        {{ message.dateText }}
                    </dd>
                    <dt class="ons-message-item__metadata-term ons-message-item__metadata-term--body ons-u-vh">
                        {{ params.bodyLabel | default("Message text") }}:
                    </dt>
                    <dd class="ons-message-item__metadata-value ons-message-item__metadata-value--body ons-u-fs-r ons-u-mt-s">
                        {{ message.body | safe }}
                    </dd>
                </dl>
                <div class="ons-message-item__link ons-u-vh">
                    <a href="{{ message.subject.url }}">{{ params.hiddenReadLabel }}: {{ message.subject.text }}</a>
                </div>
            </li>
        {% endfor %}
    </ul>
{%- endmacro -%}
