### File

`packages/components/eui-dashboard-card/eui-dashboard-card-status-content.component.ts`

### Description

Status indicator container for dashboard cards, displaying badges, chips, or status information. Positioned separately from main content to highlight important state or metadata.

### Status Badge

Example :

    <eui-dashboard-card-status-content>
      <eui-chip euiSizeS euiSuccess>Active</eui-chip>
    </eui-dashboard-card-status-content>

### Warning Status

Example :

    <eui-dashboard-card-status-content>
      <eui-chip euiSizeS euiOutline euiWarning>Pending Review</eui-chip>
    </eui-dashboard-card-status-content>

### Multiple Indicators

Example :

    <eui-dashboard-card-status-content>
      <eui-badge euiInfo>New</eui-badge>
      <eui-chip euiSizeS euiOutline>Draft</eui-chip>
    </eui-dashboard-card-status-content>

### Accessibility

- Status information should be conveyed through text, not color alone
- Use semantic elements (badges, chips) with descriptive text
- Ensure sufficient color contrast for status indicators

### Notes

- Use alongside `eui-dashboard-card-content` for status display
- Typically contains badges, chips, or status labels
- Positioned independently from main card content
- Supports multiple status indicators

### Metadata

selector | `eui-dashboard-card-status-content`

template

    <ng-content/>

### Index

###### Properties

- string

###### HostBindings

- class

### HostBindings

class
Type : `string`
Default value : `'eui-dashboard-card-status-content'`
CSS class applied to the host element

### Properties

string
Type : `string`
Default value : `'eui-dashboard-card-status-content'`
Decorators : `@HostBinding('class')`
CSS class applied to the host element

# results matching ""

# No results matching ""