forked from reya/gpui-native-kit
+50
-47
@@ -7,7 +7,7 @@ use gpui::{
|
||||
Entity, InteractiveElement as _, IntoElement, KeyDownEvent, MouseButton, MouseDownEvent,
|
||||
ParentElement as _, Pixels, Point, RenderOnce, Role, ScrollHandle, SharedString,
|
||||
StatefulInteractiveElement as _, Styled as _, Window, anchored, canvas, deferred, div,
|
||||
ease_out_quint, px,
|
||||
ease_out_quint, point, px, relative,
|
||||
};
|
||||
use gpui_native_icons::{IconRole, icon as icon_glyph};
|
||||
use gpui_native_theme::ActiveTheme as _;
|
||||
@@ -127,6 +127,7 @@ impl MenuItem {
|
||||
struct MenuChrome {
|
||||
surface: gpui::Hsla,
|
||||
border: gpui::Hsla,
|
||||
panel_border: gpui::Hsla,
|
||||
foreground: gpui::Hsla,
|
||||
muted_foreground: gpui::Hsla,
|
||||
primary: gpui::Hsla,
|
||||
@@ -137,6 +138,9 @@ struct MenuChrome {
|
||||
radius_sm: Pixels,
|
||||
icon_size: Pixels,
|
||||
dense_icon_size: Pixels,
|
||||
menu_item_height: Pixels,
|
||||
spacing_unit: Pixels,
|
||||
text_size: Pixels,
|
||||
shadow: Vec<BoxShadow>,
|
||||
}
|
||||
|
||||
@@ -242,6 +246,11 @@ impl RenderOnce for Menu {
|
||||
MenuChrome {
|
||||
surface: theme.colors.surface,
|
||||
border: theme.colors.border,
|
||||
panel_border: if theme.borders.overlays {
|
||||
theme.colors.border
|
||||
} else {
|
||||
theme.colors.surface
|
||||
},
|
||||
foreground: theme.colors.foreground,
|
||||
muted_foreground: theme.colors.muted_foreground,
|
||||
primary: theme.ramps.primary.base,
|
||||
@@ -252,6 +261,9 @@ impl RenderOnce for Menu {
|
||||
radius_sm: theme.radius.sm,
|
||||
icon_size: theme.sizes.medium.icon_size,
|
||||
dense_icon_size: theme.sizes.medium.dense_icon_size,
|
||||
menu_item_height: theme.sizes.medium.menu_item_height,
|
||||
spacing_unit: theme.spacing.unit,
|
||||
text_size: theme.sizes.medium.text_size,
|
||||
shadow: theme.elevations.popover.shadows(),
|
||||
},
|
||||
theme.motion.overlay,
|
||||
@@ -259,7 +271,6 @@ impl RenderOnce for Menu {
|
||||
};
|
||||
|
||||
let trigger_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 selection = window.use_keyed_state("menu-selection", cx, |_, _| 0usize);
|
||||
let was_open = window.use_keyed_state("menu-was-open", cx, |_, _| self.open);
|
||||
@@ -363,19 +374,36 @@ impl RenderOnce for Menu {
|
||||
|
||||
let panel = v_flex()
|
||||
.id("menu-panel")
|
||||
.debug_selector(|| "menu-panel".to_string())
|
||||
.occlude()
|
||||
.track_focus(&focus)
|
||||
.role(Role::Menu)
|
||||
.aria_label(label)
|
||||
.mt_1()
|
||||
.min_w_56()
|
||||
.p_1()
|
||||
.p(chrome.spacing_unit)
|
||||
.bg(chrome.surface)
|
||||
.text_color(chrome.foreground)
|
||||
.rounded(chrome.radius_overlay)
|
||||
.border_1()
|
||||
.border_color(chrome.border)
|
||||
.border_color(chrome.panel_border)
|
||||
.shadow(chrome.shadow.clone())
|
||||
.overflow_hidden()
|
||||
.on_mouse_down_out({
|
||||
let on_change = on_change.clone();
|
||||
let trigger_bounds = trigger_bounds.clone();
|
||||
|
||||
move |event, window, cx| {
|
||||
if trigger_bounds
|
||||
.borrow()
|
||||
.is_some_and(|bounds| bounds.contains(&event.position))
|
||||
{
|
||||
return;
|
||||
}
|
||||
if let Some(on_change) = &on_change {
|
||||
on_change(false, window, cx);
|
||||
}
|
||||
}
|
||||
})
|
||||
.on_key_down({
|
||||
let items = items.clone();
|
||||
let on_change = on_change.clone();
|
||||
@@ -392,44 +420,14 @@ impl RenderOnce for Menu {
|
||||
.children(rows),
|
||||
)
|
||||
.child(
|
||||
canvas(
|
||||
{
|
||||
let cell = panel_bounds.clone();
|
||||
move |bounds, _window, _cx| *cell.borrow_mut() = Some(bounds)
|
||||
},
|
||||
{
|
||||
let on_change = on_change.clone();
|
||||
move |_, _, window, cx| {
|
||||
if !focus.contains_focused(window, cx) {
|
||||
window.focus(&focus, cx);
|
||||
}
|
||||
|
||||
window.on_mouse_event({
|
||||
let on_change = on_change.clone();
|
||||
move |event: &MouseDownEvent, phase, window, cx| {
|
||||
if phase != DispatchPhase::Bubble {
|
||||
return;
|
||||
}
|
||||
|
||||
let on_panel = panel_bounds
|
||||
.borrow()
|
||||
.is_some_and(|bounds| bounds.contains(&event.position));
|
||||
let on_trigger = trigger_bounds
|
||||
.borrow()
|
||||
.is_some_and(|bounds| bounds.contains(&event.position));
|
||||
if on_panel || on_trigger {
|
||||
return;
|
||||
}
|
||||
|
||||
if let Some(on_change) = &on_change {
|
||||
on_change(false, window, cx);
|
||||
}
|
||||
cx.stop_propagation();
|
||||
}
|
||||
});
|
||||
canvas(|_, _, _| {}, {
|
||||
let focus = focus.clone();
|
||||
move |_, _, window, cx| {
|
||||
if !focus.contains_focused(window, cx) {
|
||||
window.focus(&focus, cx);
|
||||
}
|
||||
},
|
||||
)
|
||||
}
|
||||
})
|
||||
.absolute()
|
||||
.inset_0(),
|
||||
);
|
||||
@@ -437,7 +435,8 @@ impl RenderOnce for Menu {
|
||||
let anchored = match self.open_at {
|
||||
Some(position) => anchored().position(position),
|
||||
None => anchored(),
|
||||
};
|
||||
}
|
||||
.offset(point(px(0.), chrome.spacing_unit));
|
||||
|
||||
wrapper = wrapper.child(deferred(anchored.child(panel.with_animation(
|
||||
"menu-enter",
|
||||
@@ -462,8 +461,9 @@ fn render_item(
|
||||
match item.kind {
|
||||
MenuItemKind::Separator => div()
|
||||
.h(px(1.))
|
||||
.mx_2()
|
||||
.my_1()
|
||||
.debug_selector(move || format!("menu-separator-{index}"))
|
||||
.mx(chrome.spacing_unit * 2.0)
|
||||
.my(chrome.spacing_unit)
|
||||
.bg(chrome.border)
|
||||
.into_any_element(),
|
||||
MenuItemKind::Action => {
|
||||
@@ -476,11 +476,14 @@ fn render_item(
|
||||
|
||||
div()
|
||||
.id(("menu-item", index))
|
||||
.debug_selector(move || format!("menu-item-{index}"))
|
||||
.flex()
|
||||
.items_center()
|
||||
.gap_2()
|
||||
.px_2()
|
||||
.py_1()
|
||||
.min_h(chrome.menu_item_height)
|
||||
.px(chrome.spacing_unit * 2.0)
|
||||
.text_size(chrome.text_size)
|
||||
.line_height(relative(1.0))
|
||||
.rounded(chrome.radius_sm)
|
||||
.map(|row| {
|
||||
if disabled {
|
||||
|
||||
Reference in New Issue
Block a user