Implement edge scrolling during drag operations

[Copilot]

This PR implements automatic canvas scrolling when dragging nodes or edges near the viewport edges, providing a smooth user experience for working with large diagrams.

What Changed

When a user drags selected nodes or edges and approaches within 50px of any canvas edge, the viewport automatically scrolls in that direction at 2px per frame. This allows users to seamlessly continue dragging elements beyond the current visible area without manually panning the canvas.

Implementation Details

• Edge Detection: Detects when pointer is within 50px threshold of canvas boundaries during drag operations
• Smooth Scrolling: Applies consistent 2px scroll speed that scales appropriately with zoom level
• Conditional Activation: Only triggers during active node/edge drag operations (mode === 'free' && active)
• Zoom Awareness: Scroll distance scales with zoom using (scrollSpeed * svgViewBoxZoom) / 100 formula
• Dual Mode Support: Works in both snap-lines enabled and legacy drag modes

User Experience

The feature provides intuitive edge scrolling similar to other design applications:

1. Start dragging any selected node or edge
2. Move cursor near any canvas edge (top, bottom, left, right)
3. Canvas automatically scrolls to reveal more workspace
4. Continue dragging seamlessly across the expanded viewport
5. Scrolling stops when cursor moves away from edges

The demo shows the 50px edge zones (red dashed borders) and real-time scroll values, demonstrating precise edge detection and smooth scrolling behavior.

Technical Implementation

Modified src/components/svg-canvas-graph.tsx:

• Added import for setSvgViewBoxMin Redux action
• Implemented edge detection logic in handlePointerMove function
• Added scrolling support for both snap-lines and legacy drag modes
• Maintains compatibility with existing drag, snap, and zoom functionality

The implementation follows existing patterns in the codebase and integrates seamlessly with the current SVG coordinate system and Redux state management.

Fixes #487.

[!WARNING]

Firewall rules blocked me from connecting to one or more addresses (expand for details)

I tried to connect to the following addresses, but was blocked by firewall rules:

• registry.npmmirror.com
  • Triggering command: npm install (dns block)
  • Triggering command: npm ci (dns block)
  • Triggering command: npm install @types/history (dns block)

If you need me to access, download, or install something from one of these locations, you can either:

• Configure Actions setup steps to set up my environment, which run before the firewall is enabled
• Add the appropriate URLs or hosts to the custom allowlist in this repository's Copilot coding agent settings (admins only)

---

✨ Let Copilot coding agent set things up for you — coding agent works faster and does higher quality work when set up for your repo.