File

packages/components/eui-page/components/eui-page-header/components/eui-page-header-action-items.component.ts

Description

Container for action buttons or controls in the page header (v1). Provides a dedicated area for primary and secondary actions related to the page. Typically positioned on the right side of the page header.

Basic usage

<eui-page-header label="Projects">
  <eui-page-header-action-items>
    <button euiButton euiPrimary>Create New</button>
    <button euiButton euiSecondary>Import</button>
  </eui-page-header-action-items>
</eui-page-header>

Accessibility

• Ensure buttons have descriptive labels
• Use appropriate button types (primary, secondary) for visual hierarchy
• Maintain logical tab order for keyboard navigation

Notes

• Must be used within eui-page-header component
• Typically contains action buttons related to page content
• Automatically positioned in header layout

<ng-content/>