Style contact finder (#3717)
This PR styles the contact finder. <img width="598" alt="Screenshot 2023-12-19 at 12 59 00 PM" src="https://github.com/zed-industries/zed/assets/1486634/ca9d9345-bf27-4256-aabc-6017a0c4d217"> Release Notes: - N/A
This commit is contained in:
parent
ef39382c84
commit
a3bab25792
3 changed files with 40 additions and 79 deletions
|
@ -1,8 +1,8 @@
|
|||
use editor::Editor;
|
||||
use gpui::{
|
||||
div, prelude::*, rems, uniform_list, AnyElement, AppContext, DismissEvent, Div, EventEmitter,
|
||||
FocusHandle, FocusableView, Length, MouseButton, MouseDownEvent, Render, Task,
|
||||
UniformListScrollHandle, View, ViewContext, WindowContext,
|
||||
div, prelude::*, rems, uniform_list, AppContext, DismissEvent, Div, EventEmitter, FocusHandle,
|
||||
FocusableView, Length, MouseButton, MouseDownEvent, Render, Task, UniformListScrollHandle,
|
||||
View, ViewContext, WindowContext,
|
||||
};
|
||||
use std::{cmp, sync::Arc};
|
||||
use ui::{prelude::*, v_stack, Color, Divider, Label};
|
||||
|
@ -15,6 +15,11 @@ pub struct Picker<D: PickerDelegate> {
|
|||
pending_update_matches: Option<Task<()>>,
|
||||
confirm_on_update: Option<bool>,
|
||||
width: Option<Length>,
|
||||
|
||||
/// Whether the `Picker` is rendered as a self-contained modal.
|
||||
///
|
||||
/// Set this to `false` when rendering the `Picker` as part of a larger modal.
|
||||
is_modal: bool,
|
||||
}
|
||||
|
||||
pub trait PickerDelegate: Sized + 'static {
|
||||
|
@ -58,6 +63,7 @@ impl<D: PickerDelegate> Picker<D> {
|
|||
pending_update_matches: None,
|
||||
confirm_on_update: None,
|
||||
width: None,
|
||||
is_modal: true,
|
||||
};
|
||||
this.update_matches("".to_string(), cx);
|
||||
this
|
||||
|
@ -68,6 +74,11 @@ impl<D: PickerDelegate> Picker<D> {
|
|||
self
|
||||
}
|
||||
|
||||
pub fn modal(mut self, modal: bool) -> Self {
|
||||
self.is_modal = modal;
|
||||
self
|
||||
}
|
||||
|
||||
pub fn focus(&self, cx: &mut WindowContext) {
|
||||
self.editor.update(cx, |editor, cx| editor.focus(cx));
|
||||
}
|
||||
|
@ -234,7 +245,11 @@ impl<D: PickerDelegate> Render for Picker<D> {
|
|||
el.w(width)
|
||||
})
|
||||
.overflow_hidden()
|
||||
.elevation_3(cx)
|
||||
// This is a bit of a hack to remove the modal styling when we're rendering the `Picker`
|
||||
// as a part of a modal rather than the entire modal.
|
||||
//
|
||||
// We should revisit how the `Picker` is styled to make it more composable.
|
||||
.when(self.is_modal, |this| this.elevation_3(cx))
|
||||
.on_action(cx.listener(Self::select_next))
|
||||
.on_action(cx.listener(Self::select_prev))
|
||||
.on_action(cx.listener(Self::select_first))
|
||||
|
@ -295,22 +310,3 @@ impl<D: PickerDelegate> Render for Picker<D> {
|
|||
})
|
||||
}
|
||||
}
|
||||
|
||||
pub fn simple_picker_match(
|
||||
selected: bool,
|
||||
cx: &mut WindowContext,
|
||||
children: impl FnOnce(&mut WindowContext) -> AnyElement,
|
||||
) -> AnyElement {
|
||||
let colors = cx.theme().colors();
|
||||
|
||||
div()
|
||||
.px_1()
|
||||
.text_color(colors.text)
|
||||
.text_ui()
|
||||
.bg(colors.ghost_element_background)
|
||||
.rounded_md()
|
||||
.when(selected, |this| this.bg(colors.ghost_element_selected))
|
||||
.hover(|this| this.bg(colors.ghost_element_hover))
|
||||
.child((children)(cx))
|
||||
.into_any()
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue