[Bug]: Click events prevented after scrolling using embla-carousel-wheel-gestures plugin

[kmck]

Which variants of Embla Carousel are you using?

• [x] embla-carousel (Core)
• [ ] embla-carousel-react
• [ ] embla-carousel-vue
• [ ] embla-carousel-svelte
• [ ] embla-carousel-autoplay
• [ ] embla-carousel-auto-scroll
• [ ] embla-carousel-solid
• [ ] embla-carousel-auto-height
• [ ] embla-carousel-class-names
• [ ] embla-carousel-fade
• [ ] embla-carousel-docs (Documentation)
• [ ] embla-carousel-docs (Generator)

Steps to reproduce

• Configure Embla carousel with
  • dragFree: true
  • embla-carousel-wheel-gestures plugin
  • watchDrag: (emblaApi, e) => (emblaApi.containerNode() === e.target): basically trying to disable click+drag but allow wheel gesture plugin's simulated mousemove events
• Configure carousel items to have buttons with onClick handlers inside
• Use scroll gestures/mouse wheel to scroll the carousel
• Try to click on a button inside a carousel item
• Observe that click handler doesn't fire until the second click

Expected Behavior

• Buttons should be clickable the first time

Additional Context

I investigated thinking this might be a plugin problem, but when looking at the source of embla-carousel, it seems like preventClick = true is set in the mousemove handler. I don't think there is a corresponding way for a plugin to unset it, which might make sense to do in mouseup.

My next thought is maybe to dispatch a simulated click event knowing that the first one will be ignored, but that feels pretty dirty. Maybe translating wheel events into mouse movement events in a plugin isn't the ideal approach for the plugin in the first place and it should be setting the position more directly?

What browsers are you seeing the problem on?

All browsers

Version

8.3.1

CodeSandbox

No response

Before submitting

• [x] I've made research efforts and searched the documentation
• [x] I've searched for existing issues
• [x] I agree to follow this project's Contributing Guidelines for bug reports