React hook for handling swipe gestures on touch devices and mouse interactions with comprehensive directional callbacks and customizable sensitivity settings
90
Evaluation — 90%
↑ 1.00xAgent success when using this tile
{
"context": "This criteria evaluates how effectively the engineer uses the react-swipeable package to implement an image gallery with scroll prevention. The focus is on proper usage of the useSwipeable hook and its configuration options, particularly the preventScrollOnSwipe feature.",
"type": "weighted_checklist",
"checklist": [
{
"name": "useSwipeable hook usage",
"description": "The solution imports and correctly invokes the useSwipeable hook from react-swipeable, passing a configuration object and spreading the returned handlers onto the gallery element.",
"max_score": 20
},
{
"name": "preventScrollOnSwipe enabled",
"description": "The configuration object passed to useSwipeable includes preventScrollOnSwipe set to true, which is essential for preventing browser scroll during swipes.",
"max_score": 25
},
{
"name": "onSwipedLeft callback",
"description": "The configuration includes an onSwipedLeft callback function that advances to the next image when a left swipe is detected.",
"max_score": 15
},
{
"name": "onSwipedRight callback",
"description": "The configuration includes an onSwipedRight callback function that returns to the previous image when a right swipe is detected.",
"max_score": 15
},
{
"name": "trackMouse enabled",
"description": "The configuration includes trackMouse set to true to enable mouse drag events in addition to touch events, making the gallery usable on desktop.",
"max_score": 15
},
{
"name": "Handler spreading",
"description": "The handlers object returned by useSwipeable is correctly spread onto a DOM element (e.g., using {...handlers}) to attach the swipe event listeners.",
"max_score": 10
}
]
}Install with Tessl CLI
npx tessl i tessl/npm-react-swipeabledocs
evals
scenario-1
scenario-2
scenario-3
scenario-4
scenario-5
scenario-6
scenario-7
scenario-8
scenario-9
scenario-10