> For AI agents: the complete Sanity documentation index is available at [https://www.sanity.io/docs/llms.txt](https://www.sanity.io/docs/llms.txt).

# Open and close panels

Open, resize, and close your app's panels from code with the panels.mode.set event.

Users open panels from the dock, and your app can also open, resize, and close its own panels with the `panels.mode.set` event. Your app can only control panels it declares in `sanity.cli.ts`.

## Open a panel

**src/OpenActivity.tsx**

```tsx
import {useEmit} from '@sanity/sdk-react/dashboard'

export function OpenActivity() {
  const setPanelMode = useEmit('panels.mode.set')
  return (
    <button type="button" onClick={() => setPanelMode({name: 'activity', mode: 'aside'})}>
      Show activity
    </button>
  )
}
```

`name` is the panel view's `name` from `sanity.cli.ts`. `panels.mode.set` accepts these payloads:

- `{name, mode: 'aside'}`: Open the panel beside the current app.
- `{name, mode: 'full'}`: Open the panel over the main area.
- `{name, size}`: Set the open panel's width in pixels.
- `null`: Close the open panel.

One panel is open at a time, so opening a panel replaces any other open panel.

## Check which panel is open

Read the `panels.mode` topic to show the current state, for example to toggle a panel:

**src/ToggleActivity.tsx**

```tsx
import {useEmit, useTopic} from '@sanity/sdk-react/dashboard'

export function ToggleActivity() {
  const panelMode = useTopic('panels.mode')
  const setPanelMode = useEmit('panels.mode.set')
  const openPanel = panelMode?.ok ? panelMode.value : null
  const isOpen = openPanel?.name === 'activity'

  return (
    <button
      type="button"
      onClick={() => setPanelMode(isOpen ? null : {name: 'activity', mode: 'aside'})}
    >
      {isOpen ? 'Hide activity' : 'Show activity'}
    </button>
  )
}
```

When a panel is open, its value contains the owning app's `appId`, the panel's `name`, and its `mode`. An `aside` panel can also include its width as `size`.

## Next steps

[Render a panel](https://www.sanity.io/docs/dashboard-beta/render-a-panel)
Declare a panel and export its components.

[Read Dashboard state](https://www.sanity.io/docs/dashboard-beta/read-dashboard-state)
Read the organization, user, and color scheme.

