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

{
  "context": "This evaluation assesses how effectively the engineer uses Vant's TreeSelect component to implement a hierarchical category selection interface. The criteria focus on proper usage of TreeSelect props, data structure adherence, and correct implementation of selection constraints.",
  "type": "weighted_checklist",
  "checklist": [
    {
      "name": "TreeSelect Component Usage",
      "description": "Uses the `van-tree-select` (or TreeSelect) component from Vant to implement the hierarchical selection interface.",
      "max_score": 20
    },
    {
      "name": "Items Prop Structure",
      "description": "Correctly structures the hierarchical data using the `items` prop with the expected format: each item has `text`, `children` array, and child items have `id`, `disabled`, `badge`, and `dot` properties as needed.",
      "max_score": 20
    },
    {
      "name": "Main Category Tracking",
      "description": "Implements the `main-active-index` (or `mainActiveIndex`) prop and properly binds it with `v-model:main-active-index` to track which main category is currently selected.",
      "max_score": 15
    },
    {
      "name": "Product Selection Tracking",
      "description": "Implements the `active-id` (or `activeId`) prop and properly binds it with `v-model:active-id` to track selected product IDs, supporting multiple selections.",
      "max_score": 15
    },
    {
      "name": "Height Configuration",
      "description": "Sets the `height` prop to 300 (or '300px') to match the required fixed height specification.",
      "max_score": 10
    },
    {
      "name": "Max Selection Limit",
      "description": "Uses the `max` prop set to 3 to enforce the maximum selection limit of 3 products.",
      "max_score": 10
    },
    {
      "name": "Disabled Items Support",
      "description": "Properly uses the `disabled` property in the data structure to mark unavailable products that cannot be selected.",
      "max_score": 5
    },
    {
      "name": "Badge Display",
      "description": "Correctly implements the `badge` and/or `dot` properties in the data structure to display notification indicators on products.",
      "max_score": 5
    }
  ]
}

Version

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