mirrors/halo
1
0
Fork 0
mirror of https://github.com/halo-dev/halo.git synced 2025-12-14 16:24:01 +08:00
Code Issues Packages Projects Releases Wiki Activity

Refactor Codemirror language loading to async (#7956)

Browse Source
This commit is contained in:
Ryan Wang
2025-11-21 15:04:42 +08:00
committed by GitHub
parent 64620140e5
commit 57e7df9f95
4 changed files with 285 additions and 215 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
ui/package.json
View File

@@ -44,15 +44,15 @@
"axios": "^1.12.2"
},
"dependencies": {
"@codemirror/commands": "^6.1.2",
"@codemirror/lang-css": "^6.0.1",
"@codemirror/lang-html": "^6.2.0",
"@codemirror/lang-javascript": "^6.1.1",
"@codemirror/lang-json": "^6.0.1",
"@codemirror/language": "^6.3.1",
"@codemirror/legacy-modes": "^6.3.0",
"@codemirror/state": "^6.1.4",
"@codemirror/view": "^6.5.1",
"@codemirror/commands": "^6.10.0",
"@codemirror/lang-css": "^6.3.1",
"@codemirror/lang-html": "^6.4.11",
"@codemirror/lang-javascript": "^6.2.4",
"@codemirror/lang-json": "^6.0.2",
"@codemirror/lang-yaml": "^6.1.2",
"@codemirror/language": "^6.11.3",
"@codemirror/state": "^6.5.2",
"@codemirror/view": "^6.38.8",
"@emoji-mart/data": "^1.2.1",
"@formkit/addons": "^1.6.9",
"@formkit/core": "^1.6.9",
@@ -88,7 +88,7 @@
"@vueuse/router": "^12.8.2",
"@vueuse/shared": "^12.8.2",
"axios": "^1.12.2",
"codemirror": "^6.0.1",
"codemirror": "^6.0.2",
"colorjs.io": "^0.4.3",
"core-js": "^3.43.0",
"cropperjs": "^1.5.13",
@@ -181,7 +181,8 @@
"prosemirror-model": "1.25.1",
"prosemirror-transform": "1.10.4",
"prosemirror-view": "1.40.0",
"vite": "npm:rolldown-vite@7.2.5"
"vite": "npm:rolldown-vite@7.2.5",
"@lezer/javascript": "1.5.4"
},
"onlyBuiltDependencies": [
"@nestjs/core",

333
ui/pnpm-lock.yaml generated
View File

@@ -6,42 +6,43 @@ settings:
overrides:
axios: ^1.12.2
vite: npm:rolldown-vite@7.2.5
prosemirror-model: 1.25.1
prosemirror-view: 1.40.0
prosemirror-transform: 1.10.4
prosemirror-view: 1.40.0
vite: npm:rolldown-vite@7.2.5
'@lezer/javascript': 1.5.4
importers:
.:
dependencies:
'@codemirror/commands':
specifier: ^6.1.2
version: 6.1.2
specifier: ^6.10.0
version: 6.10.0
'@codemirror/lang-css':
specifier: ^6.0.1
version: 6.0.1(@codemirror/view@6.5.1)(@lezer/common@1.0.1)
'@codemirror/lang-html':
specifier: ^6.2.0
version: 6.2.0
'@codemirror/lang-javascript':
specifier: ^6.1.1
version: 6.1.1
'@codemirror/lang-json':
specifier: ^6.0.1
version: 6.0.1
'@codemirror/language':
specifier: ^6.3.1
version: 6.3.1
'@codemirror/legacy-modes':
specifier: ^6.3.0
version: 6.3.0
version: 6.3.1(@codemirror/view@6.38.8)
'@codemirror/lang-html':
specifier: ^6.4.11
version: 6.4.11
'@codemirror/lang-javascript':
specifier: ^6.2.4
version: 6.2.4
'@codemirror/lang-json':
specifier: ^6.0.2
version: 6.0.2
'@codemirror/lang-yaml':
specifier: ^6.1.2
version: 6.1.2(@codemirror/view@6.38.8)
'@codemirror/language':
specifier: ^6.11.3
version: 6.11.3
'@codemirror/state':
specifier: ^6.1.4
version: 6.1.4
specifier: ^6.5.2
version: 6.5.2
'@codemirror/view':
specifier: ^6.5.1
version: 6.5.1
specifier: ^6.38.8
version: 6.38.8
'@emoji-mart/data':
specifier: ^1.2.1
version: 1.2.1
@@ -148,8 +149,8 @@ importers:
specifier: ^1.12.2
version: 1.12.2(debug@4.3.2)
codemirror:
specifier: ^6.0.1
version: 6.0.1(@lezer/common@1.0.1)
specifier: ^6.0.2
version: 6.0.2(@lezer/common@1.3.0)
colorjs.io:
specifier: ^0.4.3
version: 0.4.3
@@ -792,26 +793,26 @@ packages:
'@codemirror/view': ^6.0.0
'@lezer/common': ^1.0.0
'@codemirror/commands@6.1.2':
resolution: {integrity: sha512-sO3jdX1s0pam6lIdeSJLMN3DQ6mPEbM4yLvyKkdqtmd/UDwhXA5+AwFJ89rRXm6vTeOXBsE5cAmlos/t7MJdgg==}
'@codemirror/commands@6.10.0':
resolution: {integrity: sha512-2xUIc5mHXQzT16JnyOFkh8PvfeXuIut3pslWGfsGOhxP/lpgRm9HOl/mpzLErgt5mXDovqA0d11P21gofRLb9w==}
'@codemirror/lang-css@6.0.1':
resolution: {integrity: sha512-rlLq1Dt0WJl+2epLQeAsfqIsx3lGu4HStHCJu95nGGuz2P2fNugbU3dQYafr2VRjM4eMC9HviI6jvS98CNtG5w==}
'@codemirror/lang-css@6.3.1':
resolution: {integrity: sha512-kr5fwBGiGtmz6l0LSJIbno9QrifNMUusivHbnA1H6Dmqy4HZFte3UAICix1VuKo0lMPKQr2rqB+0BkKi/S3Ejg==}
'@codemirror/lang-html@6.2.0':
resolution: {integrity: sha512-0Kr+gWPu1J4mhpLbqHPqoD5+xLCwAntfzRv9L61cqRSFNpDpDbGbONSN5xzWupo6AJ9qtDOlJNBFBuL72tXPwg==}
'@codemirror/lang-html@6.4.11':
resolution: {integrity: sha512-9NsXp7Nwp891pQchI7gPdTwBuSuT3K65NGTHWHNJ55HjYcHLllr0rbIZNdOzas9ztc1EUVBlHou85FFZS4BNnw==}
'@codemirror/lang-javascript@6.1.1':
resolution: {integrity: sha512-F4+kiuC5d5dUSJmff96tJQwpEXs/tX/4bapMRnZWW6bHKK1Fx6MunTzopkCUWRa9bF87GPmb9m7Qtg7Yv8f3uQ==}
'@codemirror/lang-javascript@6.2.4':
resolution: {integrity: sha512-0WVmhp1QOqZ4Rt6GlVGwKJN3KW7Xh4H2q8ZZNGZaP6lRdxXJzmjm4FqvmOojVj6khWJHIb9sp7U/72W7xQgqAA==}
'@codemirror/lang-json@6.0.1':
resolution: {integrity: sha512-+T1flHdgpqDDlJZ2Lkil/rLiRy684WMLc74xUnjJH48GQdfJo/pudlTRreZmKwzP8/tGdKf83wlbAdOCzlJOGQ==}
'@codemirror/lang-json@6.0.2':
resolution: {integrity: sha512-x2OtO+AvwEHrEwR0FyyPtfDUiloG3rnVTSZV1W8UteaLL8/MajQd8DpvUb2YVzC+/T18aSDv0H9mu+xw0EStoQ==}
'@codemirror/language@6.3.1':
resolution: {integrity: sha512-MK+G1QKaGfSEUg9YEFaBkMBI6j1ge4VMBPZv9fDYotw7w695c42x5Ba1mmwBkesYnzYFBfte6Hh9TDcKa6xORQ==}
'@codemirror/lang-yaml@6.1.2':
resolution: {integrity: sha512-dxrfG8w5Ce/QbT7YID7mWZFKhdhsaTNOYjOkSIMt1qmC4VQnXSDSYVHHHn8k6kJUfIhtLo8t1JJgltlxWdsITw==}
'@codemirror/legacy-modes@6.3.0':
resolution: {integrity: sha512-54ncmguzXZQ3u+8gx4/mpBRbkn6TLzfIrCGvFNLgB3giFYY3E2UETzv1RCFP0hM2L2bQBKBoI92i4ahrDAiE6g==}
'@codemirror/language@6.11.3':
resolution: {integrity: sha512-9HBM2XnwDj7fnu0551HkGdrUrrqmYq/WC5iv6nbY2WdicXdGbhR/gfbZOH73Aqj4351alY1+aoG9rCNfiwS1RA==}
'@codemirror/lint@6.0.0':
resolution: {integrity: sha512-nUUXcJW1Xp54kNs+a1ToPLK8MadO0rMTnJB8Zk4Z8gBdrN0kqV7uvUraU/T2yqg+grDNR38Vmy/MrhQN/RgwiA==}
@@ -819,11 +820,11 @@ packages:
'@codemirror/search@6.2.1':
resolution: {integrity: sha512-Q1JgUSBjQZRPIddlXzad/AVDigdhriLxQNFyP0gfrDTq6LDHNhr95U/tW3bpVssGenkaLzujtu/7XoK4kyvL3g==}
'@codemirror/state@6.1.4':
resolution: {integrity: sha512-g+3OJuRylV5qsXuuhrc6Cvs1NQluNioepYMM2fhnpYkNk7NgX+j0AFuevKSVKzTDmDyt9+Puju+zPdHNECzCNQ==}
'@codemirror/state@6.5.2':
resolution: {integrity: sha512-FVqsPqtPWKVVL3dPSxy8wEF/ymIEuVzF1PK3VbUgrxXpJUSHQWWZz4JMToquRxnkw+36LTamCZG2iua2Ptq0fA==}
'@codemirror/view@6.5.1':
resolution: {integrity: sha512-xBKP8N3AXOs06VcKvIuvIQoUlGs7Hb78ftJWahLaRX909jKPMgGxR5XjvrawzTTZMSTU3DzdjDNPwG6fPM/ypQ==}
'@codemirror/view@6.38.8':
resolution: {integrity: sha512-XcE9fcnkHCbWkjeKyi0lllwXmBLtyYb5dt89dJyx23I9+LSh5vZDIuk7OLG4VM1lgrXZQcY6cxyZyk5WVPRv/A==}
'@cspotcode/source-map-support@0.8.1':
resolution: {integrity: sha512-IchNf6dN4tHoMFIn/7OE8LWZ19Y6q/67Bmf6vnGREv8RSbBVb9LPJxEcnwrcwX6ixSvaiGoomAUvu4YSxXrVgw==}
@@ -1365,26 +1366,29 @@ packages:
'@jridgewell/trace-mapping@0.3.9':
resolution: {integrity: sha512-3Belt6tdc8bPgAtbcmdtNJlirVoTmEb5e2gC94PnkwEW9jI6CAHUeoG85tjWP5WquqfavoMtMwiG4P926ZKKuQ==}
'@lezer/common@1.0.1':
resolution: {integrity: sha512-8TR5++Q/F//tpDsLd5zkrvEX5xxeemafEaek7mUp7Y+bI8cKQXdSqhzTOBaOogETcMOVr0pT3BBPXp13477ciw==}
'@lezer/common@1.3.0':
resolution: {integrity: sha512-L9X8uHCYU310o99L3/MpJKYxPzXPOS7S0NmBaM7UO/x2Kb2WbmMLSkfvdr1KxRIFYOpbY0Jhn7CfLSUDzL8arQ==}
'@lezer/css@1.0.1':
resolution: {integrity: sha512-kLGsbzXdp1ntzO2jDwFf+2w76EBlLiD4FKofx7tgkdqeFRoslFiMS2qqbNtAauXw8ihZ4cE5YpxSpfsKXSs5Sg==}
'@lezer/css@1.3.0':
resolution: {integrity: sha512-pBL7hup88KbI7hXnZV3PQsn43DHy6TWyzuyk2AO9UyoXcDltvIdqWKE1dLL/45JVZ+YZkHe1WVHqO6wugZZWcw==}
'@lezer/highlight@1.1.1':
resolution: {integrity: sha512-duv9D23O9ghEDnnUDmxu+L8pJy4nYo4AbCOHIudUhscrLSazqeJeK1V50EU6ZufWF1zv0KJwu/frFRyZWXxHBQ==}
'@lezer/highlight@1.2.3':
resolution: {integrity: sha512-qXdH7UqTvGfdVBINrgKhDsVTJTxactNNxLk7+UMwZhU13lMHaOBlJe9Vqp907ya56Y3+ed2tlqzys7jDkTmW0g==}
'@lezer/html@1.1.1':
resolution: {integrity: sha512-L70zLh1+bemYcnaAK03Ghfu24DVxY9uScDawyjR1Y/13P2MbN72hMB9T7Ln/Vl5dL5DWI0YsxbaeIHKikx2DiQ==}
'@lezer/html@1.3.12':
resolution: {integrity: sha512-RJ7eRWdaJe3bsiiLLHjCFT1JMk8m1YP9kaUbvu2rMLEoOnke9mcTVDyfOslsln0LtujdWespjJ39w6zo+RsQYw==}
'@lezer/javascript@1.0.2':
resolution: {integrity: sha512-IjOVeIRhM8IuafWNnk+UzRz7p4/JSOKBNINLYLsdSGuJS9Ju7vFdc82AlTt0jgtV5D8eBZf4g0vK4d3ttBNz7A==}
'@lezer/javascript@1.5.4':
resolution: {integrity: sha512-vvYx3MhWqeZtGPwDStM2dwgljd5smolYD2lR2UyFcHfxbBQebqx8yjmFmxtJ/E6nN6u1D9srOiVWm3Rb4tmcUA==}
'@lezer/json@1.0.0':
resolution: {integrity: sha512-zbAuUY09RBzCoCA3lJ1+ypKw5WSNvLqGMtasdW6HvVOqZoCpPr8eWrsGnOVWGKGn8Rh21FnrKRVlJXrGAVUqRw==}
'@lezer/lr@1.2.3':
resolution: {integrity: sha512-qpB7rBzH8f6Mzjv2AVZRahcm+2Cf7nbIH++uXbvVOL1yIRvVWQ3HAM/saeBLCyz/togB7LGo76qdJYL1uKQlqA==}
'@lezer/lr@1.4.3':
resolution: {integrity: sha512-yenN5SqAxAPv/qMnpWW0AT7l+SxVrgG+u0tNsRQWqbrz66HIl8DnEbBObvy21J5K7+I1v7gsAnlE2VQ5yYVSeA==}
'@lezer/yaml@1.0.3':
resolution: {integrity: sha512-GuBLekbw9jDBDhGur82nuwkxKQ+a3W5H0GfaAthDXcAu+XdpS43VlnxA9E9hllkpSP5ellRDKjLLj7Lu9Wr6xA==}
'@ljharb/through@2.3.11':
resolution: {integrity: sha512-ccfcIDlogiXNq5KcbAwbaO7lMh3Tm1i3khMPYpxlK8hH/W53zN81KM9coerRLOnTGu3nfXIniAmQbRI9OxbC0w==}
@@ -1394,6 +1398,9 @@ packages:
resolution: {integrity: sha512-Z7C/xXCiGWsg0KuKsHTKJxbWhpI3Vs5GwLfOean7MGyVFGqdRgBbAjOCh6u4bbjPc/8MJ2pZmK/0DLdCbivLDA==}
engines: {node: '>=8'}
'@marijn/find-cluster-break@1.0.2':
resolution: {integrity: sha512-l0h88YhZFyKdXIFNfSWpyjStDjGHwZ/U7iobcK1cQQD8sejsONdQtTVU+1wVN1PBw40PiiHB1vA5S7VTfQiP9g==}
'@mdx-js/react@3.1.1':
resolution: {integrity: sha512-f++rKLQgUVYDAtECQ6fn/is15GkEH9+nZPM3MS0RcxVqoTfawHvDlSCH7JbMhAM6uJ32v3eXLvLmLvjGu7PTQw==}
peerDependencies:
@@ -2370,8 +2377,8 @@ packages:
'@transloadit/prettier-bytes@0.3.4':
resolution: {integrity: sha512-8/SnIF9Q2k52mbjRVAYLranwkaDTLb+O9r4Z/uo8uNw//SjygKvvbF4BHSOuReufaAyum1q13602VcNud25Dfg==}
'@tsconfig/node10@1.0.11':
resolution: {integrity: sha512-DcRjDCujK/kCk/cUe8Xz8ZSpm8mS3mNNpta+jGCA6USEDfktlNvm1+IuZ9eTcDbNk41BHwpHHeW+N1lKCz4zOw==}
'@tsconfig/node10@1.0.12':
resolution: {integrity: sha512-UCYBaeFvM11aU2y3YPZ//O5Rhj+xKyzy7mvcIoAjASbigy8mHMryP5cK7dgjlz2hWxh1g5pLw084E0a/wlUSFQ==}
'@tsconfig/node12@1.0.11':
resolution: {integrity: sha512-cqefuRsh12pWyGsIoBKJA9luFu3mRxCA+ORZvA4ktLSzIuCUtWVxGIuXigEwO5/ywWFMZ2QEGKWvkZG1zDMTag==}
@@ -3490,8 +3497,8 @@ packages:
resolution: {integrity: sha512-JQHZ2QMW6l3aH/j6xCqQThY/9OH4D/9ls34cgkUBiEeocRTU04tHfKPBsUK1PqZCUQM7GiA0IIXJSuXHI64Kbg==}
engines: {node: '>=0.8'}
codemirror@6.0.1:
resolution: {integrity: sha512-J8j+nZ+CdWmIeFIGXEFbFPtpiYacFMDR8GlHK3IyHQJMCaVRfGx9NT+Hxivv1ckLWPvNdZqndbr/7lVhrf/Svg==}
codemirror@6.0.2:
resolution: {integrity: sha512-VhydHotNW5w1UGK0Qj96BwSk/Zqbp9WbnyK2W/eVMv4QyF41INRGpjUhFJY7/uDNuudSc33a/PKr4iDqRduvHw==}
color-convert@1.9.3:
resolution: {integrity: sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==}
@@ -3620,8 +3627,8 @@ packages:
create-require@1.1.1:
resolution: {integrity: sha512-dcKFX3jn0MpIaXjisoRvexIJVEKzaq7z2rZKxf+MSr9TkdmHmsU4m2lcLojrj/FHl8mk5VxMmYA+ftRkP/3oKQ==}
crelt@1.0.5:
resolution: {integrity: sha512-+BO9wPPi+DWTDcNYhr/W90myha8ptzftZT+LwcmUbbok0rcP/fequmFYCw8NMoH7pkAZQzU78b3kYrlua5a9eA==}
crelt@1.0.6:
resolution: {integrity: sha512-VQ2MBenTq1fWZUH9DJNGti7kKv6EeAuYr3cLwxUWhIu1baTaXh4Ib5W2CqHVqib4/MqbYGJqiL3Zb8GJZr3l4g==}
cropperjs@1.5.13:
resolution: {integrity: sha512-by7jKAo73y5/Do0K6sxdTKHgndY0NMjG2bEdgeJxycbcmHuCiMXqw8sxy5C5Y5WTOTcDGmbT7Sr5CgKOXR06OA==}
@@ -6485,8 +6492,8 @@ packages:
resolution: {integrity: sha512-0Ju4+6A8iOnpL/Thra7dZsSlOHYAHIeMxfhWQRI1/VLcT3WDBZKKtQt/QkBOsiIN9ZpuvHE6cGZ0x4glCMmfiA==}
engines: {node: '>=12'}
semver@5.7.1:
resolution: {integrity: sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ==}
semver@5.7.2:
resolution: {integrity: sha512-cBznnQ9KjJqU67B52RMC65CMarK2600WFnbkcaiwWq3xy/5haFJlshgnpjovMVJ+Hff49d8GEn0b87C5pDQ10g==}
hasBin: true
semver@6.3.1:
@@ -6757,8 +6764,8 @@ packages:
resolution: {integrity: sha512-KIy5nylvC5le1OdaaoCJ07L+8iQzJHGH6pWDuzS+d07Cu7n1MZ2x26P8ZKIWfbK02+XIL8Mp4RkWeqdUCrDMfg==}
engines: {node: '>=18'}
style-mod@4.0.0:
resolution: {integrity: sha512-OPhtyEjyyN9x3nhPsu76f52yUGXiZcgvsrFVtvTkyGRQJ0XK+GPc6ov1z+lRpbeabka+MYEQxOYRnt5nF30aMw==}
style-mod@4.1.3:
resolution: {integrity: sha512-i/n8VsZydrugj3Iuzll8+x/00GH2vnYsk1eomD8QiRrSAeW6ItbCQDtfXCeJHd0iwiNagqjQkvpvREEPtW3IoQ==}
sucrase@3.35.0:
resolution: {integrity: sha512-8EbVDiu9iN/nESwxeSxDKe0dunta1GOlHufmSSXxMD2z2/tMZpDMpvXQGsc+ajGo8y2uYUmixaSRUc/QPoQ0GA==}
@@ -7766,87 +7773,99 @@ snapshots:
material-colors: 1.2.6
vue: 3.5.24(typescript@5.9.3)
'@codemirror/autocomplete@6.3.0(@codemirror/language@6.3.1)(@codemirror/state@6.1.4)(@codemirror/view@6.5.1)(@lezer/common@1.0.1)':
'@codemirror/autocomplete@6.3.0(@codemirror/language@6.11.3)(@codemirror/state@6.5.2)(@codemirror/view@6.38.8)(@lezer/common@1.3.0)':
dependencies:
'@codemirror/language': 6.3.1
'@codemirror/state': 6.1.4
'@codemirror/view': 6.5.1
'@lezer/common': 1.0.1
'@codemirror/language': 6.11.3
'@codemirror/state': 6.5.2
'@codemirror/view': 6.38.8
'@lezer/common': 1.3.0
'@codemirror/commands@6.1.2':
'@codemirror/commands@6.10.0':
dependencies:
'@codemirror/language': 6.3.1
'@codemirror/state': 6.1.4
'@codemirror/view': 6.5.1
'@lezer/common': 1.0.1
'@codemirror/language': 6.11.3
'@codemirror/state': 6.5.2
'@codemirror/view': 6.38.8
'@lezer/common': 1.3.0
'@codemirror/lang-css@6.0.1(@codemirror/view@6.5.1)(@lezer/common@1.0.1)':
'@codemirror/lang-css@6.3.1(@codemirror/view@6.38.8)':
dependencies:
'@codemirror/autocomplete': 6.3.0(@codemirror/language@6.3.1)(@codemirror/state@6.1.4)(@codemirror/view@6.5.1)(@lezer/common@1.0.1)
'@codemirror/language': 6.3.1
'@codemirror/state': 6.1.4
'@lezer/css': 1.0.1
'@codemirror/autocomplete': 6.3.0(@codemirror/language@6.11.3)(@codemirror/state@6.5.2)(@codemirror/view@6.38.8)(@lezer/common@1.3.0)
'@codemirror/language': 6.11.3
'@codemirror/state': 6.5.2
'@lezer/common': 1.3.0
'@lezer/css': 1.3.0
transitivePeerDependencies:
- '@codemirror/view'
- '@lezer/common'
'@codemirror/lang-html@6.2.0':
'@codemirror/lang-html@6.4.11':
dependencies:
'@codemirror/autocomplete': 6.3.0(@codemirror/language@6.3.1)(@codemirror/state@6.1.4)(@codemirror/view@6.5.1)(@lezer/common@1.0.1)
'@codemirror/lang-css': 6.0.1(@codemirror/view@6.5.1)(@lezer/common@1.0.1)
'@codemirror/lang-javascript': 6.1.1
'@codemirror/language': 6.3.1
'@codemirror/state': 6.1.4
'@codemirror/view': 6.5.1
'@lezer/common': 1.0.1
'@lezer/html': 1.1.1
'@codemirror/autocomplete': 6.3.0(@codemirror/language@6.11.3)(@codemirror/state@6.5.2)(@codemirror/view@6.38.8)(@lezer/common@1.3.0)
'@codemirror/lang-css': 6.3.1(@codemirror/view@6.38.8)
'@codemirror/lang-javascript': 6.2.4
'@codemirror/language': 6.11.3
'@codemirror/state': 6.5.2
'@codemirror/view': 6.38.8
'@lezer/common': 1.3.0
'@lezer/css': 1.3.0
'@lezer/html': 1.3.12
'@codemirror/lang-javascript@6.1.1':
'@codemirror/lang-javascript@6.2.4':
dependencies:
'@codemirror/autocomplete': 6.3.0(@codemirror/language@6.3.1)(@codemirror/state@6.1.4)(@codemirror/view@6.5.1)(@lezer/common@1.0.1)
'@codemirror/language': 6.3.1
'@codemirror/autocomplete': 6.3.0(@codemirror/language@6.11.3)(@codemirror/state@6.5.2)(@codemirror/view@6.38.8)(@lezer/common@1.3.0)
'@codemirror/language': 6.11.3
'@codemirror/lint': 6.0.0
'@codemirror/state': 6.1.4
'@codemirror/view': 6.5.1
'@lezer/common': 1.0.1
'@lezer/javascript': 1.0.2
'@codemirror/state': 6.5.2
'@codemirror/view': 6.38.8
'@lezer/common': 1.3.0
'@lezer/javascript': 1.5.4
'@codemirror/lang-json@6.0.1':
'@codemirror/lang-json@6.0.2':
dependencies:
'@codemirror/language': 6.3.1
'@codemirror/language': 6.11.3
'@lezer/json': 1.0.0
'@codemirror/language@6.3.1':
'@codemirror/lang-yaml@6.1.2(@codemirror/view@6.38.8)':
dependencies:
'@codemirror/state': 6.1.4
'@codemirror/view': 6.5.1
'@lezer/common': 1.0.1
'@lezer/highlight': 1.1.1
'@lezer/lr': 1.2.3
style-mod: 4.0.0
'@codemirror/autocomplete': 6.3.0(@codemirror/language@6.11.3)(@codemirror/state@6.5.2)(@codemirror/view@6.38.8)(@lezer/common@1.3.0)
'@codemirror/language': 6.11.3
'@codemirror/state': 6.5.2
'@lezer/common': 1.3.0
'@lezer/highlight': 1.2.3
'@lezer/lr': 1.4.3
'@lezer/yaml': 1.0.3
transitivePeerDependencies:
- '@codemirror/view'
'@codemirror/legacy-modes@6.3.0':
'@codemirror/language@6.11.3':
dependencies:
'@codemirror/language': 6.3.1
'@codemirror/state': 6.5.2
'@codemirror/view': 6.38.8
'@lezer/common': 1.3.0
'@lezer/highlight': 1.2.3
'@lezer/lr': 1.4.3
style-mod: 4.1.3
'@codemirror/lint@6.0.0':
dependencies:
'@codemirror/state': 6.1.4
'@codemirror/view': 6.5.1
crelt: 1.0.5
'@codemirror/state': 6.5.2
'@codemirror/view': 6.38.8
crelt: 1.0.6
'@codemirror/search@6.2.1':
dependencies:
'@codemirror/state': 6.1.4
'@codemirror/view': 6.5.1
crelt: 1.0.5
'@codemirror/state': 6.5.2
'@codemirror/view': 6.38.8
crelt: 1.0.6
'@codemirror/state@6.1.4': {}
'@codemirror/view@6.5.1':
'@codemirror/state@6.5.2':
dependencies:
'@codemirror/state': 6.1.4
style-mod: 4.0.0
'@marijn/find-cluster-break': 1.0.2
'@codemirror/view@6.38.8':
dependencies:
'@codemirror/state': 6.5.2
crelt: 1.0.6
style-mod: 4.1.3
w3c-keyname: 2.2.6
'@cspotcode/source-map-support@0.8.1':
@@ -8384,36 +8403,44 @@ snapshots:
'@jridgewell/sourcemap-codec': 1.5.5
optional: true
'@lezer/common@1.0.1': {}
'@lezer/common@1.3.0': {}
'@lezer/css@1.0.1':
'@lezer/css@1.3.0':
dependencies:
'@lezer/highlight': 1.1.1
'@lezer/lr': 1.2.3
'@lezer/common': 1.3.0
'@lezer/highlight': 1.2.3
'@lezer/lr': 1.4.3
'@lezer/highlight@1.1.1':
'@lezer/highlight@1.2.3':
dependencies:
'@lezer/common': 1.0.1
'@lezer/common': 1.3.0
'@lezer/html@1.1.1':
'@lezer/html@1.3.12':
dependencies:
'@lezer/common': 1.0.1
'@lezer/highlight': 1.1.1
'@lezer/lr': 1.2.3
'@lezer/common': 1.3.0
'@lezer/highlight': 1.2.3
'@lezer/lr': 1.4.3
'@lezer/javascript@1.0.2':
'@lezer/javascript@1.5.4':
dependencies:
'@lezer/highlight': 1.1.1
'@lezer/lr': 1.2.3
'@lezer/common': 1.3.0
'@lezer/highlight': 1.2.3
'@lezer/lr': 1.4.3
'@lezer/json@1.0.0':
dependencies:
'@lezer/highlight': 1.1.1
'@lezer/lr': 1.2.3
'@lezer/highlight': 1.2.3
'@lezer/lr': 1.4.3
'@lezer/lr@1.2.3':
'@lezer/lr@1.4.3':
dependencies:
'@lezer/common': 1.0.1
'@lezer/common': 1.3.0
'@lezer/yaml@1.0.3':
dependencies:
'@lezer/common': 1.3.0
'@lezer/highlight': 1.2.3
'@lezer/lr': 1.4.3
'@ljharb/through@2.3.11':
dependencies:
@@ -8421,6 +8448,8 @@ snapshots:
'@lukeed/csprng@1.1.0': {}
'@marijn/find-cluster-break@1.0.2': {}
'@mdx-js/react@3.1.1(@types/react@18.2.41)(react@18.2.0)':
dependencies:
'@types/mdx': 2.0.10
@@ -9405,7 +9434,7 @@ snapshots:
'@transloadit/prettier-bytes@0.3.4': {}
'@tsconfig/node10@1.0.11':
'@tsconfig/node10@1.0.12':
optional: true
'@tsconfig/node12@1.0.11':
@@ -10704,15 +10733,15 @@ snapshots:
clone@1.0.4: {}
codemirror@6.0.1(@lezer/common@1.0.1):
codemirror@6.0.2(@lezer/common@1.3.0):
dependencies:
'@codemirror/autocomplete': 6.3.0(@codemirror/language@6.3.1)(@codemirror/state@6.1.4)(@codemirror/view@6.5.1)(@lezer/common@1.0.1)
'@codemirror/commands': 6.1.2
'@codemirror/language': 6.3.1
'@codemirror/autocomplete': 6.3.0(@codemirror/language@6.11.3)(@codemirror/state@6.5.2)(@codemirror/view@6.38.8)(@lezer/common@1.3.0)
'@codemirror/commands': 6.10.0
'@codemirror/language': 6.11.3
'@codemirror/lint': 6.0.0
'@codemirror/search': 6.2.1
'@codemirror/state': 6.1.4
'@codemirror/view': 6.5.1
'@codemirror/state': 6.5.2
'@codemirror/view': 6.38.8
transitivePeerDependencies:
- '@lezer/common'
@@ -10838,7 +10867,7 @@ snapshots:
create-require@1.1.1:
optional: true
crelt@1.0.5: {}
crelt@1.0.6: {}
cropperjs@1.5.13: {}
@@ -10848,7 +10877,7 @@ snapshots:
dependencies:
nice-try: 1.0.5
path-key: 2.0.1
semver: 5.7.1
semver: 5.7.2
shebang-command: 1.2.0
which: 1.3.1
@@ -12546,7 +12575,7 @@ snapshots:
make-dir@2.1.0:
dependencies:
pify: 4.0.1
semver: 5.7.1
semver: 5.7.2
optional: true
make-dir@3.1.0:
@@ -12730,7 +12759,7 @@ snapshots:
dependencies:
hosted-git-info: 2.8.9
resolve: 1.22.8
semver: 5.7.1
semver: 5.7.2
validate-npm-package-license: 3.0.4
normalize-path@3.0.0: {}
@@ -13209,7 +13238,7 @@ snapshots:
prosemirror-menu@1.2.4:
dependencies:
crelt: 1.0.5
crelt: 1.0.6
prosemirror-commands: 1.6.2
prosemirror-history: 1.4.1
prosemirror-state: 1.4.3
@@ -13840,7 +13869,7 @@ snapshots:
dependencies:
semver: 7.7.3
semver@5.7.1: {}
semver@5.7.2: {}
semver@6.3.1: {}
@@ -14141,7 +14170,7 @@ snapshots:
dependencies:
'@tokenizer/token': 0.3.0
style-mod@4.0.0: {}
style-mod@4.1.3: {}
sucrase@3.35.0:
dependencies:
@@ -14334,7 +14363,7 @@ snapshots:
ts-node@10.9.2(@types/node@22.18.12)(typescript@5.9.3):
dependencies:
'@cspotcode/source-map-support': 0.8.1
'@tsconfig/node10': 1.0.11
'@tsconfig/node10': 1.0.12
'@tsconfig/node12': 1.0.11
'@tsconfig/node14': 1.0.3
'@tsconfig/node16': 1.0.4

102
ui/src/components/codemirror/Codemirror.vue
View File

@@ -1,4 +1,5 @@
<script lang="ts" setup>
import type { LanguageSupport } from "@codemirror/language";
import { Compartment, EditorState } from "@codemirror/state";
import { EditorView } from "@codemirror/view";
import { basicSetup } from "codemirror";
@@ -22,6 +23,7 @@ const cmState = shallowRef<EditorState>();
const cmView = shallowRef<EditorView>();
const themeCompartment = new Compartment();
const languageCompartment = new Compartment();
const createCustomTheme = (height: string) => {
return EditorView.theme({
@@ -33,16 +35,11 @@ const createCustomTheme = (height: string) => {
};
const createCmEditor = () => {
const language =
typeof props.language === "string"
? presetLanguages[props.language]
: props.language;
let extensions = [
basicSetup,
EditorView.lineWrapping,
themeCompartment.of(createCustomTheme(props.height)),
language,
languageCompartment.of([]),
EditorView.updateListener.of((viewUpdate) => {
if (viewUpdate.docChanged) {
const doc = viewUpdate.state.doc.toString();
@@ -65,44 +62,77 @@ const createCmEditor = () => {
state: cmState.value,
parent: wrapper.value,
});
loadLanguage();
};
async function loadLanguage() {
let language: LanguageSupport;
if (!props.language) {
return;
}
if (typeof props.language === "string") {
const loader = presetLanguages[props.language];
if (!loader) {
throw new Error(`Language ${props.language} not found`);
}
language = await loader();
} else {
language = props.language;
}
cmView.value?.dispatch({
effects: languageCompartment.reconfigure(language),
});
}
onMounted(() => {
createCmEditor();
// Update the codemirror editor doc when the model value changes.
watch(
() => props.modelValue,
(newValue) => {
if (newValue !== cmView.value?.state.doc.toString()) {
cmView.value?.dispatch({
changes: {
from: 0,
to: cmView.value?.state.doc.length,
insert: newValue,
},
});
}
}
);
watch(
() => props.height,
(newHeight) => {
if (cmView.value) {
cmView.value.dispatch({
effects: themeCompartment.reconfigure(createCustomTheme(newHeight)),
});
}
}
);
});
// Update the codemirror editor doc when the model value changes.
watch(
() => props.modelValue,
(newValue) => {
if (!cmView.value) {
return;
}
if (newValue !== cmView.value.state.doc.toString()) {
cmView.value.dispatch({
changes: {
from: 0,
to: cmView.value.state.doc.length,
insert: newValue,
},
});
}
}
);
watch(
() => props.height,
(newHeight) => {
if (cmView.value) {
cmView.value.dispatch({
effects: themeCompartment.reconfigure(createCustomTheme(newHeight)),
});
}
}
);
watch(
() => props.language,
() => {
loadLanguage();
}
);
// Destroy codemirror editor when component unmounts
onBeforeUnmount(() => {
if (cmView.value) {
cmView.value.destroy();
}
cmView.value?.destroy();
});
</script>
<template>

42
ui/src/components/codemirror/supports.ts
View File

@@ -1,25 +1,35 @@
import { css } from "@codemirror/lang-css";
import { html } from "@codemirror/lang-html";
import { javascript } from "@codemirror/lang-javascript";
import { json } from "@codemirror/lang-json";
import { LanguageSupport, StreamLanguage } from "@codemirror/language";
import { yaml } from "@codemirror/legacy-modes/mode/yaml";
import type { LanguageSupport } from "@codemirror/language";
import type { EditorStateConfig } from "@codemirror/state";
export const presetLanguages = {
yaml: StreamLanguage.define(yaml),
html: html(),
javascript: javascript({
jsx: true,
typescript: true,
}),
css: css(),
json: json(),
};
yaml: async (): Promise<LanguageSupport> => {
const { yaml } = await import("@codemirror/lang-yaml");
return yaml();
},
html: async (): Promise<LanguageSupport> => {
const { html } = await import("@codemirror/lang-html");
return html();
},
javascript: async (): Promise<LanguageSupport> => {
const { javascript } = await import("@codemirror/lang-javascript");
return javascript({
jsx: true,
typescript: true,
});
},
css: async (): Promise<LanguageSupport> => {
const { css } = await import("@codemirror/lang-css");
return css();
},
json: async (): Promise<LanguageSupport> => {
const { json } = await import("@codemirror/lang-json");
return json();
},
} satisfies Record<string, () => Promise<LanguageSupport>>;
export interface CodemirrorProps {
modelValue?: string;
height?: string;
language: keyof typeof presetLanguages | LanguageSupport;
language: keyof typeof presetLanguages;
extensions?: EditorStateConfig["extensions"];
}