or run

npx @tessl/cli init
Log in

Version

Files

docs

arrow.mdindex.mdportal-content.mdprovider.mdtooltip-root.mdtrigger.mdutilities.md
tile.json

rubric.jsonevals/scenario-1/

{
  "context": "This criteria evaluates the engineer's proficiency in using @radix-ui/react-tooltip for implementing hover interactions with pointer event handling, including proper component composition, delay configuration, and hover trigger setup.",
  "type": "weighted_checklist",
  "checklist": [
    {
      "name": "TooltipProvider usage",
      "description": "Uses TooltipProvider component to wrap the profile card and provide shared tooltip configuration",
      "max_score": 15
    },
    {
      "name": "Tooltip component structure",
      "description": "Correctly uses Tooltip component as the container for each tooltip instance to manage individual tooltip state",
      "max_score": 15
    },
    {
      "name": "TooltipTrigger implementation",
      "description": "Uses TooltipTrigger component to wrap each hover-triggerable element (username, status badge, and action buttons)",
      "max_score": 15
    },
    {
      "name": "TooltipContent rendering",
      "description": "Uses TooltipContent component to display the tooltip text with proper content for each tooltip instance",
      "max_score": 15
    },
    {
      "name": "Delay duration configuration",
      "description": "Correctly configures delayDuration prop on Tooltip or TooltipProvider to implement the specified delays (500ms for username, 300ms for status, 200ms for buttons)",
      "max_score": 20
    },
    {
      "name": "Portal usage",
      "description": "Uses TooltipPortal component to render tooltip content outside the DOM hierarchy for proper z-index handling",
      "max_score": 10
    },
    {
      "name": "Hover interaction",
      "description": "Tooltips correctly appear on pointer hover over trigger elements without requiring additional event handlers (relies on built-in onPointerMove behavior)",
      "max_score": 10
    }
  ]
}