diff --git a/docs/examples/custom-node/OutputNode.vue b/docs/examples/custom-node/OutputNode.vue
index 39ab8275..5b951c01 100644
--- a/docs/examples/custom-node/OutputNode.vue
+++ b/docs/examples/custom-node/OutputNode.vue
@@ -5,10 +5,10 @@ const connections = useHandleConnections({
   type: 'target',
 })
 
-const data = useNodesData(() => connections.value[0]?.source)
+const nodesData = useNodesData(() => connections.value[0]?.source)
 </script>
 
 <template>
-  <Handle type="target" :position="Position.Left" :style="{ backgroundColor: data?.color, filter: 'invert(100%)' }" />
-  {{ data?.isGradient ? 'GRADIENT' : data?.color }}
+  <Handle type="target" :position="Position.Left" :style="{ backgroundColor: nodesData.data?.color, filter: 'invert(100%)' }" />
+  {{ nodesData.data?.isGradient ? 'GRADIENT' : nodesData.data?.color }}
 </template>