eui documentation
  1. Components
  2. EuiOverlayContentComponent

File

packages/components/eui-overlay/components/eui-overlay-content/eui-overlay-content.component.ts

Description

Content component for eui-overlay that provides a structured main content area. Serves as the primary container for overlay body content between header and footer. Applies consistent styling, spacing, and scrolling behavior for overlay content. Must be used as a direct child of eui-overlay to maintain proper layout structure.

Basic Usage

Example :
<eui-overlay [isActive]="true">
  <eui-overlay-content>
    <p>Main content goes here</p>
  </eui-overlay-content>
</eui-overlay>

Accessibility

  • Content is scrollable when it exceeds available space
  • Maintains focus within overlay structure

Notes

  • Must be direct child of eui-overlay
  • Automatically handles overflow scrolling

Metadata

changeDetection ChangeDetectionStrategy.Default
encapsulation ViewEncapsulation.None
selector eui-overlay-content
template 
<ng-content/>

Index

HostBindings
Accessors

HostBindings

class
Type : string

Accessors

cssClasses
getcssClasses()

results matching ""

    No results matching ""