{{!
    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 mod_forum/local/grades/local/grader/user_picker

    Classes required for JS:
    * none

    Data attributes required for JS:
    * data-region="user_picker/user"
    * data-action="change-user"
    * data-direction="-1"
    * data-direction="1"
    * data-action="search-user"

    Context variables required for this template:
    * none

    Example context (json):
    {
    }
}}

<div class="d-flex align-items-center user-picker-container mb-2 py-2">
    <div aria-live="polite" data-region="user_picker/current_user"  class="sr-only"></div>
    <div class="d-flex align-items-center overflow-hidden" data-region="user_picker/user"></div>
    <div class="me-auto flex-shrink-0">
        <nav aria-label="{{#str}} usernavigation, mod_forum {{/str}}">
            <ul class="pagination mb-0">
                <li class="page-item">
                    <button
                        class="page-link icon-no-margin p-0 text-reset icon-size-3"
                        href="#"
                        aria-label="{{#str}} previoususer, mod_forum {{/str}}"
                        data-action="change-user"
                        data-direction="-1"
                        title="{{#str}} previoususer, mod_forum {{/str}}"
                    >
                        <span class="dir-ltr-hide">{{#pix}} i/next, core {{/pix}}</span>
                        <span class="dir-rtl-hide">{{#pix}} i/previous, core {{/pix}}</span>
                    </button>
                </li>
                <li class="page-item">
                    <button
                        class="page-link icon-no-margin p-0 text-reset icon-size-3 ms-2"
                        href="#"
                        aria-label="{{#str}} nextuser, mod_forum {{/str}}"
                        data-action="change-user"
                        data-direction="1"
                        title="{{#str}} nextuser, mod_forum {{/str}}"
                    >
                        <span class="dir-ltr-hide">{{#pix}} i/previous, core {{/pix}}</span>
                        <span class="dir-rtl-hide">{{#pix}} i/next, core {{/pix}}</span>
                    </button>
                </li>
            </ul>
        </nav>
    </div>
</div>