diff --git a/crates/command_palette2/src/command_palette.rs b/crates/command_palette2/src/command_palette.rs index 5f3fb4a985..b0d18c593d 100644 --- a/crates/command_palette2/src/command_palette.rs +++ b/crates/command_palette2/src/command_palette.rs @@ -301,7 +301,7 @@ impl PickerDelegate for CommandPaletteDelegate { }; Some( - ListItem::new(ix).selected(selected).child( + ListItem::new(ix).inset(true).selected(selected).child( h_stack() .justify_between() .child(HighlightedLabel::new( diff --git a/crates/file_finder2/src/file_finder.rs b/crates/file_finder2/src/file_finder.rs index b54d28a400..2f7b26dfb5 100644 --- a/crates/file_finder2/src/file_finder.rs +++ b/crates/file_finder2/src/file_finder.rs @@ -719,7 +719,7 @@ impl PickerDelegate for FileFinderDelegate { self.labels_for_match(path_match, cx, ix); Some( - ListItem::new(ix).selected(selected).child( + ListItem::new(ix).inset(true).selected(selected).child( v_stack() .child(HighlightedLabel::new(file_name, file_name_positions)) .child(HighlightedLabel::new(full_path, full_path_positions)), diff --git a/crates/storybook2/src/stories/picker.rs b/crates/storybook2/src/stories/picker.rs index 8bcfb8923d..80818946f6 100644 --- a/crates/storybook2/src/stories/picker.rs +++ b/crates/storybook2/src/stories/picker.rs @@ -61,6 +61,7 @@ impl PickerDelegate for Delegate { Some( ListItem::new(ix) + .inset(true) .selected(selected) .child(Label::new(candidate)), ) diff --git a/crates/ui2/src/components/list.rs b/crates/ui2/src/components/list.rs index d17c77ea44..ad04408e13 100644 --- a/crates/ui2/src/components/list.rs +++ b/crates/ui2/src/components/list.rs @@ -12,14 +12,6 @@ use crate::{ }; use crate::{prelude::*, GraphicSlot}; -#[derive(Clone, Copy, Default, Debug, PartialEq)] -pub enum ListItemVariant { - /// The list item extends to the far left and right of the list. - FullWidth, - #[default] - Inset, -} - pub enum ListHeaderMeta { Tools(Vec), // TODO: This should be a button @@ -32,8 +24,39 @@ pub struct ListHeader { label: SharedString, left_icon: Option, meta: Option, - variant: ListItemVariant, toggle: Toggle, + inset: bool, +} + +impl ListHeader { + pub fn new(label: impl Into) -> Self { + Self { + label: label.into(), + left_icon: None, + meta: None, + inset: false, + toggle: Toggle::NotToggleable, + } + } + + pub fn toggle(mut self, toggle: Toggle) -> Self { + self.toggle = toggle; + self + } + + pub fn left_icon(mut self, left_icon: Option) -> Self { + self.left_icon = left_icon; + self + } + + pub fn right_button(self, button: IconButton) -> Self { + self.meta(Some(ListHeaderMeta::Tools(vec![button]))) + } + + pub fn meta(mut self, meta: Option) -> Self { + self.meta = meta; + self + } } impl RenderOnce for ListHeader { @@ -61,7 +84,7 @@ impl RenderOnce for ListHeader { .child( div() .h_5() - .when(self.variant == ListItemVariant::Inset, |this| this.px_2()) + .when(self.inset, |this| this.px_2()) .flex() .flex_1() .items_center() @@ -90,42 +113,11 @@ impl RenderOnce for ListHeader { } } -impl ListHeader { - pub fn new(label: impl Into) -> Self { - Self { - label: label.into(), - left_icon: None, - meta: None, - variant: ListItemVariant::default(), - toggle: Toggle::NotToggleable, - } - } - - pub fn toggle(mut self, toggle: Toggle) -> Self { - self.toggle = toggle; - self - } - - pub fn left_icon(mut self, left_icon: Option) -> Self { - self.left_icon = left_icon; - self - } - - pub fn right_button(self, button: IconButton) -> Self { - self.meta(Some(ListHeaderMeta::Tools(vec![button]))) - } - - pub fn meta(mut self, meta: Option) -> Self { - self.meta = meta; - self - } -} - #[derive(IntoElement, Clone)] pub struct ListSubHeader { label: SharedString, left_icon: Option, - variant: ListItemVariant, + inset: bool, } impl ListSubHeader { @@ -133,7 +125,7 @@ impl ListSubHeader { Self { label: label.into(), left_icon: None, - variant: ListItemVariant::default(), + inset: false, } } @@ -150,7 +142,7 @@ impl RenderOnce for ListSubHeader { h_stack().flex_1().w_full().relative().py_1().child( div() .h_6() - .when(self.variant == ListItemVariant::Inset, |this| this.px_2()) + .when(self.inset, |this| this.px_2()) .flex() .flex_1() .w_full() @@ -185,7 +177,7 @@ pub struct ListItem { left_slot: Option, overflow: OverflowStyle, toggle: Toggle, - variant: ListItemVariant, + inset: bool, on_click: Option>, on_secondary_mouse_down: Option>, children: SmallVec<[AnyElement; 2]>, @@ -202,7 +194,7 @@ impl ListItem { left_slot: None, overflow: OverflowStyle::Hidden, toggle: Toggle::NotToggleable, - variant: ListItemVariant::default(), + inset: false, on_click: None, on_secondary_mouse_down: None, children: SmallVec::new(), @@ -222,8 +214,8 @@ impl ListItem { self } - pub fn variant(mut self, variant: ListItemVariant) -> Self { - self.variant = variant; + pub fn inset(mut self, inset: bool) -> Self { + self.inset = inset; self } @@ -283,20 +275,26 @@ impl RenderOnce for ListItem { div() .id(self.id) .relative() - .hover(|mut style| { - style.background = Some(cx.theme().colors().editor_background.into()); - style - }) // TODO: Add focus state // .when(self.state == InteractionState::Focused, |this| { // this.border() // .border_color(cx.theme().colors().border_focused) // }) + .when(self.inset, |this| this.rounded_md()) .hover(|style| style.bg(cx.theme().colors().ghost_element_hover)) .active(|style| style.bg(cx.theme().colors().ghost_element_active)) .when(self.selected, |this| { this.bg(cx.theme().colors().ghost_element_selected) }) + .when_some(self.on_click.clone(), |this, on_click| { + this.on_click(move |event, cx| { + // HACK: GPUI currently fires `on_click` with any mouse button, + // but we only care about the left button. + if event.down.button == MouseButton::Left { + (on_click)(event, cx) + } + }) + }) .when_some(self.on_secondary_mouse_down, |this, on_mouse_down| { this.on_mouse_down(MouseButton::Right, move |event, cx| { (on_mouse_down)(event, cx) @@ -304,7 +302,7 @@ impl RenderOnce for ListItem { }) .child( div() - .when(self.variant == ListItemVariant::Inset, |this| this.px_2()) + .when(self.inset, |this| this.px_2()) .ml(self.indent_level as f32 * self.indent_step_size) .flex() .gap_1()