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

component preview: Add separators between sections in sidebar (#34701)

Browse source 
Small improvement for navigating inside the component preview.

Release Notes:

- N/A
This commit is contained in:
Danilo Leal 2025-07-18 10:24:57 -03:00 • committed by GitHub
parent cfe1adc792
commit 1070de47ec
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 11 additions and 19 deletions
Download patch file Download diff file Expand all files Collapse all files

4
crates/component/src/component_layout.rs
View file

@ -118,8 +118,8 @@ impl RenderOnce for ComponentExampleGroup {
.flex() .flex()
.items_center() .items_center()
.gap_3() .gap_3()
.pb_1() .mt_4()
.child(div().h_px().w_4().bg(cx.theme().colors().border)) .mb_1()
.child( .child(
div() div()
.flex_none() .flex_none()

26
crates/zed/src/zed/component_preview.rs
View file

@ -369,7 +369,6 @@ impl ComponentPreview {
// Always show all components first // Always show all components first
entries.push(PreviewEntry::AllComponents); entries.push(PreviewEntry::AllComponents);
entries.push(PreviewEntry::ActiveThread); entries.push(PreviewEntry::ActiveThread);
entries.push(PreviewEntry::Separator);
let mut scopes: Vec<_> = scope_groups let mut scopes: Vec<_> = scope_groups
.keys() .keys()
@ -382,7 +381,9 @@ impl ComponentPreview {
for scope in scopes { for scope in scopes {
if let Some(components) = scope_groups.remove(&scope) { if let Some(components) = scope_groups.remove(&scope) {
if !components.is_empty() { if !components.is_empty() {
entries.push(PreviewEntry::Separator);
entries.push(PreviewEntry::SectionHeader(scope.to_string().into())); entries.push(PreviewEntry::SectionHeader(scope.to_string().into()));
let mut sorted_components = components; let mut sorted_components = components;
sorted_components.sort_by_key(|(component, _)| component.sort_name()); sorted_components.sort_by_key(|(component, _)| component.sort_name());
@ -515,16 +516,12 @@ impl ComponentPreview {
Vec::new() Vec::new()
}; };
if valid_positions.is_empty() { if valid_positions.is_empty() {
Label::new(name.clone()) Label::new(name.clone()).into_any_element()
.color(Color::Default)
.into_any_element()
} else { } else {
HighlightedLabel::new(name.clone(), valid_positions).into_any_element() HighlightedLabel::new(name.clone(), valid_positions).into_any_element()
} }
} else { } else {
Label::new(name.clone()) Label::new(name.clone()).into_any_element()
.color(Color::Default)
.into_any_element()
}) })
.selectable(true) .selectable(true)
.toggle_state(selected) .toggle_state(selected)
@ -542,7 +539,7 @@ impl ComponentPreview {
let selected = self.active_page == PreviewPage::AllComponents; let selected = self.active_page == PreviewPage::AllComponents;
ListItem::new(ix) ListItem::new(ix)
.child(Label::new("All Components").color(Color::Default)) .child(Label::new("All Components"))
.selectable(true) .selectable(true)
.toggle_state(selected) .toggle_state(selected)
.inset(true) .inset(true)
@ -555,7 +552,7 @@ impl ComponentPreview {
let selected = self.active_page == PreviewPage::ActiveThread; let selected = self.active_page == PreviewPage::ActiveThread;
ListItem::new(ix) ListItem::new(ix)
.child(Label::new("Active Thread").color(Color::Default)) .child(Label::new("Active Thread"))
.selectable(true) .selectable(true)
.toggle_state(selected) .toggle_state(selected)
.inset(true) .inset(true)
@ -565,12 +562,8 @@ impl ComponentPreview {
.into_any_element() .into_any_element()
} }
PreviewEntry::Separator => ListItem::new(ix) PreviewEntry::Separator => ListItem::new(ix)
.child( .disabled(true)
h_flex() .child(div().w_full().py_2().child(Divider::horizontal()))
.occlude()
.pt_3()
.child(Divider::horizontal_dashed()),
)
.into_any_element(), .into_any_element(),
} }
} }
@ -585,7 +578,6 @@ impl ComponentPreview {
h_flex() h_flex()
.w_full() .w_full()
.h_10() .h_10()
.items_center()
.child(Headline::new(title).size(HeadlineSize::XSmall)) .child(Headline::new(title).size(HeadlineSize::XSmall))
.child(Divider::horizontal()) .child(Divider::horizontal())
} }
@ -798,7 +790,7 @@ impl Render for ComponentPreview {
) )
.track_scroll(self.nav_scroll_handle.clone()) .track_scroll(self.nav_scroll_handle.clone())
.p_2p5() .p_2p5()
.w(px(240.)) .w(px(229.))
.h_full() .h_full()
.flex_1(), .flex_1(),
) )