CtrlK
BlogDocsLog inGet started
Tessl Logo

tessl/npm-react-swipeable

React hook for handling swipe gestures on touch devices and mouse interactions with comprehensive directional callbacks and customizable sensitivity settings

90

1.00x

Evaluation90%

1.00x

Agent success when using this tile

Overview
Eval results
Files

rubric.jsonevals/scenario-8/

{
  "context": "This criteria evaluates how effectively the engineer uses react-swipeable's directional callback system to implement a swipe gesture counter. The focus is on proper utilization of the useSwipeable hook with direction-specific callbacks (onSwipedLeft, onSwipedRight, onSwipedUp, onSwipedDown) and the universal onSwiped callback.",
  "type": "weighted_checklist",
  "checklist": [
    {
      "name": "useSwipeable Hook Usage",
      "description": "Uses the useSwipeable hook from react-swipeable to set up swipe detection",
      "max_score": 15
    },
    {
      "name": "onSwipedLeft Callback",
      "description": "Implements onSwipedLeft callback in the useSwipeable configuration to handle left swipe gestures and update the left swipe counter",
      "max_score": 15
    },
    {
      "name": "onSwipedRight Callback",
      "description": "Implements onSwipedRight callback in the useSwipeable configuration to handle right swipe gestures and update the right swipe counter",
      "max_score": 15
    },
    {
      "name": "onSwipedUp Callback",
      "description": "Implements onSwipedUp callback in the useSwipeable configuration to handle up swipe gestures and update the up swipe counter",
      "max_score": 15
    },
    {
      "name": "onSwipedDown Callback",
      "description": "Implements onSwipedDown callback in the useSwipeable configuration to handle down swipe gestures and update the down swipe counter",
      "max_score": 15
    },
    {
      "name": "onSwiped Universal Callback",
      "description": "Implements onSwiped callback in the useSwipeable configuration to handle all swipe gestures and update the total swipe counter",
      "max_score": 15
    },
    {
      "name": "Handler Attachment",
      "description": "Properly attaches the handlers returned by useSwipeable to a DOM element by spreading them onto a React element (e.g., <div {...handlers}>)",
      "max_score": 10
    }
  ]
}

Install with Tessl CLI

npx tessl i tessl/npm-react-swipeable

tile.json