BlockSuite API Documentation / @blocksuite/inline / InlineEditor
Class: InlineEditor<TextAttributes>
Type Parameters
• TextAttributes extends BaseTextAttributes = BaseTextAttributes
Constructors
new InlineEditor()
new InlineEditor<
TextAttributes>(yText,ops):InlineEditor<TextAttributes>
Parameters
• yText: YText
• ops = {}
• ops.hooks?
• ops.hooks.beforeinput?
• ops.hooks.compositionEnd?
• ops.inlineRangeProvider?: InlineRangeProvider
• ops.isEmbed?
• ops.vLineRenderer?
Returns
InlineEditor<TextAttributes>
Defined in
packages/framework/inline/src/inline-editor.ts:198
Properties
attributeService
readonlyattributeService:AttributeService<TextAttributes>
Defined in
packages/framework/inline/src/inline-editor.ts:52
deleteText()
deleteText: (
inlineRange) =>void
Parameters
• inlineRange: InlineRange
Returns
void
Defined in
packages/framework/inline/src/inline-editor.ts:66
deltaService
readonlydeltaService:DeltaService<TextAttributes>
Defined in
packages/framework/inline/src/inline-editor.ts:73
disposables
readonlydisposables:DisposableGroup
Defined in
packages/framework/inline/src/inline-editor.ts:50
eventService
readonlyeventService:EventService<TextAttributes>
Defined in
packages/framework/inline/src/inline-editor.ts:106
focusEnd()
focusEnd: () =>
void
Returns
void
Defined in
packages/framework/inline/src/inline-editor.ts:84
focusIndex()
focusIndex: (
index) =>void
Parameters
• index: number
Returns
void
Defined in
packages/framework/inline/src/inline-editor.ts:85
focusStart()
focusStart: () =>
void
Returns
void
Defined in
packages/framework/inline/src/inline-editor.ts:86
formatText()
formatText: (
inlineRange,attributes,options) =>void
Parameters
• inlineRange: InlineRange
• attributes: TextAttributes
• options = {}
• options.match?
• options.mode?: "replace" | "merge"
Returns
void
Defined in
packages/framework/inline/src/inline-editor.ts:67
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>
Defined in
packages/framework/inline/src/inline-editor.ts:75
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>[]
Defined in
packages/framework/inline/src/inline-editor.ts:76
getFormat()
getFormat: (
inlineRange,loose) =>TextAttributes
Parameters
• inlineRange: InlineRange
• loose: boolean = false
Returns
TextAttributes
Defined in
packages/framework/inline/src/inline-editor.ts:54
getInlineRangeFromElement()
getInlineRangeFromElement: (
element) =>null|InlineRange
Parameters
• element: Element
Returns
null | InlineRange
Defined in
packages/framework/inline/src/inline-editor.ts:87
getLine()
getLine: (
rangeIndex) =>null|object
Parameters
• rangeIndex: number
Returns
null | object
Defined in
packages/framework/inline/src/inline-editor.ts:95
getNativeRange()
getNativeRange: () =>
null|Range
Returns
null | Range
Defined in
packages/framework/inline/src/inline-editor.ts:96
getNativeSelection()
getNativeSelection: () =>
null|Selection
Returns
null | Selection
Defined in
packages/framework/inline/src/inline-editor.ts:97
getTextPoint()
getTextPoint: (
rangeIndex) =>null|TextPoint
Parameters
• rangeIndex: number
Returns
null | TextPoint
Defined in
packages/framework/inline/src/inline-editor.ts:98
hooksService
readonlyhooksService:InlineHookService<TextAttributes>
Defined in
packages/framework/inline/src/inline-editor.ts:121
inlineRangeProvider
readonlyinlineRangeProvider:InlineRangeProvider
Defined in
packages/framework/inline/src/inline-editor.ts:151
insertLineBreak()
insertLineBreak: (
inlineRange) =>void
Parameters
• inlineRange: InlineRange
Returns
void
Defined in
packages/framework/inline/src/inline-editor.ts:68
insertText()
insertText: (
inlineRange,text,attributes) =>void
Parameters
• inlineRange: InlineRange
• text: string
• attributes: TextAttributes = ...
Returns
void
Defined in
packages/framework/inline/src/inline-editor.ts:69
isEmbed()
readonlyisEmbed: (delta) =>boolean
Parameters
• delta: DeltaInsert<TextAttributes>
Returns
boolean
Defined in
packages/framework/inline/src/inline-editor.ts:196
isFirstLine()
isFirstLine: (
inlineRange) =>boolean
There are two cases to have the second line:
- long text auto wrap in span element
- soft break
Parameters
• inlineRange: null | InlineRange
Returns
boolean
Defined in
packages/framework/inline/src/inline-editor.ts:88
isLastLine()
isLastLine: (
inlineRange) =>boolean
There are two cases to have the second line:
- long text auto wrap in span element
- soft break
Parameters
• inlineRange: null | InlineRange
Returns
boolean
Defined in
packages/framework/inline/src/inline-editor.ts:89
isValidInlineRange()
isValidInlineRange: (
inlineRange) =>boolean
Parameters
• inlineRange: null | InlineRange
Returns
boolean
Defined in
packages/framework/inline/src/inline-editor.ts:90
mapDeltasInInlineRange()
mapDeltasInInlineRange: <
Result>(inlineRange,callback) =>Result[]
Type Parameters
• Result
Parameters
• inlineRange: InlineRange
• callback
Returns
Result[]
Defined in
packages/framework/inline/src/inline-editor.ts:77
normalizeAttributes()
normalizeAttributes: (
textAttributes?) =>undefined|TextAttributes
Parameters
• textAttributes?: TextAttributes
Returns
undefined | TextAttributes
Defined in
packages/framework/inline/src/inline-editor.ts:55
rangeService
readonlyrangeService:RangeService<TextAttributes>
Defined in
packages/framework/inline/src/inline-editor.ts:82
render()
render: () =>
void
Returns
void
Defined in
packages/framework/inline/src/inline-editor.ts:116
renderService
readonlyrenderService:RenderService<TextAttributes>
Defined in
packages/framework/inline/src/inline-editor.ts:112
rerenderWholeEditor()
rerenderWholeEditor: () =>
void
Returns
void
Defined in
packages/framework/inline/src/inline-editor.ts:115
resetMarks()
resetMarks: () =>
void
Returns
void
Defined in
packages/framework/inline/src/inline-editor.ts:56
resetText()
resetText: (
inlineRange) =>void
Parameters
• inlineRange: InlineRange
Returns
void
Defined in
packages/framework/inline/src/inline-editor.ts:70
selectAll()
selectAll: () =>
void
Returns
void
Defined in
packages/framework/inline/src/inline-editor.ts:91
setAttributeRenderer()
setAttributeRenderer: (
renderer) =>void
Parameters
• renderer: AttributeRenderer<TextAttributes>
Returns
void
Defined in
packages/framework/inline/src/inline-editor.ts:57
setAttributeSchema()
setAttributeSchema: (
schema) =>void
Parameters
• schema: ZodType<TextAttributes, ZodTypeDef, unknown>
Returns
void
Defined in
packages/framework/inline/src/inline-editor.ts:58
setMarks()
setMarks: (
marks) =>void
Parameters
• marks: TextAttributes
Returns
void
Defined in
packages/framework/inline/src/inline-editor.ts:59
setText()
setText: (
text,attributes) =>void
Parameters
• text: string
• attributes: TextAttributes = ...
Returns
void
Defined in
packages/framework/inline/src/inline-editor.ts:71
slots
readonlyslots:object
inlineRangeSync
inlineRangeSync:
Slot<null|Range>
inputting
inputting:
Slot<void>
Corresponding to the compositionUpdate and beforeInput events, and triggered only when the inlineRange is not null.
keydown
keydown:
Slot<KeyboardEvent>
Triggered only when the inlineRange is not null.
mounted
mounted:
Slot<void>
renderComplete
renderComplete:
Slot<void>
textChange
textChange:
Slot<void>
unmounted
unmounted:
Slot<void>
Defined in
packages/framework/inline/src/inline-editor.ts:167
syncInlineRange()
syncInlineRange: (
inlineRange?) =>void
sync the dom selection from inline range for this Editor
Parameters
• inlineRange?: null | InlineRange
Returns
void
Defined in
packages/framework/inline/src/inline-editor.ts:92
textService
readonlytextService:InlineTextService<TextAttributes>
Defined in
packages/framework/inline/src/inline-editor.ts:64
toDomRange()
toDomRange: (
inlineRange) =>null|Range
calculate the dom selection from inline ranage for this Editor
Parameters
• inlineRange: InlineRange
Returns
null | Range
Defined in
packages/framework/inline/src/inline-editor.ts:93
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)
- anchor and focus are in this Editorthe inline ranage of second Editor is
aaaaaa b|bbbb|b cccccc{index: 1, length: 4}, the others are null - anchor and focus one in this Editor, one in another Editor2.1 the inline ranage of first Editor is
aaa|aaa aaaaaa bbbbb|b or bbbbb|b cccccc cc|cccc{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} - anchor and focus are in another Editorthe inline range of first Editor is
aa|aaaa bbbbbb cccc|cc{index: 2, length: 4}, the second is{index: 0, length: 6}, the third is{index: 0, length: 4}
Parameters
• range: Range
Returns
null | InlineRange
Defined in
packages/framework/inline/src/inline-editor.ts:94
vLineRenderer
readonlyvLineRenderer:null| (vLine) =>TemplateResult
Defined in
packages/framework/inline/src/inline-editor.ts:183
waitForUpdate()
waitForUpdate: () =>
Promise<void>
Returns
Promise<void>
Defined in
packages/framework/inline/src/inline-editor.ts:114
yText
readonlyyText:YText
Defined in
packages/framework/inline/src/inline-editor.ts:185
getTextNodesFromElement()
staticgetTextNodesFromElement: (element) =>Text[]
Parameters
• element: Element
Returns
Text[]
Defined in
packages/framework/inline/src/inline-editor.ts:44
nativePointToTextPoint()
staticnativePointToTextPoint: (node,offset) =>TextPoint|null
Parameters
• node: unknown
• offset: number
Returns
TextPoint | null
Defined in
packages/framework/inline/src/inline-editor.ts:46
textPointToDomPoint()
statictextPointToDomPoint: (text,offset,rootElement) =>DomPoint|null
Parameters
• text: Text
• offset: number
• rootElement: HTMLElement
Returns
DomPoint | null
Defined in
packages/framework/inline/src/inline-editor.ts:48
Accessors
embedDeltas
getembedDeltas():DeltaInsert<TextAttributes>[]
Returns
DeltaInsert<TextAttributes>[]
Defined in
packages/framework/inline/src/inline-editor.ts:78
eventSource
geteventSource():null|HTMLElement
Returns
null | HTMLElement
Defined in
packages/framework/inline/src/inline-editor.ts:127
hooks
gethooks():object
Returns
object
beforeinput()?
optionalbeforeinput: (props) =>void
Parameters
• props: BeforeinputHookCtx<TextAttributes>
Returns
void
compositionEnd()?
optionalcompositionEnd: (props) =>void
Parameters
• props: CompositionEndHookCtx<TextAttributes>
Returns
void
Defined in
packages/framework/inline/src/inline-editor.ts:122
inlineRange$
getinlineRange$():Signal<null|InlineRange>
Returns
Signal<null | InlineRange>
Defined in
packages/framework/inline/src/inline-editor.ts:157
inlineRangeProviderOverride
getinlineRangeProviderOverride():boolean
Returns
boolean
Defined in
packages/framework/inline/src/inline-editor.ts:148
isComposing
getisComposing():boolean
Returns
boolean
Defined in
packages/framework/inline/src/inline-editor.ts:108
isReadonly
getisReadonly():boolean
Returns
boolean
Defined in
packages/framework/inline/src/inline-editor.ts:132
lastEndRelativePosition
getlastEndRelativePosition():null|RelativePosition
Returns
null | RelativePosition
Defined in
packages/framework/inline/src/inline-editor.ts:102
lastStartRelativePosition
getlastStartRelativePosition():null|RelativePosition
Returns
null | RelativePosition
Defined in
packages/framework/inline/src/inline-editor.ts:99
marks
getmarks():null|TextAttributes
Returns
null | TextAttributes
Defined in
packages/framework/inline/src/inline-editor.ts:60
mounted
getmounted():boolean
Returns
boolean
Defined in
packages/framework/inline/src/inline-editor.ts:137
rendering
getrendering():boolean
Returns
boolean
Defined in
packages/framework/inline/src/inline-editor.ts:117
rootElement
getrootElement():InlineRootElement<TextAttributes>
Returns
InlineRootElement<TextAttributes>
Defined in
packages/framework/inline/src/inline-editor.ts:142
yTextDeltas
getyTextDeltas():any
Returns
any
Defined in
packages/framework/inline/src/inline-editor.ts:186
yTextLength
getyTextLength():number
Returns
number
Defined in
packages/framework/inline/src/inline-editor.ts:189
yTextString
getyTextString():string
Returns
string
Defined in
packages/framework/inline/src/inline-editor.ts:192
Methods
getInlineRange()
getInlineRange():
null|InlineRange
Returns
null | InlineRange
Defined in
packages/framework/inline/src/inline-editor.ts:163
mount()
mount(
rootElement,eventSource,isReadonly):void
Parameters
• rootElement: HTMLElement
• eventSource: HTMLElement = rootElement
• isReadonly: boolean = false
Returns
void
Defined in
packages/framework/inline/src/inline-editor.ts:237
setInlineRange()
setInlineRange(
inlineRange):void
Parameters
• inlineRange: null | InlineRange
Returns
void
Defined in
packages/framework/inline/src/inline-editor.ts:160
setReadonly()
setReadonly(
isReadonly):void
Parameters
• isReadonly: boolean
Returns
void
Defined in
packages/framework/inline/src/inline-editor.ts:275
transact()
transact(
fn):void
Parameters
• fn
Returns
void
Defined in
packages/framework/inline/src/inline-editor.ts:289
unmount()
unmount():
void
Returns
void
Defined in
packages/framework/inline/src/inline-editor.ts:264