eui documentation
  1. Components
  2. EuiFeedbackMessageComponent

File

packages/components/eui-feedback-message/eui-feedback-message.component.ts

Description

A feedback message component that displays various types of feedback to users. Supports different states (primary, secondary, info, etc.) and can be muted.

Basic feedback message

Example :
<eui-feedback-message euiSuccess>
  Operation completed successfully
</eui-feedback-message>

Muted variant

Example :
<eui-feedback-message euiWarning [isMuted]="true">
  This is a subtle warning message
</eui-feedback-message>

Accessibility

  • Uses semantic color coding with icon indicators for state
  • Text content is readable by screen readers
  • Sufficient color contrast maintained in all states

Notes

  • Use state inputs (euiSuccess, euiWarning, euiDanger, euiInfo) for semantic meaning
  • Muted variant reduces visual prominence while maintaining accessibility
  • Icon indicators are hidden when isMuted is true

Metadata

HostDirectives BaseStatesDirective
 Inputs : euiPrimary euiSecondary euiInfo euiWarning euiSuccess euiDanger euiVariant 
selector eui-feedback-message
imports EUI_ICON_STATE
templateUrl ./eui-feedback-message.component.html
styleUrl ./eui-feedback-message.scss

Index

Inputs
HostBindings
Accessors

Inputs

isMuted
Type : boolean
Default value : false

Controls whether the feedback message should be displayed in a muted state. When true, the message will have reduced visual prominence. The status icon won't show before the message.

HostBindings

attr.type
Type : string
Default value : 'MessageFeedback'

Type attribute bound to the host element. Used to identify the component type in the DOM.
class
Type : string

Computes and returns the CSS classes for the feedback message component. Combines base state classes with muted state if applicable.

Accessors

cssClasses
getcssClasses()

Computes and returns the CSS classes for the feedback message component. Combines base state classes with muted state if applicable.

Returns : string

results matching ""

    No results matching ""