build

docs/dist/App.js

@@ -19,6 +19,7 @@ synth.set({
   }
 });
 function App() {
+  const [mode, setMode] = useState("javascript");
   const [code, setCode] = useState(tetrisHaskell);
   const [log, setLog] = useState("");
   const logBox = useRef();
@@ -49,7 +50,14 @@ function App() {
   });
   useEffect(() => {
     try {
-      const _pattern = parse(code);
+      let _pattern;
+      try {
+        _pattern = h(code);
+        setMode("pegjs");
+      } catch (err) {
+        setMode("javascript");
+        _pattern = parse(code);
+      }
       setPattern(_pattern);
       setError(void 0);
     } catch (err) {
@@ -78,6 +86,11 @@ function App() {
     className: cx("h-full bg-slate-600", error ? "focus:ring-red-500" : "focus:ring-slate-800")
   }, /* @__PURE__ */ React.createElement(CodeMirror, {
     value: code,
+    options: {
+      mode,
+      theme: "material",
+      lineNumbers: true
+    },
     onChange: (_, __, value) => {
       setLog((log2) => log2 + `${log2 ? "\n\n" : ""}✏️ edit
 ${code}

docs/dist/CodeMirror.js

@@ -1,6 +1,7 @@
 import React from "../_snowpack/pkg/react.js";
 import {Controlled as CodeMirror2} from "../_snowpack/pkg/react-codemirror2.js";
 import "../_snowpack/pkg/codemirror/mode/javascript/javascript.js";
+import "../_snowpack/pkg/codemirror/mode/pegjs/pegjs.js";
 import "../_snowpack/pkg/codemirror/theme/material.css.proxy.js";
 import "../_snowpack/pkg/codemirror/lib/codemirror.css.proxy.js";
 export default function CodeMirror({value, onChange, options}) {

docs/dist/parse.js

@@ -76,6 +76,5 @@ export const mini = (...strings) => {
 };
 export const h = (string) => {
   const ast = krill.parse(string);
-  console.log("ast", ast);
   return patternifyAST(ast);
 };

docs/dist/tunes.js

@@ -62,7 +62,7 @@ export const tetrisMini = `mini(\`[[e5 [b4 c5] d5 [c5 b4]]
 [[b1 b2]*2 [e2 e3]*2]
 [[a1 a2]*4]\`)._slow(16);
 `;
-export const tetrisHaskell = `h(\`slow 16 $ "[[e5 [b4 c5] d5 [c5 b4]]
+export const tetrisHaskellH = `h(\`slow 16 $ "[[e5 [b4 c5] d5 [c5 b4]]
 [a4 [a4 c5] e5 [d5 c5]]
 [b4 [~ c5] d5 e5]
 [c5 a4 a4 ~]
@@ -79,6 +79,23 @@ export const tetrisHaskell = `h(\`slow 16 $ "[[e5 [b4 c5] d5 [c5 b4]]
 [[b1 b2]*2 [e2 e3]*2]
 [[a1 a2]*4]"\`)
 `;
+export const tetrisHaskell = `slow 16 $ "[[e5 [b4 c5] d5 [c5 b4]]
+[a4 [a4 c5] e5 [d5 c5]]
+[b4 [~ c5] d5 e5]
+[c5 a4 a4 ~]
+[[~ d5] [~ f5] a5 [g5 f5]]
+[e5 [~ c5] e5 [d5 c5]]
+[b4 [b4 c5] d5 e5]
+[c5 a4 a4 ~]],
+[[e2 e3]*4]
+[[a2 a3]*4]
+[[g#2 g#3]*2 [e2 e3]*2]
+[a2 a3 a2 a3 a2 a3 b1 c2]
+[[d2 d3]*4]
+[[c2 c3]*4]
+[[b1 b2]*2 [e2 e3]*2]
+[[a1 a2]*4]"
+`;
 export const spanish = `slowcat(
       stack('c4','eb4','g4'),
       stack('bb3','d4','f4'),