### File

`packages/components/eui-user-profile/user-profile-menu-item/user-profile-menu-item.component.ts`

### Description

Individual menu item component for user profile menus. Implements FocusableOption for keyboard navigation support. Used within eui-user-profile-menu to create actionable menu entries.

### Basic Usage

Example :

    <eui-user-profile-menu>
      <eui-user-profile-menu-item (click)="viewProfile()">
        <eui-icon-svg icon="eui-user" size="s" />
        My Profile
      </eui-user-profile-menu-item>

      <eui-user-profile-menu-item (click)="changePassword()">
        <eui-icon-svg icon="eui-lock" size="s" />
        Change Password
      </eui-user-profile-menu-item>

      <eui-user-profile-menu-item (click)="logout()">
        <eui-icon-svg icon="eui-logout" size="s" />
        Logout
      </eui-user-profile-menu-item>
    </eui-user-profile-menu>

### Accessibility

- Implements ARIA menuitem role
- Keyboard focusable with proper tabindex management
- Supports focus() method for programmatic focus
- Works with parent menu's keyboard navigation

### Notes

- Must be used within eui-user-profile-menu
- Supports any content (text, icons, badges)
- Click events handled through standard Angular event binding
- Focus managed by parent menu's FocusKeyManager

### Implements

`FocusableOption`

### Metadata

encapsulation | `ViewEncapsulation.None`
selector | `eui-user-profile-menu-item`

template

    <ng-content/>

### Index

###### Properties

- class
- role
- tabindex

###### Methods

- focus

###### HostBindings

- attr.role
- attr.tabindex
- class

### HostBindings

attr.role
Type : `string`
Default value : `'menuitem'`

attr.tabindex
Type : `string`
Default value : `'-1'`

class
Type : `string`
Default value : `'eui-user-profile-menu-item'`

### Methods

focus
`focus()`
Returns : `void`

### Properties

class
Type : `string`
Default value : `'eui-user-profile-menu-item'`
Decorators : `@HostBinding('class')`

role
Type : `string`
Default value : `'menuitem'`
Decorators : `@HostBinding('attr.role')`

tabindex
Type : `string`
Default value : `'-1'`
Decorators : `@HostBinding('attr.tabindex')`

# results matching ""

# No results matching ""