Extend Label & Tooltip (#3322)

Marshall Bowers created

This PR extends the `Label` component with additional functionality,
partially for use in the `TextTooltip` component.

- [x] `Label` should take a `size` (`Default` & `Small` for now)
  - These should use `text_ui` and `text_ui_sm`
- [x] Fold `LabelColor` and `IconColor` into one enum
  - `TextColor`
- [x] `TextTooltip`'s keybinding field should take whatever we use for
keybindings instead of a string, and render the keybinding component
- [x] `TextTooltip` should use small `Label`s

Release Notes:

- N/A

Change summary

crates/editor2/src/items.rs                      |  4 
crates/go_to_line2/src/go_to_line.rs             |  4 
crates/picker2/src/picker2.rs                    |  4 
crates/ui2/src/components/button.rs              | 44 ++++----
crates/ui2/src/components/checkbox.rs            | 10 +-
crates/ui2/src/components/icon.rs                | 74 +--------------
crates/ui2/src/components/icon_button.rs         | 10 +-
crates/ui2/src/components/input.rs               | 10 +-
crates/ui2/src/components/keybinding.rs          |  2 
crates/ui2/src/components/label.rs               | 86 +++++++++++------
crates/ui2/src/components/list.rs                | 20 ++--
crates/ui2/src/components/palette.rs             | 31 ++---
crates/ui2/src/components/tab.rs                 | 16 +-
crates/ui2/src/components/toggle.rs              |  6 
crates/ui2/src/components/tooltip.rs             | 39 ++++++-
crates/ui2/src/prelude.rs                        |  2 
crates/ui2/src/static_data.rs                    | 56 +++++-----
crates/ui2/src/to_extract/buffer_search.rs       |  4 
crates/ui2/src/to_extract/chat_panel.rs          |  4 
crates/ui2/src/to_extract/copilot.rs             |  4 
crates/ui2/src/to_extract/editor_pane.rs         |  4 
crates/ui2/src/to_extract/notifications_panel.rs | 14 +-
crates/ui2/src/to_extract/status_bar.rs          | 12 +-
crates/ui2/src/to_extract/title_bar.rs           | 10 +-
crates/workspace2/src/pane.rs                    |  6 
crates/workspace2/src/workspace2.rs              | 49 ++++++++-
26 files changed, 271 insertions(+), 254 deletions(-)

Detailed changes

crates/editor2/src/items.rs 🔗

@@ -30,7 +30,7 @@ use std::{
 };
 use text::Selection;
 use theme::{ActiveTheme, Theme};
-use ui::{Label, LabelColor};
+use ui::{Label, TextColor};
 use util::{paths::PathExt, ResultExt, TryFutureExt};
 use workspace::item::{BreadcrumbText, FollowEvent, FollowableEvents, FollowableItemHandle};
 use workspace::{
@@ -607,7 +607,7 @@ impl Item for Editor {
                                 &description,
                                 MAX_TAB_TITLE_LEN,
                             ))
-                            .color(LabelColor::Muted),
+                            .color(TextColor::Muted),
                         ),
                     )
                 })),

crates/go_to_line2/src/go_to_line.rs 🔗

@@ -5,7 +5,7 @@ use gpui::{
 };
 use text::{Bias, Point};
 use theme::ActiveTheme;
-use ui::{h_stack, v_stack, Label, LabelColor, StyledExt};
+use ui::{h_stack, v_stack, Label, StyledExt, TextColor};
 use util::paths::FILE_ROW_COLUMN_DELIMITER;
 use workspace::{Modal, ModalEvent, Workspace};
 
@@ -176,7 +176,7 @@ impl Render for GoToLine {
                             .justify_between()
                             .px_2()
                             .py_1()
-                            .child(Label::new(self.current_text.clone()).color(LabelColor::Muted)),
+                            .child(Label::new(self.current_text.clone()).color(TextColor::Muted)),
                     ),
             )
     }

crates/picker2/src/picker2.rs 🔗

@@ -4,7 +4,7 @@ use gpui::{
     Styled, Task, UniformListScrollHandle, View, ViewContext, VisualContext, WindowContext,
 };
 use std::{cmp, sync::Arc};
-use ui::{prelude::*, v_stack, Divider, Label, LabelColor};
+use ui::{prelude::*, v_stack, Divider, Label, TextColor};
 
 pub struct Picker<D: PickerDelegate> {
     pub delegate: D,
@@ -224,7 +224,7 @@ impl<D: PickerDelegate> Render for Picker<D> {
                     v_stack().p_1().grow().child(
                         div()
                             .px_1()
-                            .child(Label::new("No matches").color(LabelColor::Muted)),
+                            .child(Label::new("No matches").color(TextColor::Muted)),
                     ),
                 )
             })

crates/ui2/src/components/button.rs 🔗

@@ -2,10 +2,8 @@ use std::sync::Arc;
 
 use gpui::{div, DefiniteLength, Hsla, MouseButton, WindowContext};
 
-use crate::{
-    h_stack, prelude::*, Icon, IconButton, IconColor, IconElement, Label, LabelColor,
-    LineHeightStyle,
-};
+use crate::prelude::*;
+use crate::{h_stack, Icon, IconButton, IconElement, Label, LineHeightStyle, TextColor};
 
 /// Provides the flexibility to use either a standard
 /// button or an icon button in a given context.
@@ -87,7 +85,7 @@ pub struct Button<V: 'static> {
     label: SharedString,
     variant: ButtonVariant,
     width: Option<DefiniteLength>,
-    color: Option<LabelColor>,
+    color: Option<TextColor>,
 }
 
 impl<V: 'static> Button<V> {
@@ -141,14 +139,14 @@ impl<V: 'static> Button<V> {
         self
     }
 
