@mui/material 7.0.0-beta.0 → 7.0.0-beta.2

package/modern/Autocomplete/Autocomplete.d.ts

@@ -0,0 +1,290 @@
+import * as React from 'react';
+import { SxProps } from '@mui/system';
+import { OverridableStringUnion } from '@mui/types';
+import { IconButtonProps, InternalStandardProps as StandardProps, Theme } from '@mui/material';
+import { ChipProps, ChipTypeMap } from '@mui/material/Chip';
+import { PaperProps } from '@mui/material/Paper';
+import { PopperProps } from '@mui/material/Popper';
+import useAutocomplete, { AutocompleteChangeDetails, AutocompleteChangeReason, AutocompleteCloseReason, AutocompleteInputChangeReason, AutocompleteValue, createFilterOptions, UseAutocompleteProps, AutocompleteFreeSoloValueMapping } from "../useAutocomplete/index.js";
+import { AutocompleteClasses } from "./autocompleteClasses.js";
+import { CreateSlotsAndSlotProps, SlotProps } from "../utils/types.js";
+export interface AutocompletePaperSlotPropsOverrides {}
+export interface AutocompletePopperSlotPropsOverrides {}
+export { AutocompleteChangeDetails, AutocompleteChangeReason, AutocompleteCloseReason, AutocompleteInputChangeReason, AutocompleteValue, createFilterOptions };
+export type AutocompleteOwnerState<Value, Multiple extends boolean | undefined, DisableClearable extends boolean | undefined, FreeSolo extends boolean | undefined, ChipComponent extends React.ElementType = ChipTypeMap['defaultComponent']> = AutocompleteProps<Value, Multiple, DisableClearable, FreeSolo, ChipComponent> & {
+  disablePortal: boolean;
+  expanded: boolean;
+  focused: boolean;
+  fullWidth: boolean;
+  getOptionLabel: (option: Value | AutocompleteFreeSoloValueMapping<FreeSolo>) => string;
+  hasClearIcon: boolean;
+  hasPopupIcon: boolean;
+  inputFocused: boolean;
+  popupOpen: boolean;
+  size: OverridableStringUnion<'small' | 'medium', AutocompletePropsSizeOverrides>;
+};
+export type AutocompleteRenderGetTagProps = ({
+  index
+}: {
+  index: number;
+}) => {
+  key: number;
+  className: string;
+  disabled: boolean;
+  'data-tag-index': number;
+  tabIndex: -1;
+  onDelete: (event: any) => void;
+};
+export interface AutocompleteRenderOptionState {
+  inputValue: string;
+  index: number;
+  selected: boolean;
+}
+export interface AutocompleteRenderGroupParams {
+  key: number;
+  group: string;
+  children?: React.ReactNode;
+}
+export interface AutocompleteRenderInputParams {
+  id: string;
+  disabled: boolean;
+  fullWidth: boolean;
+  size: 'small' | undefined;
+  InputLabelProps: ReturnType<ReturnType<typeof useAutocomplete>['getInputLabelProps']>;
+  InputProps: {
+    ref: React.Ref<any>;
+    className: string;
+    startAdornment: React.ReactNode;
+    endAdornment: React.ReactNode;
+    onMouseDown: React.MouseEventHandler;
+  };
+  inputProps: ReturnType<ReturnType<typeof useAutocomplete>['getInputProps']>;
+}
+export interface AutocompletePropsSizeOverrides {}
+export interface AutocompleteSlots {
+  /**
+   * The component used to render the listbox.
+   * @default 'ul'
+   */
+  listbox: React.JSXElementConstructor<React.HTMLAttributes<HTMLElement>>;
+  /**
+   * The component used to render the body of the popup.
+   * @default Paper
+   */
+  paper: React.JSXElementConstructor<PaperProps & AutocompletePaperSlotPropsOverrides>;
+  /**
+   * The component used to position the popup.
+   * @default Popper
+   */
+  popper: React.JSXElementConstructor<PopperProps & AutocompletePopperSlotPropsOverrides>;
+}
+export type AutocompleteSlotsAndSlotProps<Value, Multiple extends boolean | undefined, DisableClearable extends boolean | undefined, FreeSolo extends boolean | undefined, ChipComponent extends React.ElementType = ChipTypeMap['defaultComponent']> = CreateSlotsAndSlotProps<AutocompleteSlots, {
+  chip: SlotProps<React.ElementType<Partial<ChipProps<ChipComponent>>>, {}, AutocompleteOwnerState<Value, Multiple, DisableClearable, FreeSolo, ChipComponent>>;
+  clearIndicator: SlotProps<React.ElementType<Partial<IconButtonProps>>, {}, AutocompleteOwnerState<Value, Multiple, DisableClearable, FreeSolo, ChipComponent>>;
+  /**
+   * Props applied to the Listbox element.
+   */
+  listbox: SlotProps<React.ElementType<ReturnType<ReturnType<typeof useAutocomplete>['getListboxProps']> & {
+    sx?: SxProps<Theme>;
+    ref?: React.Ref<Element>;
+  }>, {}, AutocompleteOwnerState<Value, Multiple, DisableClearable, FreeSolo, ChipComponent>>;
+  paper: SlotProps<React.ElementType<Partial<PaperProps>>, AutocompletePaperSlotPropsOverrides, AutocompleteOwnerState<Value, Multiple, DisableClearable, FreeSolo, ChipComponent>>;
+  popper: SlotProps<React.ElementType<Partial<PopperProps>>, AutocompletePopperSlotPropsOverrides, AutocompleteOwnerState<Value, Multiple, DisableClearable, FreeSolo, ChipComponent>>;
+  popupIndicator: SlotProps<React.ElementType<Partial<IconButtonProps>>, {}, AutocompleteOwnerState<Value, Multiple, DisableClearable, FreeSolo, ChipComponent>>;
+}>;
+export interface AutocompleteProps<Value, Multiple extends boolean | undefined, DisableClearable extends boolean | undefined, FreeSolo extends boolean | undefined, ChipComponent extends React.ElementType = ChipTypeMap['defaultComponent']> extends UseAutocompleteProps<Value, Multiple, DisableClearable, FreeSolo>, StandardProps<React.HTMLAttributes<HTMLDivElement>, 'defaultValue' | 'onChange' | 'children'>, AutocompleteSlotsAndSlotProps<Value, Multiple, DisableClearable, FreeSolo, ChipComponent> {
+  /**
+   * Props applied to the [`Chip`](https://mui.com/material-ui/api/chip/) element.
+   * @deprecated Use `slotProps.chip` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   */
+  ChipProps?: ChipProps<ChipComponent>;
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes?: Partial<AutocompleteClasses>;
+  /**
+   * The icon to display in place of the default clear icon.
+   * @default <ClearIcon fontSize="small" />
+   */
+  clearIcon?: React.ReactNode;
+  /**
+   * Override the default text for the *clear* icon button.
+   *
+   * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/).
+   * @default 'Clear'
+   */
+  clearText?: string;
+  /**
+   * Override the default text for the *close popup* icon button.
+   *
+   * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/).
+   * @default 'Close'
+   */
+  closeText?: string;
+  /**
+   * The props used for each slot inside.
+   * @deprecated Use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   */
+  componentsProps?: {
+    clearIndicator?: Partial<IconButtonProps>;
+    paper?: PaperProps;
+    popper?: Partial<PopperProps>;
+    popupIndicator?: Partial<IconButtonProps>;
+  };
+  /**
+   * If `true`, the component is disabled.
+   * @default false
+   */
+  disabled?: boolean;
+  /**
+   * If `true`, the `Popper` content will be under the DOM hierarchy of the parent component.
+   * @default false
+   */
+  disablePortal?: boolean;
+  /**
+   * Force the visibility display of the popup icon.
+   * @default 'auto'
+   */
+  forcePopupIcon?: true | false | 'auto';
+  /**
+   * If `true`, the input will take up the full width of its container.
+   * @default false
+   */
+  fullWidth?: boolean;
+  /**
+   * The label to display when the tags are truncated (`limitTags`).
+   *
+   * @param {number} more The number of truncated tags.
+   * @returns {ReactNode}
+   * @default (more) => `+${more}`
+   */
+  getLimitTagsText?: (more: number) => React.ReactNode;
+  /**
+   * The component used to render the listbox.
+   * @default 'ul'
+   * @deprecated Use `slotProps.listbox.component` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   */
+  ListboxComponent?: React.JSXElementConstructor<React.HTMLAttributes<HTMLElement>>;
+  /**
+   * Props applied to the Listbox element.
+   * @deprecated Use `slotProps.listbox` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   */
+  ListboxProps?: ReturnType<ReturnType<typeof useAutocomplete>['getListboxProps']> & {
+    sx?: SxProps<Theme>;
+    ref?: React.Ref<Element>;
+  };
+  /**
+   * If `true`, the component is in a loading state.
+   * This shows the `loadingText` in place of suggestions (only if there are no suggestions to show, for example `options` are empty).
+   * @default false
+   */
+  loading?: boolean;
+  /**
+   * Text to display when in a loading state.
+   *
+   * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/).
+   * @default 'Loading…'
+   */
+  loadingText?: React.ReactNode;
+  /**
+   * The maximum number of tags that will be visible when not focused.
+   * Set `-1` to disable the limit.
+   * @default -1
+   */
+  limitTags?: number;
+  /**
+   * Text to display when there are no options.
+   *
+   * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/).
+   * @default 'No options'
+   */
+  noOptionsText?: React.ReactNode;
+  onKeyDown?: (event: React.KeyboardEvent<HTMLDivElement> & {
+    defaultMuiPrevented?: boolean;
+  }) => void;
+  /**
+   * Override the default text for the *open popup* icon button.
+   *
+   * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/).
+   * @default 'Open'
+   */
+  openText?: string;
+  /**
+   * The component used to render the body of the popup.
+   * @default Paper
+   * @deprecated Use `slots.paper` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   */
+  PaperComponent?: React.JSXElementConstructor<React.HTMLAttributes<HTMLElement>>;
+  /**
+   * The component used to position the popup.
+   * @default Popper
+   * @deprecated Use `slots.popper` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   */
+  PopperComponent?: React.JSXElementConstructor<PopperProps>;
+  /**
+   * The icon to display in place of the default popup icon.
+   * @default <ArrowDropDownIcon />
+   */
+  popupIcon?: React.ReactNode;
+  /**
+   * If `true`, the component becomes readonly. It is also supported for multiple tags where the tag cannot be deleted.
+   * @default false
+   */
+  readOnly?: boolean;
+  /**
+   * Render the group.
+   *
+   * @param {AutocompleteRenderGroupParams} params The group to render.
+   * @returns {ReactNode}
+   */
+  renderGroup?: (params: AutocompleteRenderGroupParams) => React.ReactNode;
+  /**
+   * Render the input.
+   *
+   * @param {object} params
+   * @returns {ReactNode}
+   */
+  renderInput: (params: AutocompleteRenderInputParams) => React.ReactNode;
+  /**
+   * Render the option, use `getOptionLabel` by default.
+   *
+   * @param {object} props The props to apply on the li element.
+   * @param {Value} option The option to render.
+   * @param {object} state The state of each option.
+   * @param {object} ownerState The state of the Autocomplete component.
+   * @returns {ReactNode}
+   */
+  renderOption?: (props: React.HTMLAttributes<HTMLLIElement> & {
+    key: any;
+  }, option: Value, state: AutocompleteRenderOptionState, ownerState: AutocompleteOwnerState<Value, Multiple, DisableClearable, FreeSolo, ChipComponent>) => React.ReactNode;
+  /**
+   * Render the selected value.
+   *
+   * @param {Value[]} value The `value` provided to the component.
+   * @param {function} getTagProps A tag props getter.
+   * @param {object} ownerState The state of the Autocomplete component.
+   * @returns {ReactNode}
+   */
+  renderTags?: (value: Value[], getTagProps: AutocompleteRenderGetTagProps, ownerState: AutocompleteOwnerState<Value, Multiple, DisableClearable, FreeSolo, ChipComponent>) => React.ReactNode;
+  /**
+   * The size of the component.
+   * @default 'medium'
+   */
+  size?: OverridableStringUnion<'small' | 'medium', AutocompletePropsSizeOverrides>;
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx?: SxProps<Theme>;
+}
+
+/**
+ *
+ * Demos:
+ *
+ * - [Autocomplete](https://next.mui.com/material-ui/react-autocomplete/)
+ *
+ * API:
+ *
+ * - [Autocomplete API](https://next.mui.com/material-ui/api/autocomplete/)
+ */
+export default function Autocomplete<Value, Multiple extends boolean | undefined = false, DisableClearable extends boolean | undefined = false, FreeSolo extends boolean | undefined = false, ChipComponent extends React.ElementType = ChipTypeMap['defaultComponent']>(props: AutocompleteProps<Value, Multiple, DisableClearable, FreeSolo, ChipComponent>): React.JSX.Element;

