BlockSuite

Appearance

BlockSuite API Documentation / @blocksuite/inline / InlineEditor

Class: InlineEditor<TextAttributes> ​

Contents ​

Type parameters ​

• TextAttributes extends BaseTextAttributes = BaseTextAttributes

Constructors ​

new InlineEditor(yText, ops) ​

new InlineEditor<TextAttributes>(yText, ops): InlineEditor<TextAttributes>

Parameters ​

• yText: Text

• ops: Object= {}

• ops.hooks?: Object

• ops.hooks.beforeinput?: (props) => null | BeforeinputHookCtx<TextAttributes>

• ops.hooks.compositionEnd?: (props) => null | CompositionEndHookCtx<TextAttributes>

• ops.inlineRangeProvider?: InlineRangeProvider

• ops.isEmbed?: (delta) => boolean

Returns ​

InlineEditor<TextAttributes>

Source ​

packages/inline/src/inline-editor.ts:181

Properties ​

_attributeService ​

private _attributeService: AttributeService<TextAttributes>

Source ​

packages/inline/src/inline-editor.ts:61

_deltaService ​

private _deltaService: DeltaService<TextAttributes>

Source ​

packages/inline/src/inline-editor.ts:64

_disposables ​

private _disposables: DisposableGroup

Source ​

packages/inline/src/inline-editor.ts:45

_eventService ​

private _eventService: EventService<TextAttributes>

Source ​

packages/inline/src/inline-editor.ts:55

_eventSource ​

private _eventSource: null | HTMLElement = null

Source ​

packages/inline/src/inline-editor.ts:52

_hooksService ​

private _hooksService: InlineHookService<TextAttributes>

Source ​

packages/inline/src/inline-editor.ts:70

_isReadonly ​

private _isReadonly: boolean = false

Source ​

packages/inline/src/inline-editor.ts:53

_mounted ​

private _mounted: boolean = false

Source ​

packages/inline/src/inline-editor.ts:72

_rangeService ​

private _rangeService: RangeService<TextAttributes>

Source ​

packages/inline/src/inline-editor.ts:58

_rootElement ​

private _rootElement: null | InlineRootElement<TextAttributes> = null

Source ​

packages/inline/src/inline-editor.ts:51

_textService ​

private _textService: InlineTextService<TextAttributes>

Source ​

packages/inline/src/inline-editor.ts:67

_yText ​

private readonly _yText: Text

Source ​

packages/inline/src/inline-editor.ts:50

deleteText ​

deleteText: (inlineRange) => void

Parameters ​

• inlineRange: InlineRange

Returns ​

void

Source ​

packages/inline/src/inline-editor.ts:169

focusEnd ​

focusEnd: () => void

Returns ​

void

Source ​

packages/inline/src/inline-editor.ts:157

focusIndex ​

focusIndex: (index) => void

Parameters ​

• index: number

Returns ​

void

Source ​

packages/inline/src/inline-editor.ts:159

focusStart ​

focusStart: () => void

Returns ​

void

Source ​

packages/inline/src/inline-editor.ts:156

formatText ​

formatText: (inlineRange, attributes, options) => void

Parameters ​

• inlineRange: InlineRange

• attributes: TextAttributes

• options: Object= {}

• options.match?: (delta, deltaInlineRange) => boolean

• options.mode?: "replace" | "merge"

Returns ​

void

Source ​

packages/inline/src/inline-editor.ts:172

getDeltaByRangeIndex ​

getDeltaByRangeIndex: (rangeIndex) => null | DeltaInsert<TextAttributes>

Here are examples of how this function computes and gets the delta.

We have such a text:

[
  {
     insert: 'aaa',
     attributes: { bold: true },
  },
  {
     insert: 'bbb',
     attributes: { italic: true },
  },
]

getDeltaByRangeIndex(0) returns { insert: 'aaa', attributes: { bold: true } }.

getDeltaByRangeIndex(1) returns { insert: 'aaa', attributes: { bold: true } }.

getDeltaByRangeIndex(3) returns { insert: 'aaa', attributes: { bold: true } }.

getDeltaByRangeIndex(4) returns { insert: 'bbb', attributes: { italic: true } }.

Parameters ​

• rangeIndex: number

Returns ​

null | DeltaInsert<TextAttributes>

Source ​

packages/inline/src/inline-editor.ts:164

getDeltasByInlineRange ​

getDeltasByInlineRange: (inlineRange) => DeltaEntry<TextAttributes>[]

Here are examples of how this function computes and gets the deltas.

We have such a text:

[
  {
     insert: 'aaa',
     attributes: { bold: true },
  },
  {
     insert: 'bbb',
     attributes: { italic: true },
  },
  {
     insert: 'ccc',
     attributes: { underline: true },
  },
]

getDeltasByInlineRange({ index: 0, length: 0 }) returns

[{ insert: 'aaa', attributes: { bold: true }, }, { index: 0, length: 3, }]]

getDeltasByInlineRange({ index: 0, length: 1 }) returns

[{ insert: 'aaa', attributes: { bold: true }, }, { index: 0, length: 3, }]]

getDeltasByInlineRange({ index: 0, length: 4 }) returns

[{ insert: 'aaa', attributes: { bold: true }, }, { index: 0, length: 3, }],
 [{ insert: 'bbb', attributes: { italic: true }, }, { index: 3, length: 3, }]]

getDeltasByInlineRange({ index: 3, length: 1 }) returns

[{ insert: 'aaa', attributes: { bold: true }, }, { index: 0, length: 3, }],
 [{ insert: 'bbb', attributes: { italic: true }, }, { index: 3, length: 3, }]]

getDeltasByInlineRange({ index: 3, length: 3 }) returns

[{ insert: 'aaa', attributes: { bold: true }, }, { index: 0, length: 3, }],
 [{ insert: 'bbb', attributes: { italic: true }, }, { index: 3, length: 3, }]]

getDeltasByInlineRange({ index: 3, length: 4 }) returns

[{ insert: 'aaa', attributes: { bold: true }, }, { index: 0, length: 3, }],
 [{ insert: 'bbb', attributes: { italic: true }, }, { index: 3, length: 3, }],
 [{ insert: 'ccc', attributes: { underline: true }, }, { index: 6, length: 3, }]]

Parameters ​

• inlineRange: InlineRange

Returns ​

DeltaEntry<TextAttributes>[]

Source ​

packages/inline/src/inline-editor.ts:163

getFormat ​

getFormat: (inlineRange, loose) => TextAttributes

Parameters ​

• inlineRange: InlineRange

• loose: boolean= false

Returns ​

TextAttributes

Source ​

packages/inline/src/inline-editor.ts:142

getInlineRange ​

getInlineRange: () => null | InlineRange

Returns ​

null | InlineRange

Source ​

packages/inline/src/inline-editor.ts:147

getInlineRangeFromElement ​

getInlineRangeFromElement: (element) => null | InlineRange

Parameters ​

• element: Element

Returns ​

null | InlineRange

Source ​

packages/inline/src/inline-editor.ts:148

getLine ​

getLine: (rangeIndex) => readonly [VLine, number]

Parameters ​

• rangeIndex: number

Returns ​

readonly [VLine, number]

Source ​

packages/inline/src/inline-editor.ts:151

getNativeSelection ​

getNativeSelection: () => null | Selection

Returns ​

null | Selection

Source ​

packages/inline/src/inline-editor.ts:149

getTextPoint ​

getTextPoint: (rangeIndex) => TextPoint

Parameters ​

• rangeIndex: number

Returns ​

TextPoint

Source ​

packages/inline/src/inline-editor.ts:150

inlineRangeProvider ​

readonly inlineRangeProvider: null | InlineRangeProvider

Source ​

packages/inline/src/inline-editor.ts:75

insertLineBreak ​

insertLineBreak: (inlineRange) => void

Parameters ​

• inlineRange: InlineRange

Returns ​

void

Source ​

packages/inline/src/inline-editor.ts:171

insertText ​

insertText: (inlineRange, text, attributes) => void

Parameters ​

• inlineRange: InlineRange

• text: string

• attributes: TextAttributes= undefined

Returns ​

void

Source ​

packages/inline/src/inline-editor.ts:170

isEmbed ​

readonly isEmbed: (delta) => boolean

Parameters ​

• delta: DeltaInsert<TextAttributes>

Returns ​

boolean

Source ​

packages/inline/src/inline-editor.ts:74

isFirstLine ​

isFirstLine: (inlineRange) => boolean

There are two cases to have the second line:

  1. long text auto wrap in span element
  2. soft break

Parameters ​

• inlineRange: null | InlineRange

Returns ​

boolean

Source ​

packages/inline/src/inline-editor.ts:153

isLastLine ​

isLastLine: (inlineRange) => boolean

There are two cases to have the second line:

  1. long text auto wrap in span element
  2. soft break

Parameters ​

• inlineRange: null | InlineRange

Returns ​

boolean

Source ​

packages/inline/src/inline-editor.ts:154

isNormalizedDeltaSelected ​

isNormalizedDeltaSelected: (normalizedDeltaIndex, inlineRange) => boolean

Parameters ​

• normalizedDeltaIndex: number

• inlineRange: InlineRange

Returns ​

boolean

Source ​

packages/inline/src/inline-editor.ts:166

isValidInlineRange ​

isValidInlineRange: (inlineRange) => boolean

