@mocanvas/mocanvas · class
declare abstract class BaseBoxShapeTool extends StateNodeDrag out a box shape, or click to place a default-sized one.
The create-on-drag state chart, on its own, so a placement tool is a subclass rather than a copy of it:
``ts
class SectionTool extends BaseBoxShapeTool {
static override id = "section"
static override initial = "idle"
override shapeType = "section" as const
override onCreate(shape: UnknownShape | null): void { … }
}
``
A subclass that overrides BaseBoxShapeTool.onCreate takes over *everything* the base did afterwards, tool lock included — the default implementation is the whole of that behaviour, so an override is expected to finish the job itself.
Methods · 3
getCreateProps(): Record<string, unknown>Props to seed a newly created shape with, beyond w/h.
The hook for a shape whose identity is decided at placement time — a
frame's Frame 3, a section's colour. Runs once, before the shape exists.
getDefaultSize(): BoxSizeThe size a click (as opposed to a drag) places.
Defaults to the shape util's own getDefaultProps(), so the tool and a
programmatic createShape agree on what "a new one" means, and a util that
changes its default size does not have to tell the tool.
onCreate(_shape: UnknownShape | null): voidCalled once the shape is final: after the drag ends, or after a click has
placed a default-sized one. null means nothing was created.
The default returns to the select tool, unless tool lock is on. Override it to adopt enclosed shapes, open an editor, or anything else a placement should do — and repeat whichever of those two endings you want, because an override replaces this entirely.
Properties · 5
static children: () => StateNodeConstructor[]static id: stringstatic initial: stringminSize: numberSmallest box a drag may produce, in page units.
abstract shapeType: stringThe shape type this tool creates.
mocanvas is built by Symbio. Free for non-commercial, non-profit and development use; commercial use needs an agreement. Not affiliated with or endorsed by tldraw.