diff --git a/examples/vite-app/src/examples/CustomMiniMapNode/index.tsx b/examples/vite-app/src/examples/CustomMiniMapNode/index.tsx
index fcb5b5b0..6a8e5807 100644
--- a/examples/vite-app/src/examples/CustomMiniMapNode/index.tsx
+++ b/examples/vite-app/src/examples/CustomMiniMapNode/index.tsx
@@ -8,6 +8,7 @@ import ReactFlow, {
   Controls,
   Edge,
   MiniMap,
+  MiniMapNodeProps,
   Node,
   ReactFlowInstance,
   useEdgesState,
@@ -25,6 +26,10 @@ const buttonStyle: CSSProperties = {
   zIndex: 4,
 };
 
+const CustomMiniMapNode = ({ x, y, width, height, color }: MiniMapNodeProps) => (
+  <circle cx={x} cy={y} r={Math.max(width, height) / 2} fill={color} />
+);
+
 const CustomMiniMapNodeFlow = () => {
   const [nodes, setNodes, onNodesChange] = useNodesState([]);
   const [edges, setEdges, onEdgesChange] = useEdgesState([]);
@@ -66,8 +71,4 @@ const CustomMiniMapNodeFlow = () => {
   );
 };
 
-const CustomMiniMapNode = ({ x, y, width, height }) => (
-  <circle cx={x} cy={y} r={Math.max(width, height)} />
-)
-
 export default CustomMiniMapNodeFlow;