<!-- source-hash: cde6b3206d9d2b1da2994e1fb8b1fb77 -->
Storybook stories for the `Tooltip` UI component, demonstrating usage patterns, placement options, and interactive states.

## Key Components

| Story | Description |
|---|---|
| `Default` | Basic tooltip on a settings icon button |
| `InfoHelper` | Info icon with explanatory tooltip for forms/dashboards |
| `Placement` | All four tooltip positions: `top`, `bottom`, `left`, `right` |
| `IconToolbar` | Action bar with tooltips on Copy, Download, Share, and Delete icons |
| `DisabledButton` | Tooltip on a disabled button via wrapper `<span>` to preserve hover events |
| `TruncatedText` | Reveals full text on hover when content is visually clipped |
| `RichContent` | Multi-line tooltip with icon, heading, and keyboard shortcut badge |
| `CopyButton` | Interactive copy button that toggles tooltip text and icon on click |

## Usage Example

```typescript
// Basic tooltip
<TooltipProvider delayDuration={200}>
  <Tooltip>
    <TooltipTrigger asChild>
      <button>Hover me</button>
    </TooltipTrigger>
    <TooltipContent side="top">Tooltip text</TooltipContent>
  </Tooltip>
</TooltipProvider>

// Tooltip on a disabled button — wrap in span to capture hover
<Tooltip>
  <TooltipTrigger asChild>
    <span tabIndex={0} className="inline-block">
      <Button disabled>Deploy</Button>
    </span>
  </TooltipTrigger>
  <TooltipContent>You need admin permissions to deploy.</TooltipContent>
</Tooltip>
```

> `TooltipProvider` must wrap all `Tooltip` instances. Use `delayDuration` to control hover delay in milliseconds.