https://github.com/jurjanpaul/codemirror6-parinfer
CodeMirror 6 Parinfer extension
https://github.com/jurjanpaul/codemirror6-parinfer
clojure codemirror codemirror6 parinfer scittle
Last synced: 4 months ago
JSON representation
CodeMirror 6 Parinfer extension
- Host: GitHub
- URL: https://github.com/jurjanpaul/codemirror6-parinfer
- Owner: jurjanpaul
- License: mit
- Created: 2024-10-26T14:18:00.000Z (8 months ago)
- Default Branch: main
- Last Pushed: 2025-02-09T21:09:36.000Z (4 months ago)
- Last Synced: 2025-02-09T21:15:13.702Z (4 months ago)
- Topics: clojure, codemirror, codemirror6, parinfer, scittle
- Language: Clojure
- Homepage: https://www.npmjs.com/package/@jurjanpaul/codemirror6-parinfer
- Size: 201 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# CodeMirror 6 Parinfer extension
A [CodeMirror 6](https://codemirror.net/) extension that integrates [Parinfer](https://shaunlebron.github.io/parinfer/), which facilitates structural editing of Lisp code (Clojure code in particular) by indentation.
By default [`smartMode`](https://github.com/parinfer/parinfer.js/tree/master#status-update-2019-smart-mode) is applied, but both `indentMode` and `parenMode` can be selected as well. (For now the extension does not support styling the [Paren Trail](https://github.com/parinfer/parinfer.js/blob/master/doc/code.md#paren-trail).)
Initially I used ClojureScript on [Scittle](https://babashka.org/scittle/) to explore what was needed to get the integration to work, but the actual extension is written in TypeScript and available from [npmjs.com](https://www.npmjs.com/package/@jurjanpaul/codemirror6-parinfer).
Try it at [the demo page](https://jurjanpaul.github.io/codemirror6-parinfer/)!
Please let me know if you have a use for this or have any feedback!
## Basic usage
```
import { basicSetup } from 'codemirror';
import { EditorState } from '@codemirror/state';
import { EditorView } from '@codemirror/view';
import { parinferExtension } from '@jurjanpaul/codemirror6-parinfer';
const doc = `
(defn foo []
[:bar \"baz\"])`
new EditorView({
state: EditorState.create({
doc,
extensions: [basicSetup, parinferExtension()],
}),
parent: document.getElementById("editor");
});
```
## Motivation
I had previously used CodeMirror 5 with Parinfer in the [Away from Preferred Editor ClojureScript Playground](https://github.com/jurjanpaul/ape-cljs-playground) and hoped to upgrade to CodeMirror 6 as soon as somebody would make a Parinfer extension available.
For quite a while, as a Clojure programmer I was simply too intimidated by the statically typed CodeMirror 6 module architecture to even consider taking on that task myself next to a few other side projects. But still not finding one some years after the CodeMirror 6 release, I finally found the time and motivation to take up the challenge, starting with studying TypeScript, etc.
## Implementation
Some observations w.r.t. the implementation can be found [here](docs/implementation.md).