CtrlK
BlogDocsLog inGet started
Tessl Logo

tessl/npm-radix-ui--react-tooltip

A React tooltip component from Radix UI Primitives, part of an open-source UI component library for building high-quality, accessible design systems and web apps

Overall
score

96%

Overview
Eval results
Files

rubric.jsonevals/scenario-4/

{
  "context": "This evaluation assesses how well the engineer uses the @radix-ui/react-tooltip package's provider-level configuration features to create a dashboard with consistent tooltip behavior. The focus is on proper usage of TooltipProvider and its configuration props.",
  "type": "weighted_checklist",
  "checklist": [
    {
      "name": "TooltipProvider usage",
      "description": "Uses TooltipProvider component to wrap the dashboard or all tooltip instances, establishing the configuration context",
      "max_score": 25
    },
    {
      "name": "delayDuration configuration",
      "description": "Sets the delayDuration prop on TooltipProvider to 400 (milliseconds) to control the delay before tooltips appear",
      "max_score": 20
    },
    {
      "name": "skipDelayDuration configuration",
      "description": "Sets the skipDelayDuration prop on TooltipProvider to 200 (milliseconds) to enable instant tooltip display when moving between tooltips",
      "max_score": 20
    },
    {
      "name": "disableHoverableContent configuration",
      "description": "Sets the disableHoverableContent prop on TooltipProvider to true to ensure tooltips close immediately when mouse leaves the trigger",
      "max_score": 15
    },
    {
      "name": "Multiple Tooltip instances",
      "description": "Creates multiple Tooltip components (at least 4) using the Root/Tooltip component, each with Trigger and Content components",
      "max_score": 15
    },
    {
      "name": "Component composition",
      "description": "Properly composes tooltip components using TooltipTrigger and TooltipContent (or their equivalents like Trigger and Content) for each tooltip instance",
      "max_score": 5
    }
  ]
}

Install with Tessl CLI

npx tessl i tessl/npm-radix-ui--react-tooltip

tile.json