defaultShapeSchemas • tldraw Docs

Default shape schema configurations for all built-in tldraw shape types. Each shape type includes its validation props and migration sequences.

This object contains schema information for:

arrow: Directional lines that can bind to other shapes
bookmark: Website bookmark cards with preview information
draw: Freehand drawing paths created with drawing tools
embed: Embedded content from external services (YouTube, Figma, etc.)
frame: Container shapes for organizing content
geo: Geometric shapes (rectangles, ellipses, triangles, etc.)
group: Logical groupings of multiple shapes
highlight: Highlighting strokes from the highlighter tool
image: Raster image shapes referencing image assets
line: Multi-point lines and splines
note: Sticky note shapes with text content
text: Rich text shapes with formatting support
video: Video shapes referencing video assets

defaultShapeSchemas: {
  arrow: {
    migrations: MigrationSequence
    props: import('./recordsWithProps').RecordProps<
      import('./shapes/TLArrowShape').TLArrowShape
    >
  }
  bookmark: {
    migrations: TLPropsMigrations
    props: import('./recordsWithProps').RecordProps<
      import('./shapes/TLBookmarkShape').TLBookmarkShape
    >
  }
  draw: {
    migrations: TLPropsMigrations
    props: import('./recordsWithProps').RecordProps<
      import('./shapes/TLDrawShape').TLDrawShape
    >
  }
  embed: {
    migrations: TLPropsMigrations
    props: import('./recordsWithProps').RecordProps<
      import('./shapes/TLEmbedShape').TLEmbedShape
    >
  }
  frame: {
    migrations: TLPropsMigrations
    props: import('./recordsWithProps').RecordProps<
      import('./shapes/TLFrameShape').TLFrameShape
    >
  }
  geo: {
    migrations: TLPropsMigrations
    props: import('./recordsWithProps').RecordProps<
      import('./shapes/TLGeoShape').TLGeoShape
    >
  }
  group: {
    migrations: TLPropsMigrations
    props: import('./recordsWithProps').RecordProps<
      import('./shapes/TLGroupShape').TLGroupShape
    >
  }
  highlight: {
    migrations: TLPropsMigrations
    props: import('./recordsWithProps').RecordProps<
      import('./shapes/TLHighlightShape').TLHighlightShape
    >
  }
  image: {
    migrations: TLPropsMigrations
    props: import('./recordsWithProps').RecordProps<
      import('./shapes/TLImageShape').TLImageShape
    >
  }
  line: {
    migrations: TLPropsMigrations
    props: import('./recordsWithProps').RecordProps<
      import('./shapes/TLLineShape').TLLineShape
    >
  }
  note: {
    migrations: TLPropsMigrations
    props: import('./recordsWithProps').RecordProps<
      import('./shapes/TLNoteShape').TLNoteShape
    >
  }
  text: {
    migrations: TLPropsMigrations
    props: import('./recordsWithProps').RecordProps<
      import('./shapes/TLTextShape').TLTextShape
    >
  }
  video: {
    migrations: TLPropsMigrations
    props: import('./recordsWithProps').RecordProps<
      import('./shapes/TLVideoShape').TLVideoShape
    >
  }
}

Example

import { createTLSchema, defaultShapeSchemas } from '@tldraw/tlschema'

// Use all default shapes
const schema = createTLSchema({
  shapes: defaultShapeSchemas,
})

// Use only specific default shapes
const minimalSchema = createTLSchema({
  shapes: {
    geo: defaultShapeSchemas.geo,
    text: defaultShapeSchemas.text,
  },
})