Merge pull request #13 from codewars/use-unicode-helper

Rewrite using codemirror-unicode-helper

Author: kazk

.github/workflows/publish_demo.yml

@@ -5,19 +5,15 @@ on:
       - master
 jobs:
   deploy:
-    runs-on: ubuntu-18.04
+    runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@v2
-      - name: Setup Node
-        uses: actions/setup-node@v1
+      - uses: actions/setup-node@v1
         with:
-          node-version: '10.x'
-      - name: Install build deps
-        run: npm ci
-      - name: Prepare docs/
-        run: cp lib/index.js docs/codemirror-agda.js
-      - name: Deploy demo
-        uses: peaceiris/actions-gh-pages@v3
+          node-version: "12.x"
+      - run: npm ci
+      - run: cp umd/*.js docs/
+      - uses: peaceiris/actions-gh-pages@v3
         with:
           github_token: ${{ secrets.GITHUB_TOKEN }}
           publish_dir: ./docs

.gitignore

@@ -1,2 +1,4 @@
 node_modules/
 lib/
+umd/
+docs/*.js

README.md

@@ -1,9 +1,36 @@
 # codemirror-agda
 
-Agda mode and input helper for CodeMirror
+CodeMirror extension for editing Agda.
 
+Provides a function `defineMode` to define `agda` mode, and an array `UNICODE_HELPER_PAIRS`.
+
+- `defineMode(CodeMirror)`: Define `agda` mode and MIME `text/x-agda`.
+- `UNICODE_HELPER_PAIRS` (`[seq: string, sym: string][]`): For entering Unicode characters with ASCII sequences using [@codewars/codemirror-unicode-helper](https://github.com/codewars/codemirror-unicode-helper). A subset of `agda-input-translations` in `agda-input.el`.
+
+See <https://codewars.github.io/codemirror-agda/>.
+
+## Usage
+
+```javascript
+import CodeMirror from "codemirror";
+import "codemirror/addon/mode/simple"; // `defineSimpleMode`
+import "codemirror/addon/hint/show-hint"; // optional
+import { unicodeHelperWith } from "@codewars/codemirror-unicode-helper"; // optional
+
+import { defineMode, UNICODE_HELPER_PAIRS } from "@codewars/codemirror-agda";
+
+defineMode(CodeMirror);
+// Optionally register unicode input helper.
+// `show-hint` addon is required.
+CodeMirror.registerGlobalHelper(
+  "hint",
+  "agda-input",
+  // only enable in agda mode
+  (mode, cm) => mode && mode.name === "agda",
+  unicodeHelperWith(UNICODE_HELPER_PAIRS)
+);
+```
 
 ## Acknowledgments
 
-- Agda mode was contributed by [@Bubbler-4](https://github.com/Bubbler-4)
-- Agda input is based on [ejgallego/CodeMirror-TeX-input](https://github.com/ejgallego/CodeMirror-TeX-input)
+Agda mode was contributed by [@Bubbler-4](https://github.com/Bubbler-4).

docs/index.html

@@ -65,8 +65,18 @@ <h2>Agda mode</h2>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.44.0/keymap/vim.min.js"></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.44.0/keymap/emacs.min.js"></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.44.0/keymap/sublime.min.js"></script>
-<script src="codemirror-agda.js"></script>
+<script src="https://unpkg.com/@codewars/[email protected]/umd/codemirror-unicode-helper.min.js"></script>
+<script src="codemirror-agda.min.js"></script>
 <script>
+  CodeMirrorAgda.defineMode(CodeMirror);
+  CodeMirror.registerGlobalHelper(
+    "hint",
+    "agda-input",
+    // only enable in agda mode
+    (mode, cm) => mode && mode.name === "agda",
+    CodeMirrorUnicodeHelper.unicodeHelperWith(CodeMirrorAgda.UNICODE_HELPER_PAIRS)
+  );
+
   const autocompleteKeyMap = {
     "\\": function(cm) {
       cm.replaceSelection("\\");

package-lock.json

@@ -1,28 +1,37 @@
 {
   "name": "@codewars/codemirror-agda",
   "version": "0.1.0",
-  "description": "Agda mode and input helper for CodeMirror",
+  "description": "CodeMirror extension for editing Agda",
   "homepage": "https://github.com/codewars/codemirror-agda#readme",
   "repository": "github:codewars/codemirror-agda",
+  "license": "MIT",
   "bugs": {
     "url": "https://github.com/codewars/codemirror-agda/issues"
   },
-  "main": "lib/index.js",
+  "main": "lib/cjs/index.js",
+  "module": "lib/esm/index.js",
   "files": [
     "lib/*",
-    "src/*"
+    "umd/*"
   ],
-  "module": "src/index.js",
-  "license": "MIT",
   "scripts": {
-    "prepare": "rollup -i src/index.js -o lib/index.js --format umd --external codemirror --globals codemirror:CodeMirror"
+    "prepare": "npm run build",
+    "build": "npm run build:esm && npm run build:cjs && npm run build:umd && npm run build:umd:min",
+    "build:cjs": "tsc --target es2020 --module commonjs --outDir lib/cjs",
+    "build:esm": "tsc --target es2020 --module es2020 --outDir lib/esm",
+    "build:umd": "rollup lib/esm/index.js --format umd --name CodeMirrorAgda -o umd/codemirror-agda.js",
+    "build:umd:min": "terser umd/codemirror-agda.js -o umd/codemirror-agda.min.js"
   },
   "peerDependencies": {
     "codemirror": "5.x"
   },
   "devDependencies": {
+    "@codewars/codemirror-unicode-helper": "^0.1.0",
+    "@types/codemirror": "0.0.108",
     "codemirror": "^5.44.0",
-    "rollup": "^1.6.0"
+    "rollup": "^2.41.2",
+    "terser": "^5.6.0",
+    "typescript": "^4.2.3"
   },
   "dependencies": {}
 }

package.json

@@ -1,26 +1,21 @@
-const hint = (cm, self, data) =>
-  cm.replaceRange(data.symbol, self.from, self.to);
-
-const cmObj = (k, v) => ({
-  text: "\\" + k,
-  symbol: v,
-  displayText: `${v} \\${k}`,
-  hint: hint,
-});
-
-const toTable = pairs =>
-  pairs.reduce((a, p) => {
-    a.push.apply(
-      a,
-      Array.from(p[1].replace(/\s/g, "")).map(v => cmObj(p[0], v))
-    );
-    return a;
-  }, []).sort((a,b) => a.text.localeCompare(b.text));
+import type { Pair } from "@codewars/codemirror-unicode-helper";
+
+const toPairs = (trans: [string, string][]): Pair[] =>
+  trans
+    .reduce((a, [seq, syms]) => {
+      a.push.apply(
+        a,
+        Array.from(syms.replace(/\s/g, "")).map((v) => [seq, v] as Pair)
+      );
+      return a;
+    }, [] as Pair[])
+    .sort((a, b) => a[0].localeCompare(b[0]));
 
 // Subset of agda-input-translations + TeX-Input
 // TODO Add some more from TeX-Input
 // https://github.com/agda/agda/blob/master/src/data/emacs-mode/agda-input.el#L191
-export const translations = toTable([
+// prettier-ignore
+export const UNICODE_HELPER_PAIRS: Pair[] = toPairs([
   ["ell", "ℓ"],
   // Equality and similar symbols.
   // ["eq", "=∼∽≈≋∻∾∿≀≃⋍≂≅ ≌≊≡≣≐≑≒≓≔≕≖≗≘≙≚≛≜≝≞≟≍≎≏≬⋕"],

src/agda-input.js

@@ -1,5 +1,10 @@
-import CodeMirror from "codemirror";
-// Requires addon/mode/simple.js
+/// <reference types="codemirror/addon/mode/simple" />
+import type { defineMIME, defineSimpleMode } from "codemirror";
+
+export type CodeMirrorType = {
+  defineMIME: typeof defineMIME;
+  defineSimpleMode: typeof defineSimpleMode;
+};
 
 const floatRegex = /-?(?:0|[1-9]\d*)(?:\.\d+)?(?:[eE][+-]?\d+)?(?=[.;{}()@"\s]|$)/u;
 const integerRegex = /-?(?:0|[1-9]\d*|0x[0-9A-Fa-f]+)(?=[.;{}()@"\s]|$)/u;
@@ -77,12 +82,18 @@ const stringState = [
   { regex: /./u, token: "string error" },
 ];
 
-CodeMirror.defineSimpleMode("agda", {
-  start: startState,
-  comment: commentState,
-  hole: holeState,
-  charLit: charLitState,
-  charLitEnd: charLitEndState,
-  strLit: stringState,
-});
-CodeMirror.defineMIME("text/x-agda", "agda");
+/**
+ * Defines `agda` mode and `text/x-agda` MIME.
+ * @param CodeMirror - CodeMirror
+ */
+export const defineMode = (CodeMirror: CodeMirrorType) => {
+  CodeMirror.defineSimpleMode("agda", {
+    start: startState,
+    comment: commentState,
+    hole: holeState,
+    charLit: charLitState,
+    charLitEnd: charLitEndState,
+    strLit: stringState,
+  });
+  CodeMirror.defineMIME("text/x-agda", "agda");
+};