---
title: ConsentManagerProvider
description: The root provider component that initializes the consent system and makes consent state available to all child components.
---
## Basic Usage
```tsx
import { type ReactNode } from 'react';
import { ConsentManagerProvider, ConsentBanner, ConsentDialog } from '@c15t/nextjs';
export default function ConsentManager({ children }: { children: ReactNode }) {
return (
{children}
);
}
```
## Mode: hosted vs offline
```tsx
// Hosted mode — persists to hosted backend
// Offline mode — local cookie storage only
```
See [Client Modes](/docs/frameworks/next/concepts/client-modes) for a detailed comparison.