@mui/material 7.3.7 → 7.3.9

package/Typography/Typography.d.ts

@@ -12,7 +12,7 @@ export interface TypographyOwnProps extends Omit<SystemProps<Theme>, 'color'> {
    * Set the text-align on the component.
    * @default 'inherit'
    */
-  align?: 'inherit' | 'left' | 'center' | 'right' | 'justify';
+  align?: 'inherit' | 'left' | 'center' | 'right' | 'justify' | undefined;
   /**
    * The content of the component.
    */
@@ -20,18 +20,18 @@ export interface TypographyOwnProps extends Omit<SystemProps<Theme>, 'color'> {
   /**
    * Override or extend the styles applied to the component.
    */
-  classes?: Partial<TypographyClasses>;
+  classes?: Partial<TypographyClasses> | 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).
    */
-  color?: OverridableStringUnion<'primary' | 'secondary' | 'success' | 'error' | 'info' | 'warning' | `text${Capitalize<keyof TypeText>}`, TypographyPropsColorOverrides> | (string & {}); // to work with v5 color prop type which allows any string
+  color?: OverridableStringUnion<'primary' | 'secondary' | 'success' | 'error' | 'info' | 'warning' | `text${Capitalize<keyof TypeText>}`, TypographyPropsColorOverrides> | (string & {}) | undefined; // to work with v5 color prop type which allows any string
   /**
    * If `true`, the text will have a bottom margin.
    * @default false
    */
-  gutterBottom?: boolean;
+  gutterBottom?: boolean | undefined;
   /**
    * If `true`, the text will not wrap, but instead will truncate with a text overflow ellipsis.
    *
@@ -39,22 +39,22 @@ export interface TypographyOwnProps extends Omit<SystemProps<Theme>, 'color'> {
    * (the element needs to have a width in order to overflow).
    * @default false
    */
-  noWrap?: boolean;
+  noWrap?: boolean | undefined;
   /**
    * If `true`, the element will be a paragraph element.
    * @default false
    * @deprecated Use the `component` prop instead. This prop will be removed in a future major release. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    */
-  paragraph?: boolean;
+  paragraph?: boolean | undefined;
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx?: SxProps<Theme>;
+  sx?: SxProps<Theme> | undefined;
   /**
    * Applies the theme typography styles.
    * @default 'body1'
    */
-  variant?: OverridableStringUnion<TypographyVariant | 'inherit', TypographyPropsVariantOverrides>;
+  variant?: OverridableStringUnion<TypographyVariant | 'inherit', TypographyPropsVariantOverrides> | undefined;
   /**
    * The component maps the variant prop to a range of different HTML element types.
    * For instance, subtitle1 to `<h6>`.
@@ -74,7 +74,7 @@ export interface TypographyOwnProps extends Omit<SystemProps<Theme>, 'color'> {
    *   inherit: 'p',
    * }
    */
-  variantMapping?: Partial<Record<OverridableStringUnion<TypographyVariant | 'inherit', TypographyPropsVariantOverrides>, string>>;
+  variantMapping?: Partial<Record<OverridableStringUnion<TypographyVariant | 'inherit', TypographyPropsVariantOverrides>, string>> | undefined;
 }
 export interface TypographyTypeMap<AdditionalProps = {}, RootComponent extends React.ElementType = 'span'> {
   props: AdditionalProps & TypographyOwnProps;
@@ -94,6 +94,6 @@ export interface TypographyTypeMap<AdditionalProps = {}, RootComponent extends R
  */
 declare const Typography: OverridableComponent<TypographyTypeMap>;
 export type TypographyProps<RootComponent extends React.ElementType = TypographyTypeMap['defaultComponent'], AdditionalProps = {}> = OverrideProps<TypographyTypeMap<AdditionalProps, RootComponent>, RootComponent> & {
-  component?: React.ElementType;
+  component?: React.ElementType | undefined;
 };
 export default Typography;

package/Unstable_TrapFocus/FocusTrap.types.d.ts

@@ -9,7 +9,7 @@ export interface FocusTrapProps {
    * For instance, you can provide the "tabbable" npm dependency.
    * @param {HTMLElement} root
    */
-  getTabbable?: (root: HTMLElement) => ReadonlyArray<HTMLElement>;
+  getTabbable?: ((root: HTMLElement) => ReadonlyArray<HTMLElement>) | undefined;
   /**
    * This prop extends the `open` prop.
    * It allows to toggle the open state without having to wait for a rerender when changing the `open` prop.
@@ -19,13 +19,13 @@ export interface FocusTrapProps {
    *   return true;
    * }
    */
-  isEnabled?: () => boolean;
+  isEnabled?: (() => boolean) | undefined;
   /**
    * A single child content element.
    */
   children: React.ReactElement<{
-    onFocus?: React.FocusEventHandler;
-    ref?: React.RefCallback<any> | null;
+    onFocus?: React.FocusEventHandler | undefined;
+    ref?: React.RefCallback<any> | null | undefined;
   }>;
   /**
    * If `true`, the focus trap will not automatically shift focus to itself when it opens, and
@@ -36,7 +36,7 @@ export interface FocusTrapProps {
    * accessible to assistive technologies, like screen readers.
    * @default false
    */
-  disableAutoFocus?: boolean;
+  disableAutoFocus?: boolean | undefined;
   /**
    * If `true`, the focus trap will not prevent focus from leaving the focus trap while open.
    *
@@ -44,11 +44,11 @@ export interface FocusTrapProps {
    * accessible to assistive technologies, like screen readers.
    * @default false
    */
-  disableEnforceFocus?: boolean;
+  disableEnforceFocus?: boolean | undefined;
   /**
    * If `true`, the focus trap will not restore focus to previously focused element once
    * focus trap is hidden or unmounted.
    * @default false
    */
-  disableRestoreFocus?: boolean;
+  disableRestoreFocus?: boolean | undefined;
 }

package/Zoom/Zoom.d.ts

@@ -6,7 +6,7 @@ export interface ZoomProps extends TransitionProps {
    * Set this to `false` to disable this behavior.
    * @default true
    */
-  appear?: boolean;
+  appear?: boolean | undefined;
   /**
    * A single child content element.
    */
@@ -15,12 +15,12 @@ export interface ZoomProps extends TransitionProps {
    * The transition timing function.
    * You may specify a single easing or a object containing enter and exit values.
    */
-  easing?: TransitionProps['easing'];
+  easing?: TransitionProps['easing'] | undefined;
   /**
    * If `true`, the component will transition in.
    */
-  in?: boolean;
-  ref?: React.Ref<unknown>;
+  in?: boolean | undefined;
+  ref?: React.Ref<unknown> | undefined;
   /**
    * The duration for the transition, in milliseconds.
    * You may specify a single timeout for all transitions, or individually with an object.
@@ -29,7 +29,7 @@ export interface ZoomProps extends TransitionProps {
    *   exit: theme.transitions.duration.leavingScreen,
    * }
    */
-  timeout?: TransitionProps['timeout'];
+  timeout?: TransitionProps['timeout'] | undefined;
 }
 
 /**

package/esm/Accordion/Accordion.d.ts

@@ -63,52 +63,52 @@ export interface AccordionOwnProps {
   /**
    * Override or extend the styles applied to the component.
    */
-  classes?: Partial<AccordionClasses>;
+  classes?: Partial<AccordionClasses> | undefined;
   /**
    * If `true`, expands the accordion by default.
    * @default false
    */
-  defaultExpanded?: boolean;
+  defaultExpanded?: boolean | undefined;
   /**
    * If `true`, the component is disabled.
    * @default false
    */
-  disabled?: boolean;
+  disabled?: boolean | undefined;
   /**
    * If `true`, it removes the margin between two expanded accordion items and prevents the increased height when expanded.
    * @default false
    */
-  disableGutters?: boolean;
+  disableGutters?: boolean | undefined;
   /**
    * If `true`, expands the accordion, otherwise collapses it.
    * Setting this prop enables control over the accordion.
    */
-  expanded?: boolean;
+  expanded?: boolean | undefined;
   /**
    * Callback fired when the expand/collapse state is changed.
    *
    * @param {React.SyntheticEvent} event The event source of the callback. **Warning**: This is a generic event not a change event.
    * @param {boolean} expanded The `expanded` state of the accordion.
    */
-  onChange?: (event: React.SyntheticEvent, expanded: boolean) => void;
+  onChange?: ((event: React.SyntheticEvent, expanded: boolean) => void) | undefined;
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx?: SxProps<Theme>;
+  sx?: SxProps<Theme> | undefined;
   /**
    * The component used for the transition.
    * [Follow this guide](https://mui.com/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component.
    * @deprecated Use `slots.transition` instead. This prop will be removed in a future major release. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    */
   TransitionComponent?: React.JSXElementConstructor<TransitionProps & {
-    children?: React.ReactElement<unknown, any>;
-  }>;
+    children?: React.ReactElement<unknown, any> | undefined;
+  }> | undefined;
   /**
    * Props applied to the transition element.
    * By default, the element is based on this [`Transition`](https://reactcommunity.org/react-transition-group/transition/) component.
    * @deprecated Use `slotProps.transition` instead. This prop will be removed in a future major release. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    */
-  TransitionProps?: TransitionProps;
+  TransitionProps?: TransitionProps | undefined;
 }
 export type AccordionTypeMap<AdditionalProps = {}, RootComponent extends React.ElementType = 'div'> = ExtendPaperTypeMap<{
   props: AdditionalProps & AccordionOwnProps & AccordionSlotsAndSlotProps;
@@ -128,7 +128,7 @@ export type AccordionTypeMap<AdditionalProps = {}, RootComponent extends React.E
  */
 declare const Accordion: OverridableComponent<AccordionTypeMap>;
 export type AccordionProps<RootComponent extends React.ElementType = AccordionTypeMap['defaultComponent'], AdditionalProps = {}> = OverrideProps<AccordionTypeMap<AdditionalProps, RootComponent>, RootComponent> & {
-  component?: React.ElementType;
+  component?: React.ElementType | undefined;
 };
 export interface AccordionOwnerState extends AccordionProps {}
 export default Accordion;

package/esm/AccordionActions/AccordionActions.d.ts

@@ -11,16 +11,16 @@ export interface AccordionActionsProps extends StandardProps<React.HTMLAttribute
   /**
    * Override or extend the styles applied to the component.
    */
-  classes?: Partial<AccordionActionsClasses>;
+  classes?: Partial<AccordionActionsClasses> | undefined;
   /**
    * If `true`, the actions do not have additional margin.
    * @default false
    */
-  disableSpacing?: boolean;
+  disableSpacing?: boolean | undefined;
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx?: SxProps<Theme>;
+  sx?: SxProps<Theme> | undefined;
 }
 
 /**

package/esm/AccordionDetails/AccordionDetails.d.ts

@@ -11,11 +11,11 @@ export interface AccordionDetailsProps extends StandardProps<React.HTMLAttribute
   /**
    * Override or extend the styles applied to the component.
    */
