Design of @ mentions for the editor.

[burtonator]

Describe the bug

Implementing @ mention support in MDXEditor / Lexical is going to be a bit hard because I need to reverse engineer MDXEditor, Gurx (their state management system they use), and Lexical.

We might not have to use Gurx though. I'm not sure yet. I might just use it to avoid any bugs and try to make this a pure MDXEditor plugin.

The main MDXEditor docs are here: https://mdxeditor.dev/editor/docs/extending-the-editor

How Plugins are Created

Plugins use the following syntax (roughly).

export const directivesPlugin = realmPlugin<{
  /**
   * Use this to register your custom directive editors. You can also use the built-in {@link GenericDirectiveEditor}.
   */
  directiveDescriptors: DirectiveDescriptor<any>[]
}>({
  update: (realm, params) => {
    // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
    realm.pub(directiveDescriptors$, params?.directiveDescriptors ?? [])
  },

  init: (realm, params) => {
    realm.pubIn({
      [directiveDescriptors$]: params?.directiveDescriptors ?? [],
      // import
      [addMdastExtension$]: directiveFromMarkdown(),
      [addSyntaxExtension$]: directive(),
      [addImportVisitor$]: MdastDirectiveVisitor,
      // export
      [addLexicalNode$]: DirectiveNode,
      [addExportVisitor$]: DirectiveVisitor,
      [addToMarkdownExtension$]: directiveToMarkdown()
    })
  }
})

I think the main ones we need are:

addLexicalNode$

I think I have to take the LinkNode from within Lexical and extend it...

• We should the MentionsPlugin within Lexical and use that as a starting point.