Beta badge
The EuiBetaBadge was created specifically to call out modules that are not in GA. Generally the labels used are "Beta" or "Lab". They require an extra
tooltipContent to describe the purpose of the badge. You can pass an optional title prop to populate the tooltip title or html title attribute but by default it will use the label.
If you pass in an iconType, only the icon will be used in the badge itself and the label will be applied as the title. Only use an icon when attaching the beta badge to small components. Beta badges can also be made clickable by passing href or onClick as needed.
They can also be used in conjunction with
EuiCards and EuiKeyPadMenuItems.Props
EuiBetaBadge
Prop | Description and type | Default value |
|---|---|---|
Prop label# | Description and type One word label like "Beta" or "Lab" string | number | boolean | ReactElement | Iterable<ReactNode> | ReactPortal | (ReactElement<...> & string) | (Iterable<...> & string) | (ReactPortal & string) | Default value Required |
Prop className# | Description and type Type: string | Default value |
Prop aria-label# | Description and type Defines a string value that labels the current element. 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 target# | Description and type Type: string | Default value |
Prop title# | Description and type Optional title will be supplied as tooltip title or title attribute string | Default value |
Prop href# | Description and type Type: string | Default value |
Prop onClick# | Description and type Will apply an onclick to the badge itself MouseEventHandler<HTMLButtonElement> | Default value |
Prop onClickAriaLabel# | Description and type Aria label applied to the onClick button string | Default value |
Prop iconType# | Description and type Supply an icon type if the badge should just be an icon IconType | Default value |
Prop tooltipContent# | Description and type Content for the tooltip ReactNode | Default value |
Prop tooltipPosition# | Description and type Custom position of the tooltip ToolTipPositions | Default value top |
Prop anchorProps# | Description and type Passes onto the span wrapping the badge CommonProps & HTMLAttributes<HTMLSpanElement> | Default value |
Prop color# | Description and type Accepts accent, subdued, hollow and warning. "accent" | "warning" | "subdued" | "hollow" | Default value hollow |
Prop size# | Description and type Type: "s" | "m" | Default value m |
Prop alignment# | Description and type Sets the "baseline" | "middle" | Default value baseline |