forked from reya/gpui-native-kit
feat: apply declarative render rule across components
This commit is contained in:
+21
-18
@@ -518,7 +518,7 @@ where
|
|||||||
|
|
||||||
let wrapper_bounds: Rc<RefCell<Option<Bounds<Pixels>>>> = Rc::new(RefCell::new(None));
|
let wrapper_bounds: Rc<RefCell<Option<Bounds<Pixels>>>> = Rc::new(RefCell::new(None));
|
||||||
|
|
||||||
let mut wrapper = div()
|
div()
|
||||||
.id(id.clone())
|
.id(id.clone())
|
||||||
.key_context(COMBOBOX_CONTEXT)
|
.key_context(COMBOBOX_CONTEXT)
|
||||||
.relative()
|
.relative()
|
||||||
@@ -575,9 +575,8 @@ where
|
|||||||
.right(metrics.dense_padding_x)
|
.right(metrics.dense_padding_x)
|
||||||
.top((metrics.input_height + BORDER_WIDTH * 2.0 - icon_size) / 2.)
|
.top((metrics.input_height + BORDER_WIDTH * 2.0 - icon_size) / 2.)
|
||||||
.child(chevron),
|
.child(chevron),
|
||||||
);
|
)
|
||||||
|
.when(open, |wrapper| {
|
||||||
if open {
|
|
||||||
let rows: Vec<gpui::AnyElement> = self
|
let rows: Vec<gpui::AnyElement> = self
|
||||||
.visible
|
.visible
|
||||||
.iter()
|
.iter()
|
||||||
@@ -617,7 +616,9 @@ where
|
|||||||
.on_click({
|
.on_click({
|
||||||
let state = state.clone();
|
let state = state.clone();
|
||||||
move |_, window, cx| {
|
move |_, window, cx| {
|
||||||
state.update(cx, |state, cx| state.choose_row(row_ix, window, cx));
|
state.update(cx, |state, cx| {
|
||||||
|
state.choose_row(row_ix, window, cx)
|
||||||
|
});
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
.child(
|
.child(
|
||||||
@@ -649,8 +650,9 @@ where
|
|||||||
.child("No matches")
|
.child("No matches")
|
||||||
.into_any_element()
|
.into_any_element()
|
||||||
} else {
|
} else {
|
||||||
let scroll = window
|
let scroll = window.use_keyed_state((id.clone(), "rows-scroll"), cx, |_, _| {
|
||||||
.use_keyed_state((id.clone(), "rows-scroll"), cx, |_, _| ScrollHandle::new());
|
ScrollHandle::new()
|
||||||
|
});
|
||||||
|
|
||||||
ScrollArea::new((id.clone(), "rows"))
|
ScrollArea::new((id.clone(), "rows"))
|
||||||
.handle(scroll.read(cx).clone())
|
.handle(scroll.read(cx).clone())
|
||||||
@@ -661,6 +663,7 @@ where
|
|||||||
};
|
};
|
||||||
|
|
||||||
let panel_bounds: Rc<RefCell<Option<Bounds<Pixels>>>> = Rc::new(RefCell::new(None));
|
let panel_bounds: Rc<RefCell<Option<Bounds<Pixels>>>> = Rc::new(RefCell::new(None));
|
||||||
|
|
||||||
let popup_width = wrapper_bounds
|
let popup_width = wrapper_bounds
|
||||||
.borrow()
|
.borrow()
|
||||||
.map(|bounds| bounds.size.width)
|
.map(|bounds| bounds.size.width)
|
||||||
@@ -701,12 +704,14 @@ where
|
|||||||
if phase != gpui::DispatchPhase::Bubble {
|
if phase != gpui::DispatchPhase::Bubble {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
let on_panel = panel_bounds
|
let on_panel =
|
||||||
.borrow()
|
panel_bounds.borrow().is_some_and(|bounds| {
|
||||||
.is_some_and(|bounds| bounds.contains(&event.position));
|
bounds.contains(&event.position)
|
||||||
let on_wrapper = wrapper_bounds
|
});
|
||||||
.borrow()
|
let on_wrapper =
|
||||||
.is_some_and(|bounds| bounds.contains(&event.position));
|
wrapper_bounds.borrow().is_some_and(|bounds| {
|
||||||
|
bounds.contains(&event.position)
|
||||||
|
});
|
||||||
if on_panel || on_wrapper {
|
if on_panel || on_wrapper {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
@@ -723,11 +728,9 @@ where
|
|||||||
.inset_0(),
|
.inset_0(),
|
||||||
);
|
);
|
||||||
|
|
||||||
wrapper = wrapper.child(deferred(
|
wrapper.child(deferred(
|
||||||
anchored().offset(point(px(0.), spacing_unit)).child(panel),
|
anchored().offset(point(px(0.), spacing_unit)).child(panel),
|
||||||
));
|
))
|
||||||
}
|
})
|
||||||
|
|
||||||
wrapper
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -366,7 +366,15 @@ impl RenderOnce for DropdownMenu {
|
|||||||
trigger
|
trigger
|
||||||
};
|
};
|
||||||
|
|
||||||
let mut wrapper = div()
|
let items = if self.open {
|
||||||
|
self.items
|
||||||
|
.map(|build| Rc::from(build(window, cx)))
|
||||||
|
.unwrap_or_else(|| Rc::from([]))
|
||||||
|
} else {
|
||||||
|
Rc::from([])
|
||||||
|
};
|
||||||
|
|
||||||
|
div()
|
||||||
.relative()
|
.relative()
|
||||||
.child(
|
.child(
|
||||||
canvas(
|
canvas(
|
||||||
@@ -421,17 +429,9 @@ impl RenderOnce for DropdownMenu {
|
|||||||
.absolute()
|
.absolute()
|
||||||
.inset_0(),
|
.inset_0(),
|
||||||
)
|
)
|
||||||
.child(trigger);
|
.child(trigger)
|
||||||
|
.when_some(
|
||||||
let items = if self.open {
|
anchored_menu_panel(
|
||||||
self.items
|
|
||||||
.map(|build| Rc::from(build(window, cx)))
|
|
||||||
.unwrap_or_else(|| Rc::from([]))
|
|
||||||
} else {
|
|
||||||
Rc::from([])
|
|
||||||
};
|
|
||||||
|
|
||||||
if let Some(panel) = anchored_menu_panel(
|
|
||||||
window,
|
window,
|
||||||
cx,
|
cx,
|
||||||
&self.id,
|
&self.id,
|
||||||
@@ -445,10 +445,8 @@ impl RenderOnce for DropdownMenu {
|
|||||||
&trigger_bounds,
|
&trigger_bounds,
|
||||||
&panel_chrome,
|
&panel_chrome,
|
||||||
enter_duration,
|
enter_duration,
|
||||||
) {
|
),
|
||||||
wrapper = wrapper.child(panel);
|
|wrapper, panel| wrapper.child(panel),
|
||||||
}
|
)
|
||||||
|
|
||||||
wrapper
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
+20
-19
@@ -1,7 +1,7 @@
|
|||||||
use std::cell::RefCell;
|
use std::cell::RefCell;
|
||||||
use std::rc::Rc;
|
use std::rc::Rc;
|
||||||
|
|
||||||
use gpui::prelude::FluentBuilder as _;
|
use gpui::prelude::FluentBuilder;
|
||||||
use gpui::{
|
use gpui::{
|
||||||
Animation, AnimationExt as _, AnyElement, App, Bounds, BoxShadow, DispatchPhase, ElementId,
|
Animation, AnimationExt as _, AnyElement, App, Bounds, BoxShadow, DispatchPhase, ElementId,
|
||||||
Entity, InteractiveElement as _, IntoElement, KeyDownEvent, MouseButton, MouseDownEvent,
|
Entity, InteractiveElement as _, IntoElement, KeyDownEvent, MouseButton, MouseDownEvent,
|
||||||
@@ -127,6 +127,9 @@ impl MenuItem {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// MenuItem is a data builder, not an element, adopt the combinators explicitly.
|
||||||
|
impl FluentBuilder for MenuItem {}
|
||||||
|
|
||||||
/// Menu chrome styles.
|
/// Menu chrome styles.
|
||||||
#[derive(Clone)]
|
#[derive(Clone)]
|
||||||
pub(crate) struct MenuChrome {
|
pub(crate) struct MenuChrome {
|
||||||
@@ -288,7 +291,16 @@ impl RenderOnce for Menu {
|
|||||||
.clone()
|
.clone()
|
||||||
.unwrap_or_else(|| SharedString::from(self.id.to_string()));
|
.unwrap_or_else(|| SharedString::from(self.id.to_string()));
|
||||||
|
|
||||||
let mut wrapper = div()
|
let items = if self.open {
|
||||||
|
match self.items {
|
||||||
|
Some(build) => Rc::from(build(window, cx)),
|
||||||
|
None => Rc::from([]),
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
Rc::from([])
|
||||||
|
};
|
||||||
|
|
||||||
|
div()
|
||||||
.relative()
|
.relative()
|
||||||
.child(
|
.child(
|
||||||
canvas(
|
canvas(
|
||||||
@@ -335,18 +347,9 @@ impl RenderOnce for Menu {
|
|||||||
)
|
)
|
||||||
.when_some(self.trigger, |wrapper, trigger| {
|
.when_some(self.trigger, |wrapper, trigger| {
|
||||||
wrapper.child(trigger(window, cx))
|
wrapper.child(trigger(window, cx))
|
||||||
});
|
})
|
||||||
|
.when_some(
|
||||||
let items = if self.open {
|
anchored_menu_panel(
|
||||||
match self.items {
|
|
||||||
Some(build) => Rc::from(build(window, cx)),
|
|
||||||
None => Rc::from([]),
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
Rc::from([])
|
|
||||||
};
|
|
||||||
|
|
||||||
if let Some(panel) = anchored_menu_panel(
|
|
||||||
window,
|
window,
|
||||||
cx,
|
cx,
|
||||||
&self.id,
|
&self.id,
|
||||||
@@ -360,11 +363,9 @@ impl RenderOnce for Menu {
|
|||||||
&trigger_bounds,
|
&trigger_bounds,
|
||||||
&chrome,
|
&chrome,
|
||||||
enter_duration,
|
enter_duration,
|
||||||
) {
|
),
|
||||||
wrapper = wrapper.child(panel);
|
|wrapper, panel| wrapper.child(panel),
|
||||||
}
|
)
|
||||||
|
|
||||||
wrapper
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -114,7 +114,7 @@ impl RenderOnce for Popover {
|
|||||||
.clone()
|
.clone()
|
||||||
.unwrap_or_else(|| SharedString::from(self.id.to_string()));
|
.unwrap_or_else(|| SharedString::from(self.id.to_string()));
|
||||||
|
|
||||||
let mut wrapper = div()
|
div()
|
||||||
.relative()
|
.relative()
|
||||||
.child(
|
.child(
|
||||||
canvas(
|
canvas(
|
||||||
@@ -161,9 +161,8 @@ impl RenderOnce for Popover {
|
|||||||
)
|
)
|
||||||
.when_some(self.trigger, |wrapper, trigger| {
|
.when_some(self.trigger, |wrapper, trigger| {
|
||||||
wrapper.child(trigger(window, cx))
|
wrapper.child(trigger(window, cx))
|
||||||
});
|
})
|
||||||
|
.when(self.open, |wrapper| {
|
||||||
if self.open {
|
|
||||||
let on_change = self.on_change;
|
let on_change = self.on_change;
|
||||||
let label = fallback_label.clone();
|
let label = fallback_label.clone();
|
||||||
let focus = gpui_native_utils::focus_handle(&self.id, window, cx);
|
let focus = gpui_native_utils::focus_handle(&self.id, window, cx);
|
||||||
@@ -224,7 +223,7 @@ impl RenderOnce for Popover {
|
|||||||
.inset_0(),
|
.inset_0(),
|
||||||
);
|
);
|
||||||
|
|
||||||
wrapper = wrapper.child(deferred(
|
wrapper.child(deferred(
|
||||||
anchored()
|
anchored()
|
||||||
.offset(point(px(0.), anchor_gap))
|
.offset(point(px(0.), anchor_gap))
|
||||||
.child(panel.with_animation(
|
.child(panel.with_animation(
|
||||||
@@ -232,9 +231,7 @@ impl RenderOnce for Popover {
|
|||||||
Animation::new(enter_duration).with_easing(ease_out_quint()),
|
Animation::new(enter_duration).with_easing(ease_out_quint()),
|
||||||
|panel, delta| panel.opacity(delta),
|
|panel, delta| panel.opacity(delta),
|
||||||
)),
|
)),
|
||||||
));
|
))
|
||||||
}
|
})
|
||||||
|
|
||||||
wrapper
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -95,7 +95,7 @@ impl RenderOnce for ScrollArea {
|
|||||||
let mut pane_style = self.style.clone();
|
let mut pane_style = self.style.clone();
|
||||||
pane_style.padding = Default::default();
|
pane_style.padding = Default::default();
|
||||||
|
|
||||||
let mut pane = div()
|
let pane = div()
|
||||||
.id(self.id.clone())
|
.id(self.id.clone())
|
||||||
.overflow_hidden()
|
.overflow_hidden()
|
||||||
.when(self.axes != ScrollAxes::Horizontal, |area| {
|
.when(self.axes != ScrollAxes::Horizontal, |area| {
|
||||||
@@ -112,34 +112,31 @@ impl RenderOnce for ScrollArea {
|
|||||||
// Keep wheel events from scrolling an outer scroll area too.
|
// Keep wheel events from scrolling an outer scroll area too.
|
||||||
cx.stop_propagation();
|
cx.stop_propagation();
|
||||||
})
|
})
|
||||||
.refine_style(&pane_style);
|
.refine_style(&pane_style)
|
||||||
|
.children(self.children);
|
||||||
|
|
||||||
// Extend with children
|
div()
|
||||||
pane.extend(self.children);
|
.relative()
|
||||||
|
.refine_style(&self.style)
|
||||||
let mut wrapper = div().relative().refine_style(&self.style);
|
.child(pane.into_any_element())
|
||||||
wrapper.extend(std::iter::once(pane.into_any_element()));
|
.when_some(self.handle, |wrapper, handle| {
|
||||||
|
|
||||||
if let Some(handle) = self.handle {
|
|
||||||
let id = self.id.clone();
|
let id = self.id.clone();
|
||||||
|
|
||||||
if self.axes != ScrollAxes::Horizontal {
|
wrapper
|
||||||
wrapper.extend(std::iter::once(
|
.when(self.axes != ScrollAxes::Horizontal, |wrapper| {
|
||||||
|
wrapper.child(
|
||||||
Scrollbar::vertical((id.clone(), "v-scrollbar"), handle.clone())
|
Scrollbar::vertical((id.clone(), "v-scrollbar"), handle.clone())
|
||||||
.visibility(self.visibility)
|
.visibility(self.visibility)
|
||||||
.into_any_element(),
|
.into_any_element(),
|
||||||
));
|
)
|
||||||
}
|
})
|
||||||
|
.when(self.axes != ScrollAxes::Vertical, |wrapper| {
|
||||||
if self.axes != ScrollAxes::Vertical {
|
wrapper.child(
|
||||||
wrapper.extend(std::iter::once(
|
|
||||||
Scrollbar::horizontal((id, "h-scrollbar"), handle)
|
Scrollbar::horizontal((id, "h-scrollbar"), handle)
|
||||||
.visibility(self.visibility)
|
.visibility(self.visibility)
|
||||||
.into_any_element(),
|
.into_any_element(),
|
||||||
));
|
)
|
||||||
}
|
})
|
||||||
}
|
})
|
||||||
|
|
||||||
wrapper
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -274,11 +274,10 @@ where
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
let mut row = MenuItem::new(option.label.clone());
|
MenuItem::new(option.label.clone())
|
||||||
if let Some(icon) = option.icon.clone() {
|
.when_some(option.icon.clone(), |row, icon| row.icon(icon))
|
||||||
row = row.icon(icon);
|
.checked(is_selected)
|
||||||
}
|
.handler(handler)
|
||||||
row.checked(is_selected).handler(handler)
|
|
||||||
})
|
})
|
||||||
.collect()
|
.collect()
|
||||||
};
|
};
|
||||||
|
|||||||
+33
-41
@@ -1,6 +1,6 @@
|
|||||||
use std::rc::Rc;
|
use std::rc::Rc;
|
||||||
|
|
||||||
use gpui::prelude::FluentBuilder as _;
|
use gpui::prelude::FluentBuilder;
|
||||||
use gpui::{
|
use gpui::{
|
||||||
AnyElement, App, Div, ElementId, InteractiveElement as _, IntoElement, KeyDownEvent,
|
AnyElement, App, Div, ElementId, InteractiveElement as _, IntoElement, KeyDownEvent,
|
||||||
ParentElement as _, RenderOnce, Role, SharedString, Stateful, StatefulInteractiveElement as _,
|
ParentElement as _, RenderOnce, Role, SharedString, Stateful, StatefulInteractiveElement as _,
|
||||||
@@ -97,6 +97,9 @@ impl Tab {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Tab is a data builder, not an element, adopt the combinators explicitly.
|
||||||
|
impl FluentBuilder for Tab {}
|
||||||
|
|
||||||
/// A tab strip.
|
/// A tab strip.
|
||||||
#[derive(IntoElement)]
|
#[derive(IntoElement)]
|
||||||
pub struct Tabs {
|
pub struct Tabs {
|
||||||
@@ -215,7 +218,7 @@ impl RenderOnce for Tabs {
|
|||||||
})
|
})
|
||||||
.collect();
|
.collect();
|
||||||
|
|
||||||
let mut strip_root = div()
|
div()
|
||||||
.id(self.id.clone())
|
.id(self.id.clone())
|
||||||
.flex()
|
.flex()
|
||||||
.text_size(theme.sizes.medium.text_size)
|
.text_size(theme.sizes.medium.text_size)
|
||||||
@@ -243,17 +246,14 @@ impl RenderOnce for Tabs {
|
|||||||
}
|
}
|
||||||
cx.stop_propagation();
|
cx.stop_propagation();
|
||||||
}
|
}
|
||||||
});
|
})
|
||||||
|
.map(|root| match self.variant {
|
||||||
strip_root = match self.variant {
|
TabsVariant::Underline => {
|
||||||
TabsVariant::Underline => strip_root
|
root.gap_1().border_b_1().border_color(theme.colors.border)
|
||||||
.gap_1()
|
}
|
||||||
.border_b_1()
|
TabsVariant::Pill => root.items_center().gap_1(),
|
||||||
.border_color(theme.colors.border),
|
})
|
||||||
TabsVariant::Pill => strip_root.items_center().gap_1(),
|
.children(strip)
|
||||||
};
|
|
||||||
|
|
||||||
strip_root.children(strip)
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -295,7 +295,7 @@ fn render_tab(
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
let mut strip_tab = div()
|
let strip_tab = div()
|
||||||
.id((tab.key.clone(), "tab"))
|
.id((tab.key.clone(), "tab"))
|
||||||
.debug_selector({
|
.debug_selector({
|
||||||
let tabs_id = tabs_id.clone();
|
let tabs_id = tabs_id.clone();
|
||||||
@@ -310,9 +310,8 @@ fn render_tab(
|
|||||||
.text_color(label_color)
|
.text_color(label_color)
|
||||||
.when(!tab.disabled && !selected, |strip_tab| {
|
.when(!tab.disabled && !selected, |strip_tab| {
|
||||||
strip_tab.hover(|strip_tab| strip_tab.bg(theme.colors.muted))
|
strip_tab.hover(|strip_tab| strip_tab.bg(theme.colors.muted))
|
||||||
});
|
})
|
||||||
|
.map(|strip_tab| match variant {
|
||||||
strip_tab = match variant {
|
|
||||||
TabsVariant::Underline => strip_tab
|
TabsVariant::Underline => strip_tab
|
||||||
.px_2()
|
.px_2()
|
||||||
.py_1()
|
.py_1()
|
||||||
@@ -333,32 +332,25 @@ fn render_tab(
|
|||||||
.bg(theme.colors.muted)
|
.bg(theme.colors.muted)
|
||||||
.hover(|strip_tab| strip_tab.bg(theme.colors.muted_hover))
|
.hover(|strip_tab| strip_tab.bg(theme.colors.muted_hover))
|
||||||
}),
|
}),
|
||||||
};
|
})
|
||||||
|
.when_some(tab.lead.take(), |strip_tab, lead| strip_tab.child(lead))
|
||||||
if let Some(lead) = tab.lead.take() {
|
.child(tab.label.clone())
|
||||||
strip_tab = strip_tab.child(lead);
|
.when(variant == TabsVariant::Pill, |strip_tab| {
|
||||||
}
|
strip_tab.child(div().flex_none().w(metrics.padding_x * 1.5))
|
||||||
|
})
|
||||||
strip_tab = strip_tab.child(tab.label.clone());
|
.when(tab.busy && !tab.disabled, |strip_tab| {
|
||||||
|
strip_tab.child(
|
||||||
if variant == TabsVariant::Pill {
|
|
||||||
strip_tab = strip_tab.child(div().flex_none().w(metrics.padding_x * 1.5));
|
|
||||||
}
|
|
||||||
|
|
||||||
if tab.busy && !tab.disabled {
|
|
||||||
strip_tab = strip_tab.child(
|
|
||||||
Spinner::new((tab.key.clone(), "tab-busy"))
|
Spinner::new((tab.key.clone(), "tab-busy"))
|
||||||
.small()
|
.small()
|
||||||
.accessibility_label("Loading"),
|
.accessibility_label("Loading"),
|
||||||
);
|
)
|
||||||
}
|
})
|
||||||
|
.when(
|
||||||
if tab.closeable && on_close.is_some() && !tab.disabled {
|
tab.closeable && on_close.is_some() && !tab.disabled,
|
||||||
strip_tab = strip_tab.child(render_tab_close(tabs_id, &tab, index, on_close));
|
|strip_tab| strip_tab.child(render_tab_close(tabs_id, &tab, index, on_close)),
|
||||||
}
|
)
|
||||||
|
.when(!tab.disabled, |strip_tab| {
|
||||||
if !tab.disabled {
|
strip_tab.cursor_pointer().on_click({
|
||||||
strip_tab = strip_tab.cursor_pointer().on_click({
|
|
||||||
let on_change = on_change.clone();
|
let on_change = on_change.clone();
|
||||||
let focus = focus.clone();
|
let focus = focus.clone();
|
||||||
move |_, window, cx| {
|
move |_, window, cx| {
|
||||||
@@ -369,8 +361,8 @@ fn render_tab(
|
|||||||
on_change(index, window, cx);
|
on_change(index, window, cx);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
})
|
||||||
});
|
});
|
||||||
}
|
|
||||||
|
|
||||||
match tab.wrap {
|
match tab.wrap {
|
||||||
Some(wrap) => wrap(strip_tab),
|
Some(wrap) => wrap(strip_tab),
|
||||||
|
|||||||
@@ -546,7 +546,8 @@ fn render_row(
|
|||||||
},
|
},
|
||||||
)
|
)
|
||||||
.when(options.line_numbers, |row_element| {
|
.when(options.line_numbers, |row_element| {
|
||||||
let mut number = gutter_cell(
|
row_element.child(
|
||||||
|
gutter_cell(
|
||||||
cx,
|
cx,
|
||||||
colors.muted_foreground,
|
colors.muted_foreground,
|
||||||
row.new_number
|
row.new_number
|
||||||
@@ -559,11 +560,11 @@ fn render_row(
|
|||||||
.bg(match row.kind {
|
.bg(match row.kind {
|
||||||
DiffRowKind::Context => wash_gutter(&colors),
|
DiffRowKind::Context => wash_gutter(&colors),
|
||||||
_ => wash_strong(change_color),
|
_ => wash_strong(change_color),
|
||||||
});
|
})
|
||||||
if options.indicators == DiffIndicators::Bars {
|
.when(options.indicators == DiffIndicators::Bars, |number| {
|
||||||
number = number.border_l_4().border_color(change_color);
|
number.border_l_4().border_color(change_color)
|
||||||
}
|
}),
|
||||||
row_element.child(number)
|
)
|
||||||
})
|
})
|
||||||
.when(
|
.when(
|
||||||
options.indicators == DiffIndicators::Bars && !options.line_numbers,
|
options.indicators == DiffIndicators::Bars && !options.line_numbers,
|
||||||
|
|||||||
@@ -817,9 +817,10 @@ fn text_row(
|
|||||||
cx: &App,
|
cx: &App,
|
||||||
) -> AnyElement {
|
) -> AnyElement {
|
||||||
let theme = cx.theme();
|
let theme = cx.theme();
|
||||||
let mut frame = block_frame(indent, quote, px(0.), bottom, id, cx);
|
|
||||||
|
|
||||||
if let Some(marker) = marker {
|
block_frame(indent, quote, px(0.), bottom, id, cx)
|
||||||
|
.map(|frame| match marker {
|
||||||
|
Some(marker) => {
|
||||||
let line_height = theme.sizes.small.text_size * BODY_LINE_HEIGHT;
|
let line_height = theme.sizes.small.text_size * BODY_LINE_HEIGHT;
|
||||||
let marker_cell = div()
|
let marker_cell = div()
|
||||||
.flex_none()
|
.flex_none()
|
||||||
@@ -842,18 +843,17 @@ fn text_row(
|
|||||||
ListMarker::Task(checked) => task_box(checked, cx),
|
ListMarker::Task(checked) => task_box(checked, cx),
|
||||||
});
|
});
|
||||||
|
|
||||||
frame = frame.child(
|
frame.child(
|
||||||
div()
|
div()
|
||||||
.flex()
|
.flex()
|
||||||
.items_start()
|
.items_start()
|
||||||
.child(marker_cell)
|
.child(marker_cell)
|
||||||
.child(div().flex_1().min_w_0().child(text_child(spans, id, cx))),
|
.child(div().flex_1().min_w_0().child(text_child(spans, id, cx))),
|
||||||
);
|
)
|
||||||
} else {
|
|
||||||
frame = frame.child(text_child(spans, id, cx));
|
|
||||||
}
|
}
|
||||||
|
None => frame.child(text_child(spans, id, cx)),
|
||||||
frame.into_any_element()
|
})
|
||||||
|
.into_any_element()
|
||||||
}
|
}
|
||||||
|
|
||||||
/// A read-only task item indicator, matching the checkbox component.
|
/// A read-only task item indicator, matching the checkbox component.
|
||||||
@@ -896,7 +896,7 @@ fn code_row(
|
|||||||
let text_size = theme.sizes.small.text_size;
|
let text_size = theme.sizes.small.text_size;
|
||||||
let line_height = text_size * CODE_LINE_HEIGHT;
|
let line_height = text_size * CODE_LINE_HEIGHT;
|
||||||
|
|
||||||
let mut plate = div()
|
let plate = div()
|
||||||
.w_full()
|
.w_full()
|
||||||
.flex()
|
.flex()
|
||||||
.flex_col()
|
.flex_col()
|
||||||
@@ -906,17 +906,14 @@ fn code_row(
|
|||||||
.font_family(theme.mono_font)
|
.font_family(theme.mono_font)
|
||||||
.text_size(text_size)
|
.text_size(text_size)
|
||||||
.line_height(relative(CODE_LINE_HEIGHT))
|
.line_height(relative(CODE_LINE_HEIGHT))
|
||||||
.overflow_hidden();
|
.overflow_hidden()
|
||||||
|
.children(lines.lines.iter().map(|line| {
|
||||||
for line in &lines.lines {
|
|
||||||
plate = plate.child(
|
|
||||||
div()
|
div()
|
||||||
.h(line_height)
|
.h(line_height)
|
||||||
.whitespace_nowrap()
|
.whitespace_nowrap()
|
||||||
.overflow_hidden()
|
.overflow_hidden()
|
||||||
.child(code_line(line, theme.colors, theme.ramps)),
|
.child(code_line(line, theme.colors, theme.ramps))
|
||||||
);
|
}));
|
||||||
}
|
|
||||||
|
|
||||||
block_frame(
|
block_frame(
|
||||||
indent,
|
indent,
|
||||||
@@ -961,29 +958,30 @@ fn table_row(
|
|||||||
.unwrap_or(0);
|
.unwrap_or(0);
|
||||||
let row_count = table.rows.len();
|
let row_count = table.rows.len();
|
||||||
|
|
||||||
let mut grid = div()
|
let grid = div()
|
||||||
.w_full()
|
.w_full()
|
||||||
.flex()
|
.flex()
|
||||||
.flex_col()
|
.flex_col()
|
||||||
.border_1()
|
.border_1()
|
||||||
.border_color(colors.border)
|
.border_color(colors.border)
|
||||||
.rounded(theme.radius.control)
|
.rounded(theme.radius.control)
|
||||||
.overflow_hidden();
|
.overflow_hidden()
|
||||||
|
.children(table.rows.iter().enumerate().map(|(row_ix, row)| {
|
||||||
for (row_ix, row) in table.rows.iter().enumerate() {
|
div()
|
||||||
let mut row_element = div().w_full().flex();
|
.w_full()
|
||||||
if row_ix + 1 < row_count {
|
.flex()
|
||||||
row_element = row_element.border_b_1().border_color(colors.border);
|
.when(row_ix + 1 < row_count, |row_element| {
|
||||||
}
|
row_element.border_b_1().border_color(colors.border)
|
||||||
if row.header {
|
})
|
||||||
row_element = row_element.bg(colors.muted);
|
.when(row.header, |row_element| row_element.bg(colors.muted))
|
||||||
}
|
.children(
|
||||||
|
row.cells
|
||||||
for (column_ix, cell) in row.cells.iter().enumerate() {
|
.iter()
|
||||||
|
.enumerate()
|
||||||
|
.map(|(column_ix, cell)| {
|
||||||
let cell_id = ElementId::from(SharedString::from(format!(
|
let cell_id = ElementId::from(SharedString::from(format!(
|
||||||
"{id}-cell-{row_ix}-{column_ix}"
|
"{id}-cell-{row_ix}-{column_ix}"
|
||||||
)));
|
)));
|
||||||
row_element = row_element.child(
|
|
||||||
div()
|
div()
|
||||||
.flex_1()
|
.flex_1()
|
||||||
.min_w_0()
|
.min_w_0()
|
||||||
@@ -992,17 +990,15 @@ fn table_row(
|
|||||||
.when(row.header, |cell_element| {
|
.when(row.header, |cell_element| {
|
||||||
cell_element.font_weight(FontWeight::SEMIBOLD)
|
cell_element.font_weight(FontWeight::SEMIBOLD)
|
||||||
})
|
})
|
||||||
.child(text_child(&cell.spans, &cell_id, cx)),
|
.child(text_child(&cell.spans, &cell_id, cx))
|
||||||
);
|
})
|
||||||
}
|
|
||||||
|
|
||||||
// Ragged tables pad missing cells so rows align.
|
// Ragged tables pad missing cells so rows align.
|
||||||
for _ in row.cells.len()..width {
|
.chain(
|
||||||
row_element = row_element.child(div().flex_1().min_w_0().px_2().py_1());
|
(row.cells.len()..width)
|
||||||
}
|
.map(|_| div().flex_1().min_w_0().px_2().py_1()),
|
||||||
|
),
|
||||||
grid = grid.child(row_element);
|
)
|
||||||
}
|
}));
|
||||||
|
|
||||||
block_frame(
|
block_frame(
|
||||||
indent,
|
indent,
|
||||||
|
|||||||
@@ -1044,11 +1044,12 @@ fn render_pane(
|
|||||||
|
|
||||||
tabs.iter()
|
tabs.iter()
|
||||||
.map(|tab| {
|
.map(|tab| {
|
||||||
let mut entry = Tab::new(tab.panel.clone(), tab.title.clone());
|
Tab::new(tab.panel.clone(), tab.title.clone())
|
||||||
if let Some(icon) = tab.icon.clone() {
|
.when_some(tab.icon.clone(), |entry, icon| {
|
||||||
entry = entry.lead(icon.size(metrics.icon_size));
|
entry.lead(icon.size(metrics.icon_size))
|
||||||
}
|
})
|
||||||
entry.closeable(true).wrap({
|
.closeable(true)
|
||||||
|
.wrap({
|
||||||
let panel = tab.panel.clone();
|
let panel = tab.panel.clone();
|
||||||
let title = tab.title.clone();
|
let title = tab.title.clone();
|
||||||
move |tab| {
|
move |tab| {
|
||||||
|
|||||||
@@ -220,39 +220,36 @@ impl RenderOnce for Resizable {
|
|||||||
.map(|ix| state.read(cx).pane_size(ix, pane_count))
|
.map(|ix| state.read(cx).pane_size(ix, pane_count))
|
||||||
.collect();
|
.collect();
|
||||||
|
|
||||||
let mut group = div()
|
div()
|
||||||
.flex()
|
.flex()
|
||||||
.overflow_hidden()
|
.overflow_hidden()
|
||||||
.when(axis == Axis::Vertical, |group| group.flex_col())
|
.when(axis == Axis::Vertical, |group| group.flex_col())
|
||||||
.when(axis == Axis::Horizontal, |group| group.flex_row())
|
.when(axis == Axis::Horizontal, |group| group.flex_row())
|
||||||
.refine_style(&self.style);
|
.refine_style(&self.style)
|
||||||
|
.children(self.panes.into_iter().enumerate().flat_map(|(ix, pane)| {
|
||||||
for (ix, pane) in self.panes.into_iter().enumerate() {
|
|
||||||
let remainder = ix + 1 == pane_count;
|
let remainder = ix + 1 == pane_count;
|
||||||
let content = pane.content;
|
let pane_element = div()
|
||||||
let mut pane_element = if remainder {
|
|
||||||
div()
|
|
||||||
.flex_1()
|
|
||||||
.overflow_hidden()
|
.overflow_hidden()
|
||||||
|
.when(remainder, |pane_element| {
|
||||||
|
pane_element
|
||||||
|
.flex_1()
|
||||||
.when(axis == Axis::Vertical, |p| p.min_h(pane.min))
|
.when(axis == Axis::Vertical, |p| p.min_h(pane.min))
|
||||||
.when(axis == Axis::Horizontal, |p| p.min_w(pane.min))
|
.when(axis == Axis::Horizontal, |p| p.min_w(pane.min))
|
||||||
} else {
|
})
|
||||||
div()
|
.when(!remainder, |pane_element| {
|
||||||
|
pane_element
|
||||||
.flex_none()
|
.flex_none()
|
||||||
.overflow_hidden()
|
|
||||||
.when(axis == Axis::Vertical, |p| p.h(sizes[ix]).w_full())
|
.when(axis == Axis::Vertical, |p| p.h(sizes[ix]).w_full())
|
||||||
.when(axis == Axis::Horizontal, |p| p.w(sizes[ix]).h_full())
|
.when(axis == Axis::Horizontal, |p| p.w(sizes[ix]).h_full())
|
||||||
};
|
})
|
||||||
|
.when_some(debug_selector.clone(), |pane_element, selector| {
|
||||||
if let Some(selector) = &debug_selector {
|
|
||||||
let prefix = selector();
|
let prefix = selector();
|
||||||
pane_element = pane_element.debug_selector(move || format!("{prefix}-{ix}"));
|
pane_element.debug_selector(move || format!("{prefix}-{ix}"))
|
||||||
}
|
})
|
||||||
|
.child(pane.content)
|
||||||
|
.into_any_element();
|
||||||
|
|
||||||
group = group.child(pane_element.child(content));
|
let divider = (!remainder).then(|| {
|
||||||
|
|
||||||
if !remainder {
|
|
||||||
let divider =
|
|
||||||
ResizeHandle::new(SharedString::from(format!("{}-divider-{ix}", self.id)))
|
ResizeHandle::new(SharedString::from(format!("{}-divider-{ix}", self.id)))
|
||||||
.axis(axis)
|
.axis(axis)
|
||||||
.on_resize({
|
.on_resize({
|
||||||
@@ -268,14 +265,14 @@ impl RenderOnce for Resizable {
|
|||||||
move |_, cx| {
|
move |_, cx| {
|
||||||
state.update(cx, |state, cx| state.reset_pane(ix, mins.len(), cx));
|
state.update(cx, |state, cx| state.reset_pane(ix, mins.len(), cx));
|
||||||
}
|
}
|
||||||
|
})
|
||||||
|
.into_any_element()
|
||||||
});
|
});
|
||||||
|
|
||||||
group = group.child(divider);
|
std::iter::once(pane_element).chain(divider)
|
||||||
}
|
}))
|
||||||
}
|
.when(pane_count > 0, |group| {
|
||||||
|
group.child(
|
||||||
if pane_count > 0 {
|
|
||||||
group = group.child(
|
|
||||||
canvas(
|
canvas(
|
||||||
{
|
{
|
||||||
let state = state.clone();
|
let state = state.clone();
|
||||||
@@ -291,9 +288,7 @@ impl RenderOnce for Resizable {
|
|||||||
)
|
)
|
||||||
.absolute()
|
.absolute()
|
||||||
.inset_0(),
|
.inset_0(),
|
||||||
);
|
)
|
||||||
}
|
})
|
||||||
|
|
||||||
group
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
+10
-6
@@ -9,12 +9,16 @@ is the first downstream consumer; its screens drive the order.
|
|||||||
|
|
||||||
## Next
|
## Next
|
||||||
|
|
||||||
- [ ] **Declarative render audit** — run the AGENTS.md render rule over the
|
- [x] **Declarative render audit** — the AGENTS.md render rule swept the
|
||||||
other landed components: replace `let mut` element variables reassigned
|
landed components: `let mut` element variables reassigned under `if` /
|
||||||
under `if` / `if let` with one chained expression using `.when(...)` /
|
`if let` now build one chained expression with `.when(...)` /
|
||||||
`.when_some(...)` / `.map(...)`. The sidebar row is the model; sweep
|
`.when_some(...)` / `.map(...)`. Converted: Tabs strip root and tab,
|
||||||
`crates/core`, `crates/data`, `crates/editor`, `crates/layout`, and
|
Menu / DropdownMenu / Popover / Combobox wrappers, ScrollArea pane and
|
||||||
re-run tests plus a gallery pass after each crate.
|
scrollbars, Select rows, Dock tab entries, Resizable panes and dividers,
|
||||||
|
the Markdown text / code / table rows, and the Diff gutter cell.
|
||||||
|
`MenuItem` and `Tab` adopted `FluentBuilder` so their builders chain
|
||||||
|
too; data accumulators (`Vec`/`String` builders, style clones) stay
|
||||||
|
imperative — they are state, not element refinement.
|
||||||
|
|
||||||
## Queue — to follow
|
## Queue — to follow
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user