### File

`packages/components/eui-content-card/eui-content-card-header/eui-content-card-header-start.ts`

### Description

Container for content placed at the start (left side) of the card header. Typically used for status indicators, badges, or icons.

### With Status Chip

Example :

    <eui-content-card-header-start>
        <eui-chip euiSizeS>Active</eui-chip>
    </eui-content-card-header-start>

### With Icon

Example :

    <eui-content-card-header-start>
        <eui-icon-svg icon="document" size="m"/>
    </eui-content-card-header-start>

### Accessibility

- Ensure status indicators have appropriate text or ARIA labels
- Icons should have descriptive labels when conveying important information

### Notes

- Positioned at the start of the header before the title
- Commonly used for visual status indicators or categorization
- Content is automatically aligned and spaced

### Metadata

changeDetection | `ChangeDetectionStrategy.OnPush`
selector | `eui-content-card-header-start`

template

    <ng-content/>

styleUrl | `./eui-content-card-header-start.scss`

### Index

###### Properties

- string

###### HostBindings

- class

### HostBindings

class
Type : `string`
Default value : `'eui-content-card-header-start'`
Binds the class to the component.

### Properties

string
Type : `string`
Default value : `'eui-content-card-header-start'`
Decorators : `@HostBinding('class')`
Binds the class to the component.

# results matching ""

# No results matching ""