diff --git a/crates/ui/src/menu/dropdown_menu.rs b/crates/ui/src/menu/dropdown_menu.rs index 92d03394..e8da81f3 100644 --- a/crates/ui/src/menu/dropdown_menu.rs +++ b/crates/ui/src/menu/dropdown_menu.rs @@ -22,7 +22,7 @@ pub trait DropdownMenu: Styled + Selectable + InteractiveElement + IntoElement + let id = self.interactivity().element_id.clone(); Popover::new(SharedString::from(format!("dropdown-menu:{:?}", id))) - .no_style() + .appearance(false) .trigger(self) .trigger_style(style) .anchor(anchor.into()) diff --git a/crates/ui/src/popover.rs b/crates/ui/src/popover.rs index 4199551a..133c7539 100644 --- a/crates/ui/src/popover.rs +++ b/crates/ui/src/popover.rs @@ -15,6 +15,7 @@ pub(crate) fn init(cx: &mut App) { cx.bind_keys([KeyBinding::new("escape", Cancel, Some(CONTEXT))]) } +/// The content of the popover. pub struct PopoverContent { style: StyleRefinement, focus_handle: FocusHandle, @@ -64,6 +65,7 @@ impl Render for PopoverContent { } } +/// A popover element that can be triggered by a button or any other element. pub struct Popover { id: ElementId, anchor: Corner, @@ -73,7 +75,7 @@ pub struct Popover { /// This is used for hotfix the trigger element style to support w_full. trigger_style: Option, mouse_button: MouseButton, - no_style: bool, + appearance: bool, } impl Popover @@ -89,10 +91,11 @@ where trigger_style: None, content: None, mouse_button: MouseButton::Left, - no_style: false, + appearance: true, } } + /// Set the anchor corner of the popover, default is `Corner::TopLeft`. pub fn anchor(mut self, anchor: Corner) -> Self { self.anchor = anchor; self @@ -104,6 +107,7 @@ where self } + /// Set the trigger element of the popover. pub fn trigger(mut self, trigger: T) -> Self where T: Selectable + IntoElement + 'static, @@ -115,6 +119,7 @@ where self } + /// Set the style for the trigger element. pub fn trigger_style(mut self, style: StyleRefinement) -> Self { self.trigger_style = Some(style); self @@ -137,8 +142,8 @@ where /// /// - The popover will not have a bg, border, shadow, or padding. /// - The click out of the popover will not dismiss it. - pub fn no_style(mut self) -> Self { - self.no_style = true; + pub fn appearance(mut self, appearance: bool) -> Self { + self.appearance = appearance; self } @@ -273,20 +278,20 @@ impl Element for Popover { let mut element = { let content_view_mut = element_state.content_view.clone(); let anchor = view.anchor; - let no_style = view.no_style; + let appearance = view.appearance; deferred( anchored.child( div() .size_full() .occlude() .tab_group() - .when(!no_style, |this| this.popover_style(cx)) + .when(appearance, |this| this.popover_style(cx)) .map(|this| match anchor { Corner::TopLeft | Corner::TopRight => this.top_1(), Corner::BottomLeft | Corner::BottomRight => this.bottom_1(), }) .child(content_view.clone()) - .when(!no_style, |this| { + .when(appearance, |this| { this.on_mouse_down_out(move |_, window, _| { // Update the element_state.content_view to `None`, // so that the `paint`` method will not paint it. diff --git a/docs/docs/components/popover.md b/docs/docs/components/popover.md index 911896ae..ce1309bd 100644 --- a/docs/docs/components/popover.md +++ b/docs/docs/components/popover.md @@ -155,7 +155,7 @@ Popover::new("rich-content") ```rust // For custom styled popovers or when you want full control Popover::new("custom-popover") - .no_style() + .appearance(false) .trigger(Button::new("custom").label("Custom Style")) .content(|window, cx| { cx.new(|cx| { @@ -409,40 +409,6 @@ impl InfoPopover { }) ``` -## API Reference - -### Popover - -| Method | Description | -| ---------------------- | ---------------------------------------------------------------- | -| `new(id)` | Create a new popover with element ID | -| `anchor(corner)` | Set anchor position (TopLeft, TopRight, BottomLeft, BottomRight) | -| `mouse_button(button)` | Set trigger mouse button (Left, Right, Middle) | -| `trigger(element)` | Set the trigger element (must implement Selectable) | -| `trigger_style(style)` | Apply custom styling to trigger container | -| `content(closure)` | Set popover content builder function | -| `no_style()` | Remove default popover styling | - -### PopoverContent - -| Method | Description | -| ----------------------------- | -------------------------------------------- | -| `new(window, cx, content_fn)` | Create popover content with builder function | - -PopoverContent also implements `Styled` for custom styling: - -| Method | Description | -| -------------- | ----------------- | -| `p_*()` | Padding utilities | -| `m_*()` | Margin utilities | -| `bg()` | Background color | -| `text_color()` | Text color | -| `rounded_*()` | Border radius | -| `border_*()` | Border styling | -| `shadow_*()` | Shadow effects | -| `max_w()` | Maximum width | -| `min_w()` | Minimum width | - ### Default Styling When not using `no_style()`, popovers automatically apply: