If pass a composite component to Waypoint, why need to wrap it with React.forwardRef?

Question

https://www.npmjs.com/package/react-waypoint#children

I am reading this post, why passing a composite component to Waypoint needs to wrap it with React.forwardRef? Can I just wrap the composite component with div then I don't have to wrap it with React.forwardRef?

I have tried to wrap the composite component with div, but it does not work as expected, onEnter or onLeave callbacks never be called. But if I follow the tutorial to wrap composite component with React.forwardRef, it will work as expected.

class Block extends React.Component {
  render() {
    return <div ref={this.props.innerRef}>Hello</div>
  }
}

const App = () => (
  <Waypoint>
    <div>
       <Block />
    </div>
  </Waypoint>
)

above code does not work, but I don't know why