{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "tailwind-tooltip",
  "type": "registry:ui",
  "title": "Tooltip",
  "dependencies": [
    "react",
    "react-aria-components",
    "tailwind-variants",
    "tailwindcss-react-aria-components",
    "tw-animate-css"
  ],
  "registryDependencies": [],
  "files": [
    {
      "path": "components/ui/Tooltip.tsx",
      "type": "registry:ui",
      "content": "'use client';\nimport React from 'react';\nimport {\n  Tooltip as AriaTooltip,\n  type TooltipProps as AriaTooltipProps,\n  OverlayArrow\n} from 'react-aria-components/Tooltip';\nimport {composeRenderProps} from 'react-aria-components/composeRenderProps';\nimport {tv} from 'tailwind-variants';\n\nexport interface TooltipProps extends Omit<AriaTooltipProps, 'children'> {\n  children: React.ReactNode;\n}\n\nconst styles = tv({\n  base: 'group bg-neutral-700 dark:bg-neutral-600 border border-neutral-800 dark:border-white/10 font-sans text-xs text-white rounded-lg drop-shadow-lg will-change-transform px-3 py-1.5 box-border',\n  variants: {\n    isEntering: {\n      true: 'animate-in fade-in placement-bottom:slide-in-from-top-0.5 placement-top:slide-in-from-bottom-0.5 placement-left:slide-in-from-right-0.5 placement-right:slide-in-from-left-0.5 ease-out duration-200'\n    },\n    isExiting: {\n      true: 'animate-out fade-out placement-bottom:slide-out-to-top-0.5 placement-top:slide-out-to-bottom-0.5 placement-left:slide-out-to-right-0.5 placement-right:slide-out-to-left-0.5 ease-in duration-150'\n    }\n  }\n});\n\nexport function Tooltip({children, ...props}: TooltipProps) {\n  return (\n    <AriaTooltip\n      {...props}\n      offset={10}\n      className={composeRenderProps(props.className, (className, renderProps) =>\n        styles({...renderProps, className})\n      )}>\n      <OverlayArrow>\n        <svg\n          width={8}\n          height={8}\n          viewBox=\"0 0 8 8\"\n          className=\"block fill-neutral-700 dark:fill-neutral-600 forced-colors:fill-[Canvas] stroke-neutral-800 dark:stroke-white/10 forced-colors:stroke-[ButtonBorder] group-placement-bottom:rotate-180 group-placement-left:-rotate-90 group-placement-right:rotate-90\">\n          <path d=\"M0 0 L4 4 L8 0\" />\n        </svg>\n      </OverlayArrow>\n      {children}\n    </AriaTooltip>\n  );\n}\n"
    }
  ],
  "css": {
    "@plugin \"tailwindcss-react-aria-components\"": {},
    "@import \"tw-animate-css\"": {}
  }
}