Определение

Pagination (Пагинация) — это элемент управления интерфейсом, используемый для навигации по большим наборам данных, разбросанных по нескольким страницам. Пагинация позволяет пользователям переходить к следующей, предыдущей, первой, последней или определенным страницам в нижней части насыщенных контентом интерфейсов, таких как таблицы или списки.

Функциональность

Позволяет показывать данные по частям, что делает страницы легче для восприятия.

Обеспечивает легкий доступ к нужной странице через номера страниц или кнопки “Вперед” и “Назад”.

Уменьшает перегруженность страницы большим объемом информации, распределяя контент на логические блоки.

Чаще всего пагинация используется в компоненте Таблица (Table) для удобной навигации по большим объемам данных.

Дизайн и Стиль

Размер и Форма

Пагинация обычно представляется в виде строки с кнопками для перехода между страницами, а также выпадающими списками для выбора конкретной страницы и количества отображаемых элементов на странице. 

Также отображается счетчик всех элементов, находящихся в таблице и количество всех страниц, что позволяет пользователям видеть общее количество доступных данных и ориентироваться при выборе страницы для просмотра.

Цвет и Контраст

Соблюдайте общие цветовые правила дизайн-системы. Палитра Plex отвечает стандартам контрастности WCAG.

Варианты

Навигация по страницам

Двойные стрелки позволяют быстро перейти на самую первую или самую последнюю страницу.

Одиночные стрелки дают возможность перейти на предыдущую или следующую страницу.

Количество элементов

В выпадающем списке выбора количества отображаемых элементов, используются следующие значения:

• 25 (Используется по умолчанию)
• 50
• 100

Анатомия

Для понимания анатомии входящих компонентов смотри примеры Кнопка (Button) ,
Поле ввода (Input), Метка (Label)