StateNode • tldraw Docs

Table of contents

_currentToolIdMask
_path
children
editor
id
initial
isLockable
parent
performanceTracker
shapeType
type
useCoalescedEvents
Properties
Methods
- addChild
- enter
- exit
- getCurrent
- getCurrentToolIdMask
- getIsActive
- getPath
- handleEvent
- onCancel
- onComplete
- onDoubleClick
- onEnter
- onExit
- onInterrupt
- onKeyDown
- onKeyRepeat
- onKeyUp
- onLongPress
- onMiddleClick
- onPointerDown
- onPointerMove
- onPointerUp
- onQuadrupleClick
- onRightClick
- onTick
- onTripleClick
- onWheel
- setCurrentToolIdMask
- transition

abstract class StateNode implements Partial<TLEventHandlers> {}

Constructor

Constructs a new instance of the StateNode class

Parameters

Name	Description
`editor`	`Editor`
`parent`	`StateNode`

Properties

children

optional

children?: Record<string, StateNode>

editor

editor: Editor

id

id: string

initial

optional

initial?: string

isLockable

isLockable: boolean

parent

parent: StateNode

performanceTracker

performanceTracker: PerformanceTracker

shapeType

optional

shapeType?: string

type

type: 'branch' | 'leaf' | 'root'

useCoalescedEvents

useCoalescedEvents: boolean

Methods

addChild( )

Add a child node to this state node.

addChild(childConstructor: TLStateNodeConstructor): this

Parameters

Name	Description
`childConstructor`	`TLStateNodeConstructor`

Returns

this

enter( )

enter(info: any, from: string): void

Parameters

Name	Description
`info`	`any`
`from`	`string`

Returns

void

exit( )

exit(info: any, to: string): void

Parameters

Name	Description
`info`	`any`
`to`	`string`

Returns

void

getCurrent( )

This node's current active child node, if any.

getCurrent(): StateNode | undefined

getCurrentToolIdMask( )

getCurrentToolIdMask(): string | undefined

getIsActive( )

Whether this node is active.

getIsActive(): boolean

getPath( )

This node's path of active state nodes

getPath(): string

handleEvent( )

handleEvent(info: Exclude<TLEventInfo, TLPinchEventInfo>): void

Parameters

Name	Description
`info`	`Exclude<TLEventInfo, TLPinchEventInfo>`

Returns

void

onCancel( )

optional

onCancel?(info: TLCancelEventInfo): void

Parameters

Name	Description
`info`	`TLCancelEventInfo`

Returns

void

onComplete( )

optional

onComplete?(info: TLCompleteEventInfo): void

Parameters

Name	Description
`info`	`TLCompleteEventInfo`

Returns

void

onDoubleClick( )

optional

onDoubleClick?(info: TLClickEventInfo): void

Parameters

Name	Description
`info`	`TLClickEventInfo`

Returns

void

onEnter( )

optional

onEnter?(info: any, from: string): void

Parameters

Name	Description
`info`	`any`
`from`	`string`

Returns

void

onExit( )

optional

onExit?(info: any, to: string): void

Parameters

Name	Description
`info`	`any`
`to`	`string`

Returns

void

onInterrupt( )

optional

onInterrupt?(info: TLInterruptEventInfo): void

Parameters

Name	Description
`info`	`TLInterruptEventInfo`

Returns

void

onKeyDown( )

optional

onKeyDown?(info: TLKeyboardEventInfo): void

Parameters

Name	Description
`info`	`TLKeyboardEventInfo`

Returns

void

onKeyRepeat( )

optional

onKeyRepeat?(info: TLKeyboardEventInfo): void

Parameters

Name	Description
`info`	`TLKeyboardEventInfo`

Returns

void

onKeyUp( )

optional

onKeyUp?(info: TLKeyboardEventInfo): void

Parameters

Name	Description
`info`	`TLKeyboardEventInfo`

Returns

void

onLongPress( )

optional

onLongPress?(info: TLPointerEventInfo): void

Parameters

Name	Description
`info`	`TLPointerEventInfo`

Returns

void

onMiddleClick( )

optional

onMiddleClick?(info: TLPointerEventInfo): void

Parameters

Name	Description
`info`	`TLPointerEventInfo`

Returns

void

onPointerDown( )

optional

onPointerDown?(info: TLPointerEventInfo): void

Parameters

Name	Description
`info`	`TLPointerEventInfo`

Returns

void

onPointerMove( )

optional

onPointerMove?(info: TLPointerEventInfo): void

Parameters

Name	Description
`info`	`TLPointerEventInfo`

Returns

void

onPointerUp( )

optional

onPointerUp?(info: TLPointerEventInfo): void

Parameters

Name	Description
`info`	`TLPointerEventInfo`

Returns

void

onQuadrupleClick( )

optional

onQuadrupleClick?(info: TLClickEventInfo): void

Parameters

Name	Description
`info`	`TLClickEventInfo`

Returns

void

onRightClick( )

optional

onRightClick?(info: TLPointerEventInfo): void

Parameters

Name	Description
`info`	`TLPointerEventInfo`

Returns

void

onTick( )

optional

onTick?(info: TLTickEventInfo): void

Parameters

Name	Description
`info`	`TLTickEventInfo`

Returns

void

onTripleClick( )

optional

onTripleClick?(info: TLClickEventInfo): void

Parameters

Name	Description
`info`	`TLClickEventInfo`

Returns

void

onWheel( )

optional

onWheel?(info: TLWheelEventInfo): void

Parameters

Name	Description
`info`	`TLWheelEventInfo`

Returns

void

setCurrentToolIdMask( )

setCurrentToolIdMask(id: string | undefined): void

Parameters

Name	Description
`id`	`string \| undefined`

Returns

void

transition( )

Transition to a new active child state node.

transition(id: string, info?: any): this

Example

parentState.transition('childStateA')
parentState.transition('childStateB', { myData: 4 })

Parameters

Name	Description
`id`	`string` The id of the child state node to transition to.
`info`	`any` Any data to pass to the `onEnter` and `onExit` handlers.

Returns

this