@ context menu fixes. (#9237)

## Description
<!-- Please remember to add your design buddy onto the PR for review, if
it contains any UI changes! -->

WISOTT! Fixes:
- positioning of the menu in the new cloud mode input
- some sharp corners poking through rounded ones for the selected item

<img width="588" height="312" alt="Screenshot 2026-04-27 at 9 01 19 PM"
src="https://github.com/user-attachments/assets/03cd565a-e869-4a3a-9ae3-98dd3d86c068"
/>


## Testing
<!--
How did you test this change? What automated tests did you add? If you
didn't add any new tests, what's your justification for not adding any?

If you're not sure whether you should add a test, check our testing
policy:
https://www.notion.so/warpdev/How-We-Code-at-Warp-257fe43d556e4b3c8dfd42f70004cc72#1f97825450504baa9c5fd87a737daa09
-->

See image!

## Agent Mode
- [x] Warp Agent Mode - This PR was created via Warp's AI Agent Mode
This commit is contained in:
Abhishek Pandya
2026-04-28 21:15:13 +00:00
committed by GitHub
parent 84592e2ad8
commit e3470ae088
4 changed files with 22 additions and 3 deletions
+1
View File
@@ -3,3 +3,4 @@ pub const MARGIN_RIGHT: f32 = 8.0;
pub const ESTIMATED_RESULT_HEIGHT: f32 = 24.0; pub const ESTIMATED_RESULT_HEIGHT: f32 = 24.0;
pub const MENU_ITEM_HORIZONTAL_PADDING: f32 = 16.0; pub const MENU_ITEM_HORIZONTAL_PADDING: f32 = 16.0;
pub const MENU_ITEM_VERTICAL_PADDING: f32 = 4.0; pub const MENU_ITEM_VERTICAL_PADDING: f32 = 4.0;
pub const MENU_ITEM_HIGHLIGHT_CORNER_RADIUS: f32 = 8.0;
+13 -1
View File
@@ -1287,8 +1287,11 @@ impl AIContextMenu {
return self.render_no_results(app); return self.render_no_results(app);
} }
let last_display_index = filtered_categories.len().saturating_sub(1);
for (display_index, category) in filtered_categories.iter().enumerate() { for (display_index, category) in filtered_categories.iter().enumerate() {
let is_selected = display_index == self.state.selected_category_index; let is_selected = display_index == self.state.selected_category_index;
let is_first = display_index == 0;
let is_last = display_index == last_display_index;
let text_color = if is_selected { let text_color = if is_selected {
theme.main_text_color(theme.accent()).into_solid() theme.main_text_color(theme.accent()).into_solid()
} else { } else {
@@ -1347,11 +1350,20 @@ impl AIContextMenu {
let accent_color = theme.accent(); let accent_color = theme.accent();
let accent_overlay_color = theme.accent_overlay(); let accent_overlay_color = theme.accent_overlay();
let highlight_radius = Radius::Pixels(styles::MENU_ITEM_HIGHLIGHT_CORNER_RADIUS);
let highlight_corner_radius = match (is_first, is_last) {
(true, true) => CornerRadius::with_all(highlight_radius),
(true, false) => CornerRadius::with_top(highlight_radius),
(false, true) => CornerRadius::with_bottom(highlight_radius),
(false, false) => CornerRadius::default(),
};
let category_clone_for_click = *category; let category_clone_for_click = *category;
let category_row = Hoverable::new(hover_state, move |hover_state| { let category_row = Hoverable::new(hover_state, move |hover_state| {
let mut container = Container::new(row) let mut container = Container::new(row)
.with_horizontal_padding(styles::MENU_ITEM_HORIZONTAL_PADDING) .with_horizontal_padding(styles::MENU_ITEM_HORIZONTAL_PADDING)
.with_vertical_padding(styles::MENU_ITEM_VERTICAL_PADDING); .with_vertical_padding(styles::MENU_ITEM_VERTICAL_PADDING)
.with_corner_radius(highlight_corner_radius);
if is_selected { if is_selected {
container = container.with_background(accent_color); container = container.with_background(accent_color);
} else if hover_state.is_hovered() { } else if hover_state.is_hovered() {
+7 -1
View File
@@ -3429,6 +3429,12 @@ impl Input {
if let Some(ai_context_menu) = self.editor.as_ref(app).render_ai_context_menu() { if let Some(ai_context_menu) = self.editor.as_ref(app).render_ai_context_menu() {
let position = position_id_for_cursor(self.editor.id()); let position = position_id_for_cursor(self.editor.id());
let y_anchor = if self.is_cloud_mode_input_v2_composing(app) {
AnchorPair::new(YAxisAnchor::Bottom, YAxisAnchor::Top)
} else {
menu_positioning.completion_suggestions_y_anchor()
};
stack.add_positioned_overlay_child( stack.add_positioned_overlay_child(
ai_context_menu, ai_context_menu,
OffsetPositioning::from_axes( OffsetPositioning::from_axes(
@@ -3442,7 +3448,7 @@ impl Input {
&position, &position,
PositionedElementOffsetBounds::Unbounded, PositionedElementOffsetBounds::Unbounded,
OffsetType::Pixel(0.), OffsetType::Pixel(0.),
menu_positioning.completion_suggestions_y_anchor(), y_anchor,
), ),
), ),
); );
+1 -1
View File
@@ -333,7 +333,7 @@ impl Input {
let menu_positioning = self.menu_positioning(app); let menu_positioning = self.menu_positioning(app);
let model = self.model.lock(); let model = self.model.lock();
let mut stack = Stack::new().with_constrain_absolute_children(); let mut stack = Stack::new();
// Apply the V2 gutter symmetrically (left + right) so the floating // Apply the V2 gutter symmetrically (left + right) so the floating
// input keeps equal breathing room on both sides as the pane shrinks. // input keeps equal breathing room on both sides as the pane shrinks.