TextManager • tldraw Docs

Table of contents

editor
Properties
Methods

class TextManager {}

Constructor

Constructs a new instance of the TextManager class

Parameters

Name	Description
`editor`	`Editor`

Properties

editor

editor: Editor

Methods

dispose()

dispose(): void

measureElementTextNodeSpans()

Given an html element, measure the position of each span of unbroken word/white-space characters within any text nodes it contains.

measureElementTextNodeSpans(
  element: HTMLElement,
  {
    shouldTruncateToFirstLine,
  }?: {
    shouldTruncateToFirstLine?: boolean
  }
): {
  didTruncate: boolean
  spans: {
    box: BoxModel
    text: string
  }[]
}

Parameters

Name	Description
`element`	`HTMLElement`
`{ shouldTruncateToFirstLine }`	`{ shouldTruncateToFirstLine?: boolean }`

Returns

{
  didTruncate: boolean
  spans: {
    box: BoxModel
    text: string
  }[]
}

measureHtml()

measureHtml(
  html: string,
  opts: TLMeasureTextOpts
): BoxModel & {
  scrollWidth: number
}

Parameters

Name	Description
`html`	`string`
`opts`	`TLMeasureTextOpts`

Returns

BoxModel & {
  scrollWidth: number
}

measureText()

measureText(
  textToMeasure: string,
  opts: TLMeasureTextOpts
): BoxModel & {
  scrollWidth: number
}

Parameters

Name	Description
`textToMeasure`	`string`
`opts`	`TLMeasureTextOpts`

Returns

BoxModel & {
  scrollWidth: number
}

measureTextSpans()

Measure text into individual spans. Spans are created by rendering the text, then dividing it up according to line breaks and word boundaries.

It works by having the browser render the text, then measuring the position of each character. You can use this to replicate the text-layout algorithm of the current browser in e.g. an SVG export.

measureTextSpans(
  textToMeasure: string,
  opts: TLMeasureTextSpanOpts
): {
  box: BoxModel
  text: string
}[]

Parameters

Name	Description
`textToMeasure`	`string`
`opts`	`TLMeasureTextSpanOpts`

Returns

{
  box: BoxModel
  text: string
}[]