From ebe93210af631c9f77435ad8667284806043b3a5 Mon Sep 17 00:00:00 2001 From: Jason Lee Date: Tue, 1 Apr 2025 17:59:27 +0800 Subject: [PATCH] Use normal cursor for buttons. (#760) This change to follow native UI to use normal cursor for all buttons, items. Only use `pointer` for link item. --- crates/story/src/tooltip_story.rs | 8 ++------ crates/ui/src/accordion.rs | 3 +-- crates/ui/src/button/button.rs | 2 +- crates/ui/src/button/toggle.rs | 1 - crates/ui/src/color_picker.rs | 32 +++++++++++++++---------------- crates/ui/src/dropdown.rs | 3 +-- crates/ui/src/list/list_item.rs | 9 ++++----- crates/ui/src/notification.rs | 9 ++++----- crates/ui/src/sidebar/footer.rs | 1 - crates/ui/src/sidebar/header.rs | 1 - crates/ui/src/sidebar/menu.rs | 1 - crates/ui/src/switch.rs | 2 +- crates/ui/src/tab/tab.rs | 2 +- crates/ui/src/table.rs | 1 - crates/ui/src/time/calendar.rs | 4 ++-- crates/ui/src/time/date_picker.rs | 1 - crates/ui/src/title_bar.rs | 1 - 17 files changed, 32 insertions(+), 49 deletions(-) diff --git a/crates/story/src/tooltip_story.rs b/crates/story/src/tooltip_story.rs index c2333ac9..2a2c8368 100644 --- a/crates/story/src/tooltip_story.rs +++ b/crates/story/src/tooltip_story.rs @@ -1,6 +1,6 @@ use gpui::{ - div, App, AppContext, Context, CursorStyle, Entity, Focusable, InteractiveElement, - ParentElement, Render, StatefulInteractiveElement, Styled, Window, + div, App, AppContext, Context, Entity, Focusable, InteractiveElement, ParentElement, Render, + StatefulInteractiveElement, Styled, Window, }; use gpui_component::{ @@ -58,7 +58,6 @@ impl Render for TooltipStory { .gap_5() .child( div() - .cursor(CursorStyle::PointingHand) .child( Button::new("button") .label("Hover me") @@ -70,21 +69,18 @@ impl Render for TooltipStory { .child( h_flex() .justify_center() - .cursor(CursorStyle::PointingHand) .child(Label::new("Hover me")) .id("tooltip-2") .tooltip(|window, cx| Tooltip::new("This is a Label", window, cx)), ) .child( div() - .cursor(CursorStyle::PointingHand) .child(Checkbox::new("check").label("Remember me").checked(true)) .id("tooltip-3") .tooltip(|window, cx| Tooltip::new("Checked!", window, cx)), ) .child( div() - .cursor(CursorStyle::PointingHand) .child( Button::new("button") .label("Hover me") diff --git a/crates/ui/src/accordion.rs b/crates/ui/src/accordion.rs index 4f477dd9..4d94fa70 100644 --- a/crates/ui/src/accordion.rs +++ b/crates/ui/src/accordion.rs @@ -261,8 +261,7 @@ impl RenderOnce for AccordionItem { .child(self.title), ) .when(!self.disabled, |this| { - this.cursor_pointer() - .hover(|this| this.bg(cx.theme().accordion_hover)) + this.hover(|this| this.bg(cx.theme().accordion_hover)) .child( Icon::new(if self.open { IconName::ChevronUp diff --git a/crates/ui/src/button/button.rs b/crates/ui/src/button/button.rs index b5fda197..4729d8c9 100644 --- a/crates/ui/src/button/button.rs +++ b/crates/ui/src/button/button.rs @@ -358,7 +358,7 @@ impl RenderOnce for Button { .flex() .items_center() .justify_center() - .cursor_pointer() + .when(self.variant.is_link(), |this| this.cursor_pointer()) .overflow_hidden() .when(cx.theme().shadow && normal_style.shadow, |this| { this.shadow_sm() diff --git a/crates/ui/src/button/toggle.rs b/crates/ui/src/button/toggle.rs index 87808ed4..c919c8b3 100644 --- a/crates/ui/src/button/toggle.rs +++ b/crates/ui/src/button/toggle.rs @@ -115,7 +115,6 @@ impl RenderOnce for Toggle { .flex_row() .items_center() .justify_center() - .cursor_pointer() .map(|this| match self.size { Size::XSmall => this.min_w_5().h_5().px_0p5().text_xs(), Size::Small => this.min_w_6().h_6().px_1().text_sm(), diff --git a/crates/ui/src/color_picker.rs b/crates/ui/src/color_picker.rs index f3fa4c4c..9ac68371 100644 --- a/crates/ui/src/color_picker.rs +++ b/crates/ui/src/color_picker.rs @@ -218,22 +218,21 @@ impl ColorPicker { .border_1() .border_color(color.darken(0.1)) .when(clickable, |this| { - this.cursor_pointer() - .hover(|this| { - this.border_color(color.darken(0.3)) - .bg(color.lighten(0.1)) - .shadow_sm() - }) - .active(|this| this.border_color(color.darken(0.5)).bg(color.darken(0.2))) - .on_mouse_move(cx.listener(move |view, _, _, cx| { - view.hovered_color = Some(color); - cx.notify(); - })) - .on_click(cx.listener(move |view, _, window, cx| { - view.update_value(Some(color), true, window, cx); - view.open = false; - cx.notify(); - })) + this.hover(|this| { + this.border_color(color.darken(0.3)) + .bg(color.lighten(0.1)) + .shadow_sm() + }) + .active(|this| this.border_color(color.darken(0.5)).bg(color.darken(0.2))) + .on_mouse_move(cx.listener(move |view, _, _, cx| { + view.hovered_color = Some(color); + cx.notify(); + })) + .on_click(cx.listener(move |view, _, window, cx| { + view.update_value(Some(color), true, window, cx); + view.open = false; + cx.notify(); + })) }) } @@ -321,7 +320,6 @@ impl Render for ColorPicker { .child( h_flex() .id("color-picker-input") - .cursor_pointer() .gap_2() .items_center() .input_text_size(self.size) diff --git a/crates/ui/src/dropdown.rs b/crates/ui/src/dropdown.rs index 25fd99fd..229ea1fa 100644 --- a/crates/ui/src/dropdown.rs +++ b/crates/ui/src/dropdown.rs @@ -153,7 +153,6 @@ where if let Some(item) = self.delegate.get(ix) { let list_item = ListItem::new(("list-item", ix)) .check_icon(IconName::Check) - .cursor_pointer() .selected(selected) .input_text_size(size) .list_size(size) @@ -649,7 +648,7 @@ where if self.disabled { this.cursor_not_allowed() } else { - this.cursor_pointer() + this } }) .overflow_hidden() diff --git a/crates/ui/src/list/list_item.rs b/crates/ui/src/list/list_item.rs index dda6d95e..66b10d17 100644 --- a/crates/ui/src/list/list_item.rs +++ b/crates/ui/src/list/list_item.rs @@ -130,11 +130,10 @@ impl RenderOnce for ListItem { .justify_between() .when(!self.disabled, |this| { this.when_some(self.on_click, |this, on_click| { - this.cursor_pointer() - .on_mouse_down(MouseButton::Left, move |_, _, cx| { - cx.stop_propagation(); - }) - .on_click(on_click) + this.on_mouse_down(MouseButton::Left, move |_, _, cx| { + cx.stop_propagation(); + }) + .on_click(on_click) }) .when_some(self.on_mouse_enter, |this, on_mouse_enter| { this.on_mouse_move(move |ev, window, cx| (on_mouse_enter)(ev, window, cx)) diff --git a/crates/ui/src/notification.rs b/crates/ui/src/notification.rs index d138a6d8..52c9bd62 100644 --- a/crates/ui/src/notification.rs +++ b/crates/ui/src/notification.rs @@ -247,11 +247,10 @@ impl Render for Notification { .child(div().text_sm().child(self.message.clone())), ) .when_some(self.on_click.clone(), |this, on_click| { - this.cursor_pointer() - .on_click(cx.listener(move |view, event, window, cx| { - view.dismiss(event, window, cx); - on_click(event, window, cx); - })) + this.on_click(cx.listener(move |view, event, window, cx| { + view.dismiss(event, window, cx); + on_click(event, window, cx); + })) }) .when(!self.autohide, |this| { this.child( diff --git a/crates/ui/src/sidebar/footer.rs b/crates/ui/src/sidebar/footer.rs index c2a6ddb5..6698e9be 100644 --- a/crates/ui/src/sidebar/footer.rs +++ b/crates/ui/src/sidebar/footer.rs @@ -62,7 +62,6 @@ impl RenderOnce for SidebarFooter { .p_2() .w_full() .justify_between() - .cursor_pointer() .rounded(cx.theme().radius) .hover(|this| { this.bg(cx.theme().sidebar_accent) diff --git a/crates/ui/src/sidebar/header.rs b/crates/ui/src/sidebar/header.rs index 9486cc65..e82154c6 100644 --- a/crates/ui/src/sidebar/header.rs +++ b/crates/ui/src/sidebar/header.rs @@ -62,7 +62,6 @@ impl RenderOnce for SidebarHeader { .p_2() .w_full() .justify_between() - .cursor_pointer() .rounded(cx.theme().radius) .hover(|this| { this.bg(cx.theme().sidebar_accent) diff --git a/crates/ui/src/sidebar/menu.rs b/crates/ui/src/sidebar/menu.rs index 5fea29a7..50d5a62d 100644 --- a/crates/ui/src/sidebar/menu.rs +++ b/crates/ui/src/sidebar/menu.rs @@ -146,7 +146,6 @@ impl SidebarMenuItem { .items_center() .rounded(cx.theme().radius) .text_sm() - .cursor_pointer() .hover(|this| { this.bg(cx.theme().sidebar_accent) .text_color(cx.theme().sidebar_accent_foreground) diff --git a/crates/ui/src/switch.rs b/crates/ui/src/switch.rs index 72b5c32c..e8a5792c 100644 --- a/crates/ui/src/switch.rs +++ b/crates/ui/src/switch.rs @@ -157,7 +157,7 @@ impl Element for Switch { .border(inset) .border_color(cx.theme().transparent) .bg(bg) - .when(!self.disabled, |this| this.cursor_pointer()) + .when(self.disabled, |this| this.cursor_not_allowed()) .child( // Switch Toggle div().rounded(radius).bg(toggle_bg).size(bar_width).map( diff --git a/crates/ui/src/tab/tab.rs b/crates/ui/src/tab/tab.rs index cd7c94a5..d70bf8c5 100644 --- a/crates/ui/src/tab/tab.rs +++ b/crates/ui/src/tab/tab.rs @@ -583,7 +583,7 @@ impl RenderOnce for Tab { .flex_wrap() .items_center() .flex_shrink_0() - .when(!self.disabled, |this| this.cursor_pointer()) + .when(self.disabled, |this| this.cursor_not_allowed()) .overflow_hidden() .h(height) .overflow_hidden() diff --git a/crates/ui/src/table.rs b/crates/ui/src/table.rs index a4969386..eb8f3d95 100644 --- a/crates/ui/src/table.rs +++ b/crates/ui/src/table.rs @@ -1017,7 +1017,6 @@ where Some( div() .id(("icon-sort", col_ix)) - .cursor_pointer() .p(px(2.)) .rounded(cx.theme().radius / 2.) .map(|this| match is_on { diff --git a/crates/ui/src/time/calendar.rs b/crates/ui/src/time/calendar.rs index 83920c57..806d1895 100644 --- a/crates/ui/src/time/calendar.rs +++ b/crates/ui/src/time/calendar.rs @@ -165,7 +165,7 @@ pub enum Matcher { DayOfWeek(Vec), /// Match the included days, except for those before and after the interval. /// - /// Matcher::Interval(IntervalMatcher { + /// Matcher::Interval(IntervalMatcher { /// before: Some(NaiveDate::from_ymd(2020, 1, 2)), /// after: Some(NaiveDate::from_ymd(2020, 1, 3)), /// }) @@ -477,7 +477,7 @@ impl Calendar { if disabled { this.cursor_not_allowed() } else { - this.cursor_pointer() + this } }) .when(muted, |this| { diff --git a/crates/ui/src/time/date_picker.rs b/crates/ui/src/time/date_picker.rs index 9835c087..95b25645 100644 --- a/crates/ui/src/time/date_picker.rs +++ b/crates/ui/src/time/date_picker.rs @@ -322,7 +322,6 @@ impl Render for DatePicker { .border_color(cx.theme().input) .rounded(cx.theme().radius) .when(cx.theme().shadow, |this| this.shadow_sm()) - .cursor_pointer() .overflow_hidden() .input_text_size(self.size) .when(is_focused, |this| this.focused_border(cx)) diff --git a/crates/ui/src/title_bar.rs b/crates/ui/src/title_bar.rs index f47457f5..576bba89 100644 --- a/crates/ui/src/title_bar.rs +++ b/crates/ui/src/title_bar.rs @@ -153,7 +153,6 @@ impl RenderOnce for ControlIcon { div() .id(self.id()) .flex() - .cursor_pointer() .w(TITLE_BAR_HEIGHT) .h_full() .justify_center()