Allow a button to take a color

crates/ui2/src/components/button.rs

@@ -87,6 +87,7 @@ pub struct Button<V: 'static> {
     label: SharedString,
     variant: ButtonVariant,
     width: Option<DefiniteLength>,
+    color: Option<LabelColor>,
 }
 
 impl<V: 'static> Button<V> {
@@ -99,6 +100,7 @@ impl<V: 'static> Button<V> {
             label: label.into(),
             variant: Default::default(),
             width: Default::default(),
+            color: None,
         }
     }
 
@@ -139,25 +141,24 @@ impl<V: 'static> Button<V> {
         self
     }
 
-    fn label_color(&self) -> LabelColor {
+    pub fn color(mut self, color: Option<LabelColor>) -> Self {
+        self.color = color;
+        self
+    }
+
+    pub fn label_color(&self, color: Option<LabelColor>) -> LabelColor {
         if self.disabled {
             LabelColor::Disabled
+        } else if let Some(color) = color {
+            color
         } else {
             Default::default()
         }
     }
 
-    fn icon_color(&self) -> IconColor {
+    fn render_label(&self, color: LabelColor) -> Label {
-        if self.disabled {
-            IconColor::Disabled
-        } else {
-            Default::default()
-        }
-    }
-
-    fn render_label(&self) -> Label {
         Label::new(self.label.clone())
-            .color(self.label_color())
+            .color(color)
             .line_height_style(LineHeightStyle::UILabel)
     }
 
@@ -166,7 +167,11 @@ impl<V: 'static> Button<V> {
     }
 
     pub fn render(self, _view: &mut V, cx: &mut ViewContext<V>) -> impl Component<V> {
-        let icon_color = self.icon_color();
+        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),
+        };
 
         let mut button = h_stack()
             .id(SharedString::from(format!("{}", self.label)))
@@ -182,16 +187,16 @@ impl<V: 'static> Button<V> {
             (Some(_), Some(IconPosition::Left)) => {
                 button = button
                     .gap_1()
-                    .child(self.render_label())
+                    .child(self.render_label(label_color))
                     .children(self.render_icon(icon_color))
             }
             (Some(_), Some(IconPosition::Right)) => {
                 button = button
                     .gap_1()
                     .children(self.render_icon(icon_color))
-                    .child(self.render_label())
+                    .child(self.render_label(label_color))
             }
-            (_, _) => button = button.child(self.render_label()),
+            (_, _) => button = button.child(self.render_label(label_color)),
         }
 
         if let Some(width) = self.width {

crates/ui2/src/components/icon.rs

@@ -1,7 +1,7 @@
 use gpui::{rems, svg, Hsla};
 use strum::EnumIter;
 
-use crate::prelude::*;
+use crate::{prelude::*, LabelColor};
 
 #[derive(Default, PartialEq, Copy, Clone)]
 pub enum IconSize {
@@ -14,15 +14,20 @@ pub enum IconSize {
 pub enum IconColor {
     #[default]
     Default,
-    Muted,
-    Disabled,
-    Placeholder,
     Accent,
+    Created,
+    Deleted,
+    Disabled,
     Error,
-    Warning,
+    Hidden,
-    Success,
     Info,
+    Modified,
+    Muted,
+    Placeholder,
+    Player(u32),
     Selected,
+    Success,
+    Warning,
 }
 
 impl IconColor {
@@ -38,6 +43,33 @@ impl IconColor {
             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,
         }
     }
 }

crates/ui2/src/components/icon_button.rs

@@ -1,6 +1,6 @@
 use std::sync::Arc;
 
-use gpui::{rems, MouseButton};
+use gpui::MouseButton;
 
 use crate::{h_stack, prelude::*};
 use crate::{ClickHandler, Icon, IconColor, IconElement};
@@ -88,9 +88,7 @@ impl<V: 'static> IconButton<V> {
             .id(self.id.clone())
             .justify_center()
             .rounded_md()
-            // todo!("Where do these numbers come from?")
+            .p_1()
-            .py(rems(0.21875))
-            .px(rems(0.375))
             .bg(bg_color)
             .hover(|style| style.bg(bg_hover_color))
             .active(|style| style.bg(bg_active_color))

crates/ui2/src/components/label.rs

@@ -8,28 +8,40 @@ use crate::styled_ext::StyledExt;
 pub enum LabelColor {
     #[default]
     Default,
-    Muted,
+    Accent,
     Created,
-    Modified,
     Deleted,
     Disabled,
+    Error,
     Hidden,
+    Info,
+    Modified,
+    Muted,
     Placeholder,
-    Accent,
+    Player(u32),
+    Selected,
+    Success,
+    Warning,
 }
 
 impl LabelColor {
     pub fn hsla(&self, cx: &WindowContext) -> Hsla {
         match self {
-            Self::Default => cx.theme().colors().text,
+            LabelColor::Default => cx.theme().colors().text,
-            Self::Muted => cx.theme().colors().text_muted,
+            LabelColor::Muted => cx.theme().colors().text_muted,
-            Self::Created => cx.theme().status().created,
+            LabelColor::Created => cx.theme().status().created,
-            Self::Modified => cx.theme().status().modified,
+            LabelColor::Modified => cx.theme().status().modified,
-            Self::Deleted => cx.theme().status().deleted,
+            LabelColor::Deleted => cx.theme().status().deleted,
-            Self::Disabled => cx.theme().colors().text_disabled,
+            LabelColor::Disabled => cx.theme().colors().text_disabled,
-            Self::Hidden => cx.theme().status().hidden,
+            LabelColor::Hidden => cx.theme().status().hidden,
-            Self::Placeholder => cx.theme().colors().text_placeholder,
+            LabelColor::Info => cx.theme().status().info,
-            Self::Accent => cx.theme().colors().text_accent,
+            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,
         }
     }
 }

crates/workspace2/src/workspace2.rs

@@ -69,7 +69,7 @@ use std::{
 };
 use theme2::ActiveTheme;
 pub use toolbar::{ToolbarItemLocation, ToolbarItemView};
-use ui::{h_stack, Label};
+use ui::{h_stack, Button, ButtonVariant, Label, LabelColor};
 use util::ResultExt;
 use uuid::Uuid;
 use workspace_settings::{AutosaveSetting, WorkspaceSettings};
@@ -2641,19 +2641,35 @@ impl Workspace {
         h_stack()
             .id("titlebar")
             .justify_between()
-            .w_full()
-            .h(rems(1.75))
-            .bg(cx.theme().colors().title_bar_background)
             .when(
                 !matches!(cx.window_bounds(), WindowBounds::Fullscreen),
                 |s| s.pl_20(),
             )
+            .w_full()
+            .h(rems(1.75))
+            .bg(cx.theme().colors().title_bar_background)
             .on_click(|_, event, cx| {
                 if event.up.click_count == 2 {
                     cx.zoom_window();
                 }
             })
-            .child(h_stack().child(Label::new("Left side titlebar item"))) // self.titlebar_item
+            .child(
+                h_stack()
+                    // TODO - Add player menu
+                    .child(
+                        Button::new("player")
+                            .variant(ButtonVariant::Ghost)
+                            .color(Some(LabelColor::Player(0))),
+                    )
+                    // TODO - Add project menu
+                    .child(Button::new("project_name").variant(ButtonVariant::Ghost))
+                    // TODO - Add git menu
+                    .child(
+                        Button::new("branch_name")
+                            .variant(ButtonVariant::Ghost)
+                            .color(Some(LabelColor::Muted)),
+                    ),
+            ) // self.titlebar_item
             .child(h_stack().child(Label::new("Right side titlebar item")))
     }