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.

The DocumentStore manages the collection of shapes and their ordering on the canvas. 
import { DocumentStore } from '@tsdraw/core'

​
Methods

MethodReturnsDescription
createShape(shape)voidAdd a shape to the store
updateShape(id, partial)voidUpdate shape properties
deleteShape(id)voidRemove a shape
getShape(id)Shape | undefinedGet a shape by ID
getCurrentPageShapes()Shape[]All shapes in insertion order
getCurrentPageShapesSorted()Shape[]Shapes sorted by z-index
getCurrentPageRenderingShapesSorted()Shape[]Shapes filtered and sorted for rendering
getShapeIdsInBounds(bounds)ShapeId[]Find shapes that overlap with a bounding rectangle

​
Listeners

The store notifies listeners when shapes change: 
const unsubscribe = store.addListener(() => {
  console.log('Shapes changed:', store.getCurrentPageShapes().length)
})

// later
unsubscribe()

​
Snapshot types

interface TsdrawDocumentSnapshot {
  records: TsdrawPersistedRecord[]
}

interface TsdrawPersistedRecord {
  typeName: 'page' | 'shape'
  // ... record data
}

​
Conversion utilities

import { documentSnapshotToRecords, recordsToDocumentSnapshot } from '@tsdraw/core'

const records = documentSnapshotToRecords(snapshot)
const snapshot = recordsToDocumentSnapshot(records)