package/modern/Autocomplete/autocompleteClasses.d.ts

@@ -0,0 +1,58 @@
+export interface AutocompleteClasses {
+  /** Styles applied to the root element. */
+  root: string;
+  /** Styles applied to the root element if `fullWidth={true}`. */
+  fullWidth: string;
+  /** State class applied to the root element if the listbox is displayed. */
+  expanded: string;
+  /** State class applied to the root element if focused. */
+  focused: string;
+  /** Styles applied to the option elements if they are keyboard focused. */
+  focusVisible: string;
+  /** Styles applied to the tag elements, for example the chips. */
+  tag: string;
+  /** Styles applied to the tag elements, for example the chips if `size="small"`. */
+  tagSizeSmall: string;
+  /** Styles applied to the tag elements, for example the chips if `size="medium"`. */
+  tagSizeMedium: string;
+  /** Styles applied when the popup icon is rendered. */
+  hasPopupIcon: string;
+  /** Styles applied when the clear icon is rendered. */
+  hasClearIcon: string;
+  /** Styles applied to the Input element. */
+  inputRoot: string;
+  /** Styles applied to the input element. */
+  input: string;
+  /** Styles applied to the input element if the input is focused. */
+  inputFocused: string;
+  /** Styles applied to the endAdornment element. */
+  endAdornment: string;
+  /** Styles applied to the clear indicator. */
+  clearIndicator: string;
+  /** Styles applied to the popup indicator. */
+  popupIndicator: string;
+  /** Styles applied to the popup indicator if the popup is open. */
+  popupIndicatorOpen: string;
+  /** Styles applied to the popper element. */
+  popper: string;
+  /** Styles applied to the popper element if `disablePortal={true}`. */
+  popperDisablePortal: string;
+  /** Styles applied to the Paper component. */
+  paper: string;
+  /** Styles applied to the listbox component. */
+  listbox: string;
+  /** Styles applied to the loading wrapper. */
+  loading: string;
+  /** Styles applied to the no option wrapper. */
+  noOptions: string;
+  /** Styles applied to the option elements. */
+  option: string;
+  /** Styles applied to the group's label elements. */
+  groupLabel: string;
+  /** Styles applied to the group's ul elements. */
+  groupUl: string;
+}
+export type AutocompleteClassKey = keyof AutocompleteClasses;
+export declare function getAutocompleteUtilityClass(slot: string): string;
+declare const autocompleteClasses: AutocompleteClasses;
+export default autocompleteClasses;

