mirror of
https://github.com/CherryHQ/cherry-studio.git
synced 2025-12-28 21:42:27 +08:00
refactor(Mermaid): render mermaid in shadow dom
This commit is contained in:
parent
bf30bf28a9
commit
1fcc18a8e6
@ -6,6 +6,7 @@ import styled from 'styled-components'
|
||||
import { useDebouncedRender } from './hooks/useDebouncedRender'
|
||||
import ImagePreviewLayout from './ImagePreviewLayout'
|
||||
import { BasicPreviewHandles, BasicPreviewProps } from './types'
|
||||
import { renderSvgInShadowHost } from './utils'
|
||||
|
||||
/** 预览 Mermaid 图表
|
||||
* 使用 usePreviewRenderer hook 重构,同时保留必要的可见性检测逻辑
|
||||
@ -30,7 +31,10 @@ const MermaidPreview = ({
|
||||
|
||||
// 避免不可见时产生 undefined 和 NaN
|
||||
const fixedSvg = svg.replace(/translate\(undefined,\s*NaN\)/g, 'translate(0, 0)')
|
||||
container.innerHTML = fixedSvg
|
||||
|
||||
// 使用 shadow dom,如果有问题,可以回退到 innerHTML
|
||||
renderSvgInShadowHost(fixedSvg, container)
|
||||
// container.innerHTML = fixedSvg
|
||||
},
|
||||
[diagramId, mermaid]
|
||||
)
|
||||
|
||||
Loading…
Reference in New Issue
Block a user