> ## Documentation Index
> Fetch the complete documentation index at: https://docs.daily.co/llms.txt
> Use this file to discover all available pages before exploring further.

# Daily Provider

> The DailyProvider gives every component in your application access to the Daily call object.

`<DailyProvider callObject={callObject}>`

Stores call state and manages a [call object](/docs/daily-js/concepts/call-modes#call-object-mode) instance, giving every component in your tree access to it. Two modes are supported: pass an existing call object, or provide props for `DailyProvider` to create one.

We recommend utilizing [`useCallObject`](/reference/daily-react/use-call-object) to create your own call object instance.

## Props

### Existing call object mode

<ParamField body="callObject" type="Object" required>
  Pre-initialized call object instance (instantiated via [`createCallObject()`](/reference/daily-js/factory-methods/create-call-object)).
</ParamField>

### Call object creation mode

<ParamField body="url" type="string" required>
  The URL of the Daily room to join.
</ParamField>

<ParamField body="audioSource" type="string | MediaStreamTrack | boolean">
  Audio source for the call. See [DailyCall properties](/reference/daily-js/types/daily-call-options) for details.
</ParamField>

<ParamField body="videoSource" type="string | MediaStreamTrack | boolean">
  Video source for the call. See [DailyCall properties](/reference/daily-js/types/daily-call-options) for details.
</ParamField>

<ParamField body="dailyConfig" type="Object">
  Daily configuration options. See [DailyCall properties](/reference/daily-js/types/daily-call-options) for details.
</ParamField>

<ParamField body="receiveSettings" type="Object">
  Receive settings for the call. See [DailyCall properties](/reference/daily-js/types/daily-call-options) for details.
</ParamField>

<ParamField body="subscribeToTracksAutomatically" type="boolean">
  Whether to automatically subscribe to tracks. See [DailyCall properties](/reference/daily-js/types/daily-call-options) for details.
</ParamField>

<ParamField body="token" type="string">
  Meeting token. See [DailyCall properties](/reference/daily-js/types/daily-call-options) for details.
</ParamField>

<ParamField body="userName" type="string">
  Display name for the local participant. See [DailyCall properties](/reference/daily-js/types/daily-call-options) for details.
</ParamField>

<Note>
  Changing any of the props in call object creation mode will destroy the current instance and create a new one with the updated props.
</Note>

### Optional props

<ParamField body="jotaiStore" type="Object">
  `store` to be passed to Daily React's internal Jotai `<Provider>`. If you use Jotai in your app, this will store Daily React's internal state atoms in your Jotai store.
</ParamField>

## Example

```jsx theme={null}
import { DailyProvider, useCallObject } from '@daily-co/daily-react';

function App() {
  // Create an instance of the Daily call object
  const callObject = useCallObject();

  return <DailyProvider callObject={callObject}>{children}</DailyProvider>;
}
```

### Store Daily React's state in your own Jotai Provider

```jsx theme={null}
import { DailyProvider, useCallObject } from '@daily-co/daily-react';
import { createStore, Provider } from 'jotai';

const jotaiStore = createStore();

function App() {
  // Create an instance of the Daily call object
  const callObject = useCallObject();

  return (
    <Provider store={jotaiStore}>
      <DailyProvider callObject={callObject} jotaiStore={jotaiStore}>
        {children}
      </DailyProvider>
    </Provider>
  );
}
```

## See also

<CardGroup>
  <Card title="Hooks" icon="code" iconType="solid">
    * [useCallObject()](/reference/daily-react/use-call-object)
    * [useCallFrame()](/reference/daily-react/use-call-frame)
    * [useDaily()](/reference/daily-react/use-daily)
  </Card>
</CardGroup>