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

{
  "context": "This evaluation assesses how effectively the engineer uses @radix-ui/react-tooltip package to implement configurable tooltip closing behavior, specifically focusing on the disableHoverableContent feature for both global and per-tooltip configuration.",
  "type": "weighted_checklist",
  "checklist": [
    {
      "name": "TooltipProvider usage",
      "description": "Correctly uses TooltipProvider component to wrap the application or component tree, establishing the context for all tooltips.",
      "max_score": 15
    },
    {
      "name": "Global disableHoverableContent",
      "description": "Correctly uses the disableHoverableContent prop on TooltipProvider to set the global closing behavior for all tooltips within the provider.",
      "max_score": 20
    },
    {
      "name": "Multiple Tooltip instances",
      "description": "Creates multiple Tooltip (or Root) components to manage individual tooltip instances with proper state management.",
      "max_score": 10
    },
    {
      "name": "TooltipTrigger usage",
      "description": "Correctly uses TooltipTrigger (or Trigger) component to create trigger elements that activate tooltips on hover and keyboard focus.",
      "max_score": 10
    },
    {
      "name": "TooltipContent usage",
      "description": "Correctly uses TooltipContent (or Content) component to render tooltip content, optionally with TooltipPortal for proper DOM positioning.",
      "max_score": 10
    },
    {
      "name": "Per-tooltip override",
      "description": "Correctly uses the disableHoverableContent prop on individual Tooltip components to override the global setting for specific tooltips.",
      "max_score": 25
    },
    {
      "name": "Component composition",
      "description": "Properly nests the Radix tooltip components following the compound component pattern: TooltipProvider > Tooltip > TooltipTrigger + TooltipContent.",
      "max_score": 10
    }
  ]
}

Install with Tessl CLI

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

tile.json