frontend: FE-033 明暗主题三态切换并跟随系统,防闪白+全局过渡+Monaco同步

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
fenghp
2026-06-11 17:38:55 +08:00
co-authored by Cursor
parent 9f9899b1d1
commit 67ecb24ffc
7 changed files with 144 additions and 8 deletions
@@ -126,6 +126,7 @@ export function DiffDialog({
let diffEditor: MonacoEditor.IStandaloneDiffEditor | null = null
let originalModel: MonacoEditor.ITextModel | null = null
let modifiedModel: MonacoEditor.ITextModel | null = null
let themeObserver: MutationObserver | null = null
void (async () => {
const { monaco, detectLanguage } = await import("~/lib/monaco")
if (disposed || !containerRef.current) {
@@ -167,10 +168,16 @@ export function DiffDialog({
setBlockCount(diffEditor?.getLineChanges()?.length ?? 0)
})
editorRef.current = diffEditor
// 弹窗打开期间应用切换明暗主题时,同步更新 Monaco 主题。
themeObserver = new MutationObserver(() => {
monaco.editor.setTheme(isDarkTheme() ? "mactfs-dark" : "mactfs-light")
})
themeObserver.observe(document.documentElement, { attributes: true, attributeFilter: ["class"] })
})()
return () => {
disposed = true
editorRef.current = null
themeObserver?.disconnect()
diffEditor?.dispose()
originalModel?.dispose()
modifiedModel?.dispose()