Yehowshua/ZIm
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Extend Label & Tooltip (#3322)

Browse source 
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
This commit is contained in:
Marshall Bowers 2023-11-14 13:56:05 -05:00 • committed by GitHub
commit 5c8db996ee
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
26 changed files with 271 additions and 254 deletions
Download patch file Download diff file Expand all files Collapse all files

4
crates/editor2/src/items.rs
View file

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

4
crates/go_to_line2/src/go_to_line.rs
View file

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

4
crates/picker2/src/picker2.rs
View file

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

44
crates/ui2/src/components/button.rs
View file

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

10
crates/ui2/src/components/checkbox.rs
View file

@ -6,7 +6,7 @@ use gpui::{
}; };
use theme2::ActiveTheme; 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>; 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( .color(
// If the checkbox is disabled we change the color of the icon. // If the checkbox is disabled we change the color of the icon.
if self.disabled { if self.disabled {
IconColor::Disabled TextColor::Disabled
} else { } else {
IconColor::Selected TextColor::Selected
}, },
), ),
) )
@ -73,9 +73,9 @@ impl<V: 'static> Checkbox<V> {
.color( .color(
// If the checkbox is disabled we change the color of the icon. // If the checkbox is disabled we change the color of the icon.
if self.disabled { if self.disabled {
IconColor::Disabled TextColor::Disabled
} else { } else {
IconColor::Selected TextColor::Selected
}, },
), ),
) )

74
crates/ui2/src/components/icon.rs
View file