package/modern/Autocomplete/index.d.ts

@@ -0,0 +1,4 @@
+export { default } from "./Autocomplete.js";
+export * from "./Autocomplete.js";
+export { default as autocompleteClasses } from "./autocompleteClasses.js";
+export * from "./autocompleteClasses.js";

package/modern/Avatar/Avatar.d.ts

@@ -0,0 +1,85 @@
+import * as React from 'react';
+import { SxProps } from '@mui/system';
+import { OverridableStringUnion } from '@mui/types';
+import { Theme } from "../styles/index.js";
+import { OverridableComponent, OverrideProps } from "../OverridableComponent/index.js";
+import { AvatarClasses } from "./avatarClasses.js";
+import { CreateSlotsAndSlotProps, SlotProps } from "../utils/types.js";
+export interface AvatarSlots {
+  /**
+   * The component that renders the transition.
+   * [Follow this guide](https://mui.com/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component.
+   * @default Collapse
+   */
+  img: React.JSXElementConstructor<React.ImgHTMLAttributes<HTMLImageElement>>;
+}
+export interface AvatarPropsVariantOverrides {}
+export type AvatarSlotsAndSlotProps = CreateSlotsAndSlotProps<AvatarSlots, {
+  img: SlotProps<React.ElementType<React.ImgHTMLAttributes<HTMLImageElement>>, {}, AvatarOwnProps>;
+}>;
+export interface AvatarOwnProps {
+  /**
+   * Used in combination with `src` or `srcSet` to
+   * provide an alt attribute for the rendered `img` element.
+   */
+  alt?: string;
+  /**
+   * Used to render icon or text elements inside the Avatar if `src` is not set.
+   * This can be an element, or just a string.
+   */
+  children?: React.ReactNode;
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes?: Partial<AvatarClasses>;
+  /**
+   * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#attributes) applied to the `img` element if the component is used to display an image.
+   * It can be used to listen for the loading error event.
+   * @deprecated Use `slotProps.img` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   */
+  imgProps?: React.ImgHTMLAttributes<HTMLImageElement> & {
+    sx?: SxProps<Theme>;
+  };
+  /**
+   * The `sizes` attribute for the `img` element.
+   */
+  sizes?: string;
+  /**
+   * The `src` attribute for the `img` element.
+   */
+  src?: string;
+  /**
+   * The `srcSet` attribute for the `img` element.
+   * Use this attribute for responsive image display.
+   */
+  srcSet?: string;
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx?: SxProps<Theme>;
+  /**
+   * The shape of the avatar.
+   * @default 'circular'
+   */
+  variant?: OverridableStringUnion<'circular' | 'rounded' | 'square', AvatarPropsVariantOverrides>;
+}
+export interface AvatarTypeMap<AdditionalProps = {}, RootComponent extends React.ElementType = 'div'> {
+  props: AdditionalProps & AvatarOwnProps & AvatarSlotsAndSlotProps;
+  defaultComponent: RootComponent;
+}
+
+/**
+ *
+ * Demos:
+ *
+ * - [Avatar](https://next.mui.com/material-ui/react-avatar/)
+ *
+ * API:
+ *
+ * - [Avatar API](https://next.mui.com/material-ui/api/avatar/)
+ */
+declare const Avatar: OverridableComponent<AvatarTypeMap>;
+export type AvatarProps<RootComponent extends React.ElementType = AvatarTypeMap['defaultComponent'], AdditionalProps = {}> = OverrideProps<AvatarTypeMap<AdditionalProps, RootComponent>, RootComponent> & {
+  component?: React.ElementType;
+};
+export default Avatar;

