codex-team / codex-team/editor.js

💡TOOL: Add an autocomplete tool type

Open
#1,623 12 comments 23 reactions 0 assignees View on GitHub
Dominant language
TypeScript
Stars
31.9k
Forks
2.2k
Avg merge
1d 1h
Merged PRs (30d)
1

Description

1. Describe a problem.
When typing a text, I'm used to the github workflow where I can type `#` to refer to an issue, `@` to mention someone or `:` to open the emoji panel. These kind of interactions are widely used in modern forums/chat, but as far as I've seen, are not possible with editor.js right now.

2. Describe the solution you'd like. Mockups are welcome.
Autocomplete tools would be triggered by typing its marker, and can be discarded using the escape key.
The autocomplete tool API could look something like this : (10 seconds thinking, might need some adjustments)

```
class MentionTool {

static get isAutocomplete() {
return true;
}

static get trigger() {
return '@';
}

complete(text) {
return [
{// Each auto complete item has a free form, and is given as-is to the makeListItem/itemSelected functions
id: 16060815,
text: "CodeX-Team",
profilePicture: "https://avatars.githubusercontent.com/u/16060815?s=200&v=4"
}
].filter(i => i.text.startsWith(text));
}

makeListItem(item) { // Creates a list item to show in the autocomplete list
return ` ${item.text}`;
}

itemSelected(selectedItem) { // Creates the code to put in the editor
return `#${selectedItem.text}`;
}

}
```

3. Are there any alternatives?
There is the "inline tool" type, but you need to select a text and apply the inline tool, which breaks the natural flow of typing.

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.