rspace-online/backlog/tasks/task-70 - Default-selector-...

2.0 KiB

id title status assignee created_date updated_date labels dependencies references priority
TASK-70 Default selector tool with marquee multi-select Done
2026-02-28 00:36 2026-02-28 00:36
canvas
UX
selection
lib/folk-shape.ts
website/canvas.html
high

Description

Replace single-click-to-pan with selector as the default canvas tool. Left-click-drag on background draws a blue marquee rectangle to select multiple shapes. Shift/Ctrl+click toggles additive selection. Panning moves to Space+drag, middle-click, or wheel/trackpad. Delete/Backspace removes all selected shapes. folk-shape highlighted state shows blue selection outline.

Acceptance Criteria

  • #1 Click canvas background → nothing selected, no pan
  • #2 Click-drag on background → blue marquee rectangle appears
  • #3 Release marquee → all overlapping shapes highlighted with blue outline
  • #4 Shift+click a shape → adds/removes from selection
  • #5 Click a single shape → only that shape selected
  • #6 Hold Space + drag → pans the canvas (cursor shows grab)
  • #7 Middle-click + drag → pans the canvas
  • #8 Two-finger scroll → still pans (unchanged)
  • #9 Ctrl+scroll → still zooms (unchanged)
  • #10 Delete/Backspace → removes all selected shapes
  • #11 Click toolbar tool → crosshair cursor → click to place (unchanged)
  • #12 bunx tsc --noEmit passes

Final Summary

Implemented default selector tool with marquee multi-select. Changed folk-shape.ts highlighted CSS to show blue outline. Rewrote canvas.html pointer handlers: left-click-drag draws marquee selection rectangle, Space+drag and middle-click for panning, Shift/Ctrl+click for additive selection, Delete/Backspace to remove selected shapes. Commit 1d8fc2b on dev, merged to main.