Support interactive widgets in tooltips (#4596)

* Closes https://github.com/emilk/egui/issues/1010

### In short
You can now put interactive widgets, like buttons and hyperlinks, in an
tooltip using `on_hover_ui`. If you do, the tooltip will stay open as
long as the user hovers it.

There is a new demo for this in the egui demo app (egui.rs):


![interactive-tooltips](https://github.com/emilk/egui/assets/1148717/97335ba6-fa3e-40dd-9da0-1276a051dbf2)

### Design
Tooltips can now contain interactive widgets, such as buttons and links.
If they do, they will stay open when the user moves their pointer over
them.

Widgets that do not contain interactive widgets disappear as soon as you
no longer hover the underlying widget, just like before. This is so that
they won't annoy the user.

To ensure not all tooltips with text in them are considered interactive,
`selectable_labels` is `false` for tooltips contents by default. If you
want selectable text in tooltips, either change the `selectable_labels`
setting, or use `Label::selectable`.

```rs
ui.label("Hover me").on_hover_ui(|ui| {
    ui.style_mut().interaction.selectable_labels = true;
    ui.label("This text can be selected.");

    ui.add(egui::Label::new("This too.").selectable(true));
});
```

### Changes
* Layers in `Order::Tooltip` can now be interacted with

crates/egui_demo_lib/src/demo/demo_app_windows.rs

@@ -42,6 +42,7 @@ impl Default for Demos {
             Box::<super::table_demo::TableDemo>::default(),
             Box::<super::text_edit::TextEditDemo>::default(),
             Box::<super::text_layout::TextLayoutDemo>::default(),
+            Box::<super::tooltips::Tooltips>::default(),
             Box::<super::widget_gallery::WidgetGallery>::default(),
             Box::<super::window_options::WindowOptions>::default(),
             Box::<super::tests::WindowResizeTest>::default(),

crates/egui_demo_lib/src/demo/misc_demo_window.rs

@@ -233,7 +233,6 @@ fn label_ui(ui: &mut egui::Ui) {
 #[cfg_attr(feature = "serde", serde(default))]
 pub struct Widgets {
     angle: f32,
-    enabled: bool,
     password: String,
 }
 
@@ -241,7 +240,6 @@ impl Default for Widgets {
     fn default() -> Self {
         Self {
             angle: std::f32::consts::TAU / 3.0,
-            enabled: true,
             password: "hunter2".to_owned(),
         }
     }
@@ -249,38 +247,11 @@ impl Default for Widgets {
 
 impl Widgets {
     pub fn ui(&mut self, ui: &mut Ui) {
-        let Self {
-            angle,
-            enabled,
-            password,
-        } = self;
+        let Self { angle, password } = self;
         ui.vertical_centered(|ui| {
             ui.add(crate::egui_github_link_file_line!());
         });
 
-        let tooltip_ui = |ui: &mut Ui| {
-            ui.heading("The name of the tooltip");
-            ui.horizontal(|ui| {
-                ui.label("This tooltip was created with");
-                ui.monospace(".on_hover_ui(…)");
-            });
-            let _ = ui.button("A button you can never press");
-        };
-        let disabled_tooltip_ui = |ui: &mut Ui| {
-            ui.heading("Different tooltip when widget is disabled");
-            ui.horizontal(|ui| {
-                ui.label("This tooltip was created with");
-                ui.monospace(".on_disabled_hover_ui(…)");
-            });
-        };
-        ui.checkbox(enabled, "Enabled");
-        ui.add_enabled(
-            *enabled,
-            egui::Label::new("Tooltips can be more than just simple text."),
-        )
-        .on_hover_ui(tooltip_ui)
-        .on_disabled_hover_ui(disabled_tooltip_ui);
-
         ui.separator();
 
         ui.horizontal(|ui| {

crates/egui_demo_lib/src/demo/mod.rs

@@ -32,6 +32,7 @@ pub mod tests;
 pub mod text_edit;
 pub mod text_layout;
 pub mod toggle_switch;
+pub mod tooltips;
 pub mod widget_gallery;
 pub mod window_options;
 

crates/egui_demo_lib/src/demo/tooltips.rs

@@ -0,0 +1,85 @@
+#[derive(Clone, PartialEq, Eq)]
+#[cfg_attr(feature = "serde", derive(serde::Deserialize, serde::Serialize))]
+pub struct Tooltips {
+    enabled: bool,
+}
+
+impl Default for Tooltips {
+    fn default() -> Self {
+        Self { enabled: true }
+    }
+}
+
+impl super::Demo for Tooltips {
+    fn name(&self) -> &'static str {
+        "🗖 Tooltips"
+    }
+
+    fn show(&mut self, ctx: &egui::Context, open: &mut bool) {
+        use super::View as _;
+        let window = egui::Window::new("Tooltips")
+            .constrain(false) // So we can test how tooltips behave close to the screen edge
+            .resizable(false)
+            .scroll(false)
+            .open(open);
+        window.show(ctx, |ui| self.ui(ui));
+    }
+}
+
+impl super::View for Tooltips {
+    fn ui(&mut self, ui: &mut egui::Ui) {
+        ui.spacing_mut().item_spacing.y = 8.0;
+
+        ui.vertical_centered(|ui| {
+            ui.add(crate::egui_github_link_file_line!());
+        });
+
+        ui.label("All labels in this demo have tooltips.")
+            .on_hover_text("Yes, even this one.");
+
+        ui.label("Some widgets have multiple tooltips!")
+            .on_hover_text("The first tooltip.")
+            .on_hover_text("The second tooltip.");
+
+        ui.label("Tooltips can contain interactive widgets.")
+            .on_hover_ui(|ui| {
+                ui.label("This tooltip contains a link:");
+                ui.hyperlink_to("www.egui.rs", "https://www.egui.rs/")
+                    .on_hover_text("The tooltip has a tooltip in it!");
+            });
+
+        ui.label("You can put selectable text in tooltips too.")
+            .on_hover_ui(|ui| {
+                ui.style_mut().interaction.selectable_labels = true;
+                ui.label("You can select this text.");
+            });
+
+        ui.separator(); // ---------------------------------------------------------
+
+        let tooltip_ui = |ui: &mut egui::Ui| {
+            ui.horizontal(|ui| {
+                ui.label("This tooltip was created with");
+                ui.code(".on_hover_ui(…)");
+            });
+        };
+        let disabled_tooltip_ui = |ui: &mut egui::Ui| {
+            ui.label("A fifferent tooltip when widget is disabled.");
+            ui.horizontal(|ui| {
+                ui.label("This tooltip was created with");
+                ui.code(".on_disabled_hover_ui(…)");
+            });
+        };
+
+        ui.label("You can have different tooltips depending on whether or not a widget is enabled or not:")
+            .on_hover_text("Check the tooltip of the button below, and see how it changes dependning on whether or not it is enabled.");
+
+        ui.horizontal(|ui| {
+            ui.checkbox(&mut self.enabled, "Enabled")
+                .on_hover_text("Controls whether or not the button below is enabled.");
+
+            ui.add_enabled(self.enabled, egui::Button::new("Sometimes clickable"))
+                .on_hover_ui(tooltip_ui)
+                .on_disabled_hover_ui(disabled_tooltip_ui);
+        });
+    }
+}