remove old codemirror packages + styles

package-lock.json

@@ -9193,6 +9193,7 @@
       }
     },
     "packages/serial": {
+      "name": "@strudel.cycles/serial",
       "version": "0.0.6",
       "license": "GPL-3.0-or-later"
     },

repl/package-lock.json

@@ -12,12 +12,10 @@
         "@testing-library/jest-dom": "^5.16.3",
         "@testing-library/react": "^12.1.4",
         "@testing-library/user-event": "^13.5.0",
-        "codemirror": "^5.65.2",
         "codemirror6-themes": "^0.1.2",
         "events": "^3.3.0",
         "gh-pages": "^3.2.3",
         "react": "^17.0.2",
-        "react-codemirror2": "^7.2.1",
         "react-codemirror6": "^1.1.0",
         "react-dom": "^17.0.2",
         "react-hook-inview": "^4.4.1",
@@ -7813,11 +7811,6 @@
         "node": ">= 4.0"
       }
     },
-    "node_modules/codemirror": {
-      "version": "5.65.2",
-      "resolved": "https://registry.npmjs.org/codemirror/-/codemirror-5.65.2.tgz",
-      "integrity": "sha512-SZM4Zq7XEC8Fhroqe3LxbEEX1zUPWH1wMr5zxiBuiUF64iYOUH/JI88v4tBag8MiBS8B8gRv8O1pPXGYXQ4ErA=="
-    },
     "node_modules/codemirror6-themes": {
       "version": "0.1.2",
       "resolved": "https://registry.npmjs.org/codemirror6-themes/-/codemirror6-themes-0.1.2.tgz",
@@ -16701,15 +16694,6 @@
         "node": ">=14"
       }
     },
-    "node_modules/react-codemirror2": {
-      "version": "7.2.1",
-      "resolved": "https://registry.npmjs.org/react-codemirror2/-/react-codemirror2-7.2.1.tgz",
-      "integrity": "sha512-t7YFmz1AXdlImgHXA9Ja0T6AWuopilub24jRaQdPVbzUJVNKIYuy3uCFZYa7CE5S3UW6SrSa5nAqVQvtzRF9gw==",
-      "peerDependencies": {
-        "codemirror": "5.x",
-        "react": ">=15.5 <=16.x"
-      }
-    },
     "node_modules/react-codemirror6": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/react-codemirror6/-/react-codemirror6-1.1.0.tgz",
@@ -25905,11 +25889,6 @@
         "q": "^1.1.2"
       }
     },
-    "codemirror": {
-      "version": "5.65.2",
-      "resolved": "https://registry.npmjs.org/codemirror/-/codemirror-5.65.2.tgz",
-      "integrity": "sha512-SZM4Zq7XEC8Fhroqe3LxbEEX1zUPWH1wMr5zxiBuiUF64iYOUH/JI88v4tBag8MiBS8B8gRv8O1pPXGYXQ4ErA=="
-    },
     "codemirror6-themes": {
       "version": "0.1.2",
       "resolved": "https://registry.npmjs.org/codemirror6-themes/-/codemirror6-themes-0.1.2.tgz",
@@ -32213,12 +32192,6 @@
         "whatwg-fetch": "^3.6.2"
       }
     },
-    "react-codemirror2": {
-      "version": "7.2.1",
-      "resolved": "https://registry.npmjs.org/react-codemirror2/-/react-codemirror2-7.2.1.tgz",
-      "integrity": "sha512-t7YFmz1AXdlImgHXA9Ja0T6AWuopilub24jRaQdPVbzUJVNKIYuy3uCFZYa7CE5S3UW6SrSa5nAqVQvtzRF9gw==",
-      "requires": {}
-    },
     "react-codemirror6": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/react-codemirror6/-/react-codemirror6-1.1.0.tgz",

repl/package.json

@@ -8,12 +8,10 @@
     "@testing-library/jest-dom": "^5.16.3",
     "@testing-library/react": "^12.1.4",
     "@testing-library/user-event": "^13.5.0",
-    "codemirror": "^5.65.2",
     "codemirror6-themes": "^0.1.2",
     "events": "^3.3.0",
     "gh-pages": "^3.2.3",
     "react": "^17.0.2",
