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-4/

{
  "context": "This criteria evaluates how well the engineer uses react-swipeable's direction-specific delta threshold configuration to implement asymmetric swipe sensitivity. The focus is on proper usage of the delta parameter as an object with directional keys.",
  "type": "weighted_checklist",
  "checklist": [
    {
      "name": "useSwipeable hook usage",
      "description": "Uses the useSwipeable hook from react-swipeable to enable swipe detection",
      "max_score": 15
    },
    {
      "name": "Delta object configuration",
      "description": "Configures the delta parameter as an object with direction-specific keys (left, right, up, down) rather than a single number",
      "max_score": 30
    },
    {
      "name": "Correct threshold values",
      "description": "Sets correct threshold values: left=15, right=15, up=50, down=50 (or values that match the specified requirements)",
      "max_score": 25
    },
    {
      "name": "Direction callbacks",
      "description": "Implements appropriate swipe direction callbacks (e.g., onSwipedLeft, onSwipedRight, onSwipedUp, onSwipedDown or onSwiped) to detect and respond to swipe gestures",
      "max_score": 20
    },
    {
      "name": "Handler attachment",
      "description": "Properly attaches the handlers returned from useSwipeable to a DOM element using spread operator or ref",
      "max_score": 10
    }
  ]
}

Install with Tessl CLI

npx tessl i tessl/npm-react-swipeable

tile.json