Thanks for the suggestion. I’m trying that now, but not getting anywhere unfortunately. This is what I’ve tried so far after hunting down examples and looking through the source code of CodeMirror to try and find out how to use languageDataOf
. I’m sorry, but I’m new to CodeMirror and not super adept at JavaScript. I’m more of an Objective-C and Swift developer.
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 myCompletions(context) {
let word = context.matchBefore(/\w*/)
if (word.from == word.to && !context.explicit)
return null
return {
from: word.from,
options: completions
}
};
function javascriptCompletions(context) {
let word = context.matchBefore(/\w*/)
if (word.from == word.to && !context.explicit)
return null
return {
from: word.from,
options: editorView.state.languageDataAt("autocomplete")
}
};
const editorView = new CodeMirror.EditorView({
doc: "",
state: EditorState.create({
extensions: [
lineNumbers(),
highlightActiveLineGutter(),
highlightSpecialChars(),
history(),
foldGutter(),
drawSelection(),
dropCursor(),
indentOnInput(),
syntaxHighlighting(defaultHighlightStyle, { fallback: true }),
bracketMatching(),
closeBrackets(),
autocompletion({override: [myCompletions, javascriptCompletions]}),
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,
});