Empty button

Use EuiButtonEmpty when you want to reduce the importance of the button (i.e. tertiary or low prominence actions), but still want to align it to the rest of the buttons.

It is also the only button component that supports down to size

xs.

Loading...

Flush empty button

When aligning EuiButtonEmpty components to the left or the right, you should make sure they’re flush with the edge of their container, so that they’re horizontally aligned with the other content in the container.

Loading...

Props

EuiButtonEmpty

Extends AnchorHTMLAttributes, ButtonHTMLAttributes

𐘂𐘂

✄𐘗✄𐘗

Prop ↦	Description and type ↦	Default value ↵
Prop color# ↦	Description and type Any of the named color palette options. Type: "primary" | "text" | "accent" | "accentSecondary" | "success" | "warning" | "danger" ↦	Default value primary ↵
Prop size# ↦	Description and type Type: "xs" | "s" | "m" ↦	Default value m ↵
Prop flush# ↦	Description and type Ensure the text of the button sits flush to the left, right, or both sides of its container Type: "left" | "right" | "both" ↦	Default value ↵
Prop isDisabled# ↦	Description and type disabled is also allowed Type: boolean ↦	Default value ↵
Prop isLoading# ↦	Description and type Force disables the button and changes the icon to a loading spinner Type: boolean ↦	Default value ↵
Prop isSelected# ↦	Description and type Applies the boolean state as the aria-pressed property to create a toggle button. Only use when the readable text does not change between states. Type: boolean ↦	Default value ↵
Prop href# ↦	Description and type Type: string ↦	Default value ↵
Prop target# ↦	Description and type Type: string ↦	Default value ↵
Prop rel# ↦	Description and type Type: string ↦	Default value ↵
Prop type# ↦	Description and type Type: "button" | "reset" | "submit" ↦	Default value button ↵
Prop buttonRef# ↦	Description and type Type: Ref<HTMLAnchorElement | HTMLButtonElement> ↦	Default value ↵
Prop contentProps# ↦	Description and type Object of props passed to the <span> wrapping the button's content Type: CommonProps & EuiButtonDisplayContentType ↦	Default value ↵
Prop iconType# ↦	Description and type Any type accepted by EuiIcon Type: IconType ↦	Default value ↵
Prop iconSide# ↦	Description and type Can only be one side left or right Type: ButtonContentIconSide ↦	Default value left ↵
Prop textProps# ↦	Description and type Object of props passed to the <span> wrapping the content's text/children only (not icon) This span wrapper can be removed by passing textProps={false}. Type: false | (HTMLAttributes<HTMLSpanElement> & CommonProps & { ref?: Ref<HTMLSpanElement>; 'data-text'?: string; }) ↦	Default value ↵
Prop iconSize# ↦	Description and type Type: "s" | "m" ↦	Default value m ↵
Prop className# ↦	Description and type Type: string ↦	Default value ↵
Prop aria-label# ↦	Description and type Defines a string value that labels the current element. @see aria-labelledby. Type: string ↦	Default value ↵
Prop data-test-subj# ↦	Description and type Type: string ↦	Default value ↵
Prop css# ↦	Description and type Type: Interpolation<Theme> ↦	Default value ↵
Prop onClick# ↦	Description and type Type: MouseEventHandler<HTMLAnchorElement> | MouseEventHandler<HTMLButtonElement> ↦	Default value ↵

𐘂𐘂