Parameters ​

• inlineRange: null | InlineRange

Returns ​

boolean

Source ​

packages/inline/src/inline-editor.ts:152

mapDeltasInInlineRange ​

mapDeltasInInlineRange: <Result>(inlineRange, callback, normalize) => Result[]

Type parameters ​

• Result

Parameters ​

• inlineRange: InlineRange

• callback: (delta, rangeIndex, deltaIndex) => Result

• normalize: boolean= false

Returns ​

Result[]

Source ​

packages/inline/src/inline-editor.ts:165

resetMarks ​

resetMarks: () => void

Returns ​

void

Source ​

packages/inline/src/inline-editor.ts:141

resetText ​

resetText: (inlineRange) => void

Parameters ​

• inlineRange: InlineRange

Returns ​

void

Source ​

packages/inline/src/inline-editor.ts:173

selectAll ​

selectAll: () => void

Returns ​

void

Source ​

packages/inline/src/inline-editor.ts:158

setAttributeRenderer ​

setAttributeRenderer: (renderer) => void

Parameters ​

• renderer: AttributeRenderer<TextAttributes>

Returns ​

void

Source ​

packages/inline/src/inline-editor.ts:139

setAttributeSchema ​

setAttributeSchema: (schema) => void

Parameters ​

• schema: ZodType<TextAttributes, ZodTypeDef, unknown>

Returns ​

void

Source ​

packages/inline/src/inline-editor.ts:138

setInlineRange ​

setInlineRange: (inlineRange, sync) => void

the inline ranage is synced to the native selection asynchronically if sync is true, the native selection will be synced immediately

Parameters ​

• inlineRange: null | InlineRange

• sync: boolean= true

Returns ​

void

Source ​

packages/inline/src/inline-editor.ts:155

setMarks ​

setMarks: (marks) => void

Parameters ​

• marks: TextAttributes

Returns ​

void

Source ​

packages/inline/src/inline-editor.ts:140

setText ​

setText: (text, attributes) => void

Parameters ​

• text: string

• attributes: TextAttributes= undefined

Returns ​

void

Source ​

packages/inline/src/inline-editor.ts:174

slots ​

readonly slots: Object

Type declaration ​

inlineRangeApply ​

inlineRangeApply: Slot<Range>

inlineRangeUpdate ​

inlineRangeUpdate: Slot<InlineRangeUpdatedProp>

mounted ​

mounted: Slot<void>

render ​

render: Slot<void>

renderComplete ​

renderComplete: Slot<void>

textChange ​

textChange: Slot<void>

unmounted ​

unmounted: Slot<void>

Source ​

packages/inline/src/inline-editor.ts:77

syncInlineRange ​

syncInlineRange: () => void

sync the dom selection from inline ranage for this Editor

Returns ​

void

Source ​

packages/inline/src/inline-editor.ts:160

toDomRange ​

toDomRange: (inlineRange) => null | Range

calculate the dom selection from inline ranage for this Editor

Parameters ​

• inlineRange: InlineRange

Returns ​

null | Range

Source ​

packages/inline/src/inline-editor.ts:145

toInlineRange ​

toInlineRange: (range) => null | InlineRange

calculate the inline ranage from dom selection for this Editor there are three cases when the inline ranage of this Editor is not null: (In the following, "|" mean anchor and focus, each line is a separate Editor)

  1. anchor and focus are in this Editor
    aaaaaa
b|bbbb|b
cccccc
    the inline ranage of second Editor is {index: 1, length: 4}, the others are null
  2. anchor and focus one in this Editor, one in another Editor
    aaa|aaa    aaaaaa
bbbbb|b or bbbbb|b
cccccc     cc|cccc
    2.1 the inline ranage of first Editor is {index: 3, length: 3}, the second is {index: 0, length: 5}, the third is null 2.2 the inline ranage of first Editor is null, the second is {index: 5, length: 1}, the third is {index: 0, length: 2}
  3. anchor and focus are in another Editor
    aa|aaaa
bbbbbb
cccc|cc
    the inline range of first Editor is {index: 2, length: 4}, the second is {index: 0, length: 6}, the third is {index: 0, length: 4}

Parameters ​

• range: Range

Returns ​

null | InlineRange

Source ​

packages/inline/src/inline-editor.ts:146

getTextNodesFromElement ​

static getTextNodesFromElement: (element) => Text[] = getTextNodesFromElement

Parameters ​

• element: Element

Returns ​

Text[]

Source ​

packages/inline/src/inline-editor.ts:43

nativePointToTextPoint ​

static nativePointToTextPoint: (node, offset) => TextPoint | null = nativePointToTextPoint

Parameters ​

• node: unknown

• offset: number

Returns ​