-    pub fn color(mut self, color: Option<LabelColor>) -> Self {
+    pub fn color(mut self, color: Option<TextColor>) -> Self {
         self.color = color;
         self
     }
 
-    pub fn label_color(&self, color: Option<LabelColor>) -> LabelColor {
+    pub fn label_color(&self, color: Option<TextColor>) -> TextColor {
         if self.disabled {
-            LabelColor::Disabled
+            TextColor::Disabled
         } else if let Some(color) = color {
             color
         } else {
@@ -156,21 +154,21 @@ impl<V: 'static> Button<V> {
         }
     }
 
-    fn render_label(&self, color: LabelColor) -> Label {
+    fn render_label(&self, color: TextColor) -> Label {
         Label::new(self.label.clone())
             .color(color)
             .line_height_style(LineHeightStyle::UILabel)
     }
 
-    fn render_icon(&self, icon_color: IconColor) -> Option<IconElement> {
+    fn render_icon(&self, icon_color: TextColor) -> Option<IconElement> {
         self.icon.map(|i| IconElement::new(i).color(icon_color))
     }
 
     pub fn render(self, _view: &mut V, cx: &mut ViewContext<V>) -> impl Component<V> {
         let (icon_color, label_color) = match (self.disabled, self.color) {
-            (true, _) => (IconColor::Disabled, LabelColor::Disabled),
-            (_, None) => (IconColor::Default, LabelColor::Default),
-            (_, Some(color)) => (IconColor::from(color), color),
+            (true, _) => (TextColor::Disabled, TextColor::Disabled),
+            (_, None) => (TextColor::Default, TextColor::Default),
+            (_, Some(color)) => (TextColor::from(color), color),
         };
 
         let mut button = h_stack()
@@ -240,7 +238,7 @@ pub use stories::*;
 #[cfg(feature = "stories")]
 mod stories {
     use super::*;
-    use crate::{h_stack, v_stack, LabelColor, Story};
+    use crate::{h_stack, v_stack, Story, TextColor};
     use gpui::{rems, Div, Render};
     use strum::IntoEnumIterator;
 
@@ -265,7 +263,7 @@ mod stories {
                                     v_stack()
                                         .gap_1()
                                         .child(
-                                            Label::new(state.to_string()).color(LabelColor::Muted),
+                                            Label::new(state.to_string()).color(TextColor::Muted),
                                         )
                                         .child(
                                             Button::new("Label").variant(ButtonVariant::Ghost), // .state(state),
@@ -276,7 +274,7 @@ mod stories {
                                     v_stack()
                                         .gap_1()
                                         .child(
-                                            Label::new(state.to_string()).color(LabelColor::Muted),
+                                            Label::new(state.to_string()).color(TextColor::Muted),
                                         )
                                         .child(
                                             Button::new("Label")
@@ -290,7 +288,7 @@ mod stories {
                                     v_stack()
                                         .gap_1()
                                         .child(
-                                            Label::new(state.to_string()).color(LabelColor::Muted),
+                                            Label::new(state.to_string()).color(TextColor::Muted),
                                         )
                                         .child(
                                             Button::new("Label")
@@ -307,7 +305,7 @@ mod stories {
                                     v_stack()
                                         .gap_1()
                                         .child(
-                                            Label::new(state.to_string()).color(LabelColor::Muted),
+                                            Label::new(state.to_string()).color(TextColor::Muted),
                                         )
                                         .child(
                                             Button::new("Label").variant(ButtonVariant::Filled), // .state(state),
@@ -318,7 +316,7 @@ mod stories {
                                     v_stack()
                                         .gap_1()
                                         .child(
-                                            Label::new(state.to_string()).color(LabelColor::Muted),
+                                            Label::new(state.to_string()).color(TextColor::Muted),
                                         )
                                         .child(
                                             Button::new("Label")
@@ -332,7 +330,7 @@ mod stories {
                                     v_stack()
                                         .gap_1()
                                         .child(
-                                            Label::new(state.to_string()).color(LabelColor::Muted),
+                                            Label::new(state.to_string()).color(TextColor::Muted),
                                         )
                                         .child(
                                             Button::new("Label")
@@ -349,7 +347,7 @@ mod stories {
                                     v_stack()
                                         .gap_1()
                                         .child(
-                                            Label::new(state.to_string()).color(LabelColor::Muted),
+                                            Label::new(state.to_string()).color(TextColor::Muted),
                                         )
                                         .child(
                                             Button::new("Label")
@@ -363,7 +361,7 @@ mod stories {
                                     v_stack()
                                         .gap_1()
                                         .child(
-                                            Label::new(state.to_string()).color(LabelColor::Muted),
+                                            Label::new(state.to_string()).color(TextColor::Muted),
                                         )
                                         .child(
                                             Button::new("Label")
@@ -379,7 +377,7 @@ mod stories {
                                     v_stack()
                                         .gap_1()
                                         .child(
-                                            Label::new(state.to_string()).color(LabelColor::Muted),
+                                            Label::new(state.to_string()).color(TextColor::Muted),
                                         )
                                         .child(
                                             Button::new("Label")

crates/ui2/src/components/checkbox.rs 🔗

@@ -6,7 +6,7 @@ use gpui::{
 };
 use theme2::ActiveTheme;
 
-use crate::{Icon, IconColor, IconElement, Selection};
+use crate::{Icon, IconElement, Selection, TextColor};
 
 pub type CheckHandler<V> = Arc<dyn Fn(Selection, &mut V, &mut ViewContext<V>) + Send + Sync>;
 
@@ -58,9 +58,9 @@ impl<V: 'static> Checkbox<V> {
                         .color(
                             // If the checkbox is disabled we change the color of the icon.
                             if self.disabled {
-                                IconColor::Disabled
+                                TextColor::Disabled
                             } else {
-                                IconColor::Selected
+                                TextColor::Selected
                             },
                         ),
                 )
@@ -73,9 +73,9 @@ impl<V: 'static> Checkbox<V> {
                         .color(
                             // If the checkbox is disabled we change the color of the icon.
                             if self.disabled {
-                                IconColor::Disabled
+                                TextColor::Disabled
                             } else {
-                                IconColor::Selected
+                                TextColor::Selected
                             },
                         ),
                 )

crates/ui2/src/components/icon.rs 🔗

@@ -1,7 +1,7 @@
-use gpui::{rems, svg, Hsla};
+use gpui::{rems, svg};
 use strum::EnumIter;
 
-use crate::{prelude::*, LabelColor};
+use crate::prelude::*;
 
 #[derive(Default, PartialEq, Copy, Clone)]
 pub enum IconSize {
@@ -10,70 +10,6 @@ pub enum IconSize {
     Medium,
 }
 
-#[derive(Default, PartialEq, Copy, Clone)]
-pub enum IconColor {
-    #[default]
-    Default,
-    Accent,
-    Created,
-    Deleted,
-    Disabled,
-    Error,
-    Hidden,
-    Info,
-    Modified,
-    Muted,
-    Placeholder,
-    Player(u32),
-    Selected,
-    Success,
-    Warning,
-}
-
-impl IconColor {
-    pub fn color(self, cx: &WindowContext) -> Hsla {
-        match self {
-            IconColor::Default => cx.theme().colors().icon,
-            IconColor::Muted => cx.theme().colors().icon_muted,
-            IconColor::Disabled => cx.theme().colors().icon_disabled,
-            IconColor::Placeholder => cx.theme().colors().icon_placeholder,
-            IconColor::Accent => cx.theme().colors().icon_accent,
-            IconColor::Error => cx.theme().status().error,
-            IconColor::Warning => cx.theme().status().warning,
-            IconColor::Success => cx.theme().status().success,
-            IconColor::Info => cx.theme().status().info,
-            IconColor::Selected => cx.theme().colors().icon_accent,
-            IconColor::Player(i) => cx.theme().styles.player.0[i.clone() as usize].cursor,
-            IconColor::Created => cx.theme().status().created,
-            IconColor::Modified => cx.theme().status().modified,
-            IconColor::Deleted => cx.theme().status().deleted,
-            IconColor::Hidden => cx.theme().status().hidden,
-        }
-    }
-}
-
-impl From<LabelColor> for IconColor {
-    fn from(label: LabelColor) -> Self {
-        match label {
-            LabelColor::Default => IconColor::Default,
-            LabelColor::Muted => IconColor::Muted,
-            LabelColor::Disabled => IconColor::Disabled,
-            LabelColor::Placeholder => IconColor::Placeholder,
-            LabelColor::Accent => IconColor::Accent,
-            LabelColor::Error => IconColor::Error,
-            LabelColor::Warning => IconColor::Warning,
-            LabelColor::Success => IconColor::Success,
-            LabelColor::Info => IconColor::Info,
-            LabelColor::Selected => IconColor::Selected,
-            LabelColor::Player(i) => IconColor::Player(i),
-            LabelColor::Created => IconColor::Created,
-            LabelColor::Modified => IconColor::Modified,
-            LabelColor::Deleted => IconColor::Deleted,
-            LabelColor::Hidden => IconColor::Hidden,
-        }
-    }
-}
-
 #[derive(Debug, PartialEq, Copy, Clone, EnumIter)]
 pub enum Icon {
     Ai,
@@ -194,7 +130,7 @@ impl Icon {
 #[derive(Component)]
 pub struct IconElement {
     icon: Icon,
-    color: IconColor,
+    color: TextColor,
     size: IconSize,
 }
 
@@ -202,12 +138,12 @@ impl IconElement {
     pub fn new(icon: Icon) -> Self {
         Self {
             icon,
-            color: IconColor::default(),
+            color: TextColor::default(),
             size: IconSize::default(),
         }
     }
 
-    pub fn color(mut self, color: IconColor) -> Self {
+    pub fn color(mut self, color: TextColor) -> Self {
         self.color = color;
         self
     }

crates/ui2/src/components/icon_button.rs 🔗

@@ -1,4 +1,4 @@
-use crate::{h_stack, prelude::*, ClickHandler, Icon, IconColor, IconElement, TextTooltip};
+use crate::{h_stack, prelude::*, ClickHandler, Icon, IconElement, TextColor, TextTooltip};
 use gpui::{MouseButton, VisualContext};
 use std::sync::Arc;
 
@@ -16,7 +16,7 @@ impl<V: 'static> Default for IconButtonHandlers<V> {
 pub struct IconButton<V: 'static> {
     id: ElementId,
     icon: Icon,
-    color: IconColor,
+    color: TextColor,
     variant: ButtonVariant,
     state: InteractionState,
     tooltip: Option<SharedString>,
@@ -28,7 +28,7 @@ impl<V: 'static> IconButton<V> {
         Self {
             id: id.into(),
             icon,
-            color: IconColor::default(),
+            color: TextColor::default(),
             variant: ButtonVariant::default(),
             state: InteractionState::default(),
             tooltip: None,
@@ -41,7 +41,7 @@ impl<V: 'static> IconButton<V> {
         self
     }
 
-    pub fn color(mut self, color: IconColor) -> Self {
+    pub fn color(mut self, color: TextColor) -> Self {
         self.color = color;
         self
     }
@@ -71,7 +71,7 @@ impl<V: 'static> IconButton<V> {
 
     fn render(self, _view: &mut V, cx: &mut ViewContext<V>) -> impl Component<V> {
         let icon_color = match (self.state, self.color) {
-            (InteractionState::Disabled, _) => IconColor::Disabled,
+            (InteractionState::Disabled, _) => TextColor::Disabled,
             _ => self.color,
         };
 

crates/ui2/src/components/input.rs 🔗

@@ -1,6 +1,6 @@
 use crate::prelude::*;
 use crate::Label;
-use crate::LabelColor;
+use crate::TextColor;
 
 #[derive(Default, PartialEq)]
 pub enum InputVariant {
@@ -71,15 +71,15 @@ impl Input {
         };
 
         let placeholder_label = Label::new(self.placeholder.clone()).color(if self.disabled {
-            LabelColor::Disabled
+            TextColor::Disabled
         } else {
-            LabelColor::Placeholder
+            TextColor::Placeholder
         });
 
         let label = Label::new(self.value.clone()).color(if self.disabled {
-            LabelColor::Disabled
+            TextColor::Disabled
         } else {
-            LabelColor::Default
+            TextColor::Default
         });
 
         div()

crates/ui2/src/components/keybinding.rs 🔗

@@ -3,7 +3,7 @@ use strum::EnumIter;
 
 use crate::prelude::*;
 
-#[derive(Component)]
+#[derive(Component, Clone)]
 pub struct KeyBinding {
     /// A keybinding consists of a key and a set of modifier keys.
     /// More then one keybinding produces a chord.

crates/ui2/src/components/label.rs 🔗

@@ -3,8 +3,15 @@ use gpui::{relative, Hsla, Text, TextRun, WindowContext};
 use crate::prelude::*;
 use crate::styled_ext::StyledExt;
 
+#[derive(Debug, PartialEq, Eq, PartialOrd, Ord, Hash, Clone, Copy, Default)]
+pub enum LabelSize {
+    #[default]
+    Default,
+    Small,
+}
+
 #[derive(Default, PartialEq, Copy, Clone)]
-pub enum LabelColor {
+pub enum TextColor {
     #[default]
     Default,
     Accent,
@@ -23,24 +30,24 @@ pub enum LabelColor {
     Warning,
 }
 
-impl LabelColor {
-    pub fn hsla(&self, cx: &WindowContext) -> Hsla {
+impl TextColor {
+    pub fn color(&self, cx: &WindowContext) -> Hsla {
         match self {
-            LabelColor::Default => cx.theme().colors().text,
-            LabelColor::Muted => cx.theme().colors().text_muted,
-            LabelColor::Created => cx.theme().status().created,
-            LabelColor::Modified => cx.theme().status().modified,
-            LabelColor::Deleted => cx.theme().status().deleted,
-            LabelColor::Disabled => cx.theme().colors().text_disabled,
-            LabelColor::Hidden => cx.theme().status().hidden,
-            LabelColor::Info => cx.theme().status().info,
-            LabelColor::Placeholder => cx.theme().colors().text_placeholder,
-            LabelColor::Accent => cx.theme().colors().text_accent,
-            LabelColor::Player(i) => cx.theme().styles.player.0[i.clone() as usize].cursor,
-            LabelColor::Error => cx.theme().status().error,
-            LabelColor::Selected => cx.theme().colors().text_accent,
-            LabelColor::Success => cx.theme().status().success,
-            LabelColor::Warning => cx.theme().status().warning,
+            TextColor::Default => cx.theme().colors().text,
+            TextColor::Muted => cx.theme().colors().text_muted,
+            TextColor::Created => cx.theme().status().created,
+            TextColor::Modified => cx.theme().status().modified,
+            TextColor::Deleted => cx.theme().status().deleted,
+            TextColor::Disabled => cx.theme().colors().text_disabled,
+            TextColor::Hidden => cx.theme().status().hidden,
+            TextColor::Info => cx.theme().status().info,
+            TextColor::Placeholder => cx.theme().colors().text_placeholder,
+            TextColor::Accent => cx.theme().colors().text_accent,
+            TextColor::Player(i) => cx.theme().styles.player.0[i.clone() as usize].cursor,
+            TextColor::Error => cx.theme().status().error,
+            TextColor::Selected => cx.theme().colors().text_accent,
+            TextColor::Success => cx.theme().status().success,
+            TextColor::Warning => cx.theme().status().warning,
         }
     }
 }
@@ -56,8 +63,9 @@ pub enum LineHeightStyle {
 #[derive(Component)]
 pub struct Label {
     label: SharedString,
+    size: LabelSize,
     line_height_style: LineHeightStyle,
-    color: LabelColor,
+    color: TextColor,
     strikethrough: bool,
 }
 
@@ -65,13 +73,19 @@ impl Label {
     pub fn new(label: impl Into<SharedString>) -> Self {
         Self {
             label: label.into(),
+            size: LabelSize::Default,
             line_height_style: LineHeightStyle::default(),
-            color: LabelColor::Default,
+            color: TextColor::Default,
             strikethrough: false,
         }
     }
 
-    pub fn color(mut self, color: LabelColor) -> Self {
+    pub fn size(mut self, size: LabelSize) -> Self {
+        self.size = size;
+        self
+    }
+
+    pub fn color(mut self, color: TextColor) -> Self {
         self.color = color;
         self
     }
@@ -95,14 +109,17 @@ impl Label {
                         .top_1_2()
                         .w_full()
                         .h_px()
-                        .bg(LabelColor::Hidden.hsla(cx)),
+                        .bg(TextColor::Hidden.color(cx)),
                 )
             })
-            .text_ui()
+            .map(|this| match self.size {
+                LabelSize::Default => this.text_ui(),
+                LabelSize::Small => this.text_ui_sm(),
+            })
             .when(self.line_height_style == LineHeightStyle::UILabel, |this| {
                 this.line_height(relative(1.))
             })
-            .text_color(self.color.hsla(cx))
+            .text_color(self.color.color(cx))
             .child(self.label.clone())
     }
 }
@@ -110,7 +127,8 @@ impl Label {
 #[derive(Component)]
 pub struct HighlightedLabel {
     label: SharedString,
-    color: LabelColor,
+    size: LabelSize,
+    color: TextColor,
     highlight_indices: Vec<usize>,
     strikethrough: bool,
 }
@@ -121,13 +139,19 @@ impl HighlightedLabel {
     pub fn new(label: impl Into<SharedString>, highlight_indices: Vec<usize>) -> Self {
         Self {
             label: label.into(),
-            color: LabelColor::Default,
+            size: LabelSize::Default,
+            color: TextColor::Default,
             highlight_indices,
             strikethrough: false,
         }
     }
 
-    pub fn color(mut self, color: LabelColor) -> Self {
+    pub fn size(mut self, size: LabelSize) -> Self {
+        self.size = size;
+        self
+    }
+
+    pub fn color(mut self, color: TextColor) -> Self {
         self.color = color;
         self
     }
@@ -146,7 +170,7 @@ impl HighlightedLabel {
         let mut runs: Vec<TextRun> = Vec::new();
 
         for (char_ix, char) in self.label.char_indices() {
-            let mut color = self.color.hsla(cx);
+            let mut color = self.color.color(cx);
 
             if let Some(highlight_ix) = highlight_indices.peek() {
                 if char_ix == *highlight_ix {
@@ -183,9 +207,13 @@ impl HighlightedLabel {
                         .my_auto()
                         .w_full()
                         .h_px()
-                        .bg(LabelColor::Hidden.hsla(cx)),
+                        .bg(TextColor::Hidden.color(cx)),
                 )
             })
+            .map(|this| match self.size {
+                LabelSize::Default => this.text_ui(),
+                LabelSize::Small => this.text_ui_sm(),
+            })
             .child(Text::styled(self.label, runs))
     }
 }

crates/ui2/src/components/list.rs 🔗

@@ -1,11 +1,11 @@
 use gpui::div;
 
+use crate::prelude::*;
 use crate::settings::user_settings;
 use crate::{
-    disclosure_control, h_stack, v_stack, Avatar, Icon, IconColor, IconElement, IconSize, Label,
-    LabelColor, Toggle,
+    disclosure_control, h_stack, v_stack, Avatar, GraphicSlot, Icon, IconElement, IconSize, Label,
+    TextColor, Toggle,
 };
-use crate::{prelude::*, GraphicSlot};
 
 #[derive(Clone, Copy, Default, Debug, PartialEq)]
 pub enum ListItemVariant {
@@ -68,7 +68,7 @@ impl ListHeader {
                     .items_center()
                     .children(icons.into_iter().map(|i| {
                         IconElement::new(i)
-                            .color(IconColor::Muted)
+                            .color(TextColor::Muted)
                             .size(IconSize::Small)
                     })),
             ),
@@ -106,10 +106,10 @@ impl ListHeader {
                                     .items_center()
                                     .children(self.left_icon.map(|i| {
                                         IconElement::new(i)
-                                            .color(IconColor::Muted)
+                                            .color(TextColor::Muted)
                                             .size(IconSize::Small)
                                     }))
-                                    .child(Label::new(self.label.clone()).color(LabelColor::Muted)),
+                                    .child(Label::new(self.label.clone()).color(TextColor::Muted)),
                             )
                             .child(disclosure_control),
                     )
@@ -157,10 +157,10 @@ impl ListSubHeader {
                         .items_center()
                         .children(self.left_icon.map(|i| {
                             IconElement::new(i)
-                                .color(IconColor::Muted)
+                                .color(TextColor::Muted)
                                 .size(IconSize::Small)
                         }))
-                        .child(Label::new(self.label.clone()).color(LabelColor::Muted)),
+                        .child(Label::new(self.label.clone()).color(TextColor::Muted)),
                 ),
         )
     }
@@ -291,7 +291,7 @@ impl ListEntry {
                 h_stack().child(
                     IconElement::new(i)
                         .size(IconSize::Small)
-                        .color(IconColor::Muted),
+                        .color(TextColor::Muted),
                 ),
             ),
             Some(GraphicSlot::Avatar(src)) => Some(h_stack().child(Avatar::new(src))),
@@ -394,7 +394,7 @@ impl List {
             (false, _) => div().children(self.items),
             (true, Toggle::Toggled(false)) => div(),
             (true, _) => {
-                div().child(Label::new(self.empty_message.clone()).color(LabelColor::Muted))
+                div().child(Label::new(self.empty_message.clone()).color(TextColor::Muted))
             }
         };
 

crates/ui2/src/components/palette.rs 🔗

@@ -1,5 +1,5 @@
 use crate::prelude::*;
-use crate::{h_stack, v_stack, KeyBinding, Label, LabelColor};
+use crate::{h_stack, v_stack, KeyBinding, Label, TextColor};
 
 #[derive(Component)]
 pub struct Palette {
@@ -54,7 +54,7 @@ impl Palette {
                 v_stack()
                     .gap_px()
                     .child(v_stack().py_0p5().px_1().child(div().px_2().py_0p5().child(
-                        Label::new(self.input_placeholder.clone()).color(LabelColor::Placeholder),
+                        Label::new(self.input_placeholder.clone()).color(TextColor::Placeholder),
                     )))
                     .child(
                         div()
@@ -75,7 +75,7 @@ impl Palette {
                                     Some(
                                         h_stack().justify_between().px_2().py_1().child(
                                             Label::new(self.empty_string.clone())
-                                                .color(LabelColor::Muted),
+                                                .color(TextColor::Muted),
                                         ),
                                     )
                                 } else {
@@ -108,7 +108,7 @@ impl Palette {
 pub struct PaletteItem {
     pub label: SharedString,
     pub sublabel: Option<SharedString>,
-    pub keybinding: Option<KeyBinding>,
+    pub key_binding: Option<KeyBinding>,
 }
 
 impl PaletteItem {
@@ -116,7 +116,7 @@ impl PaletteItem {
         Self {
             label: label.into(),
             sublabel: None,
-            keybinding: None,
+            key_binding: None,
         }
     }
 
@@ -130,11 +130,8 @@ impl PaletteItem {
         self
     }
 
-    pub fn keybinding<K>(mut self, keybinding: K) -> Self
-    where
-        K: Into<Option<KeyBinding>>,
-    {
-        self.keybinding = keybinding.into();
+    pub fn key_binding(mut self, key_binding: impl Into<Option<KeyBinding>>) -> Self {
+        self.key_binding = key_binding.into();
         self
     }
 
@@ -149,7 +146,7 @@ impl PaletteItem {
                     .child(Label::new(self.label.clone()))
                     .children(self.sublabel.clone().map(|sublabel| Label::new(sublabel))),
             )
-            .children(self.keybinding)
+            .children(self.key_binding)
     }
 }
 
@@ -182,23 +179,23 @@ mod stories {
                             .placeholder("Execute a command...")
                             .items(vec![
                                 PaletteItem::new("theme selector: toggle")
-                                    .keybinding(KeyBinding::new(binding("cmd-k cmd-t"))),
+                                    .key_binding(KeyBinding::new(binding("cmd-k cmd-t"))),
                                 PaletteItem::new("assistant: inline assist")
-                                    .keybinding(KeyBinding::new(binding("cmd-enter"))),
+                                    .key_binding(KeyBinding::new(binding("cmd-enter"))),
                                 PaletteItem::new("assistant: quote selection")
-                                    .keybinding(KeyBinding::new(binding("cmd-<"))),
+                                    .key_binding(KeyBinding::new(binding("cmd-<"))),
                                 PaletteItem::new("assistant: toggle focus")
-                                    .keybinding(KeyBinding::new(binding("cmd-?"))),
+                                    .key_binding(KeyBinding::new(binding("cmd-?"))),
                                 PaletteItem::new("auto update: check"),
                                 PaletteItem::new("auto update: view release notes"),
                                 PaletteItem::new("branches: open recent")
-                                    .keybinding(KeyBinding::new(binding("cmd-alt-b"))),
+                                    .key_binding(KeyBinding::new(binding("cmd-alt-b"))),
                                 PaletteItem::new("chat panel: toggle focus"),
                                 PaletteItem::new("cli: install"),
                                 PaletteItem::new("client: sign in"),
                                 PaletteItem::new("client: sign out"),
                                 PaletteItem::new("editor: cancel")
-                                    .keybinding(KeyBinding::new(binding("escape"))),
+                                    .key_binding(KeyBinding::new(binding("escape"))),
                             ]),
                     )
             }

crates/ui2/src/components/tab.rs 🔗

@@ -1,5 +1,5 @@
 use crate::prelude::*;
-use crate::{Icon, IconColor, IconElement, Label, LabelColor};
+use crate::{Icon, IconElement, Label, TextColor};
 use gpui::{red, Div, ElementId, Render, View, VisualContext};
 
 #[derive(Component, Clone)]
@@ -92,20 +92,18 @@ impl Tab {
 
         let label = match (self.git_status, is_deleted) {
             (_, true) | (GitStatus::Deleted, false) => Label::new(self.title.clone())
-                .color(LabelColor::Hidden)
+                .color(TextColor::Hidden)
                 .set_strikethrough(true),
             (GitStatus::None, false) => Label::new(self.title.clone()),
-            (GitStatus::Created, false) => {
-                Label::new(self.title.clone()).color(LabelColor::Created)
-            }
+            (GitStatus::Created, false) => Label::new(self.title.clone()).color(TextColor::Created),
             (GitStatus::Modified, false) => {
-                Label::new(self.title.clone()).color(LabelColor::Modified)
+                Label::new(self.title.clone()).color(TextColor::Modified)
             }
-            (GitStatus::Renamed, false) => Label::new(self.title.clone()).color(LabelColor::Accent),
+            (GitStatus::Renamed, false) => Label::new(self.title.clone()).color(TextColor::Accent),
             (GitStatus::Conflict, false) => Label::new(self.title.clone()),
         };
 
-        let close_icon = || IconElement::new(Icon::Close).color(IconColor::Muted);
+        let close_icon = || IconElement::new(Icon::Close).color(TextColor::Muted);
 
         let (tab_bg, tab_hover_bg, tab_active_bg) = match self.current {
             false => (
@@ -148,7 +146,7 @@ impl Tab {
                     .children(has_fs_conflict.then(|| {
                         IconElement::new(Icon::ExclamationTriangle)
                             .size(crate::IconSize::Small)
-                            .color(IconColor::Warning)
+                            .color(TextColor::Warning)
                     }))
                     .children(self.icon.map(IconElement::new))
                     .children(if self.close_side == IconSide::Left {

crates/ui2/src/components/toggle.rs 🔗

@@ -1,6 +1,6 @@
 use gpui::{div, Component, ParentElement};
 
-use crate::{Icon, IconColor, IconElement, IconSize};
+use crate::{Icon, IconElement, IconSize, TextColor};
 
 /// Whether the entry is toggleable, and if so, whether it is currently toggled.
 ///
@@ -49,12 +49,12 @@ pub fn disclosure_control<V: 'static>(toggle: Toggle) -> impl Component<V> {
         (false, _) => div(),
         (_, true) => div().child(
             IconElement::new(Icon::ChevronDown)
-                .color(IconColor::Muted)
+                .color(TextColor::Muted)
                 .size(IconSize::Small),
         ),
         (_, false) => div().child(
             IconElement::new(Icon::ChevronRight)
-                .color(IconColor::Muted)
+                .color(TextColor::Muted)
                 .size(IconSize::Small),
         ),
     }

crates/ui2/src/components/tooltip.rs 🔗

@@ -1,32 +1,59 @@
-use gpui::{div, Div, ParentElement, Render, SharedString, Styled, ViewContext};
+use gpui::{Div, Render};
 use theme2::ActiveTheme;
 
-use crate::StyledExt;
+use crate::prelude::*;
+use crate::{h_stack, v_stack, KeyBinding, Label, LabelSize, StyledExt, TextColor};
 
-#[derive(Clone, Debug)]
 pub struct TextTooltip {
     title: SharedString,
+    meta: Option<SharedString>,
+    key_binding: Option<KeyBinding>,
 }
 
 impl TextTooltip {
     pub fn new(title: impl Into<SharedString>) -> Self {
         Self {
             title: title.into(),
+            meta: None,
+            key_binding: None,
         }
     }
+
+    pub fn meta(mut self, meta: impl Into<SharedString>) -> Self {
+        self.meta = Some(meta.into());
+        self
+    }
+
+    pub fn key_binding(mut self, key_binding: impl Into<Option<KeyBinding>>) -> Self {
+        self.key_binding = key_binding.into();
+        self
+    }
 }
 
 impl Render for TextTooltip {
     type Element = Div<Self>;
 
     fn render(&mut self, cx: &mut ViewContext<Self>) -> Self::Element {
-        div()
+        v_stack()
             .elevation_2(cx)
             .font("Zed Sans")
-            .text_ui()
+            .text_ui_sm()
             .text_color(cx.theme().colors().text)
             .py_1()
             .px_2()
-            .child(self.title.clone())
+            .child(
+                h_stack()
+                    .child(self.title.clone())
+                    .when_some(self.key_binding.clone(), |this, key_binding| {
+                        this.justify_between().child(key_binding)
+                    }),
+            )
+            .when_some(self.meta.clone(), |this, meta| {
+                this.child(
+                    Label::new(meta)
+                        .size(LabelSize::Small)
+                        .color(TextColor::Muted),
+                )
+            })
     }
 }

crates/ui2/src/prelude.rs 🔗

@@ -6,8 +6,8 @@ pub use gpui::{
 };
 
 pub use crate::elevation::*;
-pub use crate::ButtonVariant;
 pub use crate::StyledExt;
+pub use crate::{ButtonVariant, TextColor};
 pub use theme2::ActiveTheme;
 
 use gpui::Hsla;

crates/ui2/src/static_data.rs 🔗

@@ -10,9 +10,9 @@ use theme2::ActiveTheme;
 use crate::{binding, HighlightedText};
 use crate::{
     Buffer, BufferRow, BufferRows, Button, EditorPane, FileSystemStatus, GitStatus,
-    HighlightedLine, Icon, KeyBinding, Label, LabelColor, ListEntry, ListEntrySize, Livestream,
-    MicStatus, Notification, PaletteItem, Player, PlayerCallStatus, PlayerWithCallStatus,
-    PublicPlayer, ScreenShareStatus, Symbol, Tab, Toggle, VideoStatus,
+    HighlightedLine, Icon, KeyBinding, Label, ListEntry, ListEntrySize, Livestream, MicStatus,
+    Notification, PaletteItem, Player, PlayerCallStatus, PlayerWithCallStatus, PublicPlayer,
+    ScreenShareStatus, Symbol, Tab, TextColor, Toggle, VideoStatus,
 };
 use crate::{ListItem, NotificationAction};
 
@@ -490,20 +490,20 @@ pub fn static_project_panel_project_items() -> Vec<ListItem> {
         ListEntry::new(Label::new(".config"))
             .left_icon(Icon::Folder.into())
             .indent_level(1),
-        ListEntry::new(Label::new(".git").color(LabelColor::Hidden))
+        ListEntry::new(Label::new(".git").color(TextColor::Hidden))
             .left_icon(Icon::Folder.into())
             .indent_level(1),
         ListEntry::new(Label::new(".cargo"))
             .left_icon(Icon::Folder.into())
             .indent_level(1),
-        ListEntry::new(Label::new(".idea").color(LabelColor::Hidden))
+        ListEntry::new(Label::new(".idea").color(TextColor::Hidden))
             .left_icon(Icon::Folder.into())
             .indent_level(1),
         ListEntry::new(Label::new("assets"))
             .left_icon(Icon::Folder.into())
             .indent_level(1)
             .toggle(Toggle::Toggled(true)),
-        ListEntry::new(Label::new("cargo-target").color(LabelColor::Hidden))
+        ListEntry::new(Label::new("cargo-target").color(TextColor::Hidden))
             .left_icon(Icon::Folder.into())
             .indent_level(1),
         ListEntry::new(Label::new("crates"))
@@ -528,7 +528,7 @@ pub fn static_project_panel_project_items() -> Vec<ListItem> {
         ListEntry::new(Label::new("call"))
             .left_icon(Icon::Folder.into())
             .indent_level(2),
-        ListEntry::new(Label::new("sqlez").color(LabelColor::Modified))
+        ListEntry::new(Label::new("sqlez").color(TextColor::Modified))
             .left_icon(Icon::Folder.into())
             .indent_level(2)
             .toggle(Toggle::Toggled(false)),
@@ -543,45 +543,45 @@ pub fn static_project_panel_project_items() -> Vec<ListItem> {
         ListEntry::new(Label::new("derive_element.rs"))
             .left_icon(Icon::FileRust.into())
             .indent_level(4),
-        ListEntry::new(Label::new("storybook").color(LabelColor::Modified))
+        ListEntry::new(Label::new("storybook").color(TextColor::Modified))
             .left_icon(Icon::FolderOpen.into())
             .indent_level(1)
             .toggle(Toggle::Toggled(true)),
-        ListEntry::new(Label::new("docs").color(LabelColor::Default))
+        ListEntry::new(Label::new("docs").color(TextColor::Default))
             .left_icon(Icon::Folder.into())
             .indent_level(2)
             .toggle(Toggle::Toggled(true)),
-        ListEntry::new(Label::new("src").color(LabelColor::Modified))
+        ListEntry::new(Label::new("src").color(TextColor::Modified))
             .left_icon(Icon::FolderOpen.into())
             .indent_level(3)
             .toggle(Toggle::Toggled(true)),
-        ListEntry::new(Label::new("ui").color(LabelColor::Modified))
+        ListEntry::new(Label::new("ui").color(TextColor::Modified))
             .left_icon(Icon::FolderOpen.into())
             .indent_level(4)
             .toggle(Toggle::Toggled(true)),
-        ListEntry::new(Label::new("component").color(LabelColor::Created))
+        ListEntry::new(Label::new("component").color(TextColor::Created))
             .left_icon(Icon::FolderOpen.into())
             .indent_level(5)
             .toggle(Toggle::Toggled(true)),
-        ListEntry::new(Label::new("facepile.rs").color(LabelColor::Default))
+        ListEntry::new(Label::new("facepile.rs").color(TextColor::Default))
             .left_icon(Icon::FileRust.into())
             .indent_level(6),
-        ListEntry::new(Label::new("follow_group.rs").color(LabelColor::Default))
+        ListEntry::new(Label::new("follow_group.rs").color(TextColor::Default))
             .left_icon(Icon::FileRust.into())
             .indent_level(6),
-        ListEntry::new(Label::new("list_item.rs").color(LabelColor::Created))
+        ListEntry::new(Label::new("list_item.rs").color(TextColor::Created))
             .left_icon(Icon::FileRust.into())
             .indent_level(6),
-        ListEntry::new(Label::new("tab.rs").color(LabelColor::Default))
+        ListEntry::new(Label::new("tab.rs").color(TextColor::Default))
             .left_icon(Icon::FileRust.into())
             .indent_level(6),
-        ListEntry::new(Label::new("target").color(LabelColor::Hidden))
+        ListEntry::new(Label::new("target").color(TextColor::Hidden))
             .left_icon(Icon::Folder.into())
             .indent_level(1),
         ListEntry::new(Label::new(".dockerignore"))
             .left_icon(Icon::FileGeneric.into())
             .indent_level(1),
-        ListEntry::new(Label::new(".DS_Store").color(LabelColor::Hidden))
+        ListEntry::new(Label::new(".DS_Store").color(TextColor::Hidden))
             .left_icon(Icon::FileGeneric.into())
             .indent_level(1),
         ListEntry::new(Label::new("Cargo.lock"))
@@ -701,16 +701,16 @@ pub fn static_collab_panel_channels() -> Vec<ListItem> {
 
 pub fn example_editor_actions() -> Vec<PaletteItem> {
     vec![
-        PaletteItem::new("New File").keybinding(KeyBinding::new(binding("cmd-n"))),
-        PaletteItem::new("Open File").keybinding(KeyBinding::new(binding("cmd-o"))),
-        PaletteItem::new("Save File").keybinding(KeyBinding::new(binding("cmd-s"))),
-        PaletteItem::new("Cut").keybinding(KeyBinding::new(binding("cmd-x"))),
-        PaletteItem::new("Copy").keybinding(KeyBinding::new(binding("cmd-c"))),
-        PaletteItem::new("Paste").keybinding(KeyBinding::new(binding("cmd-v"))),
-        PaletteItem::new("Undo").keybinding(KeyBinding::new(binding("cmd-z"))),
-        PaletteItem::new("Redo").keybinding(KeyBinding::new(binding("cmd-shift-z"))),
-        PaletteItem::new("Find").keybinding(KeyBinding::new(binding("cmd-f"))),
-        PaletteItem::new("Replace").keybinding(KeyBinding::new(binding("cmd-r"))),
+        PaletteItem::new("New File").key_binding(KeyBinding::new(binding("cmd-n"))),
+        PaletteItem::new("Open File").key_binding(KeyBinding::new(binding("cmd-o"))),
+        PaletteItem::new("Save File").key_binding(KeyBinding::new(binding("cmd-s"))),
+        PaletteItem::new("Cut").key_binding(KeyBinding::new(binding("cmd-x"))),
+        PaletteItem::new("Copy").key_binding(KeyBinding::new(binding("cmd-c"))),
+        PaletteItem::new("Paste").key_binding(KeyBinding::new(binding("cmd-v"))),
+        PaletteItem::new("Undo").key_binding(KeyBinding::new(binding("cmd-z"))),
+        PaletteItem::new("Redo").key_binding(KeyBinding::new(binding("cmd-shift-z"))),
+        PaletteItem::new("Find").key_binding(KeyBinding::new(binding("cmd-f"))),
+        PaletteItem::new("Replace").key_binding(KeyBinding::new(binding("cmd-r"))),
         PaletteItem::new("Jump to Line"),
         PaletteItem::new("Select All"),
         PaletteItem::new("Deselect All"),

crates/ui2/src/to_extract/buffer_search.rs 🔗

@@ -1,7 +1,7 @@
 use gpui::{Div, Render, View, VisualContext};
 
 use crate::prelude::*;
-use crate::{h_stack, Icon, IconButton, IconColor, Input};
+use crate::{h_stack, Icon, IconButton, Input, TextColor};
 
 #[derive(Clone)]
 pub struct BufferSearch {
@@ -36,7 +36,7 @@ impl Render for BufferSearch {
             .child(
                 h_stack().child(Input::new("Search")).child(
                     IconButton::<Self>::new("replace", Icon::Replace)
-                        .when(self.is_replace_open, |this| this.color(IconColor::Accent))
+                        .when(self.is_replace_open, |this| this.color(TextColor::Accent))
                         .on_click(|buffer_search, cx| {
                             buffer_search.toggle_replace(cx);
                         }),

crates/ui2/src/to_extract/chat_panel.rs 🔗

@@ -1,7 +1,7 @@
 use chrono::NaiveDateTime;
 
 use crate::prelude::*;
-use crate::{Icon, IconButton, Input, Label, LabelColor};
+use crate::{Icon, IconButton, Input, Label, TextColor};
 
 #[derive(Component)]
 pub struct ChatPanel {
@@ -95,7 +95,7 @@ impl ChatMessage {
                     .child(Label::new(self.author.clone()))
                     .child(
                         Label::new(self.sent_at.format("%m/%d/%Y").to_string())
-                            .color(LabelColor::Muted),
+                            .color(TextColor::Muted),
                     ),
             )
             .child(div().child(Label::new(self.text.clone())))

crates/ui2/src/to_extract/copilot.rs 🔗

@@ -1,4 +1,4 @@
-use crate::{prelude::*, Button, Label, LabelColor, Modal};
+use crate::{prelude::*, Button, Label, Modal, TextColor};
 
 #[derive(Component)]
 pub struct CopilotModal {
@@ -14,7 +14,7 @@ impl CopilotModal {
         div().id(self.id.clone()).child(
             Modal::new("some-id")
                 .title("Connect Copilot to Zed")
-                .child(Label::new("You can update your settings or sign out from the Copilot menu in the status bar.").color(LabelColor::Muted))
+                .child(Label::new("You can update your settings or sign out from the Copilot menu in the status bar.").color(TextColor::Muted))
                 .primary_action(Button::new("Connect to Github").variant(ButtonVariant::Filled)),
         )
     }

crates/ui2/src/to_extract/editor_pane.rs 🔗

@@ -5,7 +5,7 @@ use gpui::{Div, Render, View, VisualContext};
 use crate::prelude::*;
 use crate::{
     hello_world_rust_editor_with_status_example, v_stack, Breadcrumb, Buffer, BufferSearch, Icon,
-    IconButton, IconColor, Symbol, Tab, TabBar, Toolbar,
+    IconButton, Symbol, Tab, TabBar, TextColor, Toolbar,
 };
 
 #[derive(Clone)]
@@ -63,7 +63,7 @@ impl Render for EditorPane {
                         IconButton::new("toggle_inlay_hints", Icon::InlayHint),
                         IconButton::<Self>::new("buffer_search", Icon::MagnifyingGlass)
                             .when(self.is_buffer_search_open, |this| {
-                                this.color(IconColor::Accent)
+                                this.color(TextColor::Accent)
                             })
                             .on_click(|editor, cx| {
                                 editor.toggle_buffer_search(cx);

crates/ui2/src/to_extract/notifications_panel.rs 🔗

@@ -1,8 +1,8 @@
 use crate::utils::naive_format_distance_from_now;
 use crate::{
     h_stack, prelude::*, static_new_notification_items_2, v_stack, Avatar, ButtonOrIconButton,
-    Icon, IconElement, Label, LabelColor, LineHeightStyle, ListHeaderMeta, ListSeparator,
-    PublicPlayer, UnreadIndicator,
+    Icon, IconElement, Label, LineHeightStyle, ListHeaderMeta, ListSeparator, PublicPlayer,
+    TextColor, UnreadIndicator,
 };
 use crate::{ClickHandler, ListHeader};
 
@@ -48,7 +48,7 @@ impl NotificationsPanel {
                             .border_color(cx.theme().colors().border_variant)
                             .child(
                                 Label::new("Search...")
-                                    .color(LabelColor::Placeholder)
+                                    .color(TextColor::Placeholder)
                                     .line_height_style(LineHeightStyle::UILabel),
                             ),
                     )
@@ -252,7 +252,7 @@ impl<V> Notification<V> {
                         if let Some(icon) = icon {
                             meta_el = meta_el.child(IconElement::new(icon.clone()));
                         }
-                        meta_el.child(Label::new(text.clone()).color(LabelColor::Muted))
+                        meta_el.child(Label::new(text.clone()).color(TextColor::Muted))
                     })
                     .collect::<Vec<_>>(),
             )
@@ -311,7 +311,7 @@ impl<V> Notification<V> {
                                             true,
                                             true,
                                         ))
-                                        .color(LabelColor::Muted),
+                                        .color(TextColor::Muted),
                                     )
                                     .child(self.render_meta_items(cx)),
                             )
@@ -321,11 +321,11 @@ impl<V> Notification<V> {
                                 // Show the taken_message
                                 (Some(_), Some(action_taken)) => h_stack()
                                     .children(action_taken.taken_message.0.map(|icon| {
-                                        IconElement::new(icon).color(crate::IconColor::Muted)
+                                        IconElement::new(icon).color(crate::TextColor::Muted)
                                     }))
                                     .child(
                                         Label::new(action_taken.taken_message.1.clone())
-                                            .color(LabelColor::Muted),
+                                            .color(TextColor::Muted),
                                     ),
                                 // Show the actions
                                 (Some(actions), None) => {

crates/ui2/src/to_extract/status_bar.rs 🔗

@@ -1,7 +1,7 @@
 use std::sync::Arc;
 
 use crate::prelude::*;
-use crate::{Button, Icon, IconButton, IconColor, ToolDivider, Workspace};
+use crate::{Button, Icon, IconButton, TextColor, ToolDivider, Workspace};
 
 #[derive(Default, PartialEq)]
 pub enum Tool {
@@ -110,7 +110,7 @@ impl StatusBar {
             .child(
                 IconButton::<Workspace>::new("project_panel", Icon::FileTree)
                     .when(workspace.is_project_panel_open(), |this| {
-                        this.color(IconColor::Accent)
+                        this.color(TextColor::Accent)
                     })
                     .on_click(|workspace, cx| {
                         workspace.toggle_project_panel(cx);
@@ -119,7 +119,7 @@ impl StatusBar {
             .child(
                 IconButton::<Workspace>::new("collab_panel", Icon::Hash)
                     .when(workspace.is_collab_panel_open(), |this| {
-                        this.color(IconColor::Accent)
+                        this.color(TextColor::Accent)
                     })
                     .on_click(|workspace, cx| {
                         workspace.toggle_collab_panel();
@@ -174,7 +174,7 @@ impl StatusBar {
                     .child(
                         IconButton::<Workspace>::new("terminal", Icon::Terminal)
                             .when(workspace.is_terminal_open(), |this| {
-                                this.color(IconColor::Accent)
+                                this.color(TextColor::Accent)
                             })
                             .on_click(|workspace, cx| {
                                 workspace.toggle_terminal(cx);
@@ -183,7 +183,7 @@ impl StatusBar {
                     .child(
                         IconButton::<Workspace>::new("chat_panel", Icon::MessageBubbles)
                             .when(workspace.is_chat_panel_open(), |this| {
-                                this.color(IconColor::Accent)
+                                this.color(TextColor::Accent)
                             })
                             .on_click(|workspace, cx| {
                                 workspace.toggle_chat_panel(cx);
@@ -192,7 +192,7 @@ impl StatusBar {
                     .child(
                         IconButton::<Workspace>::new("assistant_panel", Icon::Ai)
                             .when(workspace.is_assistant_panel_open(), |this| {
-                                this.color(IconColor::Accent)
+                                this.color(TextColor::Accent)
                             })
                             .on_click(|workspace, cx| {
                                 workspace.toggle_assistant_panel(cx);

crates/ui2/src/to_extract/title_bar.rs 🔗

@@ -6,8 +6,8 @@ use gpui::{Div, Render, View, VisualContext};
 use crate::prelude::*;
 use crate::settings::user_settings;
 use crate::{
-    Avatar, Button, Icon, IconButton, IconColor, MicStatus, PlayerStack, PlayerWithCallStatus,
-    ScreenShareStatus, ToolDivider, TrafficLights,
+    Avatar, Button, Icon, IconButton, MicStatus, PlayerStack, PlayerWithCallStatus,
+    ScreenShareStatus, TextColor, ToolDivider, TrafficLights,
 };
 
 #[derive(Clone)]
@@ -152,19 +152,19 @@ impl Render for TitleBar {
                             .gap_1()
                             .child(
                                 IconButton::<TitleBar>::new("toggle_mic_status", Icon::Mic)
-                                    .when(self.is_mic_muted(), |this| this.color(IconColor::Error))
+                                    .when(self.is_mic_muted(), |this| this.color(TextColor::Error))
                                     .on_click(|title_bar, cx| title_bar.toggle_mic_status(cx)),
                             )
                             .child(
                                 IconButton::<TitleBar>::new("toggle_deafened", Icon::AudioOn)
-                                    .when(self.is_deafened, |this| this.color(IconColor::Error))
+                                    .when(self.is_deafened, |this| this.color(TextColor::Error))
                                     .on_click(|title_bar, cx| title_bar.toggle_deafened(cx)),
                             )
                             .child(
                                 IconButton::<TitleBar>::new("toggle_screen_share", Icon::Screen)
                                     .when(
                                         self.screen_share_status == ScreenShareStatus::Shared,
-                                        |this| this.color(IconColor::Accent),
+                                        |this| this.color(TextColor::Accent),
                                     )
                                     .on_click(|title_bar, cx| {
                                         title_bar.toggle_screen_share_status(cx)

crates/workspace2/src/pane.rs 🔗

@@ -27,7 +27,7 @@ use std::{
     },
 };
 use ui::v_stack;
-use ui::{prelude::*, Icon, IconButton, IconColor, IconElement, TextTooltip};
+use ui::{prelude::*, Icon, IconButton, IconElement, TextColor, TextTooltip};
 use util::truncate_and_remove_front;
 
 #[derive(PartialEq, Clone, Copy, Deserialize, Debug)]
@@ -1432,13 +1432,13 @@ impl Pane {
                         Some(
                             IconElement::new(Icon::ExclamationTriangle)
                                 .size(ui::IconSize::Small)
-                                .color(IconColor::Warning),
+                                .color(TextColor::Warning),
                         )
                     } else if item.is_dirty(cx) {
                         Some(
                             IconElement::new(Icon::ExclamationTriangle)
                                 .size(ui::IconSize::Small)
-                                .color(IconColor::Info),
+                                .color(TextColor::Info),
                         )
                     } else {
                         None

crates/workspace2/src/workspace2.rs 🔗

@@ -69,7 +69,7 @@ use std::{
 };
 use theme2::ActiveTheme;
 pub use toolbar::{ToolbarItemLocation, ToolbarItemView};
-use ui::{h_stack, Button, ButtonVariant, Label, LabelColor};
+use ui::{h_stack, Button, ButtonVariant, KeyBinding, Label, TextColor, TextTooltip};
 use util::ResultExt;
 use uuid::Uuid;
 pub use workspace_settings::{AutosaveSetting, WorkspaceSettings};
@@ -2472,17 +2472,50 @@ impl Workspace {
                 h_stack()
                     // TODO - Add player menu
                     .child(
-                        Button::new("player")
-                            .variant(ButtonVariant::Ghost)
-                            .color(Some(LabelColor::Player(0))),
+                        div()
+                            .id("project_owner_indicator")
+                            .child(
+                                Button::new("player")
+                                    .variant(ButtonVariant::Ghost)
+                                    .color(Some(TextColor::Player(0))),
+                            )
+                            .tooltip(move |_, cx| {
+                                cx.build_view(|cx| TextTooltip::new("Toggle following"))
+                            }),
                     )
                     // TODO - Add project menu
-                    .child(Button::new("project_name").variant(ButtonVariant::Ghost))
+                    .child(
+                        div()
+                            .id("titlebar_project_menu_button")
+                            .child(Button::new("project_name").variant(ButtonVariant::Ghost))
+                            .tooltip(move |_, cx| {
+                                cx.build_view(|cx| TextTooltip::new("Recent Projects"))
+                            }),
+                    )
                     // TODO - Add git menu
                     .child(
-                        Button::new("branch_name")
-                            .variant(ButtonVariant::Ghost)
-                            .color(Some(LabelColor::Muted)),
+                        div()
+                            .id("titlebar_git_menu_button")
+                            .child(
+                                Button::new("branch_name")
+                                    .variant(ButtonVariant::Ghost)
+                                    .color(Some(TextColor::Muted)),
+                            )
+                            .tooltip(move |_, cx| {
+                                // todo!() Replace with real action.
+                                #[gpui::action]
+                                struct NoAction {}
+
+                                cx.build_view(|cx| {
+                                    TextTooltip::new("Recent Branches")
+                                        .key_binding(KeyBinding::new(gpui::KeyBinding::new(
+                                            "cmd-b",
+                                            NoAction {},
+                                            None,
+                                        )))
+                                        .meta("Only local branches shown")
+                                })
+                            }),
                     ),
             ) // self.titlebar_item
             .child(h_stack().child(Label::new("Right side titlebar item")))