TextShapeUtil

Public Class

Table of Contents
Signature
class TextShapeUtil extends ShapeUtil<TLTextShape> {}
References

ShapeUtil, TLTextShape


Properties

canEdit

Public Property

Signature
canEdit: () => boolean

isAspectRatioLocked

Public Property

Signature
isAspectRatioLocked: TLShapeUtilFlag<TLTextShape>
References

TLShapeUtilFlag, TLTextShape


onBeforeCreate

Public Property

Signature
onBeforeCreate: (shape: TLTextShape) =>
  | {
      x: number
      y: number
      type: 'text'
      rotation: number
      index: string
      parentId: import('@tldraw/tlschema').TLParentId
      isLocked: boolean
      props: import('@tldraw/tlschema').TLTextShapeProps
      id: import('@tldraw/tlschema').TLShapeId
      typeName: 'shape'
    }
  | undefined
References

TLTextShape, TLParentId, TLTextShapeProps, TLShapeId


onBeforeUpdate

Public Property

Signature
onBeforeUpdate: (
  prev: TLTextShape,
  next: TLTextShape
) =>
  | {
      x: number
      y: number
      props: {
        w: number
        color:
          | 'black'
          | 'blue'
          | 'green'
          | 'grey'
          | 'light-blue'
          | 'light-green'
          | 'light-red'
          | 'light-violet'
          | 'orange'
          | 'red'
          | 'violet'
          | 'yellow'
        size: 'l' | 'm' | 's' | 'xl'
        font: 'draw' | 'mono' | 'sans' | 'serif'
        align: 'end' | 'middle' | 'start'
        opacity: '0.1' | '0.25' | '0.5' | '0.75' | '1'
        text: string
        scale: number
        autoSize: boolean
      }
      type: 'text'
      rotation: number
      index: string
      parentId: import('@tldraw/tlschema').TLParentId
      isLocked: boolean
      id: import('@tldraw/tlschema').TLShapeId
      typeName: 'shape'
    }
  | undefined
References

TLTextShape, TLParentId, TLShapeId


onDoubleClickEdge

Public Property

Signature
onDoubleClickEdge: (shape: TLTextShape) =>
  | {
      id: import('@tldraw/tlschema').TLShapeId
      type: 'text'
      props: {
        autoSize: boolean
        scale?: undefined
      }
    }
  | {
      id: import('@tldraw/tlschema').TLShapeId
      type: 'text'
      props: {
        scale: number
        autoSize?: undefined
      }
    }
  | undefined
References

TLTextShape, TLShapeId


onEditEnd

Public Property

Signature
onEditEnd: TLOnEditEndHandler<TLTextShape>
References

TLOnEditEndHandler, TLTextShape


onResize

Public Property

Signature
onResize: TLOnResizeHandler<TLTextShape>
References

TLOnResizeHandler, TLTextShape


type

Public Static Property

Signature
static type: string

Methods

defaultProps()

Public Method

Parameters

None

Returns
TLTextShape['props']
References

TLTextShape


getBounds()

Public Method

Parameters
NameDescription

shape

TLTextShape
Returns
Box2d
References

TLTextShape, Box2d


getCenter()

Public Method

Parameters
NameDescription

shape

TLTextShape
Returns
Vec2d
References

TLTextShape, Vec2d


getMinDimensions()

Public Method

Parameters
NameDescription

shape

TLTextShape
Returns
{
  height: number
  width: number
}
References

TLTextShape


getOutline()

Public Method

Parameters
NameDescription

shape

TLTextShape
Returns
Vec2d[]
References

TLTextShape, Vec2d


indicator()

Public Method

Parameters
NameDescription

shape

TLTextShape
Returns
JSX.Element
References

TLTextShape, JSX.Element


render()

Public Method

Parameters
NameDescription

shape

TLTextShape
Returns
JSX.Element
References

TLTextShape, JSX.Element


toSvg()

Public Method

Parameters
NameDescription

shape

TLTextShape

font

string | undefined

colors

TLExportColors
Returns
SVGGElement
References

TLTextShape, TLExportColors, SVGGElement


Edit this page
Last edited on 5 June 2023
TEXT_PROPSTLAnimationOptions