TextPoint | null

Source ​

packages/inline/src/inline-editor.ts:41

textPointToDomPoint ​

static textPointToDomPoint: (text, offset, rootElement) => DomPoint | null = textPointToDomPoint

Parameters ​

• text: Text

• offset: number

• rootElement: HTMLElement

Returns ​

DomPoint | null

Source ​

packages/inline/src/inline-editor.ts:42

Accessors ​

attributeService ​

get attributeService(): AttributeService<TextAttributes>

Returns ​

AttributeService<TextAttributes>

Source ​

packages/inline/src/inline-editor.ts:121

deltaService ​

get deltaService(): DeltaService<TextAttributes>

Returns ​

DeltaService<TextAttributes>

Source ​

packages/inline/src/inline-editor.ts:125

disposables ​

get disposables(): DisposableGroup

Returns ​

DisposableGroup

Source ​

packages/inline/src/inline-editor.ts:46

eventService ​

get eventService(): EventService<TextAttributes>

Returns ​

EventService<TextAttributes>

Source ​

packages/inline/src/inline-editor.ts:113

eventSource ​

get eventSource(): HTMLElement

Returns ​

HTMLElement

Source ​

packages/inline/src/inline-editor.ts:108

hooks ​

get hooks(): Object

Returns ​

Object

beforeinput? ​

beforeinput?: (props) => null | BeforeinputHookCtx<TextAttributes>

Parameters ​

• props: BeforeinputHookCtx<TextAttributes>

Returns ​

null | BeforeinputHookCtx<TextAttributes>

compositionEnd? ​

compositionEnd?: (props) => null | CompositionEndHookCtx<TextAttributes>

Parameters ​

• props: CompositionEndHookCtx<TextAttributes>

Returns ​

null | CompositionEndHookCtx<TextAttributes>

Source ​

packages/inline/src/inline-editor.ts:177

isReadonly ​

get isReadonly(): boolean

Returns ​

boolean

Source ​

packages/inline/src/inline-editor.ts:259

marks ​

get marks(): null | TextAttributes

Returns ​

null | TextAttributes

Source ​

packages/inline/src/inline-editor.ts:134

mounted ​

get mounted(): boolean

Returns ​

boolean

Source ​

packages/inline/src/inline-editor.ts:129

rangeService ​

get rangeService(): RangeService<TextAttributes>

Returns ​

RangeService<TextAttributes>

Source ​

packages/inline/src/inline-editor.ts:117

rootElement ​

get rootElement(): InlineRootElement<TextAttributes>

Returns ​

InlineRootElement<TextAttributes>

Source ​

packages/inline/src/inline-editor.ts:103

yText ​

get yText(): Text

Returns ​

Text

Source ​

packages/inline/src/inline-editor.ts:87

yTextDeltas ​

get yTextDeltas(): any

Returns ​

any

Source ​

packages/inline/src/inline-editor.ts:99

yTextLength ​

get yTextLength(): number

Returns ​

number

Source ​

packages/inline/src/inline-editor.ts:95

yTextString ​

get yTextString(): string

Returns ​

string

Source ​

packages/inline/src/inline-editor.ts:91

Methods ​

_bindYTextObserver() ​

private _bindYTextObserver(): void

Returns ​

void

Source ​

packages/inline/src/inline-editor.ts:291

_onYTextChange() ​

private _onYTextChange(): void

Returns ​

void

Source ​

packages/inline/src/inline-editor.ts:277

mount() ​

mount(rootElement, eventSource): void

Parameters ​

• rootElement: HTMLElement

• eventSource: HTMLElement= rootElement

Returns ​

void

Source ​

packages/inline/src/inline-editor.ts:217

requestUpdate() ​

requestUpdate(syncInlineRange): void

Parameters ​

• syncInlineRange: boolean= true

Returns ​

void

Source ​

packages/inline/src/inline-editor.ts:245

rerenderWholeEditor() ​

rerenderWholeEditor(): void

Returns ​

void

Source ​

packages/inline/src/inline-editor.ts:263

setReadonly() ​

setReadonly(isReadonly): void

Parameters ​

• isReadonly: boolean

Returns ​

void

Source ​

packages/inline/src/inline-editor.ts:254

transact() ​

transact(fn): void

Parameters ​

• fn: () => void

Returns ​

void

Source ​

packages/inline/src/inline-editor.ts:268

unmount() ​

unmount(): void

Returns ​

void

Source ​

packages/inline/src/inline-editor.ts:236

waitForUpdate() ​

waitForUpdate(): Promise<void>

Returns ​

Promise<void>

Source ​

packages/inline/src/inline-editor.ts:249

Generated using typedoc-plugin-markdown and TypeDoc

Copyright © 2022-present Toeverything