-    "react-codemirror2": "^7.2.1",
     "react-codemirror6": "^1.1.0",
     "react-dom": "^17.0.2",
     "react-hook-inview": "^4.4.1",

repl/src/CodeMirror.jsx

@@ -1,121 +0,0 @@
-import React from 'react';
-import { Controlled as CodeMirror2 } from 'react-codemirror2';
-import 'codemirror/mode/javascript/javascript';
-import 'codemirror/mode/pegjs/pegjs';
-// import 'codemirror/theme/material.css';
-import 'codemirror/lib/codemirror.css';
-import 'codemirror/theme/material.css';
-
-export default function CodeMirror({ value, onChange, onCursor, options, editorDidMount }) {
-  options = options || {
-    mode: 'javascript',
-    theme: 'material',
-    lineNumbers: true,
-    styleSelectedText: true,
-    cursorBlinkRate: 500,
-  };
-  return (
-    <CodeMirror2
-      value={value}
-      options={options}
-      onBeforeChange={onChange}
-      editorDidMount={editorDidMount}
-      onCursor={(editor, data) => onCursor?.(editor, data)}
-    />
-  );
-}
-
-export const markEvent = (editor) => (time, event) => {
-  const locs = event.context.locations;
-  if (!locs || !editor) {
-    return;
-  }
-  const col = event.context?.color || '#FFCA28';
-  // mark active event
-  const marks = locs.map(({ start, end }) =>
-    editor.getDoc().markText(
-      { line: start.line - 1, ch: start.column },
-      { line: end.line - 1, ch: end.column },
-      //{ css: 'background-color: #FFCA28; color: black' } // background-color is now used by parent marking
-      { css: 'outline: 1px solid ' + col + '; box-sizing:border-box' },
-      //{ css: `background-color: ${col};border-radius:5px` },
-    ),
-  );
-  //Tone.Transport.schedule(() => { // problem: this can be cleared by scheduler...
-  setTimeout(() => {
-    marks.forEach((mark) => mark.clear());
-    // }, '+' + event.duration.valueOf() * 0.5);
-  }, event.duration.valueOf() /* * 0.9 */ * 1000);
-};
-
-let parenMark;
-export const markParens = (editor, data) => {
-  const v = editor.getDoc().getValue();
-  const marked = getCurrentParenArea(v, data);
-  parenMark?.clear();
-  parenMark = editor.getDoc().markText(...marked, { css: 'background-color: #00007720' }); //
-};
-
-// returns { line, ch } from absolute character offset
-export function offsetToPosition(offset, code) {
-  const lines = code.split('\n');
-  let line = 0;
-  let ch = 0;
-  for (let i = 0; i < offset; i++) {
-    if (ch === lines[line].length) {
-      line++;
-      ch = 0;
-    } else {
-      ch++;
-    }
-  }
-  return { line, ch };
-}
-
-// returns absolute character offset from { line, ch }
-export function positionToOffset(position, code) {
-  const lines = code.split('\n');
-  let offset = 0;
-  for (let i = 0; i < position.line; i++) {
-    offset += lines[i].length + 1;
-  }
-  offset += position.ch;
-  return offset;
-}
-
-// given code and caret position, the functions returns the indices of the parens we are in
-export function getCurrentParenArea(code, caretPosition) {
-  const caret = positionToOffset(caretPosition, code);
-  let open, i, begin, end;
-  // walk left
-  i = caret;
-  open = 0;
-  while (i > 0) {
-    if (code[i - 1] === '(') {
-      open--;
-    } else if (code[i - 1] === ')') {
-      open++;
-    }
-    if (open === -1) {
-      break;
-    }
-    i--;
-  }
-  begin = i;
-  // walk right
-  i = caret;
-  open = 0;
-  while (i < code.length) {
-    if (code[i] === '(') {
-      open--;
-    } else if (code[i] === ')') {
-      open++;
-    }
-    if (open === 1) {
-      break;
-    }
-    i++;
-  }
-  end = i;
-  return [begin, end].map((o) => offsetToPosition(o, code));
-}

repl/src/tutorial/style.css

@@ -2,12 +2,6 @@
 @tailwind components;
 @tailwind utilities;
 
-.react-codemirror2,
-.CodeMirror {
-  width: 100% !important;
-  height: inherit !important;
-}
-
 .cm-editor {
   background-color: transparent !important;
 }