-  classes?: Partial<AccordionDetailsClasses>;
+  classes?: Partial<AccordionDetailsClasses> | undefined;
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx?: SxProps<Theme>;
+  sx?: SxProps<Theme> | undefined;
 }
 
 /**

package/esm/AccordionSummary/AccordionSummary.d.ts

@@ -47,7 +47,7 @@ export interface AccordionSummaryOwnProps extends AccordionSummarySlotsAndSlotPr
   /**
    * Override or extend the styles applied to the component.
    */
-  classes?: Partial<AccordionSummaryClasses>;
+  classes?: Partial<AccordionSummaryClasses> | undefined;
   /**
    * The icon to display as the expand indicator.
    */
@@ -55,7 +55,7 @@ export interface AccordionSummaryOwnProps extends AccordionSummarySlotsAndSlotPr
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx?: SxProps<Theme>;
+  sx?: SxProps<Theme> | undefined;
 }
 export type AccordionSummaryTypeMap<AdditionalProps = {}, RootComponent extends React.ElementType = 'div'> = ExtendButtonBaseTypeMap<{
   props: AdditionalProps & AccordionSummaryOwnProps;
@@ -76,6 +76,6 @@ export interface AccordionSummaryOwnerState extends Omit<AccordionSummaryProps,
  */
 declare const AccordionSummary: ExtendButtonBase<AccordionSummaryTypeMap>;
 export type AccordionSummaryProps<RootComponent extends React.ElementType = AccordionSummaryTypeMap['defaultComponent'], AdditionalProps = {}> = OverrideProps<AccordionSummaryTypeMap<AdditionalProps, RootComponent>, RootComponent> & {
-  component?: React.ElementType;
+  component?: React.ElementType | undefined;
 };
 export default AccordionSummary;

package/esm/Alert/Alert.d.ts

@@ -89,20 +89,20 @@ export interface AlertProps extends StandardProps<PaperProps, 'variant'>, AlertS
   /**
    * Override or extend the styles applied to the component.
    */
-  classes?: Partial<AlertClasses>;
+  classes?: Partial<AlertClasses> | undefined;
   /**
    * Override the default label 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;
+  closeText?: string | undefined;
   /**
    * The color of the component. Unless provided, the value is taken from the `severity` prop.
    * 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).
    */
-  color?: OverridableStringUnion<AlertColor, AlertPropsColorOverrides>;
+  color?: OverridableStringUnion<AlertColor, AlertPropsColorOverrides> | undefined;
   /**
    * The components used for each slot inside.
    *
@@ -111,9 +111,9 @@ export interface AlertProps extends StandardProps<PaperProps, 'variant'>, AlertS
    * @default {}
    */
   components?: {
-    CloseButton?: React.ElementType;
-    CloseIcon?: React.ElementType;
-  };
+    CloseButton?: React.ElementType | undefined;
+    CloseIcon?: React.ElementType | undefined;
+  } | undefined;
   /**
    * The extra props for the slot components.
    * You can override the existing props or add new ones.
@@ -123,14 +123,14 @@ export interface AlertProps extends StandardProps<PaperProps, 'variant'>, AlertS
    * @default {}
    */
   componentsProps?: {
-    closeButton?: IconButtonProps;
-    closeIcon?: SvgIconProps;
-  };
+    closeButton?: IconButtonProps | undefined;
+    closeIcon?: SvgIconProps | undefined;
+  } | undefined;
   /**
    * The severity of the alert. This defines the color and icon used.
    * @default 'success'
    */
