- Fix issue with
first
property onSwipeEventData
always beingtrue
.first
is now onlytrue
for the first event, thenfalse
for subsequent events- issue #221 and PR #223
- Thank you @feketegy!
New Features:
- include passive event listener option, by default, to internal uses of
addEventListener
- solves issue with chrome and lighthouse - #167
- set
passive
tofalse
only whenpreventDefaultTouchmoveEvent
istrue
. - more details in readme#passive-listener-issue
- add new
onTap
event handler prop which executes its callback after a tap- Thank you @upatel32!
- add new
vxvy
event data property[ deltaX/time, deltaY/time]
- velocity per axis- Thank you @upatel32!
Breaking Changes:
- remove
<Swipeable>
component- see below for an example of how to make your own
- Swipeable component examples
- event data update correctly calculate
deltaX
anddeltaY
- drop support for ie11
- using
addEventListener
options object needs to be polyfilled, browser support
- using
- requires react >= 16.8.3, additionally supports new react v17
Bug fixes:
Infrastructure:
- typescript Converted entire code base, tests, and examples to typescript
- changed type
EventData
->SwipeEventData
- The event data provided for all swipe event callbacks - removed type
SwipeableOptions
- useSwipeableProps
now - removed types associated with
<Swipeable>
component - new type
TapCallback
- callback for the newonTap
prop handler - new type
SwipeDirections
-"Left" | "Right" | "Up" | "Down"
- changed type
- Converted tests to
@testing-library/react
, react testing library - Build bundles with
microbundle
. microbundle- export new "modern" build - via package.json
esmodule
property
- export new "modern" build - via package.json
Maintenance:
- Upgraded all dev dependencies,
jest
,babel
,webpack
,eslint
,prettier
- Add
first
property toeventData
that istrue
for first swipe event issue #160 and PR #162- Thank you @samanpwbb!
- Add
initial
property toeventData
that supplies the inital[x, y]
swipe value coordinates issue #150 and PR #131
- Optimization for
useSwipeable
hook. AddeduseMemo
for handler internals issue #134 and PR #149- Thank you @FaberVitale!
- Add check for
event.cancelable
fortouchmove
events before callingevent.preventDefault()
, issue #128 and PR #145- Thank you @maurispalletti!
- Fix typescript types for
ref
, issue #140 and PR #142- Thank you @mastermatt!
- Fix bug where callbacks/props were not refreshed for
useSwipeable
and<Swipeable>
, issue #136 and PR #138- Thank you @caesarsol and @bas-l!
- Add typescript types for
useSwipeable
and<Swipeable>
, issue #125- Thank you @adambowles!
- Fix for
preventDefaultTouchmoveEvent
in safari issue #127 and PR #131- Thank you @JiiB and @bhj!
- use
ref
callback for both<Swipeable>
anduseSwipeable
to attach all touch event handlersuseSwipeable
's returnedhandlers
now contains a ref callback- Please see disscusion and comments in both #127 and #131 for more details and info.
- fix avoids the
passive: true
issue from chrome document event listeners - fix avoids bug on safari where the
touchmove
event listener needs to be attached before atouchstart
in order to be able to calle.preventDefault
- fix avoids the
- removed
touchHandlerOption
prop- fix above deprecates this prop
- Introduce react hook,
useSwipeable
- Core rewrite to simplify api and trim down bundled size
- Add
size-limit
to help keep bundled size down - Add
es
export via"module": "es/index.js"
topackage.json
- Add
prettier
code formating - [BREAKING] simplify handler event data to allow destructuring
onSwiped = ({ event, direction, absX, absY, velocity}) => console.log('swiped')
- [BREAKING] deprecated
onSwiping{Left|Right|Up|Down}
handler props- can be replaced with direction/
dir
event data onSwiping = ({ dir }) => console.log(`swiping - ${dir}`)
- can be replaced with direction/
- [BREAKING] deprecated props
flickThreshold
stopPropagation
disabled
- [BREAKING] deprecated passing "rest" of props down
- removed additional props besides the ones used by
<Swipeable>
from being passed down- only
className
andstyle
get passed to<Swipeable>
's dom node, defaultdiv
- only
- removed additional props besides the ones used by
- Add
rotationAngle
prop. #103- will allow to set a rotation angle, e.g. for a four-player game on a tablet, where each player has a 90° turned view.
- Thank you @Narquadah and @LarsKumbier!
- fixed bug that happened when if either
onSwiping
oronSwiped
were set we were not callinge.preventDefault()
appropriately
- Add support for calling
preventDefault
on Chrome 56+ via passive event support checking and manual event listener setup. #88- Thank you @kl0tl and @KrashStudio!
- add
disabled
prop. #83 - add
innerRef
prop that allows user to access to<Swipeable>
's inner dom node react ref. #82
- fixed bug where delta was causing a swipe to not be tracked correctly, #74 , thanks @mctep
- Major Change
preventDefaultTouchmoveEvent
defaults tofalse
now #69- This change is in part due to a Chrome56+ change
- Major Change drop support for React 12 & 13,
peerDependencies
updated #64prop-types
added todependencies
#64
- Major Change
trackMouse
now 'tracks' the swipe outside of the swipeable component, #67.- Thanks for example @TanaseHagi
- react 16 added to
peerDependencies
- add
onTap
functionality. Thanks @anicke . #61 #39 - added persisting synthetic event in example via
e.persist()
. This should help people see more details in the console when debugging in the [example](http://stack.formidable.com/react-swipeable/.
- Allow
onMouseDown
,onMouseUp
, andonMouseMove
props to fire appropriately again. #55, thanks @lochstar - Stop using this.state to track swipes, thanks @grantila for pointing out this change and submitting PR, #58. Should provide minor performance gains since
Swipeable
will no longer be callingthis.setState
internally.
- add ability to track mouse events as touch events. Thanks @jakepusateri and @Marcel-G. #51
- add stopPropagation prop for all swipe events, defaults to
false
. See #46 for more info.
- fix React 15.2.0 warning for unknown properties on DOM elements
- Add configurable container element via
nodeName
prop, defaults to'div'
. See #24 and #40 for more info.
- Add preventDefault while swiping when props
onSwipedLeft
,onSwipedRight
,onSwipedUp
, andonSwipedDown
are present. See #21 and #37 for more info.
- Adds
velocity
data toonSwiping
callback - Updated the build process introducing ES2015 and babel
- Adds
preventDefaultTouchMoveEvent
option, defaults to true
- Adds
isFLick
to onSwipe events - Removes React as a peer dep
- Adds onSwiping events
- Fixes onSwipeDown and onSwipeUp events
- Fixes vertical swiping
- Refactors build into jsx.
- Adds onSwipedUp, onSwipedRight, onSwipedDown, onSwipedLeft callbacks.
-
onFlick
prop has been removed. -
onSwipe
now has a 4th argument for the callbackBoolean isFlick
-
Added a prop
flickThreshold
which allows you to customize at what velocity a flick is detected.