Ckeditor5: Customize keys to accept mention

[felipegiotto]

Currently, the plugin always select the current item when the user hit Enter, Tab or Space keys. My suggestion is to allow the user to customize these keys. For instance, I may want to disable the "Space key" shortcut, so if the user has the mention box opened and hit Space, the box closes and the editor keeps only the plain text, without mentions.

[Reinmar]

It sounds interesting. @jodator, is that hard to make this configurable?

[jodator]

@Reinmar I think that we could rethink the space key handling. Even considering it a bug.

Adding configuration key for this shouldn't be hard - it would only require to read the config and pass it to the 'mention' view.

The form of the configuration is another question - only disabling the space or specifying keys to act on.

[mlewand]

The best option here is to allow an Number|Number[] of keystrokes that should accept the mention. So that developers are free to adjust it to their will.

Something like that:

const config = {
    mention: {
        commitKeys: keyCodes.enter
    }
};

const config = {
    mention: {
        commitKeys: [ keyCodes.enter, keyCodes.tab ]
    }
};

[zadam]

From my perspective the "space" issue is severely limiting usefulness of this plugin to only simple use cases - even the standard use case of mentioning somebody by name does not fully work since names contain space between first name and last name.

If having this configurable would take too much time then a quickfix could be considered of just allowing space (resp. not treating it as a "commit key") as a more sensible default.

[cnickless]

Not allowing a space to be written after the marker makes for a broken typing experience. It restricts users from being able to simply type marker characters (e.g. #, @) with a space following it. Right now if I wanted to just type "#[space]" the first option will be selected. If I delete those characters to go back to just the #, the feed is shown again.

To get past this, the user would have to either:

1. Type text after the tag, then use their mouse to select the cursor to the tag, delete the characters and then move the cursor back to the end of the string.
2. Type in sequence: #[esc][space]

That's quite the unnatural behavior placed on the user.

I'd recommend just updating the default keys to select being ENTER and TAB, as those feel like the more specialized keys for this.

To test the ideal scenario -- type a comment on GitHub here down below ... type "#[Space]" and notice how the mention feed appears and then disappears.

[jaigupta10]

Any update on this one? Is it working and if so then how.

[zadam]

@jaigupta10 There's PR ckeditor/ckeditor5-mention#92 which fixes the space behavior but unfortunately it wasn't merged yet and has not activity :-( But it's simple enough that you can merge it yourself locally for your project...