CtrlK
CommunityDocumentationLog inGet started
Tessl Logo

tessl/npm-vant

tessl install tessl/npm-vant@4.9.0

Mobile UI Components library built on Vue 3 with 100+ components

Agent Success

Agent success rate when using this tile

74%

Improvement

Agent success rate improvement when using this tile compared to baseline

1.07x

Baseline

Agent success rate without this tile

69%

rubric.jsonevals/scenario-5/

{
  "context": "This criteria evaluates how effectively the engineer uses the Vant Slider component to implement a dual-handle price range filter. The focus is on proper usage of the Slider API including range mode, value binding, step configuration, and mark display.",
  "type": "weighted_checklist",
  "checklist": [
    {
      "name": "Slider component import",
      "description": "Correctly imports the Slider component from Vant (van-slider or Slider from 'vant')",
      "max_score": 10
    },
    {
      "name": "Range mode enabled",
      "description": "Uses the Slider component in range mode (dual-handle) by binding v-model to an array with two values [min, max] or using the range prop",
      "max_score": 25
    },
    {
      "name": "Min/max configuration",
      "description": "Correctly sets the min and max props on the Slider to define the valid range (0 to 1000)",
      "max_score": 15
    },
    {
      "name": "Step increments",
      "description": "Configures the step prop to 10 to ensure values change in $10 increments",
      "max_score": 15
    },
    {
      "name": "Visual marks",
      "description": "Uses the marks prop or bar-height/button-size props to display visual indicators at specified price points ($0, $250, $500, $750, $1000)",
      "max_score": 20
    },
    {
      "name": "Value reactivity",
      "description": "Properly implements two-way binding with v-model or value/update:model-value to track and respond to slider changes",
      "max_score": 10
    },
    {
      "name": "Event handling",
      "description": "Implements change event emission using @change or @update:model-value to notify parent component of range changes",
      "max_score": 5
    }
  ]
}

Version

Workspace
tessl
Visibility
Public
Created
Last updated
Describes
npmpkg:npm/vant@4.9.x
tile.json