Hi everyone,
I’m using CodeMirror 6 in a custom query editor, and I support variables in the format $variableKey (e.g., $freetext). These variables are defined elsewhere in the app and can have dynamic values (e.g., $freetext = "5"). Some variables can also have the type multiselect, in which case their value is an array of selected values (e.g., ["apple", "banana"]).To support autocompletion, I previously replaced variables in the document with placeholder text that matched the length of the original variable key. In my editor, variables are referenced using the $variableKey format (e.g., $freeText). For replacement, I removed the $ and used a placeholder of the same length as the remaining key — for example, $freeText became freeTex. This was done to preserve text length and cursor positions during autocompletion, but I didn’t use the actual variable values during replacement.This worked in many cases, but it breaks when the variable is inside a function call, like:
| fieldsAdd tf1 = asDouble(($freetext)
After replacement, the syntax becomes invalid (e.g., unbalanced parentheses or quotes), and autocompletion stops working in the next pipe (|).What I want:
- Keep
$freetextvisible in the editor (not replaced). - Ensure autocompletion works reliably based on the variableValue
- Avoid modifying the document or cursor position during autocompletion.
I’ve read that using a ViewPlugin with decorations might be a better approach — to visually replace $freetext with its value without modifying the document. But I’m not sure how to implement this correctly or how to integrate it with autocompletion. My current CodeMirror versions:
"@codemirror/autocomplete": "^6.8.0",
"@codemirror/language": "^6.8.0",
"@codemirror/lint": "^6.4.0",
"@codemirror/state": "^6.2.0",
"@codemirror/view": "^6.19.0",
Thanks so much in advance!