Badge
The Badge component generates a small label that is attached to its child element.
useBadge API
Import
import { useBadge } from '@mui/base/useBadge';
// or
import { useBadge } from '@mui/base';Learn about the difference by reading this guide on minimizing bundle size.
| Name | Type | Default | Description |
|---|---|---|---|
| badgeContent | React.ReactNode | - | The content rendered within the badge. |
| invisible | boolean | false | If |
| max | number | 99 | Max count to show. |
| showZero | boolean | false | Controls whether the badge is hidden when |
| Name | Type | Description |
|---|---|---|
| badgeContent | React.ReactNode | Defines the content that's displayed inside the badge. |
| displayValue | React.ReactNode | Value to be displayed in the badge. If |
| invisible | boolean | If |
| max | number | Maximum number to be displayed in the badge. |