From ae71d1ad5df856ad958657212c482589970fb4a0 Mon Sep 17 00:00:00 2001 From: Julia Date: Tue, 2 Jan 2024 15:56:35 -0500 Subject: [PATCH 1/5] Layout completion single-line documentation to the right of item --- crates/editor2/src/editor.rs | 21 +++++++++++++++------ 1 file changed, 15 insertions(+), 6 deletions(-) diff --git a/crates/editor2/src/editor.rs b/crates/editor2/src/editor.rs index dac291b468f98a665478f6835d2cd3939039225f..9373d813465a34642db0bc8627feb6d2994bc819 100644 --- a/crates/editor2/src/editor.rs +++ b/crates/editor2/src/editor.rs @@ -98,7 +98,7 @@ pub use sum_tree::Bias; use sum_tree::TreeMap; use text::{OffsetUtf16, Rope}; use theme::{ActiveTheme, DiagnosticStyle, PlayerColor, SyntaxTheme, ThemeColors, ThemeSettings}; -use ui::{h_stack, ButtonSize, ButtonStyle, Icon, IconButton, Popover, Tooltip}; +use ui::{h_stack, ButtonSize, ButtonStyle, Icon, IconButton, List, Popover, Tooltip}; use ui::{prelude::*, IconSize}; use util::{post_inc, RangeExt, ResultExt, TryFutureExt}; use workspace::{searchable::SearchEvent, ItemNavHistory, Pane, SplitDirection, ViewId, Workspace}; @@ -1202,6 +1202,7 @@ impl CompletionsMenu { .on_mouse_down(MouseButton::Left, |_, cx| cx.stop_propagation()) }) }; + let list = uniform_list( cx.view().clone(), "completions", @@ -1239,19 +1240,27 @@ impl CompletionsMenu { .with_highlights(&style.text, highlights); let documentation_label = if let Some(Documentation::SingleLine(text)) = documentation { - Some(SharedString::from(text.clone())) - .filter(|text| !text.trim().is_empty()) + if text.trim().is_empty() { + None + } else { + Some( + h_stack() + .flex_grow() + .child(div().flex_grow()) + .child(Label::new(text.clone())), + ) + } } else { None }; - div() + h_stack() .id(mat.candidate_id) - .min_w(px(220.)) - .max_w(px(540.)) + .w(px(540.)) .whitespace_nowrap() .overflow_hidden() .text_ui() + .gap_2() .px_1() .rounded(px(4.)) .bg(cx.theme().colors().ghost_element_background) From ce5855da2f8a0359cd10ef6db77fef1fbe0e4221 Mon Sep 17 00:00:00 2001 From: Marshall Bowers Date: Tue, 2 Jan 2024 17:03:02 -0500 Subject: [PATCH 2/5] Render completion menu items using `ListItem`s --- crates/editor2/src/editor.rs | 42 ++++++++++++------------------------ 1 file changed, 14 insertions(+), 28 deletions(-) diff --git a/crates/editor2/src/editor.rs b/crates/editor2/src/editor.rs index 9373d813465a34642db0bc8627feb6d2994bc819..61f45694501fee1fe78d3b6973f18c6471274371 100644 --- a/crates/editor2/src/editor.rs +++ b/crates/editor2/src/editor.rs @@ -98,7 +98,9 @@ pub use sum_tree::Bias; use sum_tree::TreeMap; use text::{OffsetUtf16, Rope}; use theme::{ActiveTheme, DiagnosticStyle, PlayerColor, SyntaxTheme, ThemeColors, ThemeSettings}; -use ui::{h_stack, ButtonSize, ButtonStyle, Icon, IconButton, List, Popover, Tooltip}; +use ui::{ + h_stack, ButtonSize, ButtonStyle, Icon, IconButton, ListItem, ListItemSpacing, Popover, Tooltip, +}; use ui::{prelude::*, IconSize}; use util::{post_inc, RangeExt, ResultExt, TryFutureExt}; use workspace::{searchable::SearchEvent, ItemNavHistory, Pane, SplitDirection, ViewId, Workspace}; @@ -1243,34 +1245,18 @@ impl CompletionsMenu { if text.trim().is_empty() { None } else { - Some( - h_stack() - .flex_grow() - .child(div().flex_grow()) - .child(Label::new(text.clone())), - ) + Some(h_stack().ml_2().child(Label::new(text.clone()))) } } else { None }; - h_stack() - .id(mat.candidate_id) - .w(px(540.)) - .whitespace_nowrap() - .overflow_hidden() - .text_ui() - .gap_2() - .px_1() - .rounded(px(4.)) - .bg(cx.theme().colors().ghost_element_background) - .hover(|style| style.bg(cx.theme().colors().ghost_element_hover)) - .when(item_ix == selected_item, |div| { - div.bg(cx.theme().colors().ghost_element_selected) - }) - .on_mouse_down( - MouseButton::Left, - cx.listener(move |editor, _event, cx| { + div().min_w(px(220.)).max_w(px(540.)).child( + ListItem::new(mat.candidate_id) + .inset(true) + .spacing(ListItemSpacing::Sparse) + .selected(item_ix == selected_item) + .on_click(cx.listener(move |editor, _event, cx| { cx.stop_propagation(); editor .confirm_completion( @@ -1280,10 +1266,10 @@ impl CompletionsMenu { cx, ) .map(|task| task.detach_and_log_err(cx)); - }), - ) - .child(completion_label) - .children(documentation_label) + })) + .child(div().text_ui().child(completion_label)) + .end_slot::
(documentation_label), + ) }) .collect() }, From f4f9aab8a961303d3c723673d6417c37ce2b126c Mon Sep 17 00:00:00 2001 From: Marshall Bowers Date: Wed, 3 Jan 2024 10:56:51 -0500 Subject: [PATCH 3/5] Remove `text_ui` So we don't regress from #3852. --- crates/editor2/src/editor.rs | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/crates/editor2/src/editor.rs b/crates/editor2/src/editor.rs index ef8c7b8011995769ef58dae7e303fb5d754f81b8..8f15ca88ea28e796630bc978cd86c2a773221ca2 100644 --- a/crates/editor2/src/editor.rs +++ b/crates/editor2/src/editor.rs @@ -1266,7 +1266,7 @@ impl CompletionsMenu { ) .map(|task| task.detach_and_log_err(cx)); })) - .child(div().text_ui().child(completion_label)) + .child(completion_label) .end_slot::
(documentation_label), ) }) From 231fd1c5c094549852df62117cebe3a70a229935 Mon Sep 17 00:00:00 2001 From: Marshall Bowers Date: Wed, 3 Jan 2024 11:41:15 -0500 Subject: [PATCH 4/5] Clip completion labels when they would otherwise overflow their container Co-Authored-By: Julia --- crates/editor2/src/editor.rs | 2 +- crates/ui2/src/components/list/list_item.rs | 3 +++ 2 files changed, 4 insertions(+), 1 deletion(-) diff --git a/crates/editor2/src/editor.rs b/crates/editor2/src/editor.rs index 8f15ca88ea28e796630bc978cd86c2a773221ca2..ffdfe3f975b56ca114bfe3911c3dc8f0eacd47ba 100644 --- a/crates/editor2/src/editor.rs +++ b/crates/editor2/src/editor.rs @@ -1266,7 +1266,7 @@ impl CompletionsMenu { ) .map(|task| task.detach_and_log_err(cx)); })) - .child(completion_label) + .child(h_stack().overflow_hidden().child(completion_label)) .end_slot::
(documentation_label), ) }) diff --git a/crates/ui2/src/components/list/list_item.rs b/crates/ui2/src/components/list/list_item.rs index 403c24b8e52344ac53b295cc10ac9811e3150313..88ade283cc40a34b1ad3b40aa5db6c1a531f37fd 100644 --- a/crates/ui2/src/components/list/list_item.rs +++ b/crates/ui2/src/components/list/list_item.rs @@ -224,6 +224,9 @@ impl RenderOnce for ListItem { })) .child( h_stack() + // HACK: We need to set *any* width value here in order for this container to size correctly. + // Without this the `h_stack` will overflow the parent `inner_list_item`. + .w_px() .flex_1() .gap_1() .children(self.start_slot) From 092eb37a71db224ff0b2c770840cf57f478603db Mon Sep 17 00:00:00 2001 From: Marshall Bowers Date: Wed, 3 Jan 2024 11:44:17 -0500 Subject: [PATCH 5/5] Tweak styling for inline documentation labels Co-Authored-By: Julia --- crates/editor2/src/editor.rs | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/crates/editor2/src/editor.rs b/crates/editor2/src/editor.rs index ffdfe3f975b56ca114bfe3911c3dc8f0eacd47ba..4e9a1dee90c624a99f4754f0a685a9b9e42ba9b6 100644 --- a/crates/editor2/src/editor.rs +++ b/crates/editor2/src/editor.rs @@ -1244,7 +1244,13 @@ impl CompletionsMenu { if text.trim().is_empty() { None } else { - Some(h_stack().ml_2().child(Label::new(text.clone()))) + Some( + h_stack().ml_4().child( + Label::new(text.clone()) + .size(LabelSize::Small) + .color(Color::Muted), + ), + ) } } else { None