> ## Documentation Index
> Fetch the complete documentation index at: https://rive-debug-panel.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Sidebar

> Use the sidebar to access editor panels and organize your workspace.

export const VideoEmbed = ({src}) => {
  return <div style={{
    width: "100%",
    height: "100%",
    overflow: "hidden"
  }}>

      <video src={src} autoPlay loop muted playsInline style={{
    width: "100%",
    height: "100%",
    borderRadius: 0,
    margin: 0,
    display: "block",
    objectFit: "cover",
    backgroundColor: "transparent"
  }} />
    </div>;
};

The sidebar is the left side of the editor. It contains panels for navigating your file, managing assets, working with data, editing animations, and using the AI Agent.

<img src="https://mintcdn.com/rive-debug-panel/Y8dgm52DhnTVPlCr/images/interface/sidebar.png?fit=max&auto=format&n=Y8dgm52DhnTVPlCr&q=85&s=2ecc0d8c1020f39a66fdc0f40ca28897" alt="Editor sidebar" width="2478" height="1434" data-path="images/interface/sidebar.png" />

## Panels

The sidebar includes several panels:

* [Hierarchy](/editor/interface-overview/hierarchy) - View and organize the objects in your file.
* [Data](/editor/data-binding/overview) - Create and manage View Models, properties, and data binding.
* [Assets](/editor/fundamentals/assets-overview) - Manage images, fonts, audio, and other assets used in your file.
* [Animations](/editor/animate-mode/animate-mode-overview) - Create and manage animations and State Machines.
* [Agent](/editor/ai-agent/ai-agent) - Use the AI Agent to help create, edit, and explore your file.

## Panel Options

Use the **…** menu on a panel to access options such as filtering, sorting, collapsing the panel, or resetting the sidebar layout.

## Organizing Panels

You can customize how panels appear in the sidebar.

* Toggle full sidebar height.
* Drag panels to change their order.
* Drag a panel into its own column.

<VideoEmbed src="https://static.rive.app/video/sidebar-organize-panels.mp4" />

### Open AI Agent in Viewport

The Agent panel also has an option to open in the viewport, where it appears alongside the Stage or Script panel.

<VideoEmbed src="https://static.rive.app/video/sidebar-ai-open-in-viewport.mp4" />