From 321aae9b509e99b1083c831b3717f17a0a948180 Mon Sep 17 00:00:00 2001
From: Aaron Dodson <adodson@google.com>
Date: Wed, 6 Nov 2024 12:12:59 -0800
Subject: [PATCH] feat!: Use CSS to specify field cursors.

---
 core/css.ts            | 13 +++++++++++++
 core/field.ts          |  5 -----
 core/field_checkbox.ts |  5 -----
 core/field_dropdown.ts |  8 +++++---
 core/field_input.ts    |  7 ++++---
 5 files changed, 22 insertions(+), 16 deletions(-)

diff --git a/core/css.ts b/core/css.ts
index d18d930a943..cf226b3d206 100644
--- a/core/css.ts
+++ b/core/css.ts
@@ -478,4 +478,17 @@ input[type=number] {
   z-index: 80;
   pointer-events: none;
 }
+
+.blocklyField {
+  cursor: default;
+}
+
+.blocklyInputField {
+  cursor: text;
+}
+
+.blocklyDragging .blocklyField,
+.blocklyDragging .blocklyIconGroup {
+  cursor: grabbing;
+}
 `;
diff --git a/core/field.ts b/core/field.ts
index 2d50c04eb5a..fbaf1cf6252 100644
--- a/core/field.ts
+++ b/core/field.ts
@@ -193,9 +193,6 @@ export abstract class Field<T = any>
    */
   SERIALIZABLE = false;
 
-  /** Mouse cursor style when over the hotspot that initiates the editor. */
-  CURSOR = '';
-
   /**
    * @param value The initial value of the field.
    *     Also accepts Field.SKIP_SETUP if you wish to skip setup (only used by
@@ -536,11 +533,9 @@ export abstract class Field<T = any>
     if (this.enabled_ && block.isEditable()) {
       dom.addClass(group, 'blocklyEditableField');
       dom.removeClass(group, 'blocklyNonEditableField');
-      group.style.cursor = this.CURSOR;
     } else {
       dom.addClass(group, 'blocklyNonEditableField');
       dom.removeClass(group, 'blocklyEditableField');
-      group.style.cursor = '';
     }
   }
 
diff --git a/core/field_checkbox.ts b/core/field_checkbox.ts
index 0773a1f8251..eb68be2e88d 100644
--- a/core/field_checkbox.ts
+++ b/core/field_checkbox.ts
@@ -35,11 +35,6 @@ export class FieldCheckbox extends Field<CheckboxBool> {
    */
   override SERIALIZABLE = true;
 
-  /**
-   * Mouse cursor style when over the hotspot that initiates editability.
-   */
-  override CURSOR = 'default';
-
   /**
    * NOTE: The default value is set in `Field`, so maintain that value instead
    * of overwriting it here or in the constructor.
diff --git a/core/field_dropdown.ts b/core/field_dropdown.ts
index 5f26ac3b403..a5f7830f6ee 100644
--- a/core/field_dropdown.ts
+++ b/core/field_dropdown.ts
@@ -70,9 +70,6 @@ export class FieldDropdown extends Field<string> {
    */
   override SERIALIZABLE = true;
 
-  /** Mouse cursor style when over the hotspot that initiates the editor. */
-  override CURSOR = 'default';
-
   protected menuGenerator_?: MenuGenerator;
 
   /** A cache of the most recently generated options. */
@@ -204,6 +201,11 @@ export class FieldDropdown extends Field<string> {
     if (this.borderRect_) {
       dom.addClass(this.borderRect_, 'blocklyDropdownRect');
     }
+
+    if (this.fieldGroup_) {
+      dom.addClass(this.fieldGroup_, 'blocklyField');
+      dom.addClass(this.fieldGroup_, 'blocklyDropdownField');
+    }
   }
 
   /**
diff --git a/core/field_input.ts b/core/field_input.ts
index dcc2ac29ec4..5f845a6a2d5 100644
--- a/core/field_input.ts
+++ b/core/field_input.ts
@@ -99,9 +99,6 @@ export abstract class FieldInput<T extends InputTypes> extends Field<
    */
   override SERIALIZABLE = true;
 
-  /** Mouse cursor style when over the hotspot that initiates the editor. */
-  override CURSOR = 'text';
-
   /**
    * @param value The initial value of the field. Should cast to a string.
    *     Defaults to an empty string if null or undefined. Also accepts
@@ -148,6 +145,10 @@ export abstract class FieldInput<T extends InputTypes> extends Field<
     if (this.isFullBlockField()) {
       this.clickTarget_ = (this.sourceBlock_ as BlockSvg).getSvgRoot();
     }
+
+    if (this.fieldGroup_) {
+      dom.addClass(this.fieldGroup_, 'blocklyInputField');
+    }
   }
 
   protected override isFullBlockField(): boolean {