package/modern/Avatar/avatarClasses.d.ts

@@ -0,0 +1,20 @@
+export interface AvatarClasses {
+  /** Styles applied to the root element. */
+  root: string;
+  /** Styles applied to the root element if not `src` or `srcSet`. */
+  colorDefault: string;
+  /** Styles applied to the root element if `variant="circular"`. */
+  circular: string;
+  /** Styles applied to the root element if `variant="rounded"`. */
+  rounded: string;
+  /** Styles applied to the root element if `variant="square"`. */
+  square: string;
+  /** Styles applied to the img element if either `src` or `srcSet` is defined. */
+  img: string;
+  /** Styles applied to the fallback icon */
+  fallback: string;
+}
+export type AvatarClassKey = keyof AvatarClasses;
+export declare function getAvatarUtilityClass(slot: string): string;
+declare const avatarClasses: AvatarClasses;
+export default avatarClasses;

package/modern/Avatar/index.d.ts

@@ -0,0 +1,4 @@
+export { default } from "./Avatar.js";
+export * from "./Avatar.js";
+export { default as avatarClasses } from "./avatarClasses.js";
+export * from "./avatarClasses.js";

package/modern/AvatarGroup/AvatarGroup.d.ts

@@ -0,0 +1,96 @@
+import * as React from 'react';
+import { OverridableComponent, OverridableStringUnion, OverrideProps, PartiallyRequired } from '@mui/types';
+import { SxProps } from '@mui/system';
+import { Theme } from '@mui/material';
+import { AvatarGroupClasses } from "./avatarGroupClasses.js";
+import Avatar from "../Avatar/index.js";
+import { CreateSlotsAndSlotProps, SlotProps } from "../utils/types.js";
+export interface AvatarGroupPropsVariantOverrides {}
+export interface AvatarGroupComponentsPropsOverrides {}
+export interface AvatarGroupSlots {
+  surplus: React.ElementType;
+}
+export type AvatarGroupSlotsAndSlotProps = CreateSlotsAndSlotProps<AvatarGroupSlots, {
+  /**
+   * @deprecated use `slotProps.surplus` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   *  */
+  additionalAvatar: React.ComponentPropsWithRef<typeof Avatar> & AvatarGroupComponentsPropsOverrides;
+  surplus: SlotProps<React.ElementType<React.ComponentPropsWithRef<typeof Avatar>>, AvatarGroupComponentsPropsOverrides, AvatarGroupOwnerState>;
+}>;
+export interface AvatarGroupOwnProps extends AvatarGroupSlotsAndSlotProps {
+  /**
+   * The avatars to stack.
+   */
+  children?: React.ReactNode;
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes?: Partial<AvatarGroupClasses>;
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component?: React.ElementType;
+  /**
+   * The extra props for the slot components.
+   * You can override the existing props or add new ones.
+   *
+   * This prop is an alias for the `slotProps` prop.
+   *
+   * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   */
+  componentsProps?: {
+    additionalAvatar?: React.ComponentPropsWithRef<typeof Avatar> & AvatarGroupComponentsPropsOverrides;
+  };
+  /**
+   * Max avatars to show before +x.
+   * @default 5
+   */
+  max?: number;
+  /**
+   * custom renderer of extraAvatars
+   * @param {number} surplus number of extra avatars
+   * @returns {React.ReactNode} custom element to display
+   */
+  renderSurplus?: (surplus: number) => React.ReactNode;
+  /**
+   * Spacing between avatars.
+   * @default 'medium'
+   */
+  spacing?: 'small' | 'medium' | number;
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx?: SxProps<Theme>;
+  /**
+   * The total number of avatars. Used for calculating the number of extra avatars.
+   * @default children.length
+   */
+  total?: number;
+  /**
+   * The variant to use.
+   * @default 'circular'
+   */
+  variant?: OverridableStringUnion<'circular' | 'rounded' | 'square', AvatarGroupPropsVariantOverrides>;
+}
+export interface AvatarGroupTypeMap<AdditionalProps = {}, RootComponent extends React.ElementType = 'div'> {
+  props: AdditionalProps & AvatarGroupOwnProps;
+  defaultComponent: RootComponent;
+}
+
+/**
+ *
+ * Demos:
+ *
+ * - [Avatar](https://next.mui.com/material-ui/react-avatar/)
+ *
+ * API:
+ *
+ * - [AvatarGroup API](https://next.mui.com/material-ui/api/avatar-group/)
+ */
+declare const AvatarGroup: OverridableComponent<AvatarGroupTypeMap>;
+export type AvatarGroupProps<RootComponent extends React.ElementType = AvatarGroupTypeMap['defaultComponent'], AdditionalProps = {}> = OverrideProps<AvatarGroupTypeMap<AdditionalProps, RootComponent>, RootComponent> & {
+  component?: React.ElementType;
+};
+export interface AvatarGroupOwnerState extends PartiallyRequired<AvatarGroupProps, 'max' | 'spacing' | 'component' | 'variant'> {}
+export default AvatarGroup;

package/modern/AvatarGroup/avatarGroupClasses.d.ts

@@ -0,0 +1,10 @@
+export interface AvatarGroupClasses {
+  /** Styles applied to the root element. */
+  root: string;
+  /** Styles applied to the avatar elements. */
+  avatar: string;
+}
+export type AvatarGroupClassKey = keyof AvatarGroupClasses;
+export declare function getAvatarGroupUtilityClass(slot: string): string;
+declare const avatarGroupClasses: AvatarGroupClasses;
+export default avatarGroupClasses;

package/modern/AvatarGroup/index.d.ts

@@ -0,0 +1,4 @@
+export { default } from "./AvatarGroup.js";
+export * from "./AvatarGroup.js";
+export { default as avatarGroupClasses } from "./avatarGroupClasses.js";
+export * from "./avatarGroupClasses.js";