### File

`packages/components/eui-banner/eui-banner-cta.component.ts`

### Description

Content projection component for displaying call-to-action elements within eui-banner. Provides consistent styling and positioning for action buttons or links in banner contexts. Must be used as a child of eui-banner component. Typically contains buttons, links, or other interactive elements that prompt user action.

Example :

    <eui-banner imageUrl="image.jpg">
      <eui-banner-title>Join Us</eui-banner-title>
      <eui-banner-description>Be part of something great</eui-banner-description>
      <eui-banner-cta>
        <button euiButton euiCTAButton>Get Started</button>
      </eui-banner-cta>
    </eui-banner>

### Accessibility

- CTA buttons should have descriptive, action-oriented labels
- Interactive elements are keyboard accessible
- Ensure sufficient contrast for buttons on banner backgrounds

### Notes

- Must be direct child of eui-banner component
- Typically placed after title and description
- Can contain buttons, links, or button groups
- Automatically positioned according to banner layout
- Works with euiInverse for proper button styling on dark backgrounds

### Metadata

changeDetection | `ChangeDetectionStrategy.OnPush`
selector | `eui-banner-cta`

template

    <ng-content/>

styleUrl | `./eui-banner-cta.scss`

### Index

###### Properties

- string

###### HostBindings

- class

### HostBindings

class
Type : `string`
Default value : `'eui-banner-cta'`
Binds the class to the component.

### Properties

string
Type : `string`
Default value : `'eui-banner-cta'`
Decorators : `@HostBinding('class')`
Binds the class to the component.

# results matching ""

# No results matching ""