File

packages/eui/packages/components/eui-chip/eui-chip.component.ts

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.

Implements

AfterContentInit

Metadata

Index

Properties
Methods
Inputs
Outputs
HostBindings
Accessors

Inputs

ariaLabel
Type : string
Default value : 'Chip content'

Sets the aria-label attribute for the host element.

data
Type : any
Default value : { id: crypto.randomUUID(), tooltip: { color: 'euiTooltipPrimary', contentAlignment: null, position: 'above', }, }

Sets the data of the chip like tooltip configuration.

e2eAttr
Type : string
Default value : 'eui-chip'

Sets the data-e2e attribute for the host element.

euiInternalId
Type : string
Default value : null

Sets the euiInternalId of the chip.

id
Type : string | number

Sets the id of the chip.

isChipRemovable
Type : boolean
Default value : false

Wether the chip can be removed.

isFilled
Type : boolean
Default value : false

Wether the chip is filled with color.

isSquared
Type : boolean
Default value : false
tooltipMessage
Type : string

Sets the label of the tooltip to diaply on hover.

Outputs

remove
Type : EventEmitter

Event emitted when the chip is removed.

HostBindings

attr.role
Type : string
Default value : 'status'

Sets the role attribute for the host element.

class
Type : string

Methods

Public onRemove
onRemove(event?: Event)

Remove chip handler

Parameters :
Name Type Optional Description
event Event Yes

Click event

Returns : void

Properties

baseStatesDirective
Default value : inject(BaseStatesDirective)
chipLabel
Type : ElementRef<HTMLInputElement>
Decorators :
@ViewChild('chipLabel')
euiIcons
Type : QueryList<EuiIconSvgComponent>
Decorators :
@ContentChildren(undefined)

Icon declares by user in the chip

role
Type : string
Default value : 'status'
Decorators :
@HostBinding('attr.role')

Sets the role attribute for the host element.

Accessors

cssClasses
getcssClasses()

Computes and returns the CSS classes for the component based on its current state.

Returns : string

results matching ""

    No results matching ""