Группа кнопок
Навигация по записям
Навигация по записям, где переход к краю и переход на шаг различаются формой значка, а под сцепкой лежит тонкая полоса положения.
Что можно поменять
- текущий номер через index
- число записей через total
- слово в счётчике через entity и имя навигации через label
Ссылка для ИИ-агента: в ней превью, код и инструкция.
Превью
Использовать с ИИ
- 1. Скопируйте ссылку.
- 2. Напишите агенту своими словами и вставьте её в предложение.
- 3. Агент откроет ссылку и поставит компонент из реестра.
добавь это на главную первым экраном:
https://vibeui.ru/c/buttongroup-043?theme=dark
Не знаете, куда вставить? Пошаговый гайд
Показать полную инструкцию
То, что лежит по ссылке в развёрнутом виде. Нужна, если агент не может открыть ссылку — тогда вставьте этот текст целиком.
Загружается…
Для разработчика
Команда установки — в блоке «Исходник компонента» ниже: подписанная ссылка действует сутки.
Технические заметки
Компонент самодостаточен: один файл, без зависимостей, собственная палитра в переменных --vibeui-buttongroup-043-*. Серверный: индекс приходит пропсом и зажимается в диапазон 1..total. Стрелка с планкой означает «до упора», стрелка без планки — «на шаг»: разница читается формой, а не подписью. Крайние кнопки гасятся парами — на первой записи бессмысленны обе левые. Полоса положения под сцепкой построена на процентной ширине от индекса и помечена aria-hidden, потому что то же самое сказано текстом «Запись 12 из 340». Счётчик набран табличными цифрами и имеет min-width, иначе переход через сотню дёргает кнопки. Рамка одна на треке, разделители рисует общий селектор > * + *.
Теги
- buttongroup
- navigation
- records
- progress
Исходник компонента
Тот же файл, который поставит агент. Нужен, если вы предпочитаете скопировать код руками.
Загружается…