Frontend engineer to add autocomplete function without a trigger to WYSIWYG editor(Froala)

We are trying to add autocomplete to WYSIWYG text editor[froala] at local-side using javascript/jquery/vue.js. (The froala is changeable to the other WYSIWYG text editor like CKEditor. However, we prefer to use the froala.) The froala already provides 3rd party Integration [login to view URL] for autocomplete. However, [login to view URL] uses "@" or a predetermined character to trigger autocomplete. (Similarly, the CKEditor has its own autocomplete plugin using a trigger "[[".) We want not to type any trigger to use autocomplete. It means that every character(except ' ') typed by the user triggers autocomplete. (We think that this function is similar to Intellisense of Visual Studio) AUTOCOMPLETE: When a datasource includes "Jacob", "Isabella", "Ethan", "Emma", "Michael" and "Olivia", if I type "b"(without trigger) at a certain position in the froala editor, a popup list having "Jacob" and "Isabella" should be shown up at the position "b" typed(the position and a direction of the popup list should be differed by the position of the character.) If I type "c"(without trigger), the list having "Jacob" and "Michael" should be shown up. AUTOSTYLE: And then, if I choose "Isabella", it should be inserted into the froala area with "span" tag, for example, "<span class='test'>Isabella</span>"; AUTODELETE: The autocompleted text should be deleted by one key-down event(backspace or delete). NOT EDITABLE: The autocompleted text should be not editable. It has to be handled as one body after it is inserted into the editor. AUTOCHANGE: Also, if the "Isabella" of the datasource is modified or changed to "XXXXXXX" by the user after the "Isabella" inserted into the froala editor, the text(actually <span ~~>Isabella</span>) should be changed to "BOOTSTRAP"(actually <span ~~>XXXXXXX</span>). SPACEBAR AVAILABLE: ' ' among the searching characters should be handled as a part of the searching query. It means that ' ' does not close the popup list to autocomplete. If the datasource includes "test spacebar" and I type "test " in the froala editor, the list including "test spacebar" should be maintained shown. MULTILINGUAL AVAILABLE: English, Korean, Japanese. If you want, we can provide test lists of Korean and Japanese. BROWSER COMPATIBILITY: IE10+, Chrome and modern browsers. Our goal is very similar to that of [login to view URL] except using the trigger "@". Therefore, you may use or customize [login to view URL] if possible. You should provide me with complete html/css/javascript pages having a test UI for the above functions.