import * as React from 'react'; import { SxProps } from '@mui/system'; import { OverridableStringUnion, Simplify } from '@mui/types'; import { CreateSlotsAndSlotProps, SlotProps } from "../utils/types.js"; import { Theme } from "../styles/index.js"; import { OverridableComponent, OverrideProps } from "../OverridableComponent/index.js"; import { BadgeClasses } from "./badgeClasses.js"; export interface BadgePropsVariantOverrides {} export interface BadgePropsColorOverrides {} export interface BadgeRootSlotPropsOverrides {} export interface BadgeBadgeSlotPropsOverrides {} export interface BadgeSlots { /** * The component that renders the root. * @default span */ root: React.ElementType; /** * The component that renders the badge. * @default span */ badge: React.ElementType; } export type BadgeSlotsAndSlotProps = CreateSlotsAndSlotProps; /** * Props forwarded to the label slot. * By default, the available props are based on the span element. */ badge: SlotProps<'span', BadgeBadgeSlotPropsOverrides, BadgeOwnerState>; }>; export type BadgeOwnerState = Simplify & { badgeContent: React.ReactNode; invisible: boolean; max: number; displayValue: React.ReactNode; showZero: boolean; anchorOrigin: BadgeOrigin; color: OverridableStringUnion<'primary' | 'secondary' | 'default' | 'error' | 'info' | 'success' | 'warning', BadgePropsColorOverrides>; overlap: 'rectangular' | 'circular'; variant: OverridableStringUnion<'standard' | 'dot', BadgePropsVariantOverrides>; }>; export interface BadgeOrigin { vertical?: 'top' | 'bottom' | undefined; horizontal?: 'left' | 'right' | undefined; } export interface BadgeOwnProps extends BadgeSlotsAndSlotProps { /** * The anchor of the badge. * @default { * vertical: 'top', * horizontal: 'right', * } */ anchorOrigin?: BadgeOrigin | undefined; /** * The content rendered within the badge. */ badgeContent?: React.ReactNode; /** * The badge will be added relative to this node. */ children?: React.ReactNode; /** * Override or extend the styles applied to the component. */ classes?: Partial | undefined; /** * @ignore */ className?: string | undefined; /** * The color of the component. * It supports both default and custom theme colors, which can be added as shown in the * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors). * @default 'default' */ color?: OverridableStringUnion<'primary' | 'secondary' | 'default' | 'error' | 'info' | 'success' | 'warning', BadgePropsColorOverrides> | undefined; /** * If `true`, the badge is invisible. * @default false */ invisible?: boolean | undefined; /** * Max count to show. * @default 99 */ max?: number | undefined; /** * Wrapped shape the badge should overlap. * @default 'rectangular' */ overlap?: 'rectangular' | 'circular' | undefined; /** * Controls whether the badge is hidden when `badgeContent` is zero. * @default false */ showZero?: boolean | undefined; /** * The system prop that allows defining system overrides as well as additional CSS styles. */ sx?: SxProps | undefined; /** * The variant to use. * @default 'standard' */ variant?: OverridableStringUnion<'standard' | 'dot', BadgePropsVariantOverrides> | undefined; } export interface BadgeTypeMap { props: AdditionalProps & BadgeOwnProps; defaultComponent: RootComponent; } type BadgeRootProps = NonNullable['root']; type BadgeBadgeProps = NonNullable['badge']; export declare const BadgeRoot: React.FC; export declare const BadgeMark: React.FC; /** * * Demos: * * - [Avatar](https://mui.com/material-ui/react-avatar/) * - [Badge](https://mui.com/material-ui/react-badge/) * * API: * * - [Badge API](https://mui.com/material-ui/api/badge/) */ declare const Badge: OverridableComponent; export type BadgeProps = OverrideProps, RootComponent> & { component?: React.ElementType | undefined; }; export default Badge;