Tooltip

Tooltip shows a small text hint near another widget.

It is best for short, non-essential explanations such as clarifying an icon button or revealing a keyboard shortcut. A tooltip is not a good place for required instructions, form validation, or workflow-critical information because it may only appear on hover and it disappears quickly.

Fission keeps the state model straightforward here. The widget can become visible because the runtime reports that its trigger is hovered, or because you explicitly force is_visible to true. The tooltip itself does not own any hidden text state or timing state.

Example

use fission::core::WidgetNodeId;
use fission::core::ui::{Button, Text};
use fission::prelude::*;

let help = Tooltip {
    id: WidgetNodeId::explicit("save_tooltip"),
    child: Box::new(
        Button {
            child: Some(Box::new(Text::new("Save").into_node())),
            on_press: Some(save_changes),
            ..Default::default()
        }
        .build(ctx, view),
    ),
    text: "Save your draft without publishing".into(),
    is_visible: false,
}
.build(ctx, view);

Field table

Field	Type	Meaning	Notes / default behavior
id	WidgetNodeId	Stable identity for the trigger anchor and portal entry.	Required. The widget derives its hover anchor from this id.
child	Box<Node>	Trigger content rendered inline.	Required. This is the thing the tooltip is attached to.
text	String	Tooltip message text.	Required. Keep it short. The current implementation caps width at 220.0 logical pixels.
is_visible	bool	Force the tooltip visible even without hover.	Defaults to false. Useful for demos, audits, or non-hover-driven reveal logic.

Overlay behavior

The trigger stays in the normal layout tree. When the tooltip should appear, the widget builds a small card and registers it in the flyout portal layer. The same anchor-positioning rules used by other flyout-based overlays keep it near the trigger and inside the viewport.

Specific advice

Use tooltips sparingly. If many controls need tooltips before they make sense, the underlying user interface probably needs stronger labels or clearer structure.

Also be realistic about targets. Hover is a desktop and pointer-heavy web concept. On touch-first screens, a tooltip is often the wrong pattern entirely. Prefer inline helper text, a Popover, or a clearly labeled control.

Related

Popover, flyout, Button, and FormControl.