Footer tooltip appears away from cursor

[darrenburns]

I think it's related to the margin on the toolip and how that interacts with the constrain: inflect CSS rule.

(No MRE as we discussed this in office and Will has context for it)

[willmcgugan]

The tooltip will be positioned at the mouse cursor, offset by the Tooltip widget's margin. The constrain: reflect will adjust the position if it might be cropped off-screen.

That seems to do the correct thing from what I can tell. What additional styles did you set on the tooltip?

from textual.app import App, ComposeResult
from textual.binding import Binding
from textual.widgets import Footer


class MyApp(App):
    CSS = """
    Tooltip {
        border: tall red;
    }
    """

    BINDINGS = [
        Binding("a", "app.bell", "Ding", tooltip="I am a tooltip"),
        Binding("b", "bar", "Bar Bar Bar", tooltip="There can be only one"),
        Binding("c", "baz", "Baz Baz Baz", tooltip="I'm too old for this shit"),
        Binding("d", "egg", "Egg Egg Egg", tooltip="Get away from here, you b****!"),
    ]

    def compose(self) -> ComposeResult:
        yield Footer()


MyApp().run()

[darrenburns]

I can see the behaviour that I consider "weird" in your example app too.

It seems a bit far away from the cursor for me (so far that I assumed it was a bug), to the point where it almost doesn't feel like a "tooltip" associated with the key in the footer. Kind of like it's detached.

When we chatted about it, I think we agreed the inflect behaviour felt wrong - should the tooltip not just appear above where the cursor is? If it runs out of space, rather than "inflecting", should it not just "slide horizontally a bit" so that it's not clipping off screen.

[willmcgugan]

You can change the margin so that it is a bit closer to the cursor. the tall / wide borders add additional space, so might benefit from a change in margin.

It feels right to me. I like the way that a corner points to the thing being hovered. But I'm not apposed to offering alternatives. We have only a single value for constrain, but we could also offer the "slide horizontally" alternative.

We might also want to be able to change the default position of the tooltip, like centered above / below. From a bit of googling, it seems that is more typical than the current up and right a bit behavior.

[github-actions]

Don't forget to star the repository!

Follow @textualizeio for Textual updates.