onYReachEnd event keeps firing when scrolling reaches the end of the y-axis

[XinwenCheng]

Make sure these boxes are checked before submitting your issue -- thank you!

• [x] Check FAQ and Caveats
• [x] Search if there's already one reported in Issues
• [ ] Prepare a JSFiddle reproducing the issue
  • perfect-scrollbar JSFiddle
• [x] Provide a page or source code where the issue can be checked

<Box sx={{ p: 0, position: 'relative', overflowX: 'hidden', height: 'calc(100% - 7rem)' }}>
  <PerfectScrollbar
      options={{ wheelPropagation: true, suppressScrollX: true }}
      onYReachEnd={()=>{console.log('onYReachEnd time:', new Date().getTime());}}
    >
      {renderItemList()}
    </PerfectScrollbar>
</Box>

Once the Y axis reaches the end, onYReachEnd keeps firing. How can I make it just fire once each time the Y axis reaches the end? Thanks in advance!