Use ListItem in Stream Tree UI (#3153)

### What

Use `ListItem` in the Stream Tree UI.

- Consistent UI in the stream tree (vs. stuff in the left panel)
- Revamped look of the selection/hovered state in the timeline itself.
- Cleaned up the code for the "Entity/instance hover cards". Now
hovering instances in the blueprint tree _also_ displays storage use
from #2997
- Improved `ListItem`
- New attribute to control the width allocation mode (currently: max
width or fit to label)
- Improved click/hover sensing to cover the full span area (= hover
highlight), not just the actually allocated space (icon + label). That
improves the behaviour of the left panel trees too.

Fixes #3045
Fixes #2738 (if we accept that dropdown button are "close enough" and
will be improved with #2734 anyways)
Fixes #2860

<img width="1817" alt="image"
src="https://github.com/rerun-io/rerun/assets/49431240/5492ae03-0da0-4417-b7a1-2bedd4da4e8c">


### Checklist
* [x] I have read and agree to [Contributor
Guide](https://github.com/rerun-io/rerun/blob/main/CONTRIBUTING.md) and
the [Code of
Conduct](https://github.com/rerun-io/rerun/blob/main/CODE_OF_CONDUCT.md)
* [x] I've included a screenshot or gif (if applicable)
* [x] I have tested [demo.rerun.io](https://demo.rerun.io/pr/3153) (if
applicable)

- [PR Build Summary](https://build.rerun.io/pr/3153)
- [Docs
preview](https://rerun.io/preview/2c54fda5373adf90d1407dc161f65f2242dcd4a3/docs)
<!--DOCS-PREVIEW-->
- [Examples
preview](https://rerun.io/preview/2c54fda5373adf90d1407dc161f65f2242dcd4a3/examples)
<!--EXAMPLES-PREVIEW--><!--EXAMPLES-PREVIEW--><!--EXAMPLES-PREVIEW--><!--EXAMPLES-PREVIEW--><!--EXAMPLES-PREVIEW--><!--EXAMPLES-PREVIEW--><!--EXAMPLES-PREVIEW--><!--EXAMPLES-PREVIEW--><!--EXAMPLES-PREVIEW-->
- [Recent benchmark results](https://ref.rerun.io/dev/bench/)
- [Wasm size tracking](https://ref.rerun.io/dev/sizes/)

crates/re_data_ui/src/item_ui.rs

@@ -2,6 +2,7 @@
 //!
 //! TODO(andreas): This is not a `data_ui`, can this go somewhere else, shouldn't be in `re_data_ui`.
 
+use egui::Ui;
 use re_data_store::InstancePath;
 use re_log_types::{ComponentPath, EntityPath, TimeInt, Timeline};
 use re_viewer_context::{
@@ -94,31 +95,11 @@ pub fn instance_path_button_to(
     text: impl Into<egui::WidgetText>,
 ) -> egui::Response {
     let item = Item::InstancePath(space_view_id, instance_path.clone());
-    let subtype_string = if instance_path.instance_key.is_splat() {
-        "Entity"
-    } else {
-        "Entity Instance"
-    };
 
     let response = ui
         .selectable_label(ctx.selection().contains(&item), text)
         .on_hover_ui(|ui| {
-            ui.strong(subtype_string);
-            ui.label(format!("Path: {instance_path}"));
-
-            // TODO(emilk): give data_ui an alternate "everything on this timeline" query?
-            // Then we can move the size view into `data_ui`.
-            let query = ctx.current_query();
-
-            if instance_path.instance_key.is_splat() {
-                let store = &ctx.store_db.entity_db.data_store;
-                let stats = store.entity_stats(query.timeline, instance_path.entity_path.hash());
-                entity_stats_ui(ui, &query.timeline, &stats);
-            } else {
-                // TODO(emilk): per-component stats
-            }
-
-            instance_path.data_ui(ctx, ui, UiVerbosity::Reduced, &query);
+            instance_hover_card_ui(ui, ctx, instance_path);
         });
 
     cursor_interact_with_selectable(ctx, response, item)
@@ -245,21 +226,11 @@ pub fn data_blueprint_button_to(
     let response = ui
         .selectable_label(ctx.selection().contains(&item), text)
         .on_hover_ui(|ui| {
-            data_blueprint_tooltip(ui, ctx, entity_path);
+            entity_hover_card_ui(ui, ctx, entity_path);
         });
     cursor_interact_with_selectable(ctx, response, item)
 }
 
-pub fn data_blueprint_tooltip(
-    ui: &mut egui::Ui,
-    ctx: &mut ViewerContext<'_>,
-    entity_path: &EntityPath,
-) {
-    ui.strong("Space View Entity");
-    ui.label(format!("Path: {entity_path}"));
-    entity_path.data_ui(ctx, ui, UiVerbosity::Reduced, &ctx.current_query());
-}
-
 pub fn time_button(
     ctx: &mut ViewerContext<'_>,
     ui: &mut egui::Ui,
@@ -344,3 +315,44 @@ pub fn select_hovered_on_click(
         }
     }
 }
+
+/// Displays the "hover card" (i.e. big tooltip) for an instance or an entity.
+///
+/// The entity hover card is displayed the provided instance path is a splat.
+pub fn instance_hover_card_ui(
+    ui: &mut Ui,
+    ctx: &mut ViewerContext<'_>,
+    instance_path: &InstancePath,
+) {
+    let subtype_string = if instance_path.instance_key.is_splat() {
+        "Entity"
+    } else {
+        "Entity Instance"
+    };
+    ui.strong(subtype_string);
+    ui.label(format!("Path: {instance_path}"));
+
+    // TODO(emilk): give data_ui an alternate "everything on this timeline" query?
+    // Then we can move the size view into `data_ui`.
+    let query = ctx.current_query();
+
+    if instance_path.instance_key.is_splat() {
+        let store = &ctx.store_db.entity_db.data_store;
+        let stats = store.entity_stats(query.timeline, instance_path.entity_path.hash());
+        entity_stats_ui(ui, &query.timeline, &stats);
+    } else {
+        // TODO(emilk): per-component stats
+    }
+
+    instance_path.data_ui(ctx, ui, UiVerbosity::Reduced, &query);
+}
+
+/// Displays the "hover card" (i.e. big tooltip) for an entity.
+pub fn entity_hover_card_ui(
+    ui: &mut egui::Ui,
+    ctx: &mut ViewerContext<'_>,
+    entity_path: &EntityPath,
+) {
+    let instance_path = InstancePath::entity_splat(entity_path.clone());
+    instance_hover_card_ui(ui, ctx, &instance_path);
+}

crates/re_time_panel/src/data_density_graph.rs

@@ -503,8 +503,9 @@ pub fn data_density_graph_ui(
 fn graph_color(ctx: &mut ViewerContext<'_>, item: &Item, ui: &mut egui::Ui) -> Color32 {
     let is_selected = ctx.selection().contains(item);
     if is_selected {
-        make_brighter(ui.visuals().selection.bg_fill)
+        make_brighter(ui.visuals().widgets.active.fg_stroke.color)
     } else {
+        //TODO(ab): tokenize that!
         Color32::from_gray(225)
     }
 }