Tooltip Multiline Text Formatting Issue in Flow UI

Support
#1

I’m trying to add a multiline tooltip to a JmixTextArea component in a Flow UI view. I’m using Tooltip.setManual(true) and setting the tooltip text using tooltip.setText(...).

However, whether I use \n or <br> tags in the string, the tooltip content is always rendered as a single line without any line breaks.

Here’s a simplified version of my code:

Tooltip tooltip = promptField.getTooltip();
tooltip.setManual(true);
tooltip.setPosition(Tooltip.TooltipPosition.END);
tooltip.setText(
    "line1\n" +
    "line2\n
    // ... more lines
);

I also tried using HTML in the tooltip text like this:
tooltip.setText("<b>line1</b><br>• line2<br>• line3");

But it still renders as a single line with the raw tags or escaped characters.

I would prefer not to use a Dialog or PopupView, and I’m just looking for a way to show simple multiline text in a tooltip. Is there any workaround or configuration that allows tooltips to support multiline content?

#2

Hi, @sjahongir221

You can add the following CSS style for the Vaadin tooltip content:

vaadin-tooltip-overlay::part(content) {
    white-space: pre;
}

This should work with the \n tags.

Regards,
Maria.

1 Like
#3

Hi @m.orlova

Thanks a lot! Your solution worked perfectly