Add theme-aware edge highlighting colors for graph control

This commit is contained in:
yangdx 2025-10-05 10:40:25 +08:00
parent dad90d25be
commit 0aef6a16b8
2 changed files with 8 additions and 3 deletions

View file

@ -302,6 +302,10 @@ const GraphControl = ({ disableHoverEffect }: { disableHoverEffect?: boolean })
if (!disableHoverEffect) {
const _focusedNode = focusedNode || selectedNode
// Choose edge highlight color based on theme
const edgeHighlightColor = isDarkTheme
? Constants.edgeColorHighlightedDarkTheme
: Constants.edgeColorHighlightedLightTheme
if (_focusedNode && graph.hasNode(_focusedNode)) {
try {
@ -311,7 +315,7 @@ const GraphControl = ({ disableHoverEffect }: { disableHoverEffect?: boolean })
}
} else {
if (graph.extremities(edge).includes(_focusedNode)) {
newData.color = Constants.edgeColorHighlighted
newData.color = edgeHighlightColor
}
}
} catch (error) {
@ -326,7 +330,7 @@ const GraphControl = ({ disableHoverEffect }: { disableHoverEffect?: boolean })
if (edge === _selectedEdge) {
newData.color = Constants.edgeColorSelected
} else if (edge === _focusedEdge) {
newData.color = Constants.edgeColorHighlighted
newData.color = edgeHighlightColor
} else if (hideUnselectedEdges) {
newData.hidden = true
}

View file

@ -15,7 +15,8 @@ export const nodeBorderColorSelected = '#F57F17'
export const edgeColorDarkTheme = '#888888'
export const edgeColorSelected = '#F57F17'
export const edgeColorHighlighted = '#FFFFFF'
export const edgeColorHighlightedDarkTheme = '#F57F17'
export const edgeColorHighlightedLightTheme = '#F57F17'
export const searchResultLimit = 50
export const labelListLimit = 100