fix carousel item children with click handlers

[evayde]

Don't trigger the click event while dragging.

Fixes #2196

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Updated (UTC)
shoelace	✅ Ready (Inspect)	Visit Preview	Nov 5, 2024 10:30am

[claviska]

Thanks for the PR. Unfortunately, this doesn't seem to prevent the click when dragging an anchor element, e.g.:

<sl-carousel-item>
  <a href="about:blank" target="_blank">
    <img
      alt="The sun shines on the mountains and trees (by Adam Kool on Unsplash)"
      src="/assets/examples/carousel/mountains.jpg"
    />
  </a>
</sl-carousel-item>

[evayde]

My fail, I forgot to add preventDefault for the anchors. I'd love to write a test for this aswell, unfortunately, our drag-function does not trigger the click event (or the anchor). :(

[claviska]

Thanks again for the PR. The solution was almost there, but sometimes clicking on the anchor wouldn't open it because we're only checking for this.dragging, so it felt unreliable. (Every 2-3 clicks it wouldn't drag or open the link for me.)

I added a check for the start x/y position to compare it to the mouse position when the click occurs in #2259 and it feels pretty solid.