@ -1,7 +1,7 @@
use gpui::{rems, svg, Hsla}; use gpui::{rems, svg};
use strum::EnumIter; use strum::EnumIter;
use crate::{prelude::*, LabelColor}; use crate::prelude::*;
#[derive(Default, PartialEq, Copy, Clone)] #[derive(Default, PartialEq, Copy, Clone)]
pub enum IconSize { pub enum IconSize {
@ -10,70 +10,6 @@ pub enum IconSize {
Medium, 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)] #[derive(Debug, PartialEq, Copy, Clone, EnumIter)]
pub enum Icon { pub enum Icon {
Ai, Ai,
@ -194,7 +130,7 @@ impl Icon {
#[derive(Component)] #[derive(Component)]
pub struct IconElement { pub struct IconElement {
icon: Icon, icon: Icon,
color: IconColor, color: TextColor,
size: IconSize, size: IconSize,
} }
@ -202,12 +138,12 @@ impl IconElement {
pub fn new(icon: Icon) -> Self { pub fn new(icon: Icon) -> Self {
Self { Self {
icon, icon,
color: IconColor::default(), color: TextColor::default(),
size: IconSize::default(), size: IconSize::default(),
} }
} }
pub fn color(mut self, color: IconColor) -> Self { pub fn color(mut self, color: TextColor) -> Self {
self.color = color; self.color = color;
self self
} }

10
crates/ui2/src/components/icon_button.rs
View file

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

10
crates/ui2/src/components/input.rs
View file

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

2
crates/ui2/src/components/keybinding.rs
View file

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

86
crates/ui2/src/components/label.rs
View file

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

20
crates/ui2/src/components/list.rs
View file

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

31
crates/ui2/src/components/palette.rs
View file

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

16
crates/ui2/src/components/tab.rs
View file

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

6
crates/ui2/src/components/toggle.rs
View file

@ -1,6 +1,6 @@
use gpui::{div, Component, ParentElement}; 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. /// 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(), (false, _) => div(),
(_, true) => div().child( (_, true) => div().child(
IconElement::new(Icon::ChevronDown) IconElement::new(Icon::ChevronDown)
.color(IconColor::Muted) .color(TextColor::Muted)
.size(IconSize::Small), .size(IconSize::Small),
), ),
(_, false) => div().child( (_, false) => div().child(
IconElement::new(Icon::ChevronRight) IconElement::new(Icon::ChevronRight)
.color(IconColor::Muted) .color(TextColor::Muted)
.size(IconSize::Small), .size(IconSize::Small),
), ),
} }

37
crates/ui2/src/components/tooltip.rs
View file

@ -1,32 +1,59 @@
use gpui::{div, Div, ParentElement, Render, SharedString, Styled, ViewContext}; use gpui::{Div, Render};
use theme2::ActiveTheme; 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 { pub struct TextTooltip {
title: SharedString, title: SharedString,
meta: Option<SharedString>,
key_binding: Option<KeyBinding>,
} }
impl TextTooltip { impl TextTooltip {
pub fn new(title: impl Into<SharedString>) -> Self { pub fn new(title: impl Into<SharedString>) -> Self {
Self { Self {
title: title.into(), 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 { impl Render for TextTooltip {
type Element = Div<Self>; type Element = Div<Self>;
fn render(&mut self, cx: &mut ViewContext<Self>) -> Self::Element { fn render(&mut self, cx: &mut ViewContext<Self>) -> Self::Element {
div() v_stack()
.elevation_2(cx) .elevation_2(cx)
.font("Zed Sans") .font("Zed Sans")
.text_ui() .text_ui_sm()
.text_color(cx.theme().colors().text) .text_color(cx.theme().colors().text)
.py_1() .py_1()
.px_2() .px_2()
.child(
h_stack()
.child(self.title.clone()) .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),
)
})
} }
} }

2
crates/ui2/src/prelude.rs
View file

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

56
crates/ui2/src/static_data.rs
View file

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

4
crates/ui2/src/to_extract/buffer_search.rs
View file

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

4
crates/ui2/src/to_extract/chat_panel.rs
View file

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

4
crates/ui2/src/to_extract/copilot.rs
View file

@ -1,4 +1,4 @@
use crate::{prelude::*, Button, Label, LabelColor, Modal}; use crate::{prelude::*, Button, Label, Modal, TextColor};
#[derive(Component)] #[derive(Component)]
pub struct CopilotModal { pub struct CopilotModal {
@ -14,7 +14,7 @@ impl CopilotModal {
div().id(self.id.clone()).child( div().id(self.id.clone()).child(
Modal::new("some-id") Modal::new("some-id")
.title("Connect Copilot to Zed") .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)), .primary_action(Button::new("Connect to Github").variant(ButtonVariant::Filled)),
) )
} }

4
crates/ui2/src/to_extract/editor_pane.rs
View file

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

14
crates/ui2/src/to_extract/notifications_panel.rs
View file

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

12
crates/ui2/src/to_extract/status_bar.rs
View file

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

10
crates/ui2/src/to_extract/title_bar.rs
View file

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

6
crates/workspace2/src/pane.rs
View file

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

39
crates/workspace2/src/workspace2.rs
View file

@ -69,7 +69,7 @@ use std::{
}; };
use theme2::ActiveTheme; use theme2::ActiveTheme;
pub use toolbar::{ToolbarItemLocation, ToolbarItemView}; 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 util::ResultExt;
use uuid::Uuid; use uuid::Uuid;
pub use workspace_settings::{AutosaveSetting, WorkspaceSettings}; pub use workspace_settings::{AutosaveSetting, WorkspaceSettings};
@ -2471,18 +2471,51 @@ impl Workspace {
.child( .child(
h_stack() h_stack()
// TODO - Add player menu // TODO - Add player menu
.child(
div()
.id("project_owner_indicator")
.child( .child(
Button::new("player") Button::new("player")
.variant(ButtonVariant::Ghost) .variant(ButtonVariant::Ghost)
.color(Some(LabelColor::Player(0))), .color(Some(TextColor::Player(0))),
)
.tooltip(move |_, cx| {
cx.build_view(|cx| TextTooltip::new("Toggle following"))
}),
) )
// TODO - Add project menu // TODO - Add project menu
.child(
div()
.id("titlebar_project_menu_button")
.child(Button::new("project_name").variant(ButtonVariant::Ghost)) .child(Button::new("project_name").variant(ButtonVariant::Ghost))
.tooltip(move |_, cx| {
cx.build_view(|cx| TextTooltip::new("Recent Projects"))
}),
)
// TODO - Add git menu // TODO - Add git menu
.child(
div()
.id("titlebar_git_menu_button")
.child( .child(
Button::new("branch_name") Button::new("branch_name")
.variant(ButtonVariant::Ghost) .variant(ButtonVariant::Ghost)
.color(Some(LabelColor::Muted)), .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 ) // self.titlebar_item
.child(h_stack().child(Label::new("Right side titlebar item"))) .child(h_stack().child(Label::new("Right side titlebar item")))