mirror of
https://github.com/eliasstepanik/strudel-docker.git
synced 2026-01-11 13:48:34 +00:00
Merge branch 'codemirror-6' into reset
This commit is contained in:
alex
commit
21a1fe5056
1
package-lock.json
generated
1
package-lock.json
generated
@ -9193,6 +9193,7 @@
|
||||
}
|
||||
},
|
||||
"packages/serial": {
|
||||
"name": "@strudel.cycles/serial",
|
||||
"version": "0.0.6",
|
||||
"license": "GPL-3.0-or-later"
|
||||
},
|
||||
|
||||
626
repl/package-lock.json
generated
626
repl/package-lock.json
generated
@ -8,15 +8,17 @@
|
||||
"name": "@strudel.cycles/repl",
|
||||
"version": "0.1.0",
|
||||
"dependencies": {
|
||||
"@codemirror/lang-javascript": "^0.19.0",
|
||||
"@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",
|
||||
"react-scripts": "5.0.0",
|
||||
"tone": "^14.7.77",
|
||||
"web-vitals": "^2.1.4"
|
||||
@ -28,6 +30,7 @@
|
||||
"autoprefixer": "^10.4.4",
|
||||
"parcel": "^2.3.1",
|
||||
"postcss": "^8.4.12",
|
||||
"process": "^0.11.10",
|
||||
"serve": "^13.0.2",
|
||||
"tailwindcss": "^3.0.23"
|
||||
}
|
||||
@ -1857,6 +1860,223 @@
|
||||
"resolved": "https://registry.npmjs.org/@bcoe/v8-coverage/-/v8-coverage-0.2.3.tgz",
|
||||
"integrity": "sha512-0hYQ8SB4Db5zvZB4axdMHGwEaQjkZzFjQiN9LVYvIFB2nSUHW9tYpxWriPrWDASIxiaXax83REcLxuSdnGPZtw=="
|
||||
},
|
||||
"node_modules/@codemirror/autocomplete": {
|
||||
"version": "0.19.15",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/autocomplete/-/autocomplete-0.19.15.tgz",
|
||||
"integrity": "sha512-GQWzvvuXxNUyaEk+5gawbAD8s51/v2Chb++nx0e2eGWrphWk42isBtzOMdc3DxrxrZtPZ55q2ldNp+6G8KJLIQ==",
|
||||
"dependencies": {
|
||||
"@codemirror/language": "^0.19.0",
|
||||
"@codemirror/state": "^0.19.4",
|
||||
"@codemirror/text": "^0.19.2",
|
||||
"@codemirror/tooltip": "^0.19.12",
|
||||
"@codemirror/view": "^0.19.0",
|
||||
"@lezer/common": "^0.15.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/closebrackets": {
|
||||
"version": "0.19.2",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/closebrackets/-/closebrackets-0.19.2.tgz",
|
||||
"integrity": "sha512-ClMPzPcPP0eQiDcVjtVPl6OLxgdtZSYDazsvT0AKl70V1OJva0eHgl4/6kCW3RZ0pb2n34i9nJz4eXCmK+TYDA==",
|
||||
"dependencies": {
|
||||
"@codemirror/language": "^0.19.0",
|
||||
"@codemirror/rangeset": "^0.19.0",
|
||||
"@codemirror/state": "^0.19.2",
|
||||
"@codemirror/text": "^0.19.0",
|
||||
"@codemirror/view": "^0.19.44"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/commands": {
|
||||
"version": "0.19.8",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/commands/-/commands-0.19.8.tgz",
|
||||
"integrity": "sha512-65LIMSGUGGpY3oH6mzV46YWRrgao6NmfJ+AuC7jNz3K5NPnH6GCV1H5I6SwOFyVbkiygGyd0EFwrWqywTBD1aw==",
|
||||
"dependencies": {
|
||||
"@codemirror/language": "^0.19.0",
|
||||
"@codemirror/matchbrackets": "^0.19.0",
|
||||
"@codemirror/state": "^0.19.2",
|
||||
"@codemirror/text": "^0.19.6",
|
||||
"@codemirror/view": "^0.19.22",
|
||||
"@lezer/common": "^0.15.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/comment": {
|
||||
"version": "0.19.1",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/comment/-/comment-0.19.1.tgz",
|
||||
"integrity": "sha512-uGKteBuVWAC6fW+Yt8u27DOnXMT/xV4Ekk2Z5mRsiADCZDqYvryrJd6PLL5+8t64BVyocwQwNfz1UswYS2CtFQ==",
|
||||
"dependencies": {
|
||||
"@codemirror/state": "^0.19.9",
|
||||
"@codemirror/text": "^0.19.0",
|
||||
"@codemirror/view": "^0.19.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/fold": {
|
||||
"version": "0.19.4",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/fold/-/fold-0.19.4.tgz",
|
||||
"integrity": "sha512-0SNSkRSOa6gymD6GauHa3sxiysjPhUC0SRVyTlvL52o0gz9GHdc8kNqNQskm3fBtGGOiSriGwF/kAsajRiGhVw==",
|
||||
"dependencies": {
|
||||
"@codemirror/gutter": "^0.19.0",
|
||||
"@codemirror/language": "^0.19.0",
|
||||
"@codemirror/rangeset": "^0.19.0",
|
||||
"@codemirror/state": "^0.19.0",
|
||||
"@codemirror/view": "^0.19.22"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/gutter": {
|
||||
"version": "0.19.9",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/gutter/-/gutter-0.19.9.tgz",
|
||||
"integrity": "sha512-PFrtmilahin1g6uL27aG5tM/rqR9DZzZYZsIrCXA5Uc2OFTFqx4owuhoU9hqfYxHp5ovfvBwQ+txFzqS4vog6Q==",
|
||||
"dependencies": {
|
||||
"@codemirror/rangeset": "^0.19.0",
|
||||
"@codemirror/state": "^0.19.0",
|
||||
"@codemirror/view": "^0.19.23"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/highlight": {
|
||||
"version": "0.19.8",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/highlight/-/highlight-0.19.8.tgz",
|
||||
"integrity": "sha512-v/lzuHjrYR8MN2mEJcUD6fHSTXXli9C1XGYpr+ElV6fLBIUhMTNKR3qThp611xuWfXfwDxeL7ppcbkM/MzPV3A==",
|
||||
"dependencies": {
|
||||
"@codemirror/language": "^0.19.0",
|
||||
"@codemirror/rangeset": "^0.19.0",
|
||||
"@codemirror/state": "^0.19.3",
|
||||
"@codemirror/view": "^0.19.39",
|
||||
"@lezer/common": "^0.15.0",
|
||||
"style-mod": "^4.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/history": {
|
||||
"version": "0.19.2",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/history/-/history-0.19.2.tgz",
|
||||
"integrity": "sha512-unhP4t3N2smzmHoo/Yio6ueWi+il8gm9VKrvi6wlcdGH5fOfVDNkmjHQ495SiR+EdOG35+3iNebSPYww0vN7ow==",
|
||||
"dependencies": {
|
||||
"@codemirror/state": "^0.19.2",
|
||||
"@codemirror/view": "^0.19.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/lang-javascript": {
|
||||
"version": "0.19.7",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/lang-javascript/-/lang-javascript-0.19.7.tgz",
|
||||
"integrity": "sha512-DL9f3JLqOEHH9cIwEqqjnP5bkjdVXeECksLtV+/MbPm+l4H+AG+PkwZaJQ2oR1GfPZKh8MVSIE94aGWNkJP8WQ==",
|
||||
"dependencies": {
|
||||
"@codemirror/autocomplete": "^0.19.0",
|
||||
"@codemirror/highlight": "^0.19.7",
|
||||
"@codemirror/language": "^0.19.0",
|
||||
"@codemirror/lint": "^0.19.0",
|
||||
"@codemirror/state": "^0.19.0",
|
||||
"@codemirror/view": "^0.19.0",
|
||||
"@lezer/javascript": "^0.15.1"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/language": {
|
||||
"version": "0.19.10",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/language/-/language-0.19.10.tgz",
|
||||
"integrity": "sha512-yA0DZ3RYn2CqAAGW62VrU8c4YxscMQn45y/I9sjBlqB1e2OTQLg4CCkMBuMSLXk4xaqjlsgazeOQWaJQOKfV8Q==",
|
||||
"dependencies": {
|
||||
"@codemirror/state": "^0.19.0",
|
||||
"@codemirror/text": "^0.19.0",
|
||||
"@codemirror/view": "^0.19.0",
|
||||
"@lezer/common": "^0.15.5",
|
||||
"@lezer/lr": "^0.15.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/lint": {
|
||||
"version": "0.19.6",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/lint/-/lint-0.19.6.tgz",
|
||||
"integrity": "sha512-Pbw1Y5kHVs2J+itQ0uez3dI4qY9ApYVap7eNfV81x1/3/BXgBkKfadaw0gqJ4h4FDG7OnJwb0VbPsjJQllHjaA==",
|
||||
"dependencies": {
|
||||
"@codemirror/gutter": "^0.19.4",
|
||||
"@codemirror/panel": "^0.19.0",
|
||||
"@codemirror/rangeset": "^0.19.1",
|
||||
"@codemirror/state": "^0.19.4",
|
||||
"@codemirror/tooltip": "^0.19.16",
|
||||
"@codemirror/view": "^0.19.22",
|
||||
"crelt": "^1.0.5"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/matchbrackets": {
|
||||
"version": "0.19.4",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/matchbrackets/-/matchbrackets-0.19.4.tgz",
|
||||
"integrity": "sha512-VFkaOKPNudAA5sGP1zikRHCEKU0hjYmkKpr04pybUpQvfTvNJXlReCyP0rvH/1iEwAGPL990ZTT+QrLdu4MeEA==",
|
||||
"dependencies": {
|
||||
"@codemirror/language": "^0.19.0",
|
||||
"@codemirror/state": "^0.19.0",
|
||||
"@codemirror/view": "^0.19.0",
|
||||
"@lezer/common": "^0.15.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/panel": {
|
||||
"version": "0.19.1",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/panel/-/panel-0.19.1.tgz",
|
||||
"integrity": "sha512-sYeOCMA3KRYxZYJYn5PNlt9yNsjy3zTNTrbYSfVgjgL9QomIVgOJWPO5hZ2sTN8lufO6lw0vTBsIPL9MSidmBg==",
|
||||
"dependencies": {
|
||||
"@codemirror/state": "^0.19.0",
|
||||
"@codemirror/view": "^0.19.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/rangeset": {
|
||||
"version": "0.19.9",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/rangeset/-/rangeset-0.19.9.tgz",
|
||||
"integrity": "sha512-V8YUuOvK+ew87Xem+71nKcqu1SXd5QROMRLMS/ljT5/3MCxtgrRie1Cvild0G/Z2f1fpWxzX78V0U4jjXBorBQ==",
|
||||
"dependencies": {
|
||||
"@codemirror/state": "^0.19.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/rectangular-selection": {
|
||||
"version": "0.19.2",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/rectangular-selection/-/rectangular-selection-0.19.2.tgz",
|
||||
"integrity": "sha512-AXK/p5eGwFJ9GJcLfntqN4dgY+XiIF7eHfXNQJX5HhQLSped2wJE6WuC1rMEaOlcpOqlb9mrNi/ZdUjSIj9mbA==",
|
||||
"dependencies": {
|
||||
"@codemirror/state": "^0.19.0",
|
||||
"@codemirror/text": "^0.19.4",
|
||||
"@codemirror/view": "^0.19.48"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/search": {
|
||||
"version": "0.19.10",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/search/-/search-0.19.10.tgz",
|
||||
"integrity": "sha512-qjubm69HJixPBWzI6HeEghTWOOD8NXiHOTRNvdizqs8xWRuFChq9zkjD3XiAJ7GXSTzCuQJnAP9DBBGCLq4ZIA==",
|
||||
"dependencies": {
|
||||
"@codemirror/panel": "^0.19.0",
|
||||
"@codemirror/rangeset": "^0.19.0",
|
||||
"@codemirror/state": "^0.19.3",
|
||||
"@codemirror/text": "^0.19.0",
|
||||
"@codemirror/view": "^0.19.34",
|
||||
"crelt": "^1.0.5"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/state": {
|
||||
"version": "0.19.9",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/state/-/state-0.19.9.tgz",
|
||||
"integrity": "sha512-psOzDolKTZkx4CgUqhBQ8T8gBc0xN5z4gzed109aF6x7D7umpDRoimacI/O6d9UGuyl4eYuDCZmDFr2Rq7aGOw==",
|
||||
"dependencies": {
|
||||
"@codemirror/text": "^0.19.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/text": {
|
||||
"version": "0.19.6",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/text/-/text-0.19.6.tgz",
|
||||
"integrity": "sha512-T9jnREMIygx+TPC1bOuepz18maGq/92q2a+n4qTqObKwvNMg+8cMTslb8yxeEDEq7S3kpgGWxgO1UWbQRij0dA=="
|
||||
},
|
||||
"node_modules/@codemirror/tooltip": {
|
||||
"version": "0.19.16",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/tooltip/-/tooltip-0.19.16.tgz",
|
||||
"integrity": "sha512-zxKDHryUV5/RS45AQL+wOeN+i7/l81wK56OMnUPoTSzCWNITfxHn7BToDsjtrRKbzHqUxKYmBnn/4hPjpZ4WJQ==",
|
||||
"dependencies": {
|
||||
"@codemirror/state": "^0.19.0",
|
||||
"@codemirror/view": "^0.19.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/view": {
|
||||
"version": "0.19.48",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/view/-/view-0.19.48.tgz",
|
||||
"integrity": "sha512-0eg7D2Nz4S8/caetCTz61rK0tkHI17V/d15Jy0kLOT8dTLGGNJUponDnW28h2B6bERmPlVHKh8MJIr5OCp1nGw==",
|
||||
"dependencies": {
|
||||
"@codemirror/rangeset": "^0.19.5",
|
||||
"@codemirror/state": "^0.19.3",
|
||||
"@codemirror/text": "^0.19.0",
|
||||
"style-mod": "^4.0.0",
|
||||
"w3c-keyname": "^2.2.4"
|
||||
}
|
||||
},
|
||||
"node_modules/@csstools/normalize.css": {
|
||||
"version": "12.0.0",
|
||||
"resolved": "https://registry.npmjs.org/@csstools/normalize.css/-/normalize.css-12.0.0.tgz",
|
||||
@ -2729,6 +2949,27 @@
|
||||
"@jridgewell/sourcemap-codec": "^1.4.10"
|
||||
}
|
||||
},
|
||||
"node_modules/@lezer/common": {
|
||||
"version": "0.15.12",
|
||||
"resolved": "https://registry.npmjs.org/@lezer/common/-/common-0.15.12.tgz",
|
||||
"integrity": "sha512-edfwCxNLnzq5pBA/yaIhwJ3U3Kz8VAUOTRg0hhxaizaI1N+qxV7EXDv/kLCkLeq2RzSFvxexlaj5Mzfn2kY0Ig=="
|
||||
},
|
||||
"node_modules/@lezer/javascript": {
|
||||
"version": "0.15.3",
|
||||
"resolved": "https://registry.npmjs.org/@lezer/javascript/-/javascript-0.15.3.tgz",
|
||||
"integrity": "sha512-8jA2NpOfpWwSPZxRhd9BxK2ZPvGd7nLE3LFTJ5AbMhXAzMHeMjneV6GEVd7dAIee85dtap0jdb6bgOSO0+lfwA==",
|
||||
"dependencies": {
|
||||
"@lezer/lr": "^0.15.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@lezer/lr": {
|
||||
"version": "0.15.8",
|
||||
"resolved": "https://registry.npmjs.org/@lezer/lr/-/lr-0.15.8.tgz",
|
||||
"integrity": "sha512-bM6oE6VQZ6hIFxDNKk8bKPa14hqFrV07J/vHGOeiAbJReIaQXmkVb6xQu4MR+JBTLa5arGRyAAjJe1qaQt3Uvg==",
|
||||
"dependencies": {
|
||||
"@lezer/common": "^0.15.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@mdx-js/mdx": {
|
||||
"version": "1.6.22",
|
||||
"resolved": "https://registry.npmjs.org/@mdx-js/mdx/-/mdx-1.6.22.tgz",
|
||||
@ -7570,10 +7811,15 @@
|
||||
"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",
|
||||
"integrity": "sha512-MlXaa3Bx3iz4Bh9DK7+Xy+aPqbRHRsPG1iogoe6W/5f6JJqTER5QroZfKTz+ACfTqpjk2OHahv6XMl8KRi6h0w==",
|
||||
"dependencies": {
|
||||
"@codemirror/highlight": "^0.19.0",
|
||||
"@codemirror/state": "^0.19.0",
|
||||
"@codemirror/view": "^0.19.0"
|
||||
}
|
||||
},
|
||||
"node_modules/collapse-white-space": {
|
||||
"version": "1.0.6",
|
||||
@ -7839,6 +8085,11 @@
|
||||
"node": ">=10"
|
||||
}
|
||||
},
|
||||
"node_modules/crelt": {
|
||||
"version": "1.0.5",
|
||||
"resolved": "https://registry.npmjs.org/crelt/-/crelt-1.0.5.tgz",
|
||||
"integrity": "sha512-+BO9wPPi+DWTDcNYhr/W90myha8ptzftZT+LwcmUbbok0rcP/fequmFYCw8NMoH7pkAZQzU78b3kYrlua5a9eA=="
|
||||
},
|
||||
"node_modules/cross-spawn": {
|
||||
"version": "7.0.3",
|
||||
"resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.3.tgz",
|
||||
@ -16179,6 +16430,15 @@
|
||||
"url": "https://github.com/chalk/ansi-styles?sponsor=1"
|
||||
}
|
||||
},
|
||||
"node_modules/process": {
|
||||
"version": "0.11.10",
|
||||
"resolved": "https://registry.npmjs.org/process/-/process-0.11.10.tgz",
|
||||
"integrity": "sha1-czIwDoQBYb2j5podHZGn1LwW8YI=",
|
||||
"dev": true,
|
||||
"engines": {
|
||||
"node": ">= 0.6.0"
|
||||
}
|
||||
},
|
||||
"node_modules/process-nextick-args": {
|
||||
"version": "2.0.1",
|
||||
"resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-2.0.1.tgz",
|
||||
@ -16434,13 +16694,31 @@
|
||||
"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==",
|
||||
"node_modules/react-codemirror6": {
|
||||
"version": "1.1.0",
|
||||
"resolved": "https://registry.npmjs.org/react-codemirror6/-/react-codemirror6-1.1.0.tgz",
|
||||
"integrity": "sha512-xoXBMrnD4ZikGc3pJSXvjcy8HXuFHMOID1CTf3oJZzfh25MtkLaJxSd3gBz/hqy3rqlGXJH3BMVYDsFsfnHwQQ==",
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.14.8",
|
||||
"@codemirror/autocomplete": "^0.19.15",
|
||||
"@codemirror/closebrackets": "^0.19.1",
|
||||
"@codemirror/commands": "^0.19.8",
|
||||
"@codemirror/comment": "^0.19.1",
|
||||
"@codemirror/fold": "^0.19.3",
|
||||
"@codemirror/gutter": "^0.19.9",
|
||||
"@codemirror/highlight": "^0.19.8",
|
||||
"@codemirror/history": "^0.19.2",
|
||||
"@codemirror/language": "^0.19.10",
|
||||
"@codemirror/lint": "^0.19.6",
|
||||
"@codemirror/matchbrackets": "^0.19.4",
|
||||
"@codemirror/rectangular-selection": "^0.19.2",
|
||||
"@codemirror/search": "^0.19.9",
|
||||
"@codemirror/state": "^0.19.9",
|
||||
"@codemirror/view": "^0.19.48"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"codemirror": "5.x",
|
||||
"react": ">=15.5 <=16.x"
|
||||
"react": "^17.0.2",
|
||||
"react-dom": "^17.0.2"
|
||||
}
|
||||
},
|
||||
"node_modules/react-dev-utils": {
|
||||
@ -16578,6 +16856,15 @@
|
||||
"resolved": "https://registry.npmjs.org/react-error-overlay/-/react-error-overlay-6.0.10.tgz",
|
||||
"integrity": "sha512-mKR90fX7Pm5seCOfz8q9F+66VCc1PGsWSBxKbITjfKVQHMNF2zudxHnMdJiB1fRCb+XsbQV9sO9DCkgsMQgBIA=="
|
||||
},
|
||||
"node_modules/react-hook-inview": {
|
||||
"version": "4.4.1",
|
||||
"resolved": "https://registry.npmjs.org/react-hook-inview/-/react-hook-inview-4.4.1.tgz",
|
||||
"integrity": "sha512-JKx0+aWCna0YUfTCKSaphGbaMp25S/YjpWtfk5VbqhlESesOEAPr7TCGMRLS3Cv6I1mEDhWYIhz2YLHgnHX4Yw==",
|
||||
"peerDependencies": {
|
||||
"react": "^16.8.0 || ^17.0.0",
|
||||
"react-dom": "^16.8.0 || ^17.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/react-is": {
|
||||
"version": "17.0.2",
|
||||
"resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz",
|
||||
@ -18095,6 +18382,11 @@
|
||||
"webpack": "^5.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/style-mod": {
|
||||
"version": "4.0.0",
|
||||
"resolved": "https://registry.npmjs.org/style-mod/-/style-mod-4.0.0.tgz",
|
||||
"integrity": "sha512-OPhtyEjyyN9x3nhPsu76f52yUGXiZcgvsrFVtvTkyGRQJ0XK+GPc6ov1z+lRpbeabka+MYEQxOYRnt5nF30aMw=="
|
||||
},
|
||||
"node_modules/style-to-object": {
|
||||
"version": "0.3.0",
|
||||
"resolved": "https://registry.npmjs.org/style-to-object/-/style-to-object-0.3.0.tgz",
|
||||
@ -19148,6 +19440,11 @@
|
||||
"browser-process-hrtime": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/w3c-keyname": {
|
||||
"version": "2.2.4",
|
||||
"resolved": "https://registry.npmjs.org/w3c-keyname/-/w3c-keyname-2.2.4.tgz",
|
||||
"integrity": "sha512-tOhfEwEzFLJzf6d1ZPkYfGj+FWhIpBux9ppoP3rlclw3Z0BZv3N7b7030Z1kYth+6rDuAsXUFr+d0VE6Ed1ikw=="
|
||||
},
|
||||
"node_modules/w3c-xmlserializer": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/w3c-xmlserializer/-/w3c-xmlserializer-2.0.0.tgz",
|
||||
@ -21343,6 +21640,223 @@
|
||||
"resolved": "https://registry.npmjs.org/@bcoe/v8-coverage/-/v8-coverage-0.2.3.tgz",
|
||||
"integrity": "sha512-0hYQ8SB4Db5zvZB4axdMHGwEaQjkZzFjQiN9LVYvIFB2nSUHW9tYpxWriPrWDASIxiaXax83REcLxuSdnGPZtw=="
|
||||
},
|
||||
"@codemirror/autocomplete": {
|
||||
"version": "0.19.15",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/autocomplete/-/autocomplete-0.19.15.tgz",
|
||||
"integrity": "sha512-GQWzvvuXxNUyaEk+5gawbAD8s51/v2Chb++nx0e2eGWrphWk42isBtzOMdc3DxrxrZtPZ55q2ldNp+6G8KJLIQ==",
|
||||
"requires": {
|
||||
"@codemirror/language": "^0.19.0",
|
||||
"@codemirror/state": "^0.19.4",
|
||||
"@codemirror/text": "^0.19.2",
|
||||
"@codemirror/tooltip": "^0.19.12",
|
||||
"@codemirror/view": "^0.19.0",
|
||||
"@lezer/common": "^0.15.0"
|
||||
}
|
||||
},
|
||||
"@codemirror/closebrackets": {
|
||||
"version": "0.19.2",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/closebrackets/-/closebrackets-0.19.2.tgz",
|
||||
"integrity": "sha512-ClMPzPcPP0eQiDcVjtVPl6OLxgdtZSYDazsvT0AKl70V1OJva0eHgl4/6kCW3RZ0pb2n34i9nJz4eXCmK+TYDA==",
|
||||
"requires": {
|
||||
"@codemirror/language": "^0.19.0",
|
||||
"@codemirror/rangeset": "^0.19.0",
|
||||
"@codemirror/state": "^0.19.2",
|
||||
"@codemirror/text": "^0.19.0",
|
||||
"@codemirror/view": "^0.19.44"
|
||||
}
|
||||
},
|
||||
"@codemirror/commands": {
|
||||
"version": "0.19.8",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/commands/-/commands-0.19.8.tgz",
|
||||
"integrity": "sha512-65LIMSGUGGpY3oH6mzV46YWRrgao6NmfJ+AuC7jNz3K5NPnH6GCV1H5I6SwOFyVbkiygGyd0EFwrWqywTBD1aw==",
|
||||
"requires": {
|
||||
"@codemirror/language": "^0.19.0",
|
||||
"@codemirror/matchbrackets": "^0.19.0",
|
||||
"@codemirror/state": "^0.19.2",
|
||||
"@codemirror/text": "^0.19.6",
|
||||
"@codemirror/view": "^0.19.22",
|
||||
"@lezer/common": "^0.15.0"
|
||||
}
|
||||
},
|
||||
"@codemirror/comment": {
|
||||
"version": "0.19.1",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/comment/-/comment-0.19.1.tgz",
|
||||
"integrity": "sha512-uGKteBuVWAC6fW+Yt8u27DOnXMT/xV4Ekk2Z5mRsiADCZDqYvryrJd6PLL5+8t64BVyocwQwNfz1UswYS2CtFQ==",
|
||||
"requires": {
|
||||
"@codemirror/state": "^0.19.9",
|
||||
"@codemirror/text": "^0.19.0",
|
||||
"@codemirror/view": "^0.19.0"
|
||||
}
|
||||
},
|
||||
"@codemirror/fold": {
|
||||
"version": "0.19.4",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/fold/-/fold-0.19.4.tgz",
|
||||
"integrity": "sha512-0SNSkRSOa6gymD6GauHa3sxiysjPhUC0SRVyTlvL52o0gz9GHdc8kNqNQskm3fBtGGOiSriGwF/kAsajRiGhVw==",
|
||||
"requires": {
|
||||
"@codemirror/gutter": "^0.19.0",
|
||||
"@codemirror/language": "^0.19.0",
|
||||
"@codemirror/rangeset": "^0.19.0",
|
||||
"@codemirror/state": "^0.19.0",
|
||||
"@codemirror/view": "^0.19.22"
|
||||
}
|
||||
},
|
||||
"@codemirror/gutter": {
|
||||
"version": "0.19.9",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/gutter/-/gutter-0.19.9.tgz",
|
||||
"integrity": "sha512-PFrtmilahin1g6uL27aG5tM/rqR9DZzZYZsIrCXA5Uc2OFTFqx4owuhoU9hqfYxHp5ovfvBwQ+txFzqS4vog6Q==",
|
||||
"requires": {
|
||||
"@codemirror/rangeset": "^0.19.0",
|
||||
"@codemirror/state": "^0.19.0",
|
||||
"@codemirror/view": "^0.19.23"
|
||||
}
|
||||
},
|
||||
"@codemirror/highlight": {
|
||||
"version": "0.19.8",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/highlight/-/highlight-0.19.8.tgz",
|
||||
"integrity": "sha512-v/lzuHjrYR8MN2mEJcUD6fHSTXXli9C1XGYpr+ElV6fLBIUhMTNKR3qThp611xuWfXfwDxeL7ppcbkM/MzPV3A==",
|
||||
"requires": {
|
||||
"@codemirror/language": "^0.19.0",
|
||||
"@codemirror/rangeset": "^0.19.0",
|
||||
"@codemirror/state": "^0.19.3",
|
||||
"@codemirror/view": "^0.19.39",
|
||||
"@lezer/common": "^0.15.0",
|
||||
"style-mod": "^4.0.0"
|
||||
}
|
||||
},
|
||||
"@codemirror/history": {
|
||||
"version": "0.19.2",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/history/-/history-0.19.2.tgz",
|
||||
"integrity": "sha512-unhP4t3N2smzmHoo/Yio6ueWi+il8gm9VKrvi6wlcdGH5fOfVDNkmjHQ495SiR+EdOG35+3iNebSPYww0vN7ow==",
|
||||
"requires": {
|
||||
"@codemirror/state": "^0.19.2",
|
||||
"@codemirror/view": "^0.19.0"
|
||||
}
|
||||
},
|
||||
"@codemirror/lang-javascript": {
|
||||
"version": "0.19.7",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/lang-javascript/-/lang-javascript-0.19.7.tgz",
|
||||
"integrity": "sha512-DL9f3JLqOEHH9cIwEqqjnP5bkjdVXeECksLtV+/MbPm+l4H+AG+PkwZaJQ2oR1GfPZKh8MVSIE94aGWNkJP8WQ==",
|
||||
"requires": {
|
||||
"@codemirror/autocomplete": "^0.19.0",
|
||||
"@codemirror/highlight": "^0.19.7",
|
||||
"@codemirror/language": "^0.19.0",
|
||||
"@codemirror/lint": "^0.19.0",
|
||||
"@codemirror/state": "^0.19.0",
|
||||
"@codemirror/view": "^0.19.0",
|
||||
"@lezer/javascript": "^0.15.1"
|
||||
}
|
||||
},
|
||||
"@codemirror/language": {
|
||||
"version": "0.19.10",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/language/-/language-0.19.10.tgz",
|
||||
"integrity": "sha512-yA0DZ3RYn2CqAAGW62VrU8c4YxscMQn45y/I9sjBlqB1e2OTQLg4CCkMBuMSLXk4xaqjlsgazeOQWaJQOKfV8Q==",
|
||||
"requires": {
|
||||
"@codemirror/state": "^0.19.0",
|
||||
"@codemirror/text": "^0.19.0",
|
||||
"@codemirror/view": "^0.19.0",
|
||||
"@lezer/common": "^0.15.5",
|
||||
"@lezer/lr": "^0.15.0"
|
||||
}
|
||||
},
|
||||
"@codemirror/lint": {
|
||||
"version": "0.19.6",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/lint/-/lint-0.19.6.tgz",
|
||||
"integrity": "sha512-Pbw1Y5kHVs2J+itQ0uez3dI4qY9ApYVap7eNfV81x1/3/BXgBkKfadaw0gqJ4h4FDG7OnJwb0VbPsjJQllHjaA==",
|
||||
"requires": {
|
||||
"@codemirror/gutter": "^0.19.4",
|
||||
"@codemirror/panel": "^0.19.0",
|
||||
"@codemirror/rangeset": "^0.19.1",
|
||||
"@codemirror/state": "^0.19.4",
|
||||
"@codemirror/tooltip": "^0.19.16",
|
||||
"@codemirror/view": "^0.19.22",
|
||||
"crelt": "^1.0.5"
|
||||
}
|
||||
},
|
||||
"@codemirror/matchbrackets": {
|
||||
"version": "0.19.4",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/matchbrackets/-/matchbrackets-0.19.4.tgz",
|
||||
"integrity": "sha512-VFkaOKPNudAA5sGP1zikRHCEKU0hjYmkKpr04pybUpQvfTvNJXlReCyP0rvH/1iEwAGPL990ZTT+QrLdu4MeEA==",
|
||||
"requires": {
|
||||
"@codemirror/language": "^0.19.0",
|
||||
"@codemirror/state": "^0.19.0",
|
||||
"@codemirror/view": "^0.19.0",
|
||||
"@lezer/common": "^0.15.0"
|
||||
}
|
||||
},
|
||||
"@codemirror/panel": {
|
||||
"version": "0.19.1",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/panel/-/panel-0.19.1.tgz",
|
||||
"integrity": "sha512-sYeOCMA3KRYxZYJYn5PNlt9yNsjy3zTNTrbYSfVgjgL9QomIVgOJWPO5hZ2sTN8lufO6lw0vTBsIPL9MSidmBg==",
|
||||
"requires": {
|
||||
"@codemirror/state": "^0.19.0",
|
||||
"@codemirror/view": "^0.19.0"
|
||||
}
|
||||
},
|
||||
"@codemirror/rangeset": {
|
||||
"version": "0.19.9",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/rangeset/-/rangeset-0.19.9.tgz",
|
||||
"integrity": "sha512-V8YUuOvK+ew87Xem+71nKcqu1SXd5QROMRLMS/ljT5/3MCxtgrRie1Cvild0G/Z2f1fpWxzX78V0U4jjXBorBQ==",
|
||||
"requires": {
|
||||
"@codemirror/state": "^0.19.0"
|
||||
}
|
||||
},
|
||||
"@codemirror/rectangular-selection": {
|
||||
"version": "0.19.2",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/rectangular-selection/-/rectangular-selection-0.19.2.tgz",
|
||||
"integrity": "sha512-AXK/p5eGwFJ9GJcLfntqN4dgY+XiIF7eHfXNQJX5HhQLSped2wJE6WuC1rMEaOlcpOqlb9mrNi/ZdUjSIj9mbA==",
|
||||
"requires": {
|
||||
"@codemirror/state": "^0.19.0",
|
||||
"@codemirror/text": "^0.19.4",
|
||||
"@codemirror/view": "^0.19.48"
|
||||
}
|
||||
},
|
||||
"@codemirror/search": {
|
||||
"version": "0.19.10",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/search/-/search-0.19.10.tgz",
|
||||
"integrity": "sha512-qjubm69HJixPBWzI6HeEghTWOOD8NXiHOTRNvdizqs8xWRuFChq9zkjD3XiAJ7GXSTzCuQJnAP9DBBGCLq4ZIA==",
|
||||
"requires": {
|
||||
"@codemirror/panel": "^0.19.0",
|
||||
"@codemirror/rangeset": "^0.19.0",
|
||||
"@codemirror/state": "^0.19.3",
|
||||
"@codemirror/text": "^0.19.0",
|
||||
"@codemirror/view": "^0.19.34",
|
||||
"crelt": "^1.0.5"
|
||||
}
|
||||
},
|
||||
"@codemirror/state": {
|
||||
"version": "0.19.9",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/state/-/state-0.19.9.tgz",
|
||||
"integrity": "sha512-psOzDolKTZkx4CgUqhBQ8T8gBc0xN5z4gzed109aF6x7D7umpDRoimacI/O6d9UGuyl4eYuDCZmDFr2Rq7aGOw==",
|
||||
"requires": {
|
||||
"@codemirror/text": "^0.19.0"
|
||||
}
|
||||
},
|
||||
"@codemirror/text": {
|
||||
"version": "0.19.6",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/text/-/text-0.19.6.tgz",
|
||||
"integrity": "sha512-T9jnREMIygx+TPC1bOuepz18maGq/92q2a+n4qTqObKwvNMg+8cMTslb8yxeEDEq7S3kpgGWxgO1UWbQRij0dA=="
|
||||
},
|
||||
"@codemirror/tooltip": {
|
||||
"version": "0.19.16",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/tooltip/-/tooltip-0.19.16.tgz",
|
||||
"integrity": "sha512-zxKDHryUV5/RS45AQL+wOeN+i7/l81wK56OMnUPoTSzCWNITfxHn7BToDsjtrRKbzHqUxKYmBnn/4hPjpZ4WJQ==",
|
||||
"requires": {
|
||||
"@codemirror/state": "^0.19.0",
|
||||
"@codemirror/view": "^0.19.0"
|
||||
}
|
||||
},
|
||||
"@codemirror/view": {
|
||||
"version": "0.19.48",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/view/-/view-0.19.48.tgz",
|
||||
"integrity": "sha512-0eg7D2Nz4S8/caetCTz61rK0tkHI17V/d15Jy0kLOT8dTLGGNJUponDnW28h2B6bERmPlVHKh8MJIr5OCp1nGw==",
|
||||
"requires": {
|
||||
"@codemirror/rangeset": "^0.19.5",
|
||||
"@codemirror/state": "^0.19.3",
|
||||
"@codemirror/text": "^0.19.0",
|
||||
"style-mod": "^4.0.0",
|
||||
"w3c-keyname": "^2.2.4"
|
||||
}
|
||||
},
|
||||
"@csstools/normalize.css": {
|
||||
"version": "12.0.0",
|
||||
"resolved": "https://registry.npmjs.org/@csstools/normalize.css/-/normalize.css-12.0.0.tgz",
|
||||
@ -21972,6 +22486,27 @@
|
||||
"@jridgewell/sourcemap-codec": "^1.4.10"
|
||||
}
|
||||
},
|
||||
"@lezer/common": {
|
||||
"version": "0.15.12",
|
||||
"resolved": "https://registry.npmjs.org/@lezer/common/-/common-0.15.12.tgz",
|
||||
"integrity": "sha512-edfwCxNLnzq5pBA/yaIhwJ3U3Kz8VAUOTRg0hhxaizaI1N+qxV7EXDv/kLCkLeq2RzSFvxexlaj5Mzfn2kY0Ig=="
|
||||
},
|
||||
"@lezer/javascript": {
|
||||
"version": "0.15.3",
|
||||
"resolved": "https://registry.npmjs.org/@lezer/javascript/-/javascript-0.15.3.tgz",
|
||||
"integrity": "sha512-8jA2NpOfpWwSPZxRhd9BxK2ZPvGd7nLE3LFTJ5AbMhXAzMHeMjneV6GEVd7dAIee85dtap0jdb6bgOSO0+lfwA==",
|
||||
"requires": {
|
||||
"@lezer/lr": "^0.15.0"
|
||||
}
|
||||
},
|
||||
"@lezer/lr": {
|
||||
"version": "0.15.8",
|
||||
"resolved": "https://registry.npmjs.org/@lezer/lr/-/lr-0.15.8.tgz",
|
||||
"integrity": "sha512-bM6oE6VQZ6hIFxDNKk8bKPa14hqFrV07J/vHGOeiAbJReIaQXmkVb6xQu4MR+JBTLa5arGRyAAjJe1qaQt3Uvg==",
|
||||
"requires": {
|
||||
"@lezer/common": "^0.15.0"
|
||||
}
|
||||
},
|
||||
"@mdx-js/mdx": {
|
||||
"version": "1.6.22",
|
||||
"resolved": "https://registry.npmjs.org/@mdx-js/mdx/-/mdx-1.6.22.tgz",
|
||||
@ -25354,10 +25889,15 @@
|
||||
"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",
|
||||
"integrity": "sha512-MlXaa3Bx3iz4Bh9DK7+Xy+aPqbRHRsPG1iogoe6W/5f6JJqTER5QroZfKTz+ACfTqpjk2OHahv6XMl8KRi6h0w==",
|
||||
"requires": {
|
||||
"@codemirror/highlight": "^0.19.0",
|
||||
"@codemirror/state": "^0.19.0",
|
||||
"@codemirror/view": "^0.19.0"
|
||||
}
|
||||
},
|
||||
"collapse-white-space": {
|
||||
"version": "1.0.6",
|
||||
@ -25560,6 +26100,11 @@
|
||||
"yaml": "^1.10.0"
|
||||
}
|
||||
},
|
||||
"crelt": {
|
||||
"version": "1.0.5",
|
||||
"resolved": "https://registry.npmjs.org/crelt/-/crelt-1.0.5.tgz",
|
||||
"integrity": "sha512-+BO9wPPi+DWTDcNYhr/W90myha8ptzftZT+LwcmUbbok0rcP/fequmFYCw8NMoH7pkAZQzU78b3kYrlua5a9eA=="
|
||||
},
|
||||
"cross-spawn": {
|
||||
"version": "7.0.3",
|
||||
"resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.3.tgz",
|
||||
@ -31448,6 +31993,12 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
"process": {
|
||||
"version": "0.11.10",
|
||||
"resolved": "https://registry.npmjs.org/process/-/process-0.11.10.tgz",
|
||||
"integrity": "sha1-czIwDoQBYb2j5podHZGn1LwW8YI=",
|
||||
"dev": true
|
||||
},
|
||||
"process-nextick-args": {
|
||||
"version": "2.0.1",
|
||||
"resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-2.0.1.tgz",
|
||||
@ -31641,11 +32192,28 @@
|
||||
"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",
|
||||
"integrity": "sha512-xoXBMrnD4ZikGc3pJSXvjcy8HXuFHMOID1CTf3oJZzfh25MtkLaJxSd3gBz/hqy3rqlGXJH3BMVYDsFsfnHwQQ==",
|
||||
"requires": {
|
||||
"@babel/runtime": "^7.14.8",
|
||||
"@codemirror/autocomplete": "^0.19.15",
|
||||
"@codemirror/closebrackets": "^0.19.1",
|
||||
"@codemirror/commands": "^0.19.8",
|
||||
"@codemirror/comment": "^0.19.1",
|
||||
"@codemirror/fold": "^0.19.3",
|
||||
"@codemirror/gutter": "^0.19.9",
|
||||
"@codemirror/highlight": "^0.19.8",
|
||||
"@codemirror/history": "^0.19.2",
|
||||
"@codemirror/language": "^0.19.10",
|
||||
"@codemirror/lint": "^0.19.6",
|
||||
"@codemirror/matchbrackets": "^0.19.4",
|
||||
"@codemirror/rectangular-selection": "^0.19.2",
|
||||
"@codemirror/search": "^0.19.9",
|
||||
"@codemirror/state": "^0.19.9",
|
||||
"@codemirror/view": "^0.19.48"
|
||||
}
|
||||
},
|
||||
"react-dev-utils": {
|
||||
"version": "12.0.0",
|
||||
@ -31748,6 +32316,12 @@
|
||||
"resolved": "https://registry.npmjs.org/react-error-overlay/-/react-error-overlay-6.0.10.tgz",
|
||||
"integrity": "sha512-mKR90fX7Pm5seCOfz8q9F+66VCc1PGsWSBxKbITjfKVQHMNF2zudxHnMdJiB1fRCb+XsbQV9sO9DCkgsMQgBIA=="
|
||||
},
|
||||
"react-hook-inview": {
|
||||
"version": "4.4.1",
|
||||
"resolved": "https://registry.npmjs.org/react-hook-inview/-/react-hook-inview-4.4.1.tgz",
|
||||
"integrity": "sha512-JKx0+aWCna0YUfTCKSaphGbaMp25S/YjpWtfk5VbqhlESesOEAPr7TCGMRLS3Cv6I1mEDhWYIhz2YLHgnHX4Yw==",
|
||||
"requires": {}
|
||||
},
|
||||
"react-is": {
|
||||
"version": "17.0.2",
|
||||
"resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz",
|
||||
@ -32899,6 +33473,11 @@
|
||||
"integrity": "sha512-GPcQ+LDJbrcxHORTRes6Jy2sfvK2kS6hpSfI/fXhPt+spVzxF6LJ1dHLN9zIGmVaaP044YKaIatFaufENRiDoQ==",
|
||||
"requires": {}
|
||||
},
|
||||
"style-mod": {
|
||||
"version": "4.0.0",
|
||||
"resolved": "https://registry.npmjs.org/style-mod/-/style-mod-4.0.0.tgz",
|
||||
"integrity": "sha512-OPhtyEjyyN9x3nhPsu76f52yUGXiZcgvsrFVtvTkyGRQJ0XK+GPc6ov1z+lRpbeabka+MYEQxOYRnt5nF30aMw=="
|
||||
},
|
||||
"style-to-object": {
|
||||
"version": "0.3.0",
|
||||
"resolved": "https://registry.npmjs.org/style-to-object/-/style-to-object-0.3.0.tgz",
|
||||
@ -33677,6 +34256,11 @@
|
||||
"browser-process-hrtime": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"w3c-keyname": {
|
||||
"version": "2.2.4",
|
||||
"resolved": "https://registry.npmjs.org/w3c-keyname/-/w3c-keyname-2.2.4.tgz",
|
||||
"integrity": "sha512-tOhfEwEzFLJzf6d1ZPkYfGj+FWhIpBux9ppoP3rlclw3Z0BZv3N7b7030Z1kYth+6rDuAsXUFr+d0VE6Ed1ikw=="
|
||||
},
|
||||
"w3c-xmlserializer": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/w3c-xmlserializer/-/w3c-xmlserializer-2.0.0.tgz",
|
||||
|
||||
@ -4,15 +4,17 @@
|
||||
"private": true,
|
||||
"homepage": "https://strudel.tidalcycles.org",
|
||||
"dependencies": {
|
||||
"@codemirror/lang-javascript": "^0.19.0",
|
||||
"@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",
|
||||
"react-scripts": "5.0.0",
|
||||
"tone": "^14.7.77",
|
||||
"web-vitals": "^2.1.4"
|
||||
@ -53,6 +55,7 @@
|
||||
"autoprefixer": "^10.4.4",
|
||||
"parcel": "^2.3.1",
|
||||
"postcss": "^8.4.12",
|
||||
"process": "^0.11.10",
|
||||
"serve": "^13.0.2",
|
||||
"tailwindcss": "^3.0.23"
|
||||
}
|
||||
|
||||
@ -4,8 +4,8 @@ Copyright (C) 2022 Strudel contributors - see <https://github.com/tidalcycles/st
|
||||
This program is free software: you can redistribute it and/or modify it under the terms of the GNU Affero General Public License as published by the Free Software Foundation, either version 3 of the License, or (at your option) any later version. This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU Affero General Public License for more details. You should have received a copy of the GNU Affero General Public License along with this program. If not, see <https://www.gnu.org/licenses/>.
|
||||
*/
|
||||
|
||||
import CodeMirror6, { setHighlights } from './CodeMirror6';
|
||||
import React, { useCallback, useLayoutEffect, useRef, useState } from 'react';
|
||||
import CodeMirror, { markEvent, markParens } from './CodeMirror';
|
||||
import cx from './cx';
|
||||
import logo from './logo.svg';
|
||||
import playStatic from './static.mjs';
|
||||
@ -39,6 +39,7 @@ import '@strudel.cycles/osc/osc.mjs';
|
||||
import '@strudel.cycles/webaudio/webaudio.mjs';
|
||||
import '@strudel.cycles/serial/serial.mjs';
|
||||
import controls from '@strudel.cycles/core/controls.mjs';
|
||||
import useHighlighting from './useHighlighting';
|
||||
|
||||
extend(
|
||||
Tone,
|
||||
@ -56,7 +57,6 @@ extend(
|
||||
Tone,
|
||||
},
|
||||
);
|
||||
// eval stuff end
|
||||
|
||||
const codeParam = window.location.href.split('#')[1];
|
||||
let decoded;
|
||||
@ -76,14 +76,27 @@ const randomTune = getRandomTune();
|
||||
const defaultSynth = getDefaultSynth();
|
||||
|
||||
function App() {
|
||||
const [editor, setEditor] = useState();
|
||||
const { setCode, setPattern, error, code, cycle, dirty, log, togglePlay, activateCode, pattern, pushLog, pending } =
|
||||
useRepl({
|
||||
tune: decoded || randomTune,
|
||||
defaultSynth,
|
||||
onDraw: useCallback((time, event) => markEvent(editor)(time, event), [editor]),
|
||||
});
|
||||
const [uiHidden, setUiHidden] = useState(false);
|
||||
// const [editor, setEditor] = useState();
|
||||
const [view, setView] = useState();
|
||||
const {
|
||||
setCode,
|
||||
setPattern,
|
||||
error,
|
||||
code,
|
||||
cycle,
|
||||
dirty,
|
||||
log,
|
||||
togglePlay,
|
||||
activeCode,
|
||||
setActiveCode,
|
||||
activateCode,
|
||||
pattern,
|
||||
pushLog,
|
||||
pending,
|
||||
} = useRepl({
|
||||
tune: decoded || randomTune,
|
||||
defaultSynth,
|
||||
});
|
||||
const logBox = useRef();
|
||||
// scroll log box to bottom when log changes
|
||||
useLayoutEffect(() => {
|
||||
@ -108,6 +121,8 @@ function App() {
|
||||
return () => window.removeEventListener('keydown', handleKeyPress);
|
||||
}, [pattern, code, activateCode, cycle]);
|
||||
|
||||
useHighlighting({ view, pattern, started: cycle.started });
|
||||
|
||||
useWebMidi({
|
||||
ready: useCallback(
|
||||
({ outputs }) => {
|
||||
@ -133,17 +148,14 @@ function App() {
|
||||
<div className="min-h-screen flex flex-col">
|
||||
<header
|
||||
id="header"
|
||||
className={cx(
|
||||
'flex-none w-full h-14 px-2 flex border-b border-gray-200 justify-between z-[10]',
|
||||
uiHidden ? 'bg-transparent text-white' : 'bg-white',
|
||||
)}
|
||||
className="flex-none w-full h-14 px-2 flex border-b border-gray-200 justify-between z-[10] bg-gray-100"
|
||||
>
|
||||
<div className="flex items-center space-x-2">
|
||||
<img src={logo} className="Tidal-logo w-12 h-12" alt="logo" />
|
||||
<h1 className="text-2xl">Strudel REPL</h1>
|
||||
<img src={logo} className="Tidal-logo w-10 h-10" alt="logo" />
|
||||
<h1 className="text-xl">Strudel REPL</h1>
|
||||
</div>
|
||||
<div className="flex space-x-4">
|
||||
<button onClick={() => togglePlay()}>
|
||||
<div className="flex">
|
||||
<button onClick={() => togglePlay()} className="hover:bg-gray-300 p-2">
|
||||
{!pending ? (
|
||||
<span className="flex items-center w-16">
|
||||
{cycle.started ? (
|
||||
@ -170,6 +182,7 @@ function App() {
|
||||
)}
|
||||
</button>
|
||||
<button
|
||||
className="hover:bg-gray-300 p-2"
|
||||
onClick={async () => {
|
||||
const _code = getRandomTune();
|
||||
console.log('tune', _code); // uncomment this to debug when random code fails
|
||||
@ -178,42 +191,23 @@ function App() {
|
||||
uiHelpers.cleanup();
|
||||
const parsed = await evaluate(_code);
|
||||
setPattern(parsed.pattern);
|
||||
setActiveCode(_code);
|
||||
}}
|
||||
>
|
||||
🎲 random
|
||||
</button>
|
||||
<button>
|
||||
<button className="hover:bg-gray-300 p-2">
|
||||
<a href="./tutorial">📚 tutorial</a>
|
||||
</button>
|
||||
<button onClick={() => setUiHidden((c) => !c)}>👀 {uiHidden ? 'show ui' : 'hide ui'}</button>
|
||||
</div>
|
||||
</header>
|
||||
<section className="grow flex flex-col text-gray-100">
|
||||
<div className="grow relative" id="code">
|
||||
<div
|
||||
className={cx(
|
||||
'h-full transition-opacity',
|
||||
error ? 'focus:ring-red-500' : 'focus:ring-slate-800',
|
||||
uiHidden ? 'opacity-0' : 'opacity-100',
|
||||
)}
|
||||
>
|
||||
<CodeMirror
|
||||
value={code}
|
||||
editorDidMount={setEditor}
|
||||
options={{
|
||||
mode: 'javascript',
|
||||
theme: 'material',
|
||||
lineNumbers: false,
|
||||
styleSelectedText: true,
|
||||
cursorBlinkRate: 0,
|
||||
}}
|
||||
onCursor={markParens}
|
||||
onChange={(_, __, value) => setCode(value)}
|
||||
/>
|
||||
<span className="p-4 absolute top-0 right-0 text-xs whitespace-pre text-right pointer-events-none">
|
||||
{!cycle.started ? `press ctrl+enter to play\n` : dirty ? `ctrl+enter to update\n` : 'no changes\n'}
|
||||
</span>
|
||||
</div>
|
||||
<div className="grow relative flex overflow-auto" id="code">
|
||||
{/* onCursor={markParens} */}
|
||||
<CodeMirror6 value={code} onChange={setCode} onViewChanged={setView} />
|
||||
<span className="p-4 absolute top-0 right-0 text-xs whitespace-pre text-right pointer-events-none">
|
||||
{!cycle.started ? `press ctrl+enter to play\n` : dirty ? `ctrl+enter to update\n` : 'no changes\n'}
|
||||
</span>
|
||||
{error && (
|
||||
<div className={cx('absolute right-2 bottom-2 px-2', 'text-red-500')}>
|
||||
{error?.message || 'unknown error'}
|
||||
|
||||
@ -1,53 +1,72 @@
|
||||
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';
|
||||
import { CodeMirror as _CodeMirror } from 'react-codemirror6';
|
||||
import { EditorView, Decoration } from '@codemirror/view';
|
||||
import { StateField, StateEffect } from '@codemirror/state';
|
||||
import { javascript } from '@codemirror/lang-javascript';
|
||||
// import { materialPalenight } from 'codemirror6-themes';
|
||||
import { materialPalenight } from './themes/material-palenight';
|
||||
|
||||
export default function CodeMirror({ value, onChange, onCursor, options, editorDidMount }) {
|
||||
options = options || {
|
||||
mode: 'javascript',
|
||||
theme: 'material',
|
||||
lineNumbers: true,
|
||||
styleSelectedText: true,
|
||||
cursorBlinkRate: 500,
|
||||
};
|
||||
export const setHighlights = StateEffect.define();
|
||||
const highlightField = StateField.define({
|
||||
create() {
|
||||
return Decoration.none;
|
||||
},
|
||||
update(highlights, tr) {
|
||||
try {
|
||||
for (let e of tr.effects) {
|
||||
if (e.is(setHighlights)) {
|
||||
highlights = Decoration.set(
|
||||
e.value
|
||||
.flatMap((hap) =>
|
||||
(hap.context.locations || []).map(({ start, end }) => {
|
||||
const color = hap.context.color || '#FFCA28';
|
||||
let from = tr.newDoc.line(start.line).from + start.column;
|
||||
let to = tr.newDoc.line(end.line).from + end.column;
|
||||
const l = tr.newDoc.length;
|
||||
if (from > l || to > l) {
|
||||
return; // dont mark outside of range, as it will throw an error
|
||||
}
|
||||
const mark = Decoration.mark({ attributes: { style: `outline: 1px solid ${color}` } });
|
||||
return mark.range(from, to);
|
||||
}),
|
||||
)
|
||||
.filter(Boolean),
|
||||
true,
|
||||
);
|
||||
}
|
||||
}
|
||||
return highlights;
|
||||
} catch (err) {
|
||||
console.warn('highlighting error', err);
|
||||
return highlights;
|
||||
}
|
||||
},
|
||||
provide: (f) => EditorView.decorations.from(f),
|
||||
});
|
||||
|
||||
export default function CodeMirror({ value, onChange, onViewChanged, onCursor, options, editorDidMount }) {
|
||||
return (
|
||||
<CodeMirror2
|
||||
value={value}
|
||||
options={options}
|
||||
onBeforeChange={onChange}
|
||||
editorDidMount={editorDidMount}
|
||||
onCursor={(editor, data) => onCursor?.(editor, data)}
|
||||
/>
|
||||
<>
|
||||
<_CodeMirror
|
||||
onViewChange={onViewChanged}
|
||||
style={{
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
flex: '1 0 auto',
|
||||
}}
|
||||
value={value}
|
||||
onChange={onChange}
|
||||
extensions={[
|
||||
javascript(),
|
||||
materialPalenight,
|
||||
highlightField,
|
||||
// theme, language, ...
|
||||
]}
|
||||
/>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
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();
|
||||
@ -75,6 +94,10 @@ export function offsetToPosition(offset, code) {
|
||||
// returns absolute character offset from { line, ch }
|
||||
export function positionToOffset(position, code) {
|
||||
const lines = code.split('\n');
|
||||
if (position.line > lines.length) {
|
||||
// throw new Error('positionToOffset: position.line > lines.length');
|
||||
return 0;
|
||||
}
|
||||
let offset = 0;
|
||||
for (let i = 0; i < position.line; i++) {
|
||||
offset += lines[i].length + 1;
|
||||
@ -119,3 +142,27 @@ export function getCurrentParenArea(code, caretPosition) {
|
||||
end = i;
|
||||
return [begin, end].map((o) => offsetToPosition(o, code));
|
||||
}
|
||||
|
||||
/*
|
||||
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 * 0.5);
|
||||
}, event.duration * 1000);
|
||||
}; */
|
||||
135
repl/src/themes/material-palenight.js
Normal file
135
repl/src/themes/material-palenight.js
Normal file
@ -0,0 +1,135 @@
|
||||
import { EditorView } from '@codemirror/view';
|
||||
import { HighlightStyle, tags as t } from '@codemirror/highlight';
|
||||
|
||||
/*
|
||||
Credits for color palette:
|
||||
|
||||
Author: Mattia Astorino (http://github.com/equinusocio)
|
||||
Website: https://material-theme.site/
|
||||
*/
|
||||
|
||||
const ivory = '#abb2bf',
|
||||
stone = '#7d8799', // Brightened compared to original to increase contrast
|
||||
invalid = '#ffffff',
|
||||
darkBackground = '#21252b',
|
||||
highlightBackground = 'rgba(0, 0, 0, 0.5)',
|
||||
// background = '#292d3e',
|
||||
background = 'transparent',
|
||||
tooltipBackground = '#353a42',
|
||||
selection = 'rgba(128, 203, 196, 0.2)',
|
||||
cursor = '#ffcc00';
|
||||
|
||||
/// The editor theme styles for Material Palenight.
|
||||
export const materialPalenightTheme = EditorView.theme(
|
||||
{
|
||||
// done
|
||||
'&': {
|
||||
color: '#ffffff',
|
||||
backgroundColor: background,
|
||||
fontSize: '15px',
|
||||
'z-index': 11,
|
||||
},
|
||||
|
||||
// done
|
||||
'.cm-content': {
|
||||
caretColor: cursor,
|
||||
lineHeight: '22px',
|
||||
},
|
||||
'.cm-line': {
|
||||
background: '#2C323699',
|
||||
},
|
||||
// done
|
||||
'&.cm-focused .cm-cursor': {
|
||||
borderLeftColor: cursor,
|
||||
},
|
||||
|
||||
'&.cm-focused .cm-selectionBackground, .cm-selectionBackground, .cm-content ::selection': {
|
||||
backgroundColor: selection,
|
||||
},
|
||||
|
||||
'.cm-panels': { backgroundColor: darkBackground, color: '#ffffff' },
|
||||
'.cm-panels.cm-panels-top': { borderBottom: '2px solid black' },
|
||||
'.cm-panels.cm-panels-bottom': { borderTop: '2px solid black' },
|
||||
|
||||
// done, use onedarktheme
|
||||
'.cm-searchMatch': {
|
||||
backgroundColor: '#72a1ff59',
|
||||
outline: '1px solid #457dff',
|
||||
},
|
||||
'.cm-searchMatch.cm-searchMatch-selected': {
|
||||
backgroundColor: '#6199ff2f',
|
||||
},
|
||||
|
||||
'.cm-activeLine': { backgroundColor: highlightBackground },
|
||||
'.cm-selectionMatch': { backgroundColor: '#aafe661a' },
|
||||
|
||||
'&.cm-focused .cm-matchingBracket, &.cm-focused .cm-nonmatchingBracket': {
|
||||
backgroundColor: '#bad0f847',
|
||||
outline: '1px solid #515a6b',
|
||||
},
|
||||
|
||||
// done
|
||||
'.cm-gutters': {
|
||||
background: '#2C323699',
|
||||
color: '#676e95',
|
||||
border: 'none',
|
||||
},
|
||||
|
||||
'.cm-activeLineGutter': {
|
||||
backgroundColor: highlightBackground,
|
||||
},
|
||||
|
||||
'.cm-foldPlaceholder': {
|
||||
backgroundColor: 'transparent',
|
||||
border: 'none',
|
||||
color: '#ddd',
|
||||
},
|
||||
|
||||
'.cm-tooltip': {
|
||||
border: 'none',
|
||||
backgroundColor: tooltipBackground,
|
||||
},
|
||||
'.cm-tooltip .cm-tooltip-arrow:before': {
|
||||
borderTopColor: 'transparent',
|
||||
borderBottomColor: 'transparent',
|
||||
},
|
||||
'.cm-tooltip .cm-tooltip-arrow:after': {
|
||||
borderTopColor: tooltipBackground,
|
||||
borderBottomColor: tooltipBackground,
|
||||
},
|
||||
'.cm-tooltip-autocomplete': {
|
||||
'& > ul > li[aria-selected]': {
|
||||
backgroundColor: highlightBackground,
|
||||
color: ivory,
|
||||
},
|
||||
},
|
||||
},
|
||||
{ dark: true },
|
||||
);
|
||||
|
||||
/// The highlighting style for code in the Material Palenight theme.
|
||||
export const materialPalenightHighlightStyle = HighlightStyle.define([
|
||||
{ tag: t.keyword, color: '#c792ea' },
|
||||
{ tag: t.operator, color: '#89ddff' },
|
||||
{ tag: t.special(t.variableName), color: '#eeffff' },
|
||||
{ tag: t.typeName, color: '#f07178' },
|
||||
{ tag: t.atom, color: '#f78c6c' },
|
||||
{ tag: t.number, color: '#ff5370' },
|
||||
{ tag: t.definition(t.variableName), color: '#82aaff' },
|
||||
{ tag: t.string, color: '#c3e88d' },
|
||||
{ tag: t.special(t.string), color: '#f07178' },
|
||||
{ tag: t.comment, color: stone },
|
||||
{ tag: t.variableName, color: '#f07178' },
|
||||
{ tag: t.tagName, color: '#ff5370' },
|
||||
{ tag: t.bracket, color: '#a2a1a4' },
|
||||
{ tag: t.meta, color: '#ffcb6b' },
|
||||
{ tag: t.attributeName, color: '#c792ea' },
|
||||
{ tag: t.propertyName, color: '#c792ea' },
|
||||
{ tag: t.className, color: '#decb6b' },
|
||||
{ tag: t.invalid, color: invalid },
|
||||
]);
|
||||
|
||||
/// Extension to enable the Material Palenight theme (both the editor theme and
|
||||
/// the highlight style).
|
||||
// : Extension
|
||||
export const materialPalenight = [materialPalenightTheme, materialPalenightHighlightStyle];
|
||||
@ -1,8 +1,9 @@
|
||||
import React, { useCallback, useMemo, useState } from 'react';
|
||||
import React, { useState } from 'react';
|
||||
import { Tone } from '@strudel.cycles/tone';
|
||||
import useRepl from '../useRepl.mjs';
|
||||
import CodeMirror, { markEvent } from '../CodeMirror';
|
||||
import cx from '../cx';
|
||||
import useHighlighting from '../useHighlighting';
|
||||
import { useInView } from 'react-hook-inview';
|
||||
|
||||
// eval stuff start
|
||||
import { extend } from '@strudel.cycles/eval';
|
||||
@ -24,6 +25,7 @@ import '@strudel.cycles/xen/tune.mjs';
|
||||
import '@strudel.cycles/core/euclid.mjs';
|
||||
import '@strudel.cycles/tone/pianoroll.mjs';
|
||||
import '@strudel.cycles/tone/draw.mjs';
|
||||
import CodeMirror6 from '../CodeMirror6';
|
||||
|
||||
extend(Tone, strudel, strudel.Pattern.prototype.bootstrap(), toneHelpers, voicingHelpers, drawHelpers, uiHelpers, {
|
||||
gist,
|
||||
@ -43,17 +45,19 @@ const defaultSynth = new Tone.PolySynth().chain(new Tone.Gain(0.5), Tone.Destina
|
||||
// "balanced" | "interactive" | "playback";
|
||||
// Tone.setContext(new Tone.Context({ latencyHint: 'playback', lookAhead: 1 }));
|
||||
function MiniRepl({ tune, maxHeight = 500 }) {
|
||||
const [editor, setEditor] = useState();
|
||||
const { code, setCode, activateCode, activeCode, setPattern, error, cycle, dirty, log, togglePlay, hash } = useRepl({
|
||||
const { code, setCode, pattern, activateCode, error, cycle, dirty, togglePlay } = useRepl({
|
||||
tune,
|
||||
defaultSynth,
|
||||
autolink: false,
|
||||
onDraw: useCallback(markEvent(editor), [editor]),
|
||||
});
|
||||
const lines = code.split('\n').length;
|
||||
const height = Math.min(lines * 30 + 30, maxHeight);
|
||||
const [view, setView] = useState();
|
||||
const [ref, isVisible] = useInView({
|
||||
threshold: 0.01,
|
||||
});
|
||||
useHighlighting({ view, pattern, started: cycle.started });
|
||||
return (
|
||||
<div className="rounded-md overflow-hidden">
|
||||
<div className="rounded-md overflow-hidden bg-[#444C57]" ref={ref}>
|
||||
<div className="flex justify-between bg-slate-700 border-t border-slate-500">
|
||||
<div className="flex">
|
||||
<button
|
||||
@ -101,18 +105,8 @@ function MiniRepl({ tune, maxHeight = 500 }) {
|
||||
</div>
|
||||
<div className="text-right p-1 text-sm">{error && <span className="text-red-200">{error.message}</span>}</div>{' '}
|
||||
</div>
|
||||
<div className="flex space-y-0 overflow-auto" style={{ height }}>
|
||||
<CodeMirror
|
||||
className="w-full"
|
||||
value={code}
|
||||
editorDidMount={setEditor}
|
||||
options={{
|
||||
mode: 'javascript',
|
||||
theme: 'material',
|
||||
lineNumbers: true,
|
||||
}}
|
||||
onChange={(_, __, value) => setCode(value)}
|
||||
/>
|
||||
<div className="flex space-y-0 overflow-auto relative">
|
||||
{isVisible && <CodeMirror6 value={code} onChange={setCode} onViewChanged={setView} />}
|
||||
</div>
|
||||
{/* <div className="bg-slate-700 border-t border-slate-500 content-right pr-2 text-right">
|
||||
<a href={`https://strudel.tidalcycles.org/#${hash}`} className="text-white items-center inline-flex">
|
||||
|
||||
@ -2,10 +2,8 @@
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
|
||||
.react-codemirror2,
|
||||
.CodeMirror {
|
||||
width: 100% !important;
|
||||
height: inherit !important;
|
||||
.cm-editor {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
main {
|
||||
|
||||
33
repl/src/useHighlighting.js
Normal file
33
repl/src/useHighlighting.js
Normal file
@ -0,0 +1,33 @@
|
||||
import { useEffect } from 'react';
|
||||
import { setHighlights } from './CodeMirror6';
|
||||
import { Tone } from '@strudel.cycles/tone';
|
||||
|
||||
let highlights = []; // actively highlighted events
|
||||
|
||||
function useHighlighting({ view, pattern, started }) {
|
||||
useEffect(() => {
|
||||
if (view) {
|
||||
if (pattern && started) {
|
||||
let frame = requestAnimationFrame(updateHighlights);
|
||||
|
||||
function updateHighlights() {
|
||||
const audioTime = Tone.getTransport().seconds;
|
||||
highlights = highlights.filter((hap) => hap.whole.end > audioTime); // keep only highlights that are still active
|
||||
const haps = pattern.queryArc(audioTime, audioTime + 1 / 60).filter((hap) => hap.hasOnset());
|
||||
highlights = highlights.concat(haps); // add potential new onsets
|
||||
view.dispatch({ effects: setHighlights.of(highlights) }); // highlight all still active + new active haps
|
||||
frame = requestAnimationFrame(updateHighlights);
|
||||
}
|
||||
|
||||
return () => {
|
||||
cancelAnimationFrame(frame);
|
||||
};
|
||||
} else {
|
||||
highlights = [];
|
||||
view.dispatch({ effects: setHighlights.of([]) });
|
||||
}
|
||||
}
|
||||
}, [pattern, started, view]);
|
||||
}
|
||||
|
||||
export default useHighlighting;
|
||||
@ -17,7 +17,7 @@ let s4 = () => {
|
||||
};
|
||||
const generateHash = (code) => encodeURIComponent(btoa(code));
|
||||
|
||||
function useRepl({ tune, defaultSynth, autolink = true, onEvent, onDraw }) {
|
||||
function useRepl({ tune, defaultSynth, autolink = true, onEvent, onDraw: onDrawProp }) {
|
||||
const id = useMemo(() => s4(), []);
|
||||
const [code, setCode] = useState(tune);
|
||||
const [activeCode, setActiveCode] = useState();
|
||||
@ -30,11 +30,11 @@ function useRepl({ tune, defaultSynth, autolink = true, onEvent, onDraw }) {
|
||||
const pushLog = useCallback((message) => setLog((log) => log + `${log ? '\n\n' : ''}${message}`), []);
|
||||
|
||||
// below block allows disabling the highlighting by including "strudel disable-highlighting" in the code (as comment)
|
||||
onDraw = useMemo(() => {
|
||||
const onDraw = useMemo(() => {
|
||||
if (activeCode && !activeCode.includes('strudel disable-highlighting')) {
|
||||
return onDraw;
|
||||
return (time, event) => onDrawProp?.(time, event, activeCode);
|
||||
}
|
||||
}, [activeCode, onDraw]);
|
||||
}, [activeCode, onDrawProp]);
|
||||
|
||||
// cycle hook to control scheduling
|
||||
const cycle = useCycle({
|
||||
@ -146,6 +146,7 @@ function useRepl({ tune, defaultSynth, autolink = true, onEvent, onDraw }) {
|
||||
dirty,
|
||||
log,
|
||||
togglePlay,
|
||||
setActiveCode,
|
||||
activateCode,
|
||||
activeCode,
|
||||
pushLog,
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user