- 🏳🌈 Syntax highlighting
- 📔 History
- 💢 Linting
- 🔎 Search
- ℹ️ tooltip
Editor is stable. Currently it is being used by the sparql-browser-extension. It returns a Codemirror 6 EditorView instance. So you can manipulate the editor as documented in the codemirror documentation
Codemirror 6 editor instance with some sane presets and some additional functionality. It uses codemirror-lang-sparql parser for syntax highlighting. Linting and linting errors are being generated by the SPARQL.js package.
npm i sparql-editor
import { createSparqlEditor } from "sparql-editor"
const domElement = document.getElementById("editor")
const editor = createSparqlEditor({
parent: domElement,
onChange: onChange,
value: "SELECT * WHERE { ?s ?p ?o }"
});
function onChange(value, codemirrorViewInstance) {
console.log(codemirrorViewInstance)
alert(value)
}
ENV | Description | default | required |
---|---|---|---|
parent | html dom element to attach editor to | / | required |
onChange | function that gets called whenever editor value changes | / | |
value | Initial value of editor | Lines 32 to 37 in 4732494 |
Currently there is no easy way for adding extentions to the editor, this will hopefully be added soon. Until then, the best direction to take is forking this project, installing or deleting extensions and updating the index.ts file accordingly.
- clone this repo
cd
into it- run
npm install
- run
npm run dev
In the test folder there is a index.html file. Your editor probably has an extension that can easily serve this file for you. In case you are using VSCode, you can use the Live Server Extension.
[x] Tooltip functionality
[] Linting by codemirror-lang-sparql
[] Autocomplete functionality
[] Extensible extensions
Everyone can open an issue or send in a pull request.
This project is MIT licensed.