{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "tooltip",
  "title": "Tooltip",
  "description": "A short ink label on hover or focus.",
  "dependencies": [
    "@base-ui/react"
  ],
  "registryDependencies": [
    "https://spotcheckui.com/r/spotcheck-base.json"
  ],
  "files": [
    {
      "path": "registry/spotcheck/components/spotcheck/tooltip.tsx",
      "content": "\"use client\"\n\nimport * as React from \"react\"\nimport { Tooltip as BaseTooltip } from \"@base-ui/react/tooltip\"\n\nimport { cn } from \"@/lib/utils\"\n\ntype TooltipProps = {\n  /** The tooltip text. */\n  content: React.ReactNode\n  /** One focusable element, such as a button. */\n  children: React.ReactElement<Record<string, unknown>>\n  side?: \"top\" | \"right\" | \"bottom\" | \"left\"\n  className?: string\n}\n\nexport function Tooltip({ content, children, side = \"top\", className }: TooltipProps) {\n  return (\n    <BaseTooltip.Root>\n      <BaseTooltip.Trigger render={children} />\n      <BaseTooltip.Portal>\n        <BaseTooltip.Positioner side={side} sideOffset={6} className=\"z-50\">\n          <BaseTooltip.Popup\n            className={cn(\"bg-ink text-paper px-2 py-1 font-(family-name:--f-mono) text-[11.5px]\", className)}\n          >\n            {content}\n          </BaseTooltip.Popup>\n        </BaseTooltip.Positioner>\n      </BaseTooltip.Portal>\n    </BaseTooltip.Root>\n  )\n}\n",
      "type": "registry:component"
    }
  ],
  "categories": [
    "core"
  ],
  "type": "registry:component"
}