Компонент для автоматического скрытия элементов с динамической адаптацией под ширину контейнера.
Поддерживает два режима работы:
Настраивается при помощи атрибута reverseOverflowOrder.
Порядок скрываемых элементов задается с помощью атрибута order для директивы KbqOverflowItem.
Если необходимо, чтобы некоторые элементы всегда оставались видимыми, можно использовать атрибут alwaysVisible для директивы KbqOverflowItem.
Выравнивание элементов внутри контейнера задается с помощью CSS-свойства justify-content.
По умолчанию скрытие элементов происходит по горизонтали. Если необходимо скрывать элементы по вертикали, можно использовать атрибут orientation="vertical".
Задержка скрытия/отображения элементов задается с помощью атрибута debounceTime. Включение этой опции позитивно
сказывается на производительности при большом количестве элементов, либо при частых изменениях размера контейнера.
<div kbqOverflowItems [debounceTime]="300">...</div>
Иногда размер контейнера может изменяться не только при изменении размера окна браузера, но и при изменении размеров других элементов на странице (например: Sidebar). Для отслеживания таких изменений можно использовать атрибут additionalResizeObserverTargets.
Атрибут принимает либо один элемент, либо массив элементов, изменение размеров которых приведет к пересчету скрытых элементов. По умолчанию отслеживается document.body.
<div kbqOverflowItems [additionalResizeObserverTargets]="sidebarContainerElement">...</div>