# EuiAppSidebarBodyComponent

**Type:** component



Container component for the main content area of the sidebar, positioned between header and footer.
Provides a scrollable region for sidebar navigation menus or other interactive content.
Automatically handles vertical spacing to accommodate sidebar header and footer when present.
Content is projected via ng-content allowing flexible body composition.

```html
<!-- Sidebar body with navigation menu -->
<eui-app>
  <eui-app-sidebar>
    <eui-app-sidebar-body>
      <eui-app-sidebar-menu
        [items]="sidebarItems"
        [hasFilter]="true"
        [hasIcons]="true">
      </eui-app-sidebar-menu>
    </eui-app-sidebar-body>
  </eui-app-sidebar>
</eui-app>
```

### Accessibility
- Provides scrollable navigation region
- Content projection allows flexible accessible structure
- Child menu components handle keyboard navigation
- Scroll behavior maintains focus visibility

### Notes
- Must be used within eui-app-sidebar for proper layout integration
- Positioned between eui-app-sidebar-header and eui-app-sidebar-footer
- Typically contains eui-app-sidebar-menu for navigation
- Automatically scrollable when content exceeds available height
- Content is projected via ng-content for flexible composition
- Vertical spacing automatically adjusts for header/footer presence
- Takes remaining vertical space between header and footer


**Selector:** `eui-app-sidebar-body`