import * as i0 from '@angular/core';
import { EventEmitter, QueryList } from '@angular/core';
import * as i1 from '@eui/components/shared';
/**
* @description
* Container for content at the top of the card body. Used for highlighted information, alerts, or content that needs visual separation from the main body.
*
* @usageNotes
* ### Alert Message
* ```html
*
*
* Notice: This item requires attention
*
*
* ```
*
* ### Summary Information
* ```html
*
*
*
Status:
Active
*
Progress:
75%
*
*
* ```
*
* ### Accessibility
* - Use appropriate semantic elements for content type
* - Ensure alerts have proper ARIA roles when needed
* - Maintain color contrast for all content
*
* ### Notes
* - Positioned at the top of the body with visual separation
* - Optional component - only use when content needs emphasis
* - Commonly used for alerts, summaries, or key metrics
* - Automatically styled with appropriate spacing
*/
declare class EuiContentCardBodyTopComponent {
/**
* Binds the class to the component.
*
* @default 'eui-content-card-body-top'
*/
string: string;
static ɵfac: i0.ɵɵFactoryDeclaration;
static ɵcmp: i0.ɵɵComponentDeclaration;
}
/**
* @description
* Container for the main content area of the card. Supports optional top section for highlighted content.
* Content is hidden when the card is collapsed.
*
* @usageNotes
* ### Basic Body
* ```html
*
*
Main card content goes here
*
* ```
*
* ### With Top Section
* ```html
*
*
*
* Important notice or highlighted content
*
*
*
Regular card content follows
*
* ```
*
* ### Accessibility
* - Use semantic HTML elements for content structure
* - Ensure proper heading hierarchy within body content
* - Maintain sufficient color contrast for all text
* - Make interactive elements keyboard accessible
*
* ### Notes
* - Primary content container for the card
* - Automatically hidden when parent card is collapsed
* - Can contain any HTML content or components
* - Use body-top for content that needs visual separation
*/
declare class EuiContentCardBodyComponent {
/**
* Binds the class to the component.
*
* @default 'eui-content-card-body'
*/
string: string;
static ɵfac: i0.ɵɵFactoryDeclaration;
static ɵcmp: i0.ɵɵComponentDeclaration;
}
/**
* @description
* Container for footer content at the bottom of the card. Typically used for actions, links, or supplementary information.
*
* @usageNotes
* ### Action Buttons
* ```html
*
* View Details
* Cancel
*
* ```
*
* ### Links
* ```html
*
* Read more
*
* ```
*
* ### Mixed Content
* ```html
*
*
* Last updated: 2 hours ago
* Edit
*
*
* ```
*
* ### Accessibility
* - Ensure all interactive elements are keyboard accessible
* - Provide clear labels for all actions
* - Use appropriate button types (button vs link)
* - Maintain logical tab order
*
* ### Notes
* - Positioned at the bottom of the card with visual separation
* - Optional component - only include when actions or additional info needed
* - Commonly used for primary/secondary actions
* - Automatically styled with appropriate spacing and borders
*/
declare class EuiContentCardFooterComponent {
/**
* Binds the class to the component.
*
* @default 'eui-content-card-footer'
*/
string: string;
static ɵfac: i0.ɵɵFactoryDeclaration;
static ɵcmp: i0.ɵɵComponentDeclaration;
}
/**
* @description
* Container for content placed at the start (left side) of the card header. Typically used for status indicators, badges, or icons.
*
* @usageNotes
* ### With Status Chip
* ```html
*
* Active
*
* ```
*
* ### With Icon
* ```html
*
*
*
* ```
*
* ### 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
*/
declare class EuiContentCardHeaderStartComponent {
/**
* Binds the class to the component.
*
* @default 'eui-content-card-header-start'
*/
string: string;
static ɵfac: i0.ɵɵFactoryDeclaration;
static ɵcmp: i0.ɵɵComponentDeclaration;
}
/**
* @description
* The eui-content-card component is based on Material Design and provides a content container for text, photos and actions in the context of a single subject.
* Supports selection, collapsing, and bookmarking functionality.
*
* @usageNotes
* ### Basic Usage
* ```html
*
*
* Card Title
*
* Card content goes here
*
* ```
*
* ### With Selection and Collapse
* ```html
*
*
* Collapsible Card
*
* This content can be collapsed
*
* ```
*
* ### Accessibility
* - Use semantic heading levels within card titles for proper document structure
* - Ensure interactive elements (checkboxes, buttons) have appropriate labels
* - When using selection, the checkbox is automatically managed with proper ARIA attributes
* - Collapsible cards use icon buttons with appropriate accessibility labels
*
* ### Notes
* - Cards can be made selectable with `isSelectable` input
* - Cards can be made collapsible with `isCollapsible` input
* - Bookmarking functionality is available via `isBookmarkable` input
* - All interactive features emit events for state changes
* - Use with child components for structured content layout
*/
declare class EuiContentCardComponent {
/**
* @description
* Computes and returns the CSS classes for the component based on its current state.
*
* @returns {string} Space-separated string of CSS class names
*/
get cssClasses(): string;
/**
* Sets the `data-e2e` attribute at the host element.
*
* @default 'eui-card'
*/
e2eAttr: string;
/**
* Sets the `isSelected` attribute in order to show the card header as selected.
*
* @default false
*/
isSelected: boolean;
/**
* Sets the `isSelectable` attribute in order to show the card header checkbox for selection
*
* @default false
*/
isSelectable: boolean;
/**
* Sets the `isCollapsible` attribute which shows the collapsible toggle in the header.
*
* @default false
*/
isCollapsible: boolean;
/**
* Sets the `isCollapsed` attribute which collapses the card content.
*
* @default false
*/
isCollapsed: boolean;
/**
* Sets the `isBookmarkable` attribute which is adding a bookmark toggle to the card header end-block.
*
* @default false
*/
isBookmarkable: boolean;
/**
* Sets the `isBookmarkable` attribute which is adding a bookmark toggle to the card header end-block.
*
* @default false
*/
isBookmarked: boolean;
/**
* Event emitted when the card is selected.
*/
cardSelect: EventEmitter;
/**
* Event emitted when the card is bookmarked.
*/
cardBookmark: EventEmitter;
/**
* Event emitted when the card is bookmarked.
*/
cardCollapse: EventEmitter;
private baseStatesDirective;
toggleCollapse(): void;
toggleBookmark(): void;
protected onSelect(event: Event): void;
static ɵfac: i0.ɵɵFactoryDeclaration;
static ɵcmp: i0.ɵɵComponentDeclaration;
static ngAcceptInputType_isSelected: unknown;
static ngAcceptInputType_isSelectable: unknown;
static ngAcceptInputType_isCollapsible: unknown;
static ngAcceptInputType_isCollapsed: unknown;
static ngAcceptInputType_isBookmarkable: unknown;
static ngAcceptInputType_isBookmarked: unknown;
}
/**
* @description
* Container for content placed at the end (right side) of the card header. Typically used for action buttons or menus.
* Automatically integrates bookmark toggle when parent card has `isBookmarkable` enabled.
*
* @usageNotes
* ### With Action Button
* ```html
*
*
*
* ```
*
* ### With Multiple Actions
* ```html
*
*
*
*
* ```
*
* ### Accessibility
* - All action buttons must have accessible labels
* - Use `aria-label` or visible text for icon buttons
* - Group related actions logically
*
* ### Notes
* - Positioned at the end of the header after all other content
* - Automatically includes bookmark toggle when parent card is bookmarkable
* - Actions are automatically aligned and spaced
* - Commonly used for contextual menus or quick actions
*/
declare class EuiContentCardHeaderEndComponent {
/**
* Binds the class to the component.
*
* @default 'eui-content-card-header-end'
*/
string: string;
/**
* Keyboard shortcut key for the bookmark toggle.
* @default 'b'
*/
bookmarkAccessKey: string;
protected euiContentCardParent: EuiContentCardComponent;
onToggle(event: boolean): void;
static ɵfac: i0.ɵɵFactoryDeclaration;
static ɵcmp: i0.ɵɵComponentDeclaration;
}
/**
* @description
* Container for primary metadata information displayed below the subtitle. Used for key details like dates, authors, or categories.
*
* @usageNotes
* ### Simple Metadata
* ```html
*
* Created: January 26, 2024
*
* ```
*
* ### Multiple Metadata Items
* ```html
*
* Author: John Doe | Category: Research | Status: Published
*
* ```
*
* ### With Semantic Markup
* ```html
*
* |
* 5 min read
*
* ```
*
* ### Accessibility
* - Use semantic HTML elements like `