split_button.rs

 1use gpui::{
 2    AnyElement, App, BoxShadow, IntoElement, ParentElement, RenderOnce, Styled, Window, div, hsla,
 3    point, px,
 4};
 5use theme::ActiveTheme;
 6
 7use crate::{ElevationIndex, h_flex};
 8
 9use super::ButtonLike;
10
11/// /// A button with two parts: a primary action on the left and a secondary action on the right.
12///
13/// The left side is a [`ButtonLike`] with the main action, while the right side can contain
14/// any element (typically a dropdown trigger or similar).
15///
16/// The two sections are visually separated by a divider, but presented as a unified control.
17#[derive(IntoElement)]
18pub struct SplitButton {
19    pub left: ButtonLike,
20    pub right: AnyElement,
21}
22
23impl SplitButton {
24    pub fn new(left: ButtonLike, right: AnyElement) -> Self {
25        Self { left, right }
26    }
27}
28
29impl RenderOnce for SplitButton {
30    fn render(self, _window: &mut Window, cx: &mut App) -> impl IntoElement {
31        h_flex()
32            .rounded_sm()
33            .border_1()
34            .border_color(cx.theme().colors().text_muted.alpha(0.12))
35            .child(div().flex_grow().child(self.left))
36            .child(
37                div()
38                    .h_full()
39                    .w_px()
40                    .bg(cx.theme().colors().text_muted.alpha(0.16)),
41            )
42            .child(self.right)
43            .bg(ElevationIndex::Surface.on_elevation_bg(cx))
44            .shadow(vec![BoxShadow {
45                color: hsla(0.0, 0.0, 0.0, 0.16),
46                offset: point(px(0.), px(1.)),
47                blur_radius: px(0.),
48                spread_radius: px(0.),
49            }])
50    }
51}