Skip to content

Conversation

okcoker
Copy link

@okcoker okcoker commented Jul 15, 2025

Description

This may be something that would inherently be able to fix #275, but in my application, I use this for a carousel component. We noticed when swiping on the carousel, the page would scroll which was a bit undesirable. I eventually added preventScrollOnSwipe, but this made scrolling the page very hard because our carousels may take up a decent amount of the screen real estate.

We would like to prevent scrolling only when a swipe on the x-axis is in progress. I considered making preventScrollOnSwipe have a type of boolean | 'vertical' | 'horizontal' but ultimately landed on this change which should allow for any custom functionality one might want before calling event.preventDefault().

Type of Change

  • Bug fix (non-breaking change which fixes an issue)
  • New feature (non-breaking change which adds functionality)
  • Breaking change (fix or feature that would cause existing functionality to not work as expected)
  • This change requires a documentation update

How Has This Been Tested?

Tested by linking this node module in my project, and using the function. Also wrote unit tests.

Checklist: (Feel free to delete this section upon completion)

  • I have included a changeset if this change will require a version change to one of the packages.
  • I have performed a self-review of my own code
  • I have commented my code, particularly in hard-to-understand areas
  • I have made corresponding changes to the documentation
  • I have run all builds, tests, and linting and all checks pass
  • I have added tests that prove my fix is effective or that my feature works
  • My changes generate no new warnings
  • Any dependent changes have been merged and published in downstream modules

Copy link

changeset-bot bot commented Jul 15, 2025

🦋 Changeset detected

Latest commit: 36fb9c5

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
react-swipeable Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

Copy link

vercel bot commented Jul 15, 2025

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

Name Status Preview Comments Updated (UTC)
react-swipeable ✅ Ready (Inspect) Visit Preview 💬 Add feedback Jul 15, 2025 0:32am

@okcoker okcoker changed the title make preventScrollOnSwipe option more configurable Make preventScrollOnSwipe option more configurable with a function Jul 15, 2025
@hartzis
Copy link
Collaborator

hartzis commented Jul 15, 2025

initial glance and thoughts are this is awesome!

i'm now having vague memories of also thinking about this a long time ago 🤔 and seen in similar libraries. Going to look through old issues and notes 👀

the backwards compatibility is ⭐️

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants