tenant.openagents/omega

1use gpui::{AnyView, DefiniteLength, Hsla};
2
3use super::button_like::{ButtonCommon, ButtonLike, ButtonSize, ButtonStyle};
4use crate::{
5    ElevationIndex, Icon, IconWithIndicator, Indicator, SelectableButton, TintColor, Tooltip,
6    prelude::*,
7};
8use crate::{IconName, IconSize};
9
10/// The shape of an [`IconButton`].
11#[derive(Debug, PartialEq, Eq, PartialOrd, Ord, Hash, Clone, Copy)]
12pub enum IconButtonShape {
13    Square,
14    Wide,
15}
16
17#[derive(IntoElement, RegisterComponent)]
18pub struct IconButton {
19    base: ButtonLike,
20    shape: IconButtonShape,
21    icon: IconName,
22    icon_size: IconSize,
23    icon_color: Color,
24    selected_icon: Option<IconName>,
25    selected_icon_color: Option<Color>,
26    selected_style: Option<ButtonStyle>,
27    indicator: Option<Indicator>,
28    indicator_border_color: Option<Hsla>,
29    alpha: Option<f32>,
30}
31
32impl IconButton {
33    pub fn new(id: impl Into<ElementId>, icon: IconName) -> Self {
34        let mut this = Self {
35            base: ButtonLike::new(id),
36            shape: IconButtonShape::Wide,
37            icon,
38            icon_size: IconSize::default(),
39            icon_color: Color::Default,
40            selected_icon: None,
41            selected_icon_color: None,
42            selected_style: None,
43            indicator: None,
44            indicator_border_color: None,
45            alpha: None,
46        };
47        this.base.base = this.base.base.debug_selector(|| format!("ICON-{:?}", icon));
48        this
49    }
50
51    pub fn shape(mut self, shape: IconButtonShape) -> Self {
52        self.shape = shape;
53        self
54    }
55
56    /// Sets the label announced by assistive technology.
57    ///
58    /// Icon buttons have no visible text, so they should always set this for
59    /// screen reader users. Often this matches the tooltip text.
60    pub fn aria_label(mut self, label: impl Into<SharedString>) -> Self {
61        self.base = self.base.aria_label(label);
62        self
63    }
64
65    /// Sets the expanded state reported to assistive technology, for buttons
66    /// that control a popup (e.g. dropdown or disclosure triggers).
67    pub fn aria_expanded(mut self, expanded: bool) -> Self {
68        self.base = self.base.aria_expanded(expanded);
69        self
70    }
71
72    /// Registers a handler for an accessibility action (e.g.
73    /// [`gpui::accesskit::Action::Expand`]) dispatched by assistive technology.
74    pub fn on_a11y_action(
75        mut self,
76        action: gpui::accesskit::Action,
77        listener: impl FnMut(Option<&gpui::accesskit::ActionData>, &mut Window, &mut App) + 'static,
78    ) -> Self {
79        self.base = self.base.on_a11y_action(action, listener);
80        self
81    }
82
83    pub fn icon_size(mut self, icon_size: IconSize) -> Self {
84        self.icon_size = icon_size;
85        self
86    }
87
88    pub fn icon_color(mut self, icon_color: Color) -> Self {
89        self.icon_color = icon_color;
90        self
91    }
92
93    pub fn alpha(mut self, alpha: f32) -> Self {
94        self.alpha = Some(alpha);
95        self
96    }
97
98    pub fn selected_icon(mut self, icon: impl Into<Option<IconName>>) -> Self {
99        self.selected_icon = icon.into();
100        self
101    }
102
103    pub fn on_right_click(
104        mut self,
105        handler: impl Fn(&gpui::ClickEvent, &mut Window, &mut App) + 'static,
106    ) -> Self {
107        self.base = self.base.on_right_click(handler);
108        self
109    }
110
111    /// Sets the icon color used when the button is in a selected state.
112    pub fn selected_icon_color(mut self, color: impl Into<Option<Color>>) -> Self {
113        self.selected_icon_color = color.into();
114        self
115    }
116
117    pub fn indicator(mut self, indicator: Indicator) -> Self {
118        self.indicator = Some(indicator);
119        self
120    }
121
122    pub fn indicator_border_color(mut self, color: Option<Hsla>) -> Self {
123        self.indicator_border_color = color;
124
125        self
126    }
127
128    /// Use the given callback to construct a new tooltip view when the mouse hovers over this
129    /// button. The tooltip itself is also hoverable and won't disappear when the user moves the
130    /// mouse into the tooltip, allowing it to contain interactive elements like links or buttons.
131    pub fn hoverable_tooltip(
132        mut self,
133        tooltip: impl Fn(&mut Window, &mut App) -> AnyView + 'static,
134    ) -> Self {
135        self.base = self.base.hoverable_tooltip(tooltip);
136        self
137    }
138}
139
140impl Disableable for IconButton {
141    fn disabled(mut self, disabled: bool) -> Self {
142        self.base = self.base.disabled(disabled);
143        self
144    }
145}
146
147impl Toggleable for IconButton {
148    fn toggle_state(mut self, selected: bool) -> Self {
149        self.base = self.base.toggle_state(selected);
150        self
151    }
152}
153
154impl SelectableButton for IconButton {
155    fn selected_style(mut self, style: ButtonStyle) -> Self {
156        self.selected_style = Some(style);
157        self.base = self.base.selected_style(style);
158        self
159    }
160}
161
162impl Clickable for IconButton {
163    fn on_click(
164        mut self,
165        handler: impl Fn(&gpui::ClickEvent, &mut Window, &mut App) + 'static,
166    ) -> Self {
167        self.base = self.base.on_click(handler);
168        self
169    }
170
171    fn cursor_style(mut self, cursor_style: gpui::CursorStyle) -> Self {
172        self.base = self.base.cursor_style(cursor_style);
173        self
174    }
175}
176
177impl FixedWidth for IconButton {
178    fn width(mut self, width: impl Into<DefiniteLength>) -> Self {
179        self.base = self.base.width(width);
180        self
181    }
182
183    fn full_width(mut self) -> Self {
184        self.base = self.base.full_width();
185        self
186    }
187}
188
189impl ButtonCommon for IconButton {
190    fn id(&self) -> &ElementId {
191        self.base.id()
192    }
193
194    fn style(mut self, style: ButtonStyle) -> Self {
195        self.base = self.base.style(style);
196        self
197    }
198
199    fn size(mut self, size: ButtonSize) -> Self {
200        self.base = self.base.size(size);
201        self
202    }
203
204    fn tooltip(mut self, tooltip: impl Fn(&mut Window, &mut App) -> AnyView + 'static) -> Self {
205        self.base = self.base.tooltip(tooltip);
206        self
207    }
208
209    fn tab_index(mut self, tab_index: impl Into<isize>) -> Self {
210        self.base = self.base.tab_index(tab_index);
211        self
212    }
213
214    fn layer(mut self, elevation: ElevationIndex) -> Self {
215        self.base = self.base.layer(elevation);
216        self
217    }
218
219    fn track_focus(mut self, focus_handle: &gpui::FocusHandle) -> Self {
220        self.base = self.base.track_focus(focus_handle);
221        self
222    }
223}
224
225impl VisibleOnHover for IconButton {
226    fn visible_on_hover(mut self, group_name: impl Into<SharedString>) -> Self {
227        self.base = self.base.visible_on_hover(group_name);
228        self
229    }
230}
231
232impl RenderOnce for IconButton {
233    #[allow(refining_impl_trait)]
234    fn render(self, window: &mut Window, cx: &mut App) -> ButtonLike {
235        let is_disabled = self.base.disabled;
236        let is_selected = self.base.selected;
237
238        let icon = self
239            .selected_icon
240            .filter(|_| is_selected)
241            .unwrap_or(self.icon);
242
243        let icon_color = if is_disabled {
244            Color::Disabled
245        } else if self.selected_style.is_some() && is_selected {
246            self.selected_style.unwrap().into()
247        } else if is_selected {
248            self.selected_icon_color.unwrap_or(Color::Selected)
249        } else {
250            let base_color = self.icon_color.color(cx);
251            Color::Custom(base_color.opacity(self.alpha.unwrap_or(1.0)))
252        };
253
254        let icon_element = Icon::new(icon).size(self.icon_size).color(icon_color);
255
256        self.base
257            .map(|this| match self.shape {
258                IconButtonShape::Square => {
259                    let size = self.icon_size.square(window, cx);
260                    this.width(size).height(size.into())
261                }
262                IconButtonShape::Wide => this,
263            })
264            .child(match self.indicator {
265                Some(indicator) => IconWithIndicator::new(icon_element, Some(indicator))
266                    .indicator_border_color(self.indicator_border_color)
267                    .into_any_element(),
268                None => icon_element.into_any_element(),
269            })
270    }
271}
272
273impl Component for IconButton {
274    fn scope() -> ComponentScope {
275        ComponentScope::Input
276    }
277
278    fn sort_name() -> &'static str {
279        "ButtonB"
280    }
281
282    fn description() -> &'static str {
283        "A compact button that displays a single icon with an optional tooltip.\
284        The most frequently used button in the Omega codebase."
285    }
286
287    fn preview(_window: &mut Window, _cx: &mut App) -> AnyElement {
288        v_flex()
289            .gap_6()
290            .children(vec![
291                example_group_with_title(
292                    "Icon Button Styles",
293                    vec![
294                        single_example(
295                            "Default",
296                            IconButton::new("default", IconName::Check)
297                                .layer(ElevationIndex::Background)
298                                .into_any_element(),
299                        ),
300                        single_example(
301                            "Filled",
302                            IconButton::new("filled", IconName::Check)
303                                .layer(ElevationIndex::Background)
304                                .style(ButtonStyle::Filled)
305                                .into_any_element(),
306                        ),
307                        single_example(
308                            "Subtle",
309                            IconButton::new("subtle", IconName::Check)
310                                .layer(ElevationIndex::Background)
311                                .style(ButtonStyle::Subtle)
312                                .into_any_element(),
313                        ),
314                        single_example(
315                            "Tinted",
316                            IconButton::new("tinted", IconName::Check)
317                                .layer(ElevationIndex::Background)
318                                .style(ButtonStyle::Tinted(TintColor::Accent))
319                                .into_any_element(),
320                        ),
321                        single_example(
322                            "Transparent",
323                            IconButton::new("transparent", IconName::Check)
324                                .layer(ElevationIndex::Background)
325                                .style(ButtonStyle::Transparent)
326                                .into_any_element(),
327                        ),
328                    ],
329                ),
330                example_group_with_title(
331                    "Icon Button Shapes",
332                    vec![
333                        single_example(
334                            "Square",
335                            IconButton::new("square", IconName::Check)
336                                .shape(IconButtonShape::Square)
337                                .style(ButtonStyle::Filled)
338                                .layer(ElevationIndex::Background)
339                                .into_any_element(),
340                        ),
341                        single_example(
342                            "Wide",
343                            IconButton::new("wide", IconName::Check)
344                                .shape(IconButtonShape::Wide)
345                                .style(ButtonStyle::Filled)
346                                .layer(ElevationIndex::Background)
347                                .into_any_element(),
348                        ),
349                    ],
350                ),
351                example_group_with_title(
352                    "Icon Button Sizes",
353                    vec![
354                        single_example(
355                            "XSmall",
356                            IconButton::new("xsmall", IconName::Check)
357                                .icon_size(IconSize::XSmall)
358                                .style(ButtonStyle::Filled)
359                                .layer(ElevationIndex::Background)
360                                .into_any_element(),
361                        ),
362                        single_example(
363                            "Small",
364                            IconButton::new("small", IconName::Check)
365                                .icon_size(IconSize::Small)
366                                .style(ButtonStyle::Filled)
367                                .layer(ElevationIndex::Background)
368                                .into_any_element(),
369                        ),
370                        single_example(
371                            "Medium",
372                            IconButton::new("medium", IconName::Check)
373                                .icon_size(IconSize::Medium)
374                                .style(ButtonStyle::Filled)
375                                .layer(ElevationIndex::Background)
376                                .into_any_element(),
377                        ),
378                        single_example(
379                            "XLarge",
380                            IconButton::new("xlarge", IconName::Check)
381                                .icon_size(IconSize::XLarge)
382                                .style(ButtonStyle::Filled)
383                                .layer(ElevationIndex::Background)
384                                .into_any_element(),
385                        ),
386                    ],
387                ),
388                example_group_with_title(
389                    "Special States",
390                    vec![
391                        single_example(
392                            "Disabled",
393                            IconButton::new("disabled", IconName::Check)
394                                .disabled(true)
395                                .style(ButtonStyle::Filled)
396                                .layer(ElevationIndex::Background)
397                                .into_any_element(),
398                        ),
399                        single_example(
400                            "Selected",
401                            IconButton::new("selected", IconName::Check)
402                                .toggle_state(true)
403                                .style(ButtonStyle::Filled)
404                                .layer(ElevationIndex::Background)
405                                .into_any_element(),
406                        ),
407                        single_example(
408                            "With Indicator",
409                            IconButton::new("indicator", IconName::Check)
410                                .indicator(Indicator::dot().color(Color::Success))
411                                .style(ButtonStyle::Filled)
412                                .layer(ElevationIndex::Background)
413                                .into_any_element(),
414                        ),
415                        single_example(
416                            "With Tooltip",
417                            IconButton::new("tooltip", IconName::Check)
418                                .style(ButtonStyle::Filled)
419                                .layer(ElevationIndex::Background)
420                                .tooltip(Tooltip::text("As mentioned - with a tooltip"))
421                                .into_any_element(),
422                        ),
423                    ],
424                ),
425                example_group_with_title(
426                    "Custom Colors",
427                    vec![
428                        single_example(
429                            "Custom Icon Color",
430                            IconButton::new("custom_color", IconName::Check)
431                                .icon_color(Color::Accent)
432                                .style(ButtonStyle::Filled)
433                                .layer(ElevationIndex::Background)
434                                .into_any_element(),
435                        ),
436                        single_example(
437                            "With Alpha",
438                            IconButton::new("alpha", IconName::Check)
439                                .alpha(0.5)
440                                .style(ButtonStyle::Filled)
441                                .layer(ElevationIndex::Background)
442                                .into_any_element(),
443                        ),
444                    ],
445                ),
446            ])
447            .into_any_element()
448    }
449}
450