Built-in tools
| Tool ID | What it does |
|---|---|
select | Move, resize, and rotate shapes |
hand | Pan the canvas |
pen | Freehand drawing |
eraser | Swipe to delete shapes |
square | Rectangles |
circle | Ellipses |
Switching tools
State machines
Tools are state machines that respond to pointer and keyboard events. For example, the pen tool transitions between Idle and Drawing states. Add custom tools via thecustomTools prop on <Tsdraw />.
Eraser
The eraser uses hit-testing with a configurable margin (ERASER_MARGIN). Shapes are deleted only when the stroke completes.
Selection
Theselect tool supports:
- Click — pick top shape
- Marquee — drag to select area
- Transform — move, resize, rotate