Every extension

ghostText

Behaviour takes options 0.71 kB gzipped

Inline completion: grey text after the caret, Tab to take it.

The suggestion is a decoration and never part of the document, so it is not saved, not sent to collaborators and not undone. Any keystroke or caret move dismisses it — a ghost that stays where it was while the sentence changes underneath it is worse than none — and Tab inserts it at the position it was shown at, as one ordinary edit.

Where the text comes from is yours: a model, a phrase table, the next line of the previous draft. This only asks, waits, and draws.

Adding it

import { createEditor, document, paragraph, text, ghostText } from '@matrajs/core'

const editor = createEditor({
  extensions: [document, paragraph, text, ghostText({ … })],
  element: document.querySelector('#editor'),
})

There is no separate package · ghostText is already in @matrajs/core, and an extension you do not import is not in your bundle. document, paragraph and text are the floor every document needs.

Options

Field Type
suggest required (context: GhostContext) => string | null | undefined | Promise<string | null | undefined> Propose what comes next. Return nothing to propose nothing. Asked after the caret has rested for `delay`, and only the latest answer counts: a reply that arrives after another keystroke is dropped, so a slow model never writes into a sentence that has moved on.
delay number Milliseconds the caret rests before asking. Default 300.
minBefore number Characters needed before the caret in its block before asking. Default 1.
className string Class on the rendered suggestion. Default `matra-ghost`.

Commands

Keys

Styles

This one needs a stylesheet to look right, and ships the minimum as a string rather than a file · nothing is loaded unless you load it. 


          import { ghostTextCSS } from '@matrajs/core'

const style = document.createElement('style')
style.textContent = ghostTextCSS
document.head.append(style)

← All 81 extensions

Edit this page on GitHub