Improve selection and hover behavior of viewport's tabs (#4424)

### What

Tabs extend selection when cmd-clicked, and show/share hover state with
the rest of the UI (mainly the blueprint tree).

* Fixes #4412


https://github.com/rerun-io/rerun/assets/49431240/e8e7e03a-333d-4c3f-8005-bd51c2040b0f


### 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 the web demo (if applicable):
  * Full build: [app.rerun.io](https://app.rerun.io/pr/4424/index.html)
* Partial build:
[app.rerun.io](https://app.rerun.io/pr/4424/index.html?manifest_url=https://app.rerun.io/version/nightly/examples_manifest.json)
- Useful for quick testing when changes do not affect examples in any
way
* [x] The PR title and labels are set such as to maximize their
usefulness for the next release's CHANGELOG

- [PR Build Summary](https://build.rerun.io/pr/4424)
- [Docs
preview](https://rerun.io/preview/bccde1d68eb96cba22dad8d29df9c6786b803621/docs)
<!--DOCS-PREVIEW-->
- [Examples
preview](https://rerun.io/preview/bccde1d68eb96cba22dad8d29df9c6786b803621/examples)
<!--EXAMPLES-PREVIEW-->
- [Recent benchmark results](https://build.rerun.io/graphs/crates.html)
- [Wasm size tracking](https://build.rerun.io/graphs/sizes.html)

crates/re_viewport/src/viewport.rs

@@ -6,6 +6,7 @@ use std::collections::BTreeMap;
 
 use ahash::HashMap;
 use egui_tiles::Behavior as _;
+use re_data_ui::item_ui;
 
 use re_ui::{Icon, ReUi};
 use re_viewer_context::{
@@ -326,7 +327,15 @@ impl<'a, 'b> egui_tiles::Behavior<SpaceViewId> for TabViewer<'a, 'b> {
             tab_widget.paint(ui);
         }
 
-        self.on_tab_button(tiles, tile_id, response)
+        if let Some(egui_tiles::Tile::Pane(space_view_id)) = tiles.get(tile_id) {
+            item_ui::select_hovered_on_click(
+                self.ctx,
+                &response,
+                &[Item::SpaceView(*space_view_id)],
+            );
+        }
+
+        response
     }
 
     fn drag_ui(
@@ -351,25 +360,6 @@ impl<'a, 'b> egui_tiles::Behavior<SpaceViewId> for TabViewer<'a, 'b> {
         });
     }
 
-    fn on_tab_button(
-        &mut self,
-        tiles: &egui_tiles::Tiles<SpaceViewId>,
-        tile_id: egui_tiles::TileId,
-        button_response: egui::Response,
-    ) -> egui::Response {
-        if button_response.clicked() {
-            if let Some(egui_tiles::Tile::Pane(space_view_id)) = tiles.get(tile_id) {
-                self.ctx
-                    .set_single_selection(&Item::SpaceView(*space_view_id));
-            } else {
-                // Clicked a group tab - we don't support selecting that yet,
-                // so deselect whatever was selected to make it less confusing:
-                self.ctx.rec_cfg.selection_state.clear_current();
-            }
-        }
-        button_response
-    }
-
     fn retain_pane(&mut self, space_view_id: &SpaceViewId) -> bool {
         self.space_views.contains_key(space_view_id)
     }
@@ -523,6 +513,13 @@ impl TabWidget {
                 .contains(&Item::SpaceView(space_view.id))
         });
 
+        let hovered = space_view.map_or(false, |space_view| {
+            tab_viewer
+                .ctx
+                .hovered()
+                .contains(&Item::SpaceView(space_view.id))
+        });
+
         // tab icon
         let icon_size = ReUi::small_icon_size();
         let icon_width_plus_padding = icon_size.x + ReUi::text_to_icon_padding();
@@ -553,6 +550,8 @@ impl TabWidget {
 
         let bg_color = if selected {
             ui.visuals().selection.bg_fill
+        } else if hovered {
+            ui.visuals().widgets.hovered.bg_fill
         } else {
             tab_viewer.tab_bar_color(ui.visuals())
         };