import * as i0 from '@angular/core';
import { AfterContentInit, EventEmitter, QueryList, ElementRef } from '@angular/core';
import * as i1 from '@eui/components/shared';
import { BaseStatesDirective } from '@eui/components/shared';
import { EuiIconSvgComponent } from '@eui/components/eui-icon';
/**
* @description
* Chips are compact elements that allow users to enter information, select a choice, filter content or trigger an action.
* The eui-chip component can also be displayed dynamically as a group of multiple interactive elements, see eui-chip-list.
*
* @usageNotes
* #### Basic chip
* ```html
* Chip label
* ```
*
* #### Chip with color variant
* ```html
* Primary
* Success
* ```
*
* #### Removable chip
* ```html
*
* Removable
*
* ```
*
* #### Chip with icon
* ```html
*
*
* User
*
* ```
*
* #### Filled chip with tooltip
* ```html
*
* Info
*
* ```
*
* #### Size variants
* ```html
* Small
* Default
* ```
*
* ```ts
* onRemove(data: any): void {
* console.log('Chip removed:', data);
* }
* ```
*
* ### Accessibility
* - Uses role="status" for screen reader announcements (changes to "listitem" within eui-chip-list)
* - aria-label provides context about chip content (default: "Chip content")
* - Removable chips have keyboard accessible remove button (Enter/Space)
* - Backspace key can also remove chips when focused
* - Icon-only chips should have descriptive aria-label
* - Color variants provide visual meaning supplemented by text
*
* ### Notes
* - Can be used as element (eui-chip) or attribute (span[euiChip], li[euiChip])
* - Color variants: euiPrimary, euiSecondary, euiSuccess, euiInfo, euiWarning, euiDanger
* - Size variants: euiSizeS, default (medium)
* - isChipRemovable adds close button and enables removal
* - isFilled applies solid background color instead of outline
* - euiOutline applies outline/ghost styling
* - euiDisabled disables interaction
* - colorPalette accepts custom color palette names for extended theming
* - tooltipMessage displays tooltip on hover
* - id and euiInternalId for identification (euiInternalId used internally for tracking)
* - data property holds chip metadata including tooltip configuration
* - remove event emits chip data when removed
* - Supports icon content via eui-icon-svg child component
* - Automatically sets role="listitem" when used within eui-chip-list
* - Commonly used in eui-chip-list for managing multiple chips
*/
declare class EuiChipComponent implements AfterContentInit {
/**
* @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 `role` attribute for the host element.
*
* @default 'status'
*/
role: string;
/**
* Sets the `aria-label` attribute for the host element.
*
* @default 'Chip content'
*/
ariaLabel: string;
/**
* Sets the `data-e2e` attribute for the host element.
*
* @default 'eui-chip'
*/
e2eAttr: string;
/**
* Sets the euiInternalId of the chip.
*
* @default null
*/
euiInternalId: string;
/**
* Sets the label of the tooltip to diaply on hover.
*/
tooltipMessage: string;
/**
* Sets the id of the chip.
*/
id: string | number;
/**
* Sets the data of the chip like tooltip configuration.
*/
data: any;
/**
* Wether the chip can be removed.
*
* @default false
*/
isChipRemovable: boolean;
/**
* Wether the chip is filled with color.
*
* @default false
*/
isFilled: boolean;
/**
* Extra color palette to be used on the chip.
*/
colorPalette: string;
/**
* Event emitted when the chip is removed.
*/
remove: EventEmitter;
/**
* Icon declares by user in the chip
*/
euiIcons: QueryList;
chipLabel: ElementRef;
baseStatesDirective: BaseStatesDirective;
private _elementRef;
ngAfterContentInit(): void;
/**
* Remove chip handler
*
* @param event Click event
*/
onRemove(event?: Event): void;
static ɵfac: i0.ɵɵFactoryDeclaration;
static ɵcmp: i0.ɵɵComponentDeclaration;
static ngAcceptInputType_isChipRemovable: unknown;
static ngAcceptInputType_isFilled: unknown;
}
declare class EuiChip {
id: string | number;
euiInternalId: string;
label: string;
isRemovable: boolean;
isOutline: boolean;
isRounded: boolean;
isDisabled: boolean;
variant: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'danger' | 'accent';
tooltip: EuiChipTooltip;
iconClass?: string;
iconSvgName?: string;
constructor(values?: {});
}
declare class EuiChipTooltip {
tooltipMessage: string;
position?: 'above' | 'below' | 'left' | 'right' | 'before' | 'after';
contentAlignment?: 'center' | 'left' | 'right' | 'justify';
delay?: number;
constructor(values?: {});
}
declare const EUI_CHIP: readonly [typeof EuiChipComponent];
export { EUI_CHIP, EuiChip, EuiChipComponent, EuiChipTooltip };
//# sourceMappingURL=eui-components-eui-chip.d.ts.map