# Provider Configuration

The `TooltipProvider` component manages global tooltip behavior and timing across all tooltips in your application. It provides context for delay timing, hover behavior, and skip delay functionality.

## Capabilities

### TooltipProvider Component

Global context provider that wraps your application or section containing tooltips.

```typescript { .api }
/**
 * Provider component for managing global tooltip behavior and timing
 * @param children - Child components containing tooltips
 * @param delayDuration - Duration in ms from pointer enter until tooltip opens (default: 700)
 * @param skipDelayDuration - Duration in ms user has to enter another trigger without delay (default: 300)
 * @param disableHoverableContent - When true, hovering content closes tooltip (default: false)
 */
interface TooltipProviderProps {
  children: React.ReactNode;
  delayDuration?: number;
  skipDelayDuration?: number;
  disableHoverableContent?: boolean;
}

const TooltipProvider: React.FC<TooltipProviderProps>;
```

**Usage Examples:**

```typescript
import { TooltipProvider } from "@radix-ui/react-tooltip";

// Basic provider with default settings
function App() {
  return (
    <TooltipProvider>
      {/* Your tooltip components */}
    </TooltipProvider>
  );
}

// Custom delay timing
function CustomApp() {
  return (
    <TooltipProvider
      delayDuration={500}
      skipDelayDuration={200}
      disableHoverableContent={false}
    >
      {/* Your tooltip components */}
    </TooltipProvider>
  );
}

// Disable hoverable content globally
function SimpleTooltips() {
  return (
    <TooltipProvider disableHoverableContent>
      {/* Tooltips will close when pointer leaves trigger */}
    </TooltipProvider>
  );
}
```

### Provider Props

#### delayDuration

Controls the delay before tooltip opens when pointer enters trigger.

- **Type**: `number`
- **Default**: `700` (milliseconds)
- **Description**: Duration from pointer enter until tooltip opens

#### skipDelayDuration

Controls how long user has to enter another trigger without delay.

- **Type**: `number`
- **Default**: `300` (milliseconds)
- **Description**: Time window for entering another tooltip trigger without incurring delay again

#### disableHoverableContent

Controls whether tooltip content can be hovered.

- **Type**: `boolean`
- **Default**: `false`
- **Description**: When `true`, trying to hover content closes tooltip as pointer leaves trigger

### Provider Context

The provider creates a context that manages:

- **Delay state tracking**: Whether subsequent tooltips should have delays
- **Transit state**: Whether pointer is in transit between trigger and content
- **Global configuration**: Default settings inherited by all child tooltips
- **Event coordination**: Opening one tooltip closes others

### Provider Aliases

```typescript { .api }
const Provider: React.FC<TooltipProviderProps>;
```

The `Provider` component is an alias for `TooltipProvider` for shorter import names.

## Types

```typescript { .api }
type TooltipProviderProps = {
  children: React.ReactNode;
  delayDuration?: number;
  skipDelayDuration?: number;
  disableHoverableContent?: boolean;
};
```