mirror of
https://github.com/MHSanaei/3x-ui.git
synced 2026-06-04 03:19:34 +00:00
feat(json): swap raw textareas for a CodeMirror 6 JsonEditor
A new JsonEditor.vue component wraps CodeMirror 6 + lang-json with line numbers, JSON syntax highlighting, bracket matching, code folding, search (Ctrl+F), undo/redo, lint (red squiggle and gutter icon on invalid JSON), tab indent, and line wrapping. It is wired into the four raw-JSON spots that previously used <a-textarea class="json-editor">: the Xray Advanced Template tab, the Outbound JSON tab, the Balancer Observatory pane, and the Inbound Advanced tab (settings / streamSettings / sniffing). Chrome colors are driven by EditorView.theme so they win the specificity fight cleanly against CodeMirror's own injected styles. A single buildDarkTheme() factory yields a Dark+ palette (#1e1e1e background, #252526 active line, #2d2d30 panels) for the regular dark mode and a near-black variant (#0a0a0a / #141414 / #1f1f1f border) for ultra-dark — both pair with oneDarkHighlightStyle for the syntax colors. Light mode stays on basicSetup's default. CodeMirror lazy-loads as a ~17 kB gzipped chunk that only appears on the Xray/Inbounds bundles.
This commit is contained in:
@@ -16,8 +16,11 @@
|
||||
},
|
||||
"dependencies": {
|
||||
"@ant-design/icons-vue": "^7.0.1",
|
||||
"@codemirror/lang-json": "^6.0.2",
|
||||
"@codemirror/theme-one-dark": "^6.1.3",
|
||||
"ant-design-vue": "^4.2.6",
|
||||
"axios": "^1.7.9",
|
||||
"codemirror": "^6.0.2",
|
||||
"dayjs": "^1.11.20",
|
||||
"otpauth": "^9.5.1",
|
||||
"qs": "^6.13.1",
|
||||
|
||||
Reference in New Issue
Block a user