-  severity?: OverridableStringUnion<AlertColor, AlertPropsColorOverrides>;
+  severity?: OverridableStringUnion<AlertColor, AlertPropsColorOverrides> | undefined;
   /**
    * Override the icon displayed before the children.
    * Unless provided, the icon is mapped to the value of the `severity` prop.
@@ -141,29 +141,29 @@ export interface AlertProps extends StandardProps<PaperProps, 'variant'>, AlertS
    * The ARIA role attribute of the element.
    * @default 'alert'
    */
-  role?: string;
+  role?: string | undefined;
   /**
    * The component maps the `severity` prop to a range of different icons,
    * for instance success to `<SuccessOutlined>`.
    * If you wish to change this mapping, you can provide your own.
    * Alternatively, you can use the `icon` prop to override the icon displayed.
    */
-  iconMapping?: Partial<Record<OverridableStringUnion<AlertColor, AlertPropsColorOverrides>, React.ReactNode>>;
+  iconMapping?: Partial<Record<OverridableStringUnion<AlertColor, AlertPropsColorOverrides>, React.ReactNode>> | undefined;
   /**
    * Callback fired when the component requests to be closed.
    * When provided and no `action` prop is set, a close icon button is displayed that triggers the callback when clicked.
    * @param {React.SyntheticEvent} event The event source of the callback.
    */
-  onClose?: (event: React.SyntheticEvent) => void;
+  onClose?: ((event: React.SyntheticEvent) => void) | undefined;
   /**
    * The variant to use.
    * @default 'standard'
    */
-  variant?: OverridableStringUnion<'standard' | 'filled' | 'outlined', AlertPropsVariantOverrides>;
+  variant?: OverridableStringUnion<'standard' | 'filled' | 'outlined', AlertPropsVariantOverrides> | undefined;
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx?: SxProps<Theme>;
+  sx?: SxProps<Theme> | undefined;
 }
 export interface AlertOwnerState extends AlertProps {}
 

package/esm/Alert/Alert.js

@@ -230,7 +230,7 @@ const Alert = /*#__PURE__*/React.forwardRef(function Alert(inProps, ref) {
     ...rootSlotProps,
     children: [icon !== false ? /*#__PURE__*/_jsx(IconSlot, {
       ...iconSlotProps,
-      children: icon || iconMapping[severity]
+      children: icon || iconMapping[severity] || defaultIconMapping[severity]
     }) : null, /*#__PURE__*/_jsx(MessageSlot, {
       ...messageSlotProps,
       children: children

package/esm/AlertTitle/AlertTitle.d.ts

@@ -11,11 +11,11 @@ export interface AlertTitleProps extends TypographyProps<'div'> {
   /**
    * Override or extend the styles applied to the component.
    */
-  classes?: Partial<AlertTitleClasses>;
+  classes?: Partial<AlertTitleClasses> | undefined;
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx?: SxProps<Theme>;
+  sx?: SxProps<Theme> | undefined;
 }
 
 /**

package/esm/AppBar/AppBar.d.ts

@@ -10,41 +10,41 @@ export interface AppBarOwnProps {
   /**
    * Override or extend the styles applied to the component.
    */
-  classes?: Partial<AppBarClasses>;
+  classes?: Partial<AppBarClasses> | 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 'primary'
    */
-  color?: OverridableStringUnion<PropTypes.Color | 'transparent' | 'error' | 'info' | 'success' | 'warning', AppBarPropsColorOverrides>;
+  color?: OverridableStringUnion<PropTypes.Color | 'transparent' | 'error' | 'info' | 'success' | 'warning', AppBarPropsColorOverrides> | undefined;
   /**
    * Shadow depth, corresponds to `dp` in the spec.
    * It accepts values between 0 and 24 inclusive.
    * @default 4
    */
-  elevation?: number;
+  elevation?: number | undefined;
   /**
    * If true, the `color` prop is applied in dark mode.
    * @default false
    */
-  enableColorOnDark?: boolean;
+  enableColorOnDark?: boolean | undefined;
   /**
    * The positioning type. The behavior of the different options is described
    * [in the MDN web docs](https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Properties/position).
    * Note: `sticky` is not universally supported and will fall back to `static` when unavailable.
    * @default 'fixed'
    */
-  position?: 'fixed' | 'absolute' | 'sticky' | 'static' | 'relative';
+  position?: 'fixed' | 'absolute' | 'sticky' | 'static' | 'relative' | undefined;
   /**
    * If `false`, rounded corners are enabled.
    * @default true
    */
-  square?: boolean;
+  square?: boolean | undefined;
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx?: SxProps<Theme>;
+  sx?: SxProps<Theme> | undefined;
 }
 export type AppBarTypeMap<AdditionalProps = {}, RootComponent extends React.ElementType = 'header'> = ExtendPaperTypeMap<{
   props: AdditionalProps & AppBarOwnProps;
@@ -65,6 +65,6 @@ export type AppBarTypeMap<AdditionalProps = {}, RootComponent extends React.Elem
 
 declare const AppBar: OverridableComponent<AppBarTypeMap>;
 export type AppBarProps<RootComponent extends React.ElementType = AppBarTypeMap['defaultComponent'], AdditionalProps = {}> = OverrideProps<AppBarTypeMap<AdditionalProps, RootComponent>, RootComponent> & {
-  component?: React.ElementType;
+  component?: React.ElementType | undefined;
 };
 export default AppBar;

package/esm/AppBar/AppBar.js

@@ -26,7 +26,7 @@ const useUtilityClasses = ownerState => {
 
 // var2 is the fallback.
 // Ex. var1: 'var(--a)', var2: 'var(--b)'; return: 'var(--a, var(--b))'
-const joinVars = (var1, var2) => var1 ? `${var1?.replace(')', '')}, ${var2})` : var2;
+const joinVars = (var1, var2) => var1 ? `${var1.replace(')', '')}, ${var2})` : var2;
 const AppBarRoot = styled(Paper, {
   name: 'MuiAppBar',
   slot: 'Root',