From 4f066b7c004132670e79c19929b1b0b333e76e13 Mon Sep 17 00:00:00 2001
From: reya <123083837+reyamir@users.noreply.github.com>
Date: Tue, 13 May 2025 13:26:02 +0700
Subject: [PATCH] feat: Improve Blink Cursor (#34)

* add cursor color to theme

* adjust
---
 crates/theme/src/lib.rs             | 10 +++++++---
 crates/ui/src/input/blink_cursor.rs |  3 +++
 crates/ui/src/input/element.rs      |  7 ++++---
 3 files changed, 14 insertions(+), 6 deletions(-)

diff --git a/crates/theme/src/lib.rs b/crates/theme/src/lib.rs
index 9454658..228ca11 100644
--- a/crates/theme/src/lib.rs
+++ b/crates/theme/src/lib.rs
@@ -1,7 +1,7 @@
 use std::ops::{Deref, DerefMut};
 
 use colors::{brand, hsl, neutral};
-use gpui::{black, px, white, App, Global, Hsla, Pixels, SharedString, Window, WindowAppearance};
+use gpui::{px, App, Global, Hsla, Pixels, SharedString, Window, WindowAppearance};
 
 mod colors;
 mod scale;
@@ -126,6 +126,8 @@ pub struct ThemeColor {
     pub title_bar_border: Hsla,
     /// Background color. Used for modal's overlay.
     pub overlay: Hsla,
+    /// Background color. Used for cursor.
+    pub cursor: Hsla,
     /// Window border color.
     ///
     /// # Platform specific:
@@ -176,7 +178,7 @@ impl ThemeColor {
             scrollbar_thumb_border: gpui::transparent_black(),
             scrollbar_track_background: gpui::transparent_black(),
             scrollbar_track_border: neutral().light().step_5(),
-            panel_background: white(),
+            panel_background: gpui::white(),
             ring: brand().light().step_8(),
             tab_active_background: neutral().light().step_5(),
             tab_hover_background: neutral().light().step_4(),
@@ -184,6 +186,7 @@ impl ThemeColor {
             title_bar: gpui::transparent_black(),
             title_bar_border: gpui::transparent_black(),
             overlay: neutral().light_alpha().step_3(),
+            cursor: hsl(200., 100., 50.),
             window_border: hsl(240.0, 5.9, 78.0),
         }
     }
@@ -226,7 +229,7 @@ impl ThemeColor {
             scrollbar_thumb_border: gpui::transparent_black(),
             scrollbar_track_background: gpui::transparent_black(),
             scrollbar_track_border: neutral().dark().step_5(),
-            panel_background: black(),
+            panel_background: gpui::black(),
             ring: brand().dark().step_8(),
             tab_active_background: neutral().dark().step_5(),
             tab_hover_background: neutral().dark().step_4(),
@@ -234,6 +237,7 @@ impl ThemeColor {
             title_bar: gpui::transparent_black(),
             title_bar_border: gpui::transparent_black(),
             overlay: neutral().dark_alpha().step_3(),
+            cursor: hsl(200., 100., 50.),
             window_border: hsl(240.0, 3.7, 28.0),
         }
     }
diff --git a/crates/ui/src/input/blink_cursor.rs b/crates/ui/src/input/blink_cursor.rs
index c574798..ac4fd43 100644
--- a/crates/ui/src/input/blink_cursor.rs
+++ b/crates/ui/src/input/blink_cursor.rs
@@ -50,8 +50,10 @@ impl BlinkCursor {
 
         // Schedule the next blink
         let epoch = self.next_epoch();
+
         cx.spawn(async move |this, cx| {
             Timer::after(INTERVAL).await;
+
             if let Some(this) = this.upgrade() {
                 this.update(cx, |this, cx| this.blink(epoch, cx)).ok();
             }
@@ -71,6 +73,7 @@ impl BlinkCursor {
 
         // delay 500ms to start the blinking
         let epoch = self.next_epoch();
+
         cx.spawn(async move |this, cx| {
             Timer::after(PAUSE_DELAY).await;
 
diff --git a/crates/ui/src/input/element.rs b/crates/ui/src/input/element.rs
index 4494427..d96f979 100644
--- a/crates/ui/src/input/element.rs
+++ b/crates/ui/src/input/element.rs
@@ -10,6 +10,7 @@ use super::TextInput;
 
 const RIGHT_MARGIN: Pixels = px(5.);
 const BOTTOM_MARGIN: Pixels = px(20.);
+const CURSOR_THICKNESS: Pixels = px(2.);
 
 pub(super) struct TextElement {
     input: Entity<TextInput>,
@@ -140,7 +141,7 @@ impl TextElement {
             if input.show_cursor(window, cx) {
                 // cursor blink
                 let cursor_height =
-                    window.text_style().font_size.to_pixels(window.rem_size()) + px(2.);
+                    window.text_style().font_size.to_pixels(window.rem_size()) + px(4.);
 
                 cursor = Some(fill(
                     Bounds::new(
@@ -148,9 +149,9 @@ impl TextElement {
                             bounds.left() + cursor_pos.x,
                             bounds.top() + cursor_pos.y + ((line_height - cursor_height) / 2.),
                         ),
-                        size(px(1.), cursor_height),
+                        size(CURSOR_THICKNESS, cursor_height),
                     ),
-                    cx.theme().element_active,
+                    cx.theme().cursor,
                 ))
             };
         }