Support for inline mention context autocomplete menu

[raDiesle]

I couldnt find any information if it is supported or can be extended to have a context menu / mention with available options, whenever you type e.g. ":" or "@" like github supports it. - Is it? And if yes, how to do it?

[jaywcjlove]

@raDiesle Example: https://codesandbox.io/embed/react-md-editor-issues-365-8hm4rd?fontsize=14&hidenavigation=1&theme=dark

import React, { useRef, useEffect } from "react";
import ReactDOM from "react-dom";
import MDEditor from "@uiw/react-md-editor";
import "tributejs/tribute.css"
import Tribute from "tributejs";

const mkdStr = `**Hello world!!!** `;

var tribute = new Tribute({
  trigger: '@',
  values: [
    { key: "Phil Heartman", value: "pheartman" },
    { key: "Gordon Ramsey", value: "gramsey" }
  ]
});

function App() {
  const [value, setValue] = React.useState(mkdStr);
  const ref = useRef()
  const isBundle = useRef(false)
  useEffect(() => {
    if (ref.current.textarea && !isBundle.current) {
      isBundle.current = true;
      tribute.attach(ref.current.textarea);
      ref.current.textarea.addEventListener("tribute-replaced", (e) => {
        setValue(e.target.value)
      });
    }
  }, [ref.current])
  return (
    <div className="container">
      <div data-color-mode="light">
        <h3>Light</h3>
        <MDEditor
          ref={ref}
          height={200} value={value} onChange={(value) => setValue(value)}
        />
      </div>
    </div>
  );
}

ReactDOM.render(<App />, document.getElementById("container"));

[raDiesle]

Thank you, I will give it a try for my needs, so its going replaced with an image