Prosemirror is very hard on basic stuff like Suggestions

I really like the API of Prosemirror, complex things are made very simple. But unfortunately very basic stuff is extremely hard to get done in prosemirror !!

I am facing difficulties making Suggestions in Prosemirror. BELIVE ME ITS VERY VERY HARD BY ALL MEANS.

Basic implementation in my mind is very simple. In my use case i need suggestions whenever:

  1. @
  2. /
  3. (
  4. !

these characters are pressed.

Here is the general flow in my mind.

  1. Detect the character
  2. Show the html select attribute on DOM
  3. User will select a value and on press Enter, inline node gets added (different for each)

Why is it so hard?

Documentation really lags the way Plugins works and how to get it done using Decorations(for select).

I really believe either it will take an year for me to develop it or either it will have to drop prosemirror, but alas, whatever other option i have, it make hard things even harder and prosemirror makes simple things very hard to get done !!! I am seriously finding a balance !!!

Hang in there, man. There are two major humps to get over with this library. One deals rendering the view, the other with manipulating the document. (I’ve got a grip on the former, I’m not over the latter). Once you have some basics down in each, you’ll be flying. It is terse and to-the-point documentation, but not at all inaccurate or incomplete. The library reference is definitely where you will start pulling all of the good bits from.

Of the 3 types of decorations, I think the Widget would be what you want. I made an auto-completion plugin, and that’s what I used, and it’s basically the same thing. A widget places DOM inside the prose DOM container that is not part of the document. So it “decorates” in the visible sense. The other two types of decorations add attributes (i.e. decorate here refers to the software pattern, not something seen with the eyes). For instance, I have a plugin that uses node decorations to tell a node when the cursor is within that node, and another that tells a node that it has a parent of a specific type. Those decorations do manifest visibly via other behaviors, just not with something widget-esque.

You might find tiptap’s Suggestions plugin helpful for inspiration.