diff --git a/src/additional-components/MiniMap/MiniMapNode.tsx b/src/additional-components/MiniMap/MiniMapNode.tsx index f6b5b4ab..93d3aa2e 100644 --- a/src/additional-components/MiniMap/MiniMapNode.tsx +++ b/src/additional-components/MiniMap/MiniMapNode.tsx @@ -6,17 +6,18 @@ interface MiniMapNodeProps { width: number; height: number; color: string; + className: string; borderRadius: number; style?: CSSProperties; } -const MiniMapNode = ({ x, y, width, height, style, color, borderRadius }: MiniMapNodeProps) => { +const MiniMapNode = ({ x, y, width, height, style, color, className, borderRadius }: MiniMapNodeProps) => { const { background, backgroundColor } = style || {}; const fill = (color || background || backgroundColor) as string; return ( string; interface MiniMapProps extends React.HTMLAttributes { nodeColor?: string | StringFunc; + nodeClassName?: string | StringFunc; nodeBorderRadius?: number; maskColor?: string; } @@ -23,6 +24,7 @@ const MiniMap = ({ style = { backgroundColor: '#f8f8f8' }, className, nodeColor = '#ddd', + nodeClassName = '', nodeBorderRadius = 5, maskColor = 'rgba(10, 10, 10, .25)', }: MiniMapProps) => { @@ -35,6 +37,7 @@ const MiniMap = ({ const elementWidth = (style.width || defaultWidth)! as number; const elementHeight = (style.height || defaultHeight)! as number; const nodeColorFunc = (nodeColor instanceof Function ? nodeColor : () => nodeColor) as StringFunc; + const nodeClassNameFunc = (nodeClassName instanceof Function ? nodeClassName : () => nodeClassName) as StringFunc; const hasNodes = nodes && nodes.length; const bb = getRectOfNodes(nodes); const viewBB: Rect = { @@ -73,6 +76,7 @@ const MiniMap = ({ width={node.__rf.width} height={node.__rf.height} style={node.style} + className={nodeClassNameFunc(node)} color={nodeColorFunc(node)} borderRadius={nodeBorderRadius} />