Как показать усеченный текст при наведении курсора с помощью angular-tree-component?

Question

Мне нужно ограничить ширину компонента angular-tree-tree - это приводит к тому, что некоторые узлы имеют текст больше, чем ширина. Я обрезаю этот текст, но хочу, чтобы он расширялся при наведении курсора в одну строку.

Вот поведение, которое я хочу (наведите указатель мыши на любой узел, чтобы увидеть полный текст) - https://stackblitz.com/edit/angular-eqhwwm?file=src%2Fstyles.css Но поскольку я используюposition: fixed, немного прокручивая страницу и наводя на нее курсор, появляется узел там, где он был бы без прокрутки.

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

.node-content-wrapper:hover {
  text-overflow: clip;
  white-space: normal;
  word-break: break-word;
}