add context menu

crates/core/Cargo.toml

@@ -19,6 +19,7 @@ default = ["full"]
 full = [
     "button",
     "checkbox",
+    "context_menu",
     "switch",
     "radio",
     "toggle",
@@ -40,6 +41,7 @@ full = [
 ]
 button = []
 checkbox = []
+context_menu = ["menu"]
 switch = []
 radio = []
 toggle = []

crates/core/src/context_menu.rs

@@ -0,0 +1,120 @@
+use gpui::prelude::FluentBuilder as _;
+use gpui::{
+    App, ElementId, InteractiveElement as _, IntoElement, MouseButton, MouseDownEvent,
+    ParentElement as _, RenderOnce, SharedString, Window, div,
+};
+
+use crate::menu::{Menu, MenuItem};
+
+/// Builds the element that opens the menu on right-click.
+type TargetFn = Box<dyn Fn(&mut Window, &mut App) -> gpui::AnyElement>;
+/// Builds the menu's items fresh each render.
+type ItemsFn = Box<dyn Fn(&mut Window, &mut App) -> Vec<MenuItem>>;
+
+/// A menu that opens at the pointer when its target is right-clicked.
+#[derive(IntoElement)]
+pub struct ContextMenu {
+    id: ElementId,
+    target: Option<TargetFn>,
+    items: Option<ItemsFn>,
+    a11y_label: Option<SharedString>,
+}
+
+impl ContextMenu {
+    /// Creates a context menu over a target set with [`ContextMenu::target`].
+    pub fn new<I>(id: I) -> Self
+    where
+        I: Into<ElementId>,
+    {
+        Self {
+            id: id.into(),
+            target: None,
+            items: None,
+            a11y_label: None,
+        }
+    }
+
+    /// Sets the element that opens the menu on right-click.
+    pub fn target<F>(mut self, target: F) -> Self
+    where
+        F: Fn(&mut Window, &mut App) -> gpui::AnyElement + 'static,
+    {
+        self.target = Some(Box::new(target));
+        self
+    }
+
+    /// Sets the menu's items, built fresh each render.
+    pub fn items<F>(mut self, items: F) -> Self
+    where
+        F: Fn(&mut Window, &mut App) -> Vec<MenuItem> + 'static,
+    {
+        self.items = Some(Box::new(items));
+        self
+    }
+
+    /// Overrides the menu's accessibility label.
+    pub fn accessibility_label<L>(mut self, label: L) -> Self
+    where
+        L: Into<SharedString>,
+    {
+        self.a11y_label = Some(label.into());
+        self
+    }
+}
+
+impl RenderOnce for ContextMenu {
+    fn render(self, window: &mut Window, cx: &mut App) -> impl IntoElement {
+        let open = window.with_element_namespace(self.id.clone(), |window| {
+            window
+                .use_keyed_state("context-open", cx, |_, _| false)
+                .clone()
+        });
+
+        let at = window.with_element_namespace(self.id.clone(), |window| {
+            window
+                .use_keyed_state("context-position", cx, |_, _| None)
+                .clone()
+        });
+
+        let is_open = *open.read(cx);
+        let position = *at.read(cx);
+
+        let target = self.target;
+        let at_for_target = at.clone();
+
+        let trigger = move |window: &mut Window, cx: &mut App| {
+            let base = target
+                .as_ref()
+                .map(|build| build(window, cx))
+                .unwrap_or_else(|| div().into_any_element());
+
+            div()
+                .on_mouse_down(MouseButton::Right, {
+                    let at = at_for_target.clone();
+                    move |event: &MouseDownEvent, _window, cx| {
+                        at.update(cx, |at, _| *at = Some(event.position));
+                    }
+                })
+                .child(base)
+                .into_any_element()
+        };
+
+        let items = move |window: &mut Window, cx: &mut App| {
+            self.items
+                .as_ref()
+                .map(|build| build(window, cx))
+                .unwrap_or_default()
+        };
+
+        Menu::new(self.id)
+            .open(is_open)
+            .on_change(move |next, _window, cx| open.update(cx, |open, _| *open = next))
+            .open_at(position)
+            .trigger_button(MouseButton::Right)
+            .trigger(trigger)
+            .items(items)
+            .when_some(self.a11y_label.clone(), |menu, label| {
+                menu.accessibility_label(label)
+            })
+    }
+}

crates/core/src/lib.rs

@@ -12,6 +12,9 @@ pub mod button;
 #[cfg(feature = "checkbox")]
 pub mod checkbox;
 
+#[cfg(feature = "context_menu")]
+pub mod context_menu;
+
 #[cfg(feature = "switch")]
 pub mod switch;
 

crates/core/src/menu.rs

@@ -5,7 +5,7 @@ use gpui::prelude::FluentBuilder as _;
 use gpui::{
     Animation, AnimationExt as _, AnyElement, App, Bounds, BoxShadow, DispatchPhase, ElementId,
     Entity, InteractiveElement as _, IntoElement, KeyDownEvent, MouseButton, MouseDownEvent,
-    ParentElement as _, Pixels, RenderOnce, Role, ScrollHandle, SharedString,
+    ParentElement as _, Pixels, Point, RenderOnce, Role, ScrollHandle, SharedString,
     StatefulInteractiveElement as _, Styled as _, Window, anchored, canvas, deferred, div,
     ease_out_quint, px,
 };
@@ -146,6 +146,8 @@ pub struct Menu {
     id: ElementId,
     open: bool,
     initial_selection: Option<usize>,
+    trigger_button: MouseButton,
+    open_at: Option<Point<Pixels>>,
     a11y_label: Option<SharedString>,
     on_change: Option<ChangeHandler>,
     trigger: Option<TriggerFn>,
@@ -162,6 +164,8 @@ impl Menu {
             id: id.into(),
             open: false,
             initial_selection: None,
+            trigger_button: MouseButton::Left,
+            open_at: None,
             a11y_label: None,
             on_change: None,
             trigger: None,
@@ -175,6 +179,18 @@ impl Menu {
         self
     }
 
+    /// Sets the mouse button that toggles the menu; right for context menus.
+    pub fn trigger_button(mut self, button: MouseButton) -> Self {
+        self.trigger_button = button;
+        self
+    }
+
+    /// Positions the panel at this window point when it opens.
+    pub fn open_at(mut self, position: impl Into<Option<Point<Pixels>>>) -> Self {
+        self.open_at = position.into();
+        self
+    }
+
     /// Sets the current open state.
     pub fn open(mut self, open: bool) -> Self {
         self.open = open;
@@ -264,6 +280,7 @@ impl RenderOnce for Menu {
                     {
                         let on_change = self.on_change.clone();
                         let open = self.open;
+                        let trigger_button = self.trigger_button;
                         let cell = trigger_bounds.clone();
                         let was_open = was_open.clone();
                         move |_, _, window, cx| {
@@ -277,7 +294,7 @@ impl RenderOnce for Menu {
                                 let on_change = on_change.clone();
                                 move |event: &MouseDownEvent, phase, window, cx| {
                                     if phase != DispatchPhase::Bubble
-                                        || event.button != MouseButton::Left
+                                        || event.button != trigger_button
                                     {
                                         return;
                                     }
@@ -390,9 +407,7 @@ impl RenderOnce for Menu {
                                 window.on_mouse_event({
                                     let on_change = on_change.clone();
                                     move |event: &MouseDownEvent, phase, window, cx| {
-                                        if phase != DispatchPhase::Bubble
-                                            || event.button != MouseButton::Left
-                                        {
+                                        if phase != DispatchPhase::Bubble {
                                             return;
                                         }
 
@@ -419,7 +434,12 @@ impl RenderOnce for Menu {
                     .inset_0(),
                 );
 
-            wrapper = wrapper.child(deferred(anchored().child(panel.with_animation(
+            let anchored = match self.open_at {
+                Some(position) => anchored().position(position),
+                None => anchored(),
+            };
+
+            wrapper = wrapper.child(deferred(anchored.child(panel.with_animation(
                 "menu-enter",
                 Animation::new(enter_duration).with_easing(ease_out_quint()),
                 |panel, delta| panel.opacity(delta),

crates/core/tests/context_menu.rs

@@ -0,0 +1,129 @@
+use std::{cell::RefCell, rc::Rc};
+
+use gpui::{
+    Context, IntoElement, MouseButton, ParentElement as _, Render, Styled as _, TestAppContext,
+    VisualTestContext, Window, div, point, px,
+};
+use gpui_native_core::context_menu::ContextMenu;
+use gpui_native_core::menu::MenuItem;
+use gpui_native_theme::Theme;
+
+type Actions = Rc<RefCell<Vec<&'static str>>>;
+
+struct Harness {
+    actions: Actions,
+}
+
+impl Render for Harness {
+    fn render(&mut self, _window: &mut Window, _cx: &mut Context<Self>) -> impl IntoElement {
+        let actions = self.actions.clone();
+        div().size_full().p_4().child(
+            ContextMenu::new("ctx")
+                .target(|_, _| div().h(px(40.)).w(px(200.)).child("Row").into_any_element())
+                .items({
+                    let actions = actions.clone();
+                    move |_, _| {
+                        vec![
+                            MenuItem::new("Rename").handler({
+                                let actions = actions.clone();
+                                move |_, _| actions.borrow_mut().push("rename")
+                            }),
+                            MenuItem::new("Delete").handler({
+                                let actions = actions.clone();
+                                move |_, _| actions.borrow_mut().push("delete")
+                            }),
+                        ]
+                    }
+                }),
+        )
+    }
+}
+
+/// The target row rides the `p_4` band: `16..216` horizontally, `16..56`
+/// vertically, so right-clicks land near `(100, 30)`.
+fn context_window() -> (TestAppContext, VisualTestContext, Actions) {
+    let mut cx = TestAppContext::single();
+    cx.update(Theme::init);
+    let actions = Rc::new(RefCell::new(Vec::new()));
+    let harness_actions = actions.clone();
+    let window = cx.add_window(move |_, _| Harness {
+        actions: harness_actions,
+    });
+    let mut visual = VisualTestContext::from_window(window.into(), &cx);
+    visual.update(|window, cx| {
+        window.draw(cx).clear(cx);
+    });
+    (cx, visual, actions)
+}
+
+fn right_click(visual: &mut VisualTestContext, position: gpui::Point<gpui::Pixels>) {
+    visual.simulate_mouse_down(position, MouseButton::Right, gpui::Modifiers::default());
+    visual.simulate_mouse_up(position, MouseButton::Right, gpui::Modifiers::default());
+}
+
+fn click(visual: &mut VisualTestContext, position: gpui::Point<gpui::Pixels>) {
+    visual.simulate_mouse_down(position, MouseButton::Left, gpui::Modifiers::default());
+    visual.simulate_mouse_up(position, MouseButton::Left, gpui::Modifiers::default());
+}
+
+fn draw(visual: &mut VisualTestContext) {
+    visual.update(|window, cx| {
+        window.draw(cx).clear(cx);
+    });
+}
+
+#[test]
+fn right_click_opens_the_menu_and_items_activate() {
+    let (_cx, mut visual, actions) = context_window();
+
+    right_click(&mut visual, point(px(100.), px(30.)));
+    draw(&mut visual);
+    // The panel claims focus, so the first item is keyboard-highlighted.
+    visual.simulate_keystrokes("enter");
+    draw(&mut visual);
+    assert_eq!(*actions.borrow(), vec!["rename"]);
+
+    // The menu closed with the choice, so Enter reports nothing more.
+    visual.simulate_keystrokes("enter");
+    draw(&mut visual);
+    assert_eq!(*actions.borrow(), vec!["rename"]);
+
+    // Right-click again reopens; Down reaches the second item.
+    right_click(&mut visual, point(px(100.), px(30.)));
+    draw(&mut visual);
+    visual.simulate_keystrokes("down");
+    visual.simulate_keystrokes("enter");
+    draw(&mut visual);
+    assert_eq!(*actions.borrow(), vec!["rename", "delete"]);
+}
+
+#[test]
+fn a_left_click_on_the_target_does_not_open_the_menu() {
+    let (_cx, mut visual, actions) = context_window();
+
+    click(&mut visual, point(px(100.), px(30.)));
+    draw(&mut visual);
+    visual.simulate_keystrokes("enter");
+    draw(&mut visual);
+    assert_eq!(*actions.borrow(), Vec::<&str>::new());
+}
+
+#[test]
+fn a_click_outside_closes_the_menu() {
+    let (_cx, mut visual, actions) = context_window();
+
+    right_click(&mut visual, point(px(100.), px(30.)));
+    draw(&mut visual);
+    click(&mut visual, point(px(450.), px(300.)));
+    draw(&mut visual);
+    visual.simulate_keystrokes("enter");
+    draw(&mut visual);
+    assert_eq!(*actions.borrow(), Vec::<&str>::new());
+
+    // A right-click outside the target never opens it either.
+    right_click(&mut visual, point(px(450.), px(300.)));
+    draw(&mut visual);
+    visual.simulate_keystrokes("enter");
+    draw(&mut visual);
+    assert_eq!(*actions.borrow(), Vec::<&str>::new());
+}