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

# <EmptyState />

> A placeholder for a surface with nothing to show yet.

```js theme={"system"}
import {EmptyState} from "attio/client"
```

Return an `EmptyState` as the **only child** of a [page](../pages/overview), [record tab](../extensions/record-tab) or [dialog](../dialogs/show-dialog) and it fills the surface with a centred title, description and actions, matching Attio's own empty states.

## Example

```tsx src/app/pages/sync-log/page.tsx theme={"system"}
import React from "react"
import {Extensions, EmptyState, Button, navigate, Destinations} from "attio/client"

import {useSyncLog} from "./use-sync-log"
import {SyncLogTable} from "./sync-log-table"

export default Extensions.definePage({
  name: "Sync log",
  Page: () => {
    const entries = useSyncLog() // may suspend!

    if (entries.length === 0) {
      return (
        <EmptyState
          title="Nothing synced yet"
          description="Connect your account in settings and the first sync will show up here."
        >
          <Button
            label="Open settings"
            variant="primary"
            onClick={() => navigate(Destinations.appSettings())}
          />
        </EmptyState>
      )
    }

    return <SyncLogTable entries={entries} />
  },
})
```

## Props

<ParamField path="title" type="string" required>
  A short heading naming what is missing, such as "No deals yet".
</ParamField>

<ParamField path="description" type="string" required>
  A sentence below the title telling the user how to fill the surface.
</ParamField>

<ParamField path="children" type="React.ReactNode">
  The actions offered below the description, written as [`Button`](./button) children.

  * Children that are not buttons are not rendered.
  * More than two buttons collapse into an overflow menu, with primary buttons kept visible.
  * If several buttons are primary, they are all shown as secondary.
</ParamField>
