Pagination

Компонент позволяет пользователям просматривать контент по страницам — например, в таблицах.

§Применение

✅ Когда применять

• Для всех случаев с постраничным выводом.
• Если может потребоваться «перепрыгнуть» через несколько страниц или сразу перейти к нужной.
• В тех случаях, когда будет полезно настраивать отображение числа строк.
• Для фиксирования размера блоков внутри страницы, чтобы автоматическая подгрузка контента верхнего постоянно не сдвигала нижний.

🚫 Когда не следует применять

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

§Структура

1. Текущая страница — показывает порядковый номер отображаемой страницы.
2. Предыдущая страница — открывает предыдущую страницу.
3. Следующая страница — открывает следующую страницу.
4. Последняя страница контента — показывается, если известно общее количество контента и его можно сразу поделить на страницы. По клику открывает последнюю страницу.
5. Иконка переполнения — появляется, если страниц больше, чем 4.
6. Переключатели вперед/назад — переключают страницы по порядку.
7. Переход к первой странице — открывает первую страницу контента.
8. Переход к конкретной странице — при вводе номера страницы и нажатии на Enter открывает указанную страницу.
9. Количество элементов на одной странице — переключатель количества отображаемых элементов на одной странице.

Использовать все элементы структуры вместе не обязательно. Доступные конфигурации перечислены в разделе «Модификации».

§Размеры

По умолчанию размер кнопок, инпута и селекта в пагинаторе — M.

§Состояния

First page — отображение первой страницы.

Second/next page — состояние отображение второй и последующих страниц.

Last page — отображение последней страницы.

§Модификации

1. Page Size Options and Show Input — при отсутствии возможности переходить к конкретной странице или управлять количеством отображаемого на странице контента можно отключать эти поля.
2. Total Unknown — вариант с отображением только текущей страницы. Используется, когда неизвестно общее количество элементов
3. Hide Pages — переключатели страниц без порядкового номера. Используется, когда список элементов динамический и количество страниц и порядковый номер будет все время меняться и путать пользователя.
4. Compact — компактный вариант без текста. Используется, когда область интерфейса ограничена (например, диалоговое окно)

Для интерфейсов мобильных устройств можно использовать мобильную версию пагинатора.