Extend autocompletions

[brendand]

I'd like to be able to add in my own autocompletions to the list of available ones.

Do you know how to do that? The documentation on the CodeMirror 6 website is not very clear on how to put it all together.

I've been trying to put some of the examples into your editor.js file, but I end up getting compile errors.

Do you know how to extend the list of autocompletions?

[brendand]

I figured out how to do this. In editor.js add the following code:

const completions = [
    {label: "fetchRecords", type: "keyword"},
    {label: "record", type: "variable", info: "The current selected record"},
    {label: "form", type: "variable", info: "The current selected form"},
    {label: "search", type: "variable", info: "The current selected search"},
    {label: "document", type: "variable", info: "The current opened document"},
    {label: "Utils", type: "keyword"},
];

function customCompletions(context) {
    let word = context.matchBefore(/\w*/)
    if (word.from == word.to && !context.explicit)
        return null
        return {
            from: word.from,
        options: completions
        }
};

const myCustomCompletions = javascriptLanguage.data.of({
autocomplete: customCompletions
});

and then in the extensions part of creating the CodeMirror.EditorView, add myCustomCompletions above autocompletion()

const editorView = new CodeMirror.EditorView({
  doc: "",
  extensions: [
      lineNumbers(),
      highlightActiveLineGutter(),
      highlightSpecialChars(),
      history(),
      foldGutter(),
      drawSelection(),
      dropCursor(),
      indentOnInput(),
      syntaxHighlighting(defaultHighlightStyle, { fallback: true }),
      bracketMatching(),
      closeBrackets(),
      myCustomCompletions,
      autocompletion(),
      rectangularSelection(),
      crosshairCursor(),
      highlightActiveLine(),
      highlightSelectionMatches(),
      keymap.of([
          ...closeBracketsKeymap,
             ...defaultKeymap,
             ...searchKeymap,
             ...historyKeymap,
             ...foldKeymap,
             ...completionKeymap,
             indentWithTab,
      ]),
      readOnly.of([]),
      lineWrapping.of([]),
      baseTheme,
      theme.of(oneDark),
      language.of(javascript()),
      listener.of([]),
  ],
  parent: document.body,
});