<!-- source-hash: 7a9da2d80c73e939b410ce27e719aa66 -->
Accessible tooltip component built on Radix UI primitives, providing animated, portal-rendered tooltips with consistent ODS (OpenFrame Design System) styling.

## Key Components

| Export | Type | Description |
|--------|------|-------------|
| `TooltipProvider` | Component | Context provider required at the app/layout level to manage tooltip state |
| `Tooltip` | Component | Root wrapper controlling open/close behavior |
| `TooltipTrigger` | Component | Element that activates the tooltip on hover/focus |
| `TooltipContent` | Component | Styled content panel rendered in a portal with enter/exit animations |

## Usage Example

```typescript
import {
  Tooltip,
  TooltipContent,
  TooltipProvider,
  TooltipTrigger,
} from "@/components/ui/tooltip"

export function ActionButton() {
  return (
    <TooltipProvider>
      <Tooltip>
        <TooltipTrigger asChild>
          <button>Hover me</button>
        </TooltipTrigger>
        <TooltipContent side="top">
          <p>Helpful context here</p>
        </TooltipContent>
      </Tooltip>
    </TooltipProvider>
  )
}
```

## Notes

- `TooltipContent` defaults to `sideOffset={4}` and supports all four sides (`top`, `bottom`, `left`, `right`) with direction-aware slide-in animations via Tailwind data attributes.
- Content is injected via a **portal**, ensuring correct stacking context (`z-[1400]`) above modals and overlays.
- `TooltipProvider` should be placed high in the component tree (e.g., root layout) to avoid nesting multiple providers unnecessarily.