Skip to main content

Documentation Index

Fetch the complete documentation index at: https://docs.tsdraw.com/llms.txt

Use this file to discover all available pages before exploring further.

Tools define what happens during canvas events.

Built-in tools

Tool IDWhat it does
selectMove, resize, and rotate shapes
handPan the canvas
penFreehand drawing
eraserSwipe to delete shapes
squareRectangles
circleEllipses

Switching tools

editor.setCurrentTool('pen')

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 the customTools prop on <Tsdraw />.

Eraser

The eraser uses hit-testing with a configurable margin (ERASER_MARGIN). Shapes are deleted only when the stroke completes.

Selection

The select tool supports:
  • Click — pick top shape
  • Marquee — drag to select area
  • Transform — move, resize, rotate