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

Длинный список вкладок можно разместить вертикально, чтобы все элементы были видны без прокрутки. Для включения используется атрибут vertical.

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

Настраивается при помощи атрибута underlined.

Неактивную вкладку нельзя выбрать, она не имеет интерактивных состояний.

Если нужно обозначить, что внутри вкладки пусто, используйте атрибут empty. Такую вкладку можно выбрать, она имеет интерактивные состояния.

Не используйте пустые вкладки вместе с неактивными. Они внешне похожи — это запутает пользователя.

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

Когда вертикальные вкладки не помещаются по высоте, появляется скроллбар.

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

Внешний вид вкладок можно настроить под особый дизайн в продукте, при помощи директивы kbq-tab-label.

KbqTabNavBar в отличии от KbqTabGroup используется для навигации между различными страницами или разделами приложения (при помощи routerLink).

Клавиша	Действие
←	Переместить фокус на предыдущую вкладку
→	Переместить фокус на следующую вкладку
Home	Переместить фокус на первую вкладку
End	Переместить фокус на последнюю вкладку
Space / Enter	Переключиться на сфокусированную вкладку

Используйте вкладки:

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

Не используйте вкладки:

• Когда весь контент можно разместить на одной странице, на одном экране. Незачем прятать отдельные части во вкладки.
• Для выбора значения в формах. Не путай вкладки с полями ввода: радиокнопками, кнопками-переключателями.
• Для основной навигации. Для этого есть компонент Navbar.
• Когда надо изменить представление одних и тех же данных (список, плитка, таблица). Взамен используйте кнопку-меню или кнопку-переключатель.
• Когда контент уже вложен во вкладку. В том числе нельзя одновременно использовать вертикальные и горизонтальные вкладки. Вместо этого сократите количество вкладок, используйте только один вид вкладок или кнопку-переключатель, кнопку-меню.
• Когда предполагается всего один таб. В этом случае панель вкладок вовсе не нужна.
• Для обозначения шагов в форме-мастере. По внешним признакам вкладки похожи на шаги, и дизайнеру стоит избегать этой путаницы, поэтому стилизовать эти элементы нужно по‑разному. Полезно подстраховаться и оставить заметку для разработчика. Например: обрати внимание, это не вкладки, а шаги формы.