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

{
  "context": "This evaluation assesses how effectively the engineer uses react-swipeable's initial position tracking capability to capture and display swipe starting coordinates. The focus is on correct usage of the useSwipeable hook, accessing the initial property from SwipeEventData, and enabling mouse tracking.",
  "type": "weighted_checklist",
  "checklist": [
    {
      "name": "useSwipeable hook usage",
      "description": "Correctly imports and uses the useSwipeable hook from react-swipeable package",
      "max_score": 15
    },
    {
      "name": "Initial position access",
      "description": "Accesses the initial property from SwipeEventData (e.g., via onSwipeStart or onSwiping callback) to get starting coordinates [x, y]",
      "max_score": 35
    },
    {
      "name": "Mouse tracking enabled",
      "description": "Configures the useSwipeable hook with trackMouse: true to enable mouse-based swipe detection",
      "max_score": 20
    },
    {
      "name": "Swipe start callback",
      "description": "Uses onSwipeStart callback (or equivalent lifecycle callback like onSwiping with first property check) to capture coordinates when swipe begins",
      "max_score": 20
    },
    {
      "name": "Handler attachment",
      "description": "Correctly spreads the handlers object returned by useSwipeable onto a DOM element (e.g., <div {...handlers}>)",
      "max_score": 10
    }
  ]
}

Install with Tessl CLI

npx tessl i tessl/npm-react-swipeable

tile.json