Detailed changes
@@ -14,9 +14,9 @@ impl<S: 'static + Send + Sync + Clone> ContextMenuItem<S> {
fn to_list_item(self) -> ListItem<S> {
match self {
ContextMenuItem::Header(label) => ListSubHeader::new(label).into(),
- ContextMenuItem::Entry(label) => {
- ListEntry::new(label).variant(ListItemVariant::Inset).into()
- }
+ ContextMenuItem::Entry(label) => ListEntry::new(label)
+ .set_variant(ListItemVariant::Inset)
+ .into(),
ContextMenuItem::Separator => ListSeparator::new().into(),
}
}
@@ -12,8 +12,8 @@ use crate::{
#[derive(Clone, Copy, Default, Debug, PartialEq)]
pub enum ListItemVariant {
/// The list item extends to the far left and right of the list.
- #[default]
FullWidth,
+ #[default]
Inset,
}
@@ -35,7 +35,7 @@ impl<S: 'static + Send + Sync + Clone> ListHeader<S> {
left_icon: None,
variant: ListItemVariant::default(),
state: InteractionState::default(),
- toggleable: Toggleable::default(),
+ toggleable: Toggleable::Toggleable(ToggleState::Toggled),
}
}
@@ -65,8 +65,16 @@ impl<S: 'static + Send + Sync + Clone> ListHeader<S> {
match (is_toggleable, is_toggled) {
(false, _) => div(),
- (_, true) => div().child(IconElement::new(Icon::ChevronRight).color(IconColor::Muted)),
- (_, false) => div().child(IconElement::new(Icon::ChevronDown).size(IconSize::Small)),
+ (_, true) => div().child(
+ IconElement::new(Icon::ChevronDown)
+ .color(IconColor::Muted)
+ .size(IconSize::Small),
+ ),
+ (_, false) => div().child(
+ IconElement::new(Icon::ChevronRight)
+ .color(IconColor::Muted)
+ .size(IconSize::Small),
+ ),
}
}
@@ -116,10 +124,9 @@ impl<S: 'static + Send + Sync + Clone> ListHeader<S> {
.border_color(theme.lowest.accent.default.border)
})
.relative()
- .py_1()
.child(
div()
- .h_6()
+ .h_5()
.when(self.variant == ListItemVariant::Inset, |this| this.px_2())
.flex()
.flex_1()
@@ -287,14 +294,16 @@ impl<S: 'static + Send + Sync + Clone> ListEntry<S> {
left_content: None,
size: ListEntrySize::default(),
state: InteractionState::default(),
+ // TODO: Should use Toggleable::NotToggleable
+ // or remove Toggleable::NotToggleable from the system
toggle: None,
}
}
- pub fn variant(mut self, variant: ListItemVariant) -> Self {
+ pub fn set_variant(mut self, variant: ListItemVariant) -> Self {
self.variant = variant;
self
}
- pub fn indent_level(mut self, indent_level: u32) -> Self {
+ pub fn set_indent_level(mut self, indent_level: u32) -> Self {
self.indent_level = indent_level;
self
}
@@ -304,32 +313,32 @@ impl<S: 'static + Send + Sync + Clone> ListEntry<S> {
self
}
- pub fn left_content(mut self, left_content: LeftContent) -> Self {
+ pub fn set_left_content(mut self, left_content: LeftContent) -> Self {
self.left_content = Some(left_content);
self
}
- pub fn left_icon(mut self, left_icon: Icon) -> Self {
+ pub fn set_left_icon(mut self, left_icon: Icon) -> Self {
self.left_content = Some(LeftContent::Icon(left_icon));
self
}
- pub fn left_avatar(mut self, left_avatar: &'static str) -> Self {
+ pub fn set_left_avatar(mut self, left_avatar: &'static str) -> Self {
self.left_content = Some(LeftContent::Avatar(left_avatar));
self
}
- pub fn state(mut self, state: InteractionState) -> Self {
+ pub fn set_state(mut self, state: InteractionState) -> Self {
self.state = state;
self
}
- pub fn size(mut self, size: ListEntrySize) -> Self {
+ pub fn set_size(mut self, size: ListEntrySize) -> Self {
self.size = size;
self
}
- pub fn disclosure_control_style(
+ pub fn set_disclosure_control_style(
mut self,
disclosure_control_style: DisclosureControlVisibility,
) -> Self {
@@ -390,12 +399,16 @@ impl<S: 'static + Send + Sync + Clone> ListEntry<S> {
let theme = theme(cx);
let token = token();
let system_color = SystemColor::new();
- let background_color = self.background_color(cx);
+ let color = ThemeColor::new(cx);
let left_content = match self.left_content {
- Some(LeftContent::Icon(i)) => {
- Some(h_stack().child(IconElement::new(i).size(IconSize::Small)))
- }
+ Some(LeftContent::Icon(i)) => Some(
+ h_stack().child(
+ IconElement::new(i)
+ .size(IconSize::Small)
+ .color(IconColor::Muted),
+ ),
+ ),
Some(LeftContent::Avatar(src)) => Some(h_stack().child(Avatar::new(src))),
None => None,
};
@@ -406,13 +419,11 @@ impl<S: 'static + Send + Sync + Clone> ListEntry<S> {
};
div()
- .fill(background_color)
+ .relative()
+ .fill(self.background_color(cx))
.when(self.state == InteractionState::Focused, |this| {
- this.border()
- .border_color(theme.lowest.accent.default.border)
+ this.border().border_color(color.border_focused)
})
- .relative()
- .py_1()
.child(
sized_item
.when(self.variant == ListItemVariant::Inset, |this| this.px_2())
@@ -423,9 +434,11 @@ impl<S: 'static + Send + Sync + Clone> ListEntry<S> {
.h_full()
.flex()
.justify_center()
- .child(h_stack().child(div().w_px().h_full()).child(
- div().w_px().h_full().fill(theme.middle.base.default.border),
- ))
+ .child(
+ h_stack()
+ .child(div().w_px().h_full())
+ .child(div().w_px().h_full().fill(color.border)),
+ )
}))
.flex()
.gap_1()
@@ -451,9 +464,9 @@ impl<S: 'static + Send + Sync> ListSeparator<S> {
}
fn render(&mut self, cx: &mut ViewContext<S>) -> impl Element<State = S> {
- let theme = theme(cx);
+ let color = ThemeColor::new(cx);
- div().h_px().w_full().fill(theme.lowest.base.default.border)
+ div().h_px().w_full().fill(color.border)
}
}
@@ -22,17 +22,17 @@ impl<S: 'static + Send + Sync + Clone> ProjectPanel<S> {
fn render(&mut self, cx: &mut ViewContext<S>) -> impl Element<State = S> {
let theme = theme(cx);
+ let color = ThemeColor::new(cx);
div()
.flex()
.flex_col()
.w_full()
.h_full()
- .px_2()
- .fill(theme.middle.base.default.background)
+ .fill(color.panel_surface)
.child(
div()
- .w_56()
+ .w_full()
.flex()
.flex_col()
.overflow_y_scroll(ScrollState::default())
@@ -7,7 +7,6 @@ mod elements;
pub mod prelude;
mod static_data;
mod theme;
-mod tokens;
pub use children::*;
pub use components::*;
@@ -15,7 +14,6 @@ pub use element_ext::*;
pub use elements::*;
pub use prelude::*;
pub use static_data::*;
-pub use tokens::*;
pub use crate::theme::*;
@@ -5,9 +5,32 @@ pub use gpui3::{
pub use crate::{theme, ButtonVariant, ElementExt, HackyChildren, HackyChildrenPayload, Theme};
-use gpui3::{hsla, rgb, Hsla};
+use gpui3::{hsla, rems, rgb, AbsoluteLength, Hsla};
use strum::EnumIter;
+#[derive(Clone, Copy)]
+pub struct Token {
+ pub list_indent_depth: AbsoluteLength,
+ pub default_panel_size: AbsoluteLength,
+ pub state_hover_background: Hsla,
+ pub state_active_background: Hsla,
+}
+
+impl Default for Token {
+ fn default() -> Self {
+ Self {
+ list_indent_depth: AbsoluteLength::Rems(rems(0.3)),
+ default_panel_size: AbsoluteLength::Rems(rems(16.)),
+ state_hover_background: hsla(0.0, 0.0, 0.0, 0.08),
+ state_active_background: hsla(0.0, 0.0, 0.0, 0.16),
+ }
+ }
+}
+
+pub fn token() -> Token {
+ Token::default()
+}
+
#[derive(Default)]
pub struct SystemColor {
pub transparent: Hsla,
@@ -34,8 +57,10 @@ impl SystemColor {
pub struct ThemeColor {
pub border: Hsla,
pub border_variant: Hsla,
+ pub border_focused: Hsla,
/// The background color of an elevated surface, like a modal, tooltip or toast.
pub elevated_surface: Hsla,
+ pub panel_surface: Hsla,
}
impl ThemeColor {
@@ -45,7 +70,9 @@ impl ThemeColor {
Self {
border: theme.lowest.base.default.border,
border_variant: theme.lowest.variant.default.border,
+ border_focused: theme.lowest.accent.default.border,
elevated_surface: theme.middle.base.default.background,
+ panel_surface: theme.middle.base.default.background,
}
}
}
@@ -324,124 +324,124 @@ pub fn static_players_with_call_status() -> Vec<PlayerWithCallStatus> {
pub fn static_project_panel_project_items<S: 'static + Send + Sync + Clone>() -> Vec<ListItem<S>> {
vec![
ListEntry::new(Label::new("zed"))
- .left_icon(Icon::FolderOpen.into())
- .indent_level(0)
+ .set_left_icon(Icon::FolderOpen.into())
+ .set_indent_level(0)
.set_toggle(ToggleState::Toggled),
ListEntry::new(Label::new(".cargo"))
- .left_icon(Icon::Folder.into())
- .indent_level(1),
+ .set_left_icon(Icon::Folder.into())
+ .set_indent_level(1),
ListEntry::new(Label::new(".config"))
- .left_icon(Icon::Folder.into())
- .indent_level(1),
+ .set_left_icon(Icon::Folder.into())
+ .set_indent_level(1),
ListEntry::new(Label::new(".git").color(LabelColor::Hidden))
- .left_icon(Icon::Folder.into())
- .indent_level(1),
+ .set_left_icon(Icon::Folder.into())
+ .set_indent_level(1),
ListEntry::new(Label::new(".cargo"))
- .left_icon(Icon::Folder.into())
- .indent_level(1),
+ .set_left_icon(Icon::Folder.into())
+ .set_indent_level(1),
ListEntry::new(Label::new(".idea").color(LabelColor::Hidden))
- .left_icon(Icon::Folder.into())
- .indent_level(1),
+ .set_left_icon(Icon::Folder.into())
+ .set_indent_level(1),
ListEntry::new(Label::new("assets"))
- .left_icon(Icon::Folder.into())
- .indent_level(1)
+ .set_left_icon(Icon::Folder.into())
+ .set_indent_level(1)
.set_toggle(ToggleState::Toggled),
ListEntry::new(Label::new("cargo-target").color(LabelColor::Hidden))
- .left_icon(Icon::Folder.into())
- .indent_level(1),
+ .set_left_icon(Icon::Folder.into())
+ .set_indent_level(1),
ListEntry::new(Label::new("crates"))
- .left_icon(Icon::FolderOpen.into())
- .indent_level(1)
+ .set_left_icon(Icon::FolderOpen.into())
+ .set_indent_level(1)
.set_toggle(ToggleState::Toggled),
ListEntry::new(Label::new("activity_indicator"))
- .left_icon(Icon::Folder.into())
- .indent_level(2),
+ .set_left_icon(Icon::Folder.into())
+ .set_indent_level(2),
ListEntry::new(Label::new("ai"))
- .left_icon(Icon::Folder.into())
- .indent_level(2),
+ .set_left_icon(Icon::Folder.into())
+ .set_indent_level(2),
ListEntry::new(Label::new("audio"))
- .left_icon(Icon::Folder.into())
- .indent_level(2),
+ .set_left_icon(Icon::Folder.into())
+ .set_indent_level(2),
ListEntry::new(Label::new("auto_update"))
- .left_icon(Icon::Folder.into())
- .indent_level(2),
+ .set_left_icon(Icon::Folder.into())
+ .set_indent_level(2),
ListEntry::new(Label::new("breadcrumbs"))
- .left_icon(Icon::Folder.into())
- .indent_level(2),
+ .set_left_icon(Icon::Folder.into())
+ .set_indent_level(2),
ListEntry::new(Label::new("call"))
- .left_icon(Icon::Folder.into())
- .indent_level(2),
+ .set_left_icon(Icon::Folder.into())
+ .set_indent_level(2),
ListEntry::new(Label::new("sqlez").color(LabelColor::Modified))
- .left_icon(Icon::Folder.into())
- .indent_level(2)
+ .set_left_icon(Icon::Folder.into())
+ .set_indent_level(2)
.set_toggle(ToggleState::NotToggled),
ListEntry::new(Label::new("gpui2"))
- .left_icon(Icon::FolderOpen.into())
- .indent_level(2)
+ .set_left_icon(Icon::FolderOpen.into())
+ .set_indent_level(2)
.set_toggle(ToggleState::Toggled),
ListEntry::new(Label::new("src"))
- .left_icon(Icon::FolderOpen.into())
- .indent_level(3)
+ .set_left_icon(Icon::FolderOpen.into())
+ .set_indent_level(3)
.set_toggle(ToggleState::Toggled),
ListEntry::new(Label::new("derive_element.rs"))
- .left_icon(Icon::FileRust.into())
- .indent_level(4),
+ .set_left_icon(Icon::FileRust.into())
+ .set_indent_level(4),
ListEntry::new(Label::new("storybook").color(LabelColor::Modified))
- .left_icon(Icon::FolderOpen.into())
- .indent_level(1)
+ .set_left_icon(Icon::FolderOpen.into())
+ .set_indent_level(1)
.set_toggle(ToggleState::Toggled),
ListEntry::new(Label::new("docs").color(LabelColor::Default))
- .left_icon(Icon::Folder.into())
- .indent_level(2)
+ .set_left_icon(Icon::Folder.into())
+ .set_indent_level(2)
.set_toggle(ToggleState::Toggled),
ListEntry::new(Label::new("src").color(LabelColor::Modified))
- .left_icon(Icon::FolderOpen.into())
- .indent_level(3)
+ .set_left_icon(Icon::FolderOpen.into())
+ .set_indent_level(3)
.set_toggle(ToggleState::Toggled),
ListEntry::new(Label::new("ui").color(LabelColor::Modified))
- .left_icon(Icon::FolderOpen.into())
- .indent_level(4)
+ .set_left_icon(Icon::FolderOpen.into())
+ .set_indent_level(4)
.set_toggle(ToggleState::Toggled),
ListEntry::new(Label::new("component").color(LabelColor::Created))
- .left_icon(Icon::FolderOpen.into())
- .indent_level(5)
+ .set_left_icon(Icon::FolderOpen.into())
+ .set_indent_level(5)
.set_toggle(ToggleState::Toggled),
ListEntry::new(Label::new("facepile.rs").color(LabelColor::Default))
- .left_icon(Icon::FileRust.into())
- .indent_level(6),
+ .set_left_icon(Icon::FileRust.into())
+ .set_indent_level(6),
ListEntry::new(Label::new("follow_group.rs").color(LabelColor::Default))
- .left_icon(Icon::FileRust.into())
- .indent_level(6),
+ .set_left_icon(Icon::FileRust.into())
+ .set_indent_level(6),
ListEntry::new(Label::new("list_item.rs").color(LabelColor::Created))
- .left_icon(Icon::FileRust.into())
- .indent_level(6),
+ .set_left_icon(Icon::FileRust.into())
+ .set_indent_level(6),
ListEntry::new(Label::new("tab.rs").color(LabelColor::Default))
- .left_icon(Icon::FileRust.into())
- .indent_level(6),
+ .set_left_icon(Icon::FileRust.into())
+ .set_indent_level(6),
ListEntry::new(Label::new("target").color(LabelColor::Hidden))
- .left_icon(Icon::Folder.into())
- .indent_level(1),
+ .set_left_icon(Icon::Folder.into())
+ .set_indent_level(1),
ListEntry::new(Label::new(".dockerignore"))
- .left_icon(Icon::FileGeneric.into())
- .indent_level(1),
+ .set_left_icon(Icon::FileGeneric.into())
+ .set_indent_level(1),
ListEntry::new(Label::new(".DS_Store").color(LabelColor::Hidden))
- .left_icon(Icon::FileGeneric.into())
- .indent_level(1),
+ .set_left_icon(Icon::FileGeneric.into())
+ .set_indent_level(1),
ListEntry::new(Label::new("Cargo.lock"))
- .left_icon(Icon::FileLock.into())
- .indent_level(1),
+ .set_left_icon(Icon::FileLock.into())
+ .set_indent_level(1),
ListEntry::new(Label::new("Cargo.toml"))
- .left_icon(Icon::FileToml.into())
- .indent_level(1),
+ .set_left_icon(Icon::FileToml.into())
+ .set_indent_level(1),
ListEntry::new(Label::new("Dockerfile"))
- .left_icon(Icon::FileGeneric.into())
- .indent_level(1),
+ .set_left_icon(Icon::FileGeneric.into())
+ .set_indent_level(1),
ListEntry::new(Label::new("Procfile"))
- .left_icon(Icon::FileGeneric.into())
- .indent_level(1),
+ .set_left_icon(Icon::FileGeneric.into())
+ .set_indent_level(1),
ListEntry::new(Label::new("README.md"))
- .left_icon(Icon::FileDoc.into())
- .indent_level(1),
+ .set_left_icon(Icon::FileDoc.into())
+ .set_indent_level(1),
]
.into_iter()
.map(From::from)
@@ -451,14 +451,14 @@ pub fn static_project_panel_project_items<S: 'static + Send + Sync + Clone>() ->
pub fn static_project_panel_single_items<S: 'static + Send + Sync + Clone>() -> Vec<ListItem<S>> {
vec![
ListEntry::new(Label::new("todo.md"))
- .left_icon(Icon::FileDoc.into())
- .indent_level(0),
+ .set_left_icon(Icon::FileDoc.into())
+ .set_indent_level(0),
ListEntry::new(Label::new("README.md"))
- .left_icon(Icon::FileDoc.into())
- .indent_level(0),
+ .set_left_icon(Icon::FileDoc.into())
+ .set_indent_level(0),
ListEntry::new(Label::new("config.json"))
- .left_icon(Icon::FileGeneric.into())
- .indent_level(0),
+ .set_left_icon(Icon::FileGeneric.into())
+ .set_indent_level(0),
]
.into_iter()
.map(From::from)
@@ -467,11 +467,11 @@ pub fn static_project_panel_single_items<S: 'static + Send + Sync + Clone>() ->
pub fn static_collab_panel_current_call<S: 'static + Send + Sync + Clone>() -> Vec<ListItem<S>> {
vec![
- ListEntry::new(Label::new("as-cii")).left_avatar("http://github.com/as-cii.png?s=50"),
+ ListEntry::new(Label::new("as-cii")).set_left_avatar("http://github.com/as-cii.png?s=50"),
ListEntry::new(Label::new("nathansobo"))
- .left_avatar("http://github.com/nathansobo.png?s=50"),
+ .set_left_avatar("http://github.com/nathansobo.png?s=50"),
ListEntry::new(Label::new("maxbrunsfeld"))
- .left_avatar("http://github.com/maxbrunsfeld.png?s=50"),
+ .set_left_avatar("http://github.com/maxbrunsfeld.png?s=50"),
]
.into_iter()
.map(From::from)
@@ -481,61 +481,61 @@ pub fn static_collab_panel_current_call<S: 'static + Send + Sync + Clone>() -> V
pub fn static_collab_panel_channels<S: 'static + Send + Sync + Clone>() -> Vec<ListItem<S>> {
vec![
ListEntry::new(Label::new("zed"))
- .left_icon(Icon::Hash.into())
- .size(ListEntrySize::Medium)
- .indent_level(0),
+ .set_left_icon(Icon::Hash.into())
+ .set_size(ListEntrySize::Medium)
+ .set_indent_level(0),
ListEntry::new(Label::new("community"))
- .left_icon(Icon::Hash.into())
- .size(ListEntrySize::Medium)
- .indent_level(1),
+ .set_left_icon(Icon::Hash.into())
+ .set_size(ListEntrySize::Medium)
+ .set_indent_level(1),
ListEntry::new(Label::new("dashboards"))
- .left_icon(Icon::Hash.into())
- .size(ListEntrySize::Medium)
- .indent_level(2),
+ .set_left_icon(Icon::Hash.into())
+ .set_size(ListEntrySize::Medium)
+ .set_indent_level(2),
ListEntry::new(Label::new("feedback"))
- .left_icon(Icon::Hash.into())
- .size(ListEntrySize::Medium)
- .indent_level(2),
+ .set_left_icon(Icon::Hash.into())
+ .set_size(ListEntrySize::Medium)
+ .set_indent_level(2),
ListEntry::new(Label::new("teams-in-channels-alpha"))
- .left_icon(Icon::Hash.into())
- .size(ListEntrySize::Medium)
- .indent_level(2),
+ .set_left_icon(Icon::Hash.into())
+ .set_size(ListEntrySize::Medium)
+ .set_indent_level(2),
ListEntry::new(Label::new("current-projects"))
- .left_icon(Icon::Hash.into())
- .size(ListEntrySize::Medium)
- .indent_level(1),
+ .set_left_icon(Icon::Hash.into())
+ .set_size(ListEntrySize::Medium)
+ .set_indent_level(1),
ListEntry::new(Label::new("codegen"))
- .left_icon(Icon::Hash.into())
- .size(ListEntrySize::Medium)
- .indent_level(2),
+ .set_left_icon(Icon::Hash.into())
+ .set_size(ListEntrySize::Medium)
+ .set_indent_level(2),
ListEntry::new(Label::new("gpui2"))
- .left_icon(Icon::Hash.into())
- .size(ListEntrySize::Medium)
- .indent_level(2),
+ .set_left_icon(Icon::Hash.into())
+ .set_size(ListEntrySize::Medium)
+ .set_indent_level(2),
ListEntry::new(Label::new("livestreaming"))
- .left_icon(Icon::Hash.into())
- .size(ListEntrySize::Medium)
- .indent_level(2),
+ .set_left_icon(Icon::Hash.into())
+ .set_size(ListEntrySize::Medium)
+ .set_indent_level(2),
ListEntry::new(Label::new("open-source"))
- .left_icon(Icon::Hash.into())
- .size(ListEntrySize::Medium)
- .indent_level(2),
+ .set_left_icon(Icon::Hash.into())
+ .set_size(ListEntrySize::Medium)
+ .set_indent_level(2),
ListEntry::new(Label::new("replace"))
- .left_icon(Icon::Hash.into())
- .size(ListEntrySize::Medium)
- .indent_level(2),
+ .set_left_icon(Icon::Hash.into())
+ .set_size(ListEntrySize::Medium)
+ .set_indent_level(2),
ListEntry::new(Label::new("semantic-index"))
- .left_icon(Icon::Hash.into())
- .size(ListEntrySize::Medium)
- .indent_level(2),
+ .set_left_icon(Icon::Hash.into())
+ .set_size(ListEntrySize::Medium)
+ .set_indent_level(2),
ListEntry::new(Label::new("vim"))
- .left_icon(Icon::Hash.into())
- .size(ListEntrySize::Medium)
- .indent_level(2),
+ .set_left_icon(Icon::Hash.into())
+ .set_size(ListEntrySize::Medium)
+ .set_indent_level(2),
ListEntry::new(Label::new("web-tech"))
- .left_icon(Icon::Hash.into())
- .size(ListEntrySize::Medium)
- .indent_level(2),
+ .set_left_icon(Icon::Hash.into())
+ .set_size(ListEntrySize::Medium)
+ .set_indent_level(2),
]
.into_iter()
.map(From::from)
@@ -1,24 +0,0 @@
-use gpui3::{hsla, rems, AbsoluteLength, Hsla};
-
-#[derive(Clone, Copy)]
-pub struct Token {
- pub list_indent_depth: AbsoluteLength,
- pub default_panel_size: AbsoluteLength,
- pub state_hover_background: Hsla,
- pub state_active_background: Hsla,
-}
-
-impl Default for Token {
- fn default() -> Self {
- Self {
- list_indent_depth: AbsoluteLength::Rems(rems(0.5)),
- default_panel_size: AbsoluteLength::Rems(rems(16.)),
- state_hover_background: hsla(0.0, 0.0, 0.0, 0.08),
- state_active_background: hsla(0.0, 0.0, 0.0, 0.16),
- }
- }
-}
-
-pub fn token() -> Token {
- Token::default()
-}