### File

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

### Description

The eui-card component is based on Material Design and provides a content container for text, photos and actions in the context of a single subject.

### Metadata

changeDetection | `ChangeDetectionStrategy.OnPush`
HostDirectives | `BaseStatesDirective`
selector | `eui-content-card`
imports | `FormsModule` `EUI_INPUT_CHECKBOX`
templateUrl | `./eui-content-card.component.html`
styleUrl | `./eui-content-card.scss`

### Index

###### Methods

- toggleBookmark
- toggleCollapse

###### Inputs

- e2eAttr
- isBookmarkable
- isBookmarked
- isCollapsed
- isCollapsible
- isSelectable
- isSelected

###### Outputs

- cardBookmark
- cardCollapse
- cardSelect

###### HostBindings

- class

###### Accessors

- cssClasses

### Inputs

e2eAttr
Type : `string`
Default value : `'eui-content-card'`
Sets the `data-e2e` attribute at the host element.

isBookmarkable
Type : `boolean`
Default value : `false`
Sets the `isBookmarkable` attribute which is adding a bookmark toggle to the card header end-block.

isBookmarked
Type : `boolean`
Default value : `false`
Sets the `isBookmarkable` attribute which is adding a bookmark toggle to the card header end-block.

isCollapsed
Type : `boolean`
Default value : `false`
Sets the `isCollapsed` attribute which collapses the card content.

isCollapsible
Type : `boolean`
Default value : `false`
Sets the `isCollapsible` attribute which shows the collapsible toggle in the header.

isSelectable
Type : `boolean`
Default value : `false`
Sets the `isSelectable` attribute in order to show the card header checkbox for selection

isSelected
Type : `boolean`
Default value : `false`
Sets the `isSelected` attribute in order to show the card header as selected.

### Outputs

cardBookmark
Type : `EventEmitter`
Event emitted when the card is bookmarked.

cardCollapse
Type : `EventEmitter`
Event emitted when the card is bookmarked.

cardSelect
Type : `EventEmitter`
Event emitted when the card is selected.

### HostBindings

class
Type : `string`

### Methods

toggleBookmark
`toggleBookmark()`
Returns : `void`

toggleCollapse
`toggleCollapse()`
Returns : `void`

### Accessors

cssClasses
get `cssClasses()`
Computes and returns the CSS classes for the component based on its current state. Returns : `string`

# results matching ""

# No results matching ""