AI Text Tool for Editor.js

AI suggestion text Tool for the Editor.js based on the default Paragraph Tool and OpenAI Node.js library.

While writing with this tool you will get some OpenAI suggestion after 2 seconds delay. You can accept or decline it.

!image

Bindings:

Accept suggestion: 'Right or Left ALT buttons'

Decline suggestion: 'Backspace or ESC buttons'

Installation

Get the package

``shell
npm i @alkhipce/editorjs-aitext
`

Include module at your application

`javascript
import AIText from '@alkhipce/editorjs-aitext'
`

Usage for ver >= 1.2.0

If your project uses versions lower than 1.2.0, please read the old tutorial below

Add a new Tool to the tools property of the Editor.js initial config.

`javascript
var editor = EditorJS({
...

tools: {
...
aiText: {
// if you do not use TypeScript you need to remove "as unknown as ToolConstructable" construction
// type ToolConstructable imported from @editorjs/editorjs package
class: AIText as unknown as ToolConstructable,
config: {
// here you need to provide your own suggestion provider (e.g., request to your backend)
// this callback function must accept a string and return a Promise
callback: (text: string) => {
return new Promise(resolve => {
setTimeout(() => {
resolve('AI: ' + text)
}, 1000)
})
},
}
},
}

...
});
`

Usage for ver < 1.2.0

Add a new Tool to the tools property of the Editor.js initial config.

`javascript
var editor = EditorJS({
...

tools: {
...
aiText: {
// if you do not use TypeScript you need to remove "as unknown as ToolConstructable" construction
class: AIText as unknown as ToolConstructable,
config: {
openaiKey: 'YOUR_OPEN_AI_KEY'
}
},
}

...
});
`

Config Params

The AI Text Tool supports these configuration parameters:

| Field | Type | Description |
| ---------------------- | ---------- | -------------------------------------------------------------------------------------------- |
| placeholder | string | The placeholder. Will be shown only in the first paragraph when the whole editor is empty. |
| preserveBlank | boolean | (default: false) Whether or not to keep blank paragraphs when saving editor data |
| (DEPRECATED) openaiKey | string | Required parameter |
| callback | function | Required parameter. This callback function has to accept a string and return Promise |

Output data

| Field | Type | Description |
| ----- | -------- | ---------------- |
| text | string | paragraph's text |

`json
{
"type": "aiText",
"data": {
"text": "Check out our projects on a GitHub page."
}
}
``

Roadmap

1. Add types (done)
2. Add styles file
3. Improve loader icon