{{!
    This file is part of Moodle - http://moodle.org/

    Moodle is free software: you can redistribute it and/or modify
    it under the terms of the GNU General Public License as published by
    the Free Software Foundation, either version 3 of the License, or
    (at your option) any later version.

    Moodle is distributed in the hope that it will be useful,
    but WITHOUT ANY WARRANTY; without even the implied warranty of
    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
    GNU General Public License for more details.

    You should have received a copy of the GNU General Public License
    along with Moodle.  If not, see <http://www.gnu.org/licenses/>.
}}
{{!
    @template core_message/message_drawer_lazy_load_list

    This template will render a lazy loaded list for the message drawer.

    Classes required for JS:
    * none

    Data attributes required for JS:
    * All data attributes are required

    Context variables required for this template:
    * userid The logged in user id
    * urls The URLs for the popover

    Example context (json):
    {}

}}
<div
    class="{{$rootclasses}}{{/rootclasses}} lazy-load-list"
    aria-live="polite"
    data-region="lazy-load-list"
    role="list"
    data-user-id="{{loggedinuser.id}}"
    {{$rootattributes}}{{/rootattributes}}
>
    {{$notification}}{{/notification}}
    <div class="hidden text-center" data-region="empty-message-container">
        <div class="alert alert-warning mx-3 mb-3 d-flex align-items-center">
            <svg class="mr-2" width="24" height="24" fill="none" viewBox="0 0 24 24">
                <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M4.75 6.75C4.75 5.64543 5.64543 4.75 6.75 4.75H17.25C18.3546 4.75 19.25 5.64543 19.25 6.75V14.25C19.25 15.3546 18.3546 16.25 17.25 16.25H14.625L12 19.25L9.375 16.25H6.75C5.64543 16.25 4.75 15.3546 4.75 14.25V6.75Z"></path>
                <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8V10"></path>
                <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M12.5 13C12.5 13.2761 12.2761 13.5 12 13.5C11.7239 13.5 11.5 13.2761 11.5 13C11.5 12.7239 11.7239 12.5 12 12.5C12.2761 12.5 12.5 12.7239 12.5 13Z"></path>
            </svg>
            <span>{{$emptymessage}}{{/emptymessage}}</span>
        </div>
    </div>
    <div class="hidden list-group px-3 pb-1" data-region="content-container">
        {{$content}}{{/content}}
    </div>
    <div class="list-group px-3 pb-1" data-region="placeholder-container">
        {{$placeholder}}{{/placeholder}}
    </div>
    <div class="w-100 text-center p-3 hidden" data-region="loading-icon-container" >
        {{> core/loading }}
    </div>
</div>
