Директива kbq-title показывает тултип с полным текстом, когда содержимое элемента не помещается и обрезается многоточием. Подсказка появляется только при реальном переполнении — по наведению курсора или фокусе с клавиатуры — и не отвлекает, если текст виден целиком.

• Тултип появляется только при переполнении текста — по горизонтали или по вертикали (при обрезке по строкам). Если текст помещается, подсказка не показывается.
• Работает как с простым текстом, так и со сложной вложенной разметкой через шаблонные ссылки #kbqTitleContainer (измеряемый контейнер) и #kbqTitleText (текстовый элемент).
• Поддерживает несколько текстовых элементов #kbqTitleText: подсказка показывается, если переполнен хотя бы один из них.
• Позволяет задать собственное содержимое подсказки — строку или шаблон — через атрибут [kbq-title].
• Автоматически отслеживает изменение содержимого и размера окна и пересчитывает переполнение.
• Доступность: подсказка открывается при фокусе с клавиатуры и закрывается при потере фокуса.

Чтобы корректно определять переполнение во вложенной разметке, отметьте измеряемый контейнер ссылкой #kbqTitleContainer, а текстовый элемент — ссылкой #kbqTitleText. Директива сравнивает размеры контейнера и текста и показывает подсказку, когда текст не помещается.

<div kbq-title>
    <div #kbqTitleContainer>
        <div #kbqTitleText>{{ value }}</div>
    </div>
</div>

Если в контейнере несколько текстовых элементов (например, имя и значение в пайпе фильтр-бара), отметьте каждый из них ссылкой #kbqTitleText. Подсказка появится, если переполнен хотя бы один элемент.

Директива учитывает не только горизонтальное, но и вертикальное переполнение. Это полезно, когда текст обрезается по нескольким строкам (-webkit-line-clamp).

По умолчанию в подсказку попадает обрезанный текст элемента. Чтобы задать собственное содержимое, передайте в атрибут [kbq-title] строку или ссылку на шаблон (TemplateRef). Это удобно, когда нужно показать форматированный текст или дополнительную информацию.

В двустрочных опциях списка можно обойтись одной директивой kbq-title на всю опцию. Отметьте обе строки (название и описание) ссылкой #kbqTitleText, а общий контейнер — ссылкой #kbqTitleContainer. Подсказка появится, если переполнена хотя бы одна из строк, и покажет полный текст опции.

• Используйте kbq-title для текста, который может обрезаться: заголовки, ячейки таблиц, значения в фильтрах и списках.
• Если подсказка должна показываться всегда (а не только при переполнении) или содержать интерактивные элементы, используйте Tooltip или Popover.
• Держите содержимое подсказки кратким и понятным.