Add grab/grabbing cursor for spacebar pan mode

- Show grab cursor (open hand) when spacebar is pressed
- Show grabbing cursor (closed hand) when actively panning with spacebar+drag
- Revert to grab cursor on mouse release if spacebar still held
- Clear cursor when spacebar is released
- Apply cursor to SVG element (outer) where mouse events occur
- Handle edge cases: window blur, canvas blur, spacebar release outside canvas

packages/node_modules/@node-red/editor-client/src/js/ui/view.js

@@ -632,8 +632,12 @@ RED.view = (function() {
 
                 if (e.type === "keydown" && !spacebarPressed) {
                     spacebarPressed = true;
+                    // Change cursor to grab hand when spacebar is pressed
+                    outer.style('cursor', 'grab');
                 } else if (e.type === "keyup" && spacebarPressed) {
                     spacebarPressed = false;
+                    // Revert cursor when spacebar is released
+                    outer.style('cursor', '');
                 }
             }
         }
@@ -642,6 +646,8 @@ RED.view = (function() {
         function handleWindowSpacebarUp(e) {
             if ((e.keyCode === 32 || e.key === ' ') && spacebarPressed) {
                 spacebarPressed = false;
+                // Revert cursor when spacebar is released outside canvas
+                outer.style('cursor', '');
                 e.preventDefault();
                 e.stopPropagation();
             }
@@ -656,6 +662,8 @@ RED.view = (function() {
         window.addEventListener("blur", function() {
             if (spacebarPressed) {
                 spacebarPressed = false;
+                // Revert cursor when window loses focus
+                outer.style('cursor', '');
             }
         })
         
@@ -1114,6 +1122,8 @@ RED.view = (function() {
             // Reset spacebar state when chart loses focus to prevent stuck state
             if (spacebarPressed) {
                 spacebarPressed = false;
+                // Revert cursor when chart loses focus
+                outer.style('cursor', '');
             }
         });
 
@@ -1582,6 +1592,8 @@ RED.view = (function() {
             mouse_mode = RED.state.PANNING;
             mouse_position = [d3.event.pageX,d3.event.pageY]
             scroll_position = [chart.scrollLeft(),chart.scrollTop()];
+            // Change cursor to grabbing while actively panning
+            outer.style('cursor', 'grabbing');
             return;
         }
 
@@ -2497,6 +2509,12 @@ RED.view = (function() {
         }
         if (mouse_mode === RED.state.PANNING) {
             resetMouseVars();
+            // Revert to grab cursor if spacebar still held, otherwise clear cursor
+            if (spacebarPressed) {
+                outer.style('cursor', 'grab');
+            } else {
+                outer.style('cursor', '');
+            }
             return
         }
         if (mouse_mode === RED.state.SELECTING_NODE) {