### File

`packages/components/layout/eui-app/eui-app-sidebar/sidebar-footer/sidebar-footer.component.ts`

### Description

Container component for the sidebar footer area, typically containing secondary actions, settings, or utility links. Automatically registers with EuiAppShellService to calculate and set CSS variables for proper layout spacing. Manages the --eui-app-sidebar-footer-height CSS variable to coordinate vertical positioning of sidebar content. Content is projected via ng-content allowing flexible footer composition.

Example :

    <!-- Sidebar footer with custom content -->
    <eui-app>
      <eui-app-sidebar>
        <eui-app-sidebar-footer>
          <p>Version 1.0.0</p>
          <a href="/help">Help</a>
        </eui-app-sidebar-footer>
      </eui-app-sidebar>
    </eui-app>

### Accessibility

- Provides semantic container for sidebar footer content
- Content projection allows flexible accessible structure
- Links and buttons within footer maintain keyboard accessibility

### Notes

- Must be used within eui-app-sidebar for proper layout integration
- Automatically registers with EuiAppShellService on init
- Sets --eui-app-sidebar-footer-height CSS variable for layout calculations
- Typically contains utility links, version info, or secondary actions
- Content is projected via ng-content for flexible composition
- Cleans up CSS variables on destroy
- Height is automatically calculated based on content
- Positioned at bottom of sidebar, below sidebar body

### Implements

`OnInit` `OnDestroy`

### Metadata

encapsulation | `ViewEncapsulation.None`
selector | `eui-app-sidebar-footer`

template

    <ng-content/>

### Index

###### Properties

- class

###### HostBindings

- class

### HostBindings

class
Type : `string`
Default value : `'eui-app-sidebar-footer'`

### Properties

class
Type : `string`
Default value : `'eui-app-sidebar-footer'`
Decorators : `@HostBinding()`

# results matching ""

# No results matching ""