@mui/material 7.3.8 → 7.3.9

package/esm/Modal/useModal.types.d.ts

@@ -8,25 +8,25 @@ export interface UseModalRootSlotOwnProps {
 export interface UseModalBackdropSlotOwnProps {
   'aria-hidden': React.AriaAttributes['aria-hidden'];
   onClick: React.MouseEventHandler;
-  open?: boolean;
+  open?: boolean | undefined;
 }
 export type UseModalBackdropSlotProps<TOther = {}> = TOther & UseModalBackdropSlotOwnProps;
 export type UseModalRootSlotProps<TOther = {}> = TOther & UseModalRootSlotOwnProps;
 export type UseModalParameters = {
-  'aria-hidden'?: React.AriaAttributes['aria-hidden'];
+  'aria-hidden'?: React.AriaAttributes['aria-hidden'] | undefined;
   /**
    * A single child content element.
    */
   children: React.ReactElement<{
-    in?: boolean;
-    onEnter?: (this: unknown) => void;
-    onExited?: (this: unknown) => void;
+    in?: boolean | undefined;
+    onEnter?: ((this: unknown) => void) | undefined;
+    onExited?: ((this: unknown) => void) | undefined;
   }> | undefined | null;
   /**
    * When set to true the Modal waits until a nested Transition is completed before closing.
    * @default false
    */
-  closeAfterTransition?: boolean;
+  closeAfterTransition?: boolean | undefined;
   /**
    * An HTML element or function that returns one.
    * The `container` will have the portal children appended to it.
@@ -37,17 +37,17 @@ export type UseModalParameters = {
    * By default, it uses the body of the top-level document object,
    * so it's simply `document.body` most of the time.
    */
-  container?: PortalProps['container'];
+  container?: PortalProps['container'] | undefined;
   /**
    * If `true`, hitting escape will not fire the `onClose` callback.
    * @default false
    */
-  disableEscapeKeyDown?: boolean;
+  disableEscapeKeyDown?: boolean | undefined;
   /**
    * Disable the scroll lock behavior.
    * @default false
    */
-  disableScrollLock?: boolean;
+  disableScrollLock?: boolean | undefined;
   /**
    * Callback fired when the component requests to be closed.
    * The `reason` parameter can optionally be used to control the response to `onClose`.
@@ -57,16 +57,16 @@ export type UseModalParameters = {
    */
   onClose?: {
     bivarianceHack(event: {}, reason: 'backdropClick' | 'escapeKeyDown'): void;
-  }['bivarianceHack'];
-  onKeyDown?: React.KeyboardEventHandler;
+  }['bivarianceHack'] | undefined;
+  onKeyDown?: React.KeyboardEventHandler | undefined;
   /**
    * A function called when a transition enters.
    */
-  onTransitionEnter?: () => void;
+  onTransitionEnter?: (() => void) | undefined;
   /**
    * A function called when a transition has exited.
    */
-  onTransitionExited?: () => void;
+  onTransitionExited?: (() => void) | undefined;
   /**
    * If `true`, the component is shown.
    */

package/esm/NativeSelect/NativeSelect.d.ts

@@ -15,32 +15,32 @@ export interface NativeSelectProps extends StandardProps<InputProps, 'inputProps
    * Override or extend the styles applied to the component.
    * @default {}
    */
-  classes?: Partial<NativeSelectClasses>;
+  classes?: Partial<NativeSelectClasses> | undefined;
   /**
    * The icon that displays the arrow.
    * @default ArrowDropDownIcon
    */
-  IconComponent?: React.ElementType;
+  IconComponent?: React.ElementType | undefined;
   /**
    * An `Input` element; does not have to be a material-ui specific `Input`.
    * @default <Input />
    */
-  input?: React.ReactElement<unknown, any>;
+  input?: React.ReactElement<unknown, any> | undefined;
   /**
    * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/select#attributes) applied to the `select` element.
    */
-  inputProps?: Partial<NativeSelectInputProps>;
+  inputProps?: Partial<NativeSelectInputProps> | undefined;
   /**
    * Callback fired when a menu item is selected.
    *
    * @param {React.ChangeEvent<HTMLSelectElement>} event The event source of the callback.
    * You can pull out the new value by accessing `event.target.value` (string).
    */
-  onChange?: NativeSelectInputProps['onChange'];
+  onChange?: NativeSelectInputProps['onChange'] | undefined;
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx?: SxProps<Theme>;
+  sx?: SxProps<Theme> | undefined;
   /**
    * The `input` value. The DOM API casts this to a string.
    */
@@ -48,7 +48,7 @@ export interface NativeSelectProps extends StandardProps<InputProps, 'inputProps
   /**
    * The variant to use.
    */
-  variant?: 'standard' | 'outlined' | 'filled';
+  variant?: 'standard' | 'outlined' | 'filled' | undefined;
 }
 
 /**

package/esm/NativeSelect/NativeSelectInput.d.ts

@@ -2,12 +2,12 @@ import * as React from 'react';
 import { SxProps } from '@mui/system';
 import { Theme } from "../styles/index.js";
 export interface NativeSelectInputProps extends React.SelectHTMLAttributes<HTMLSelectElement> {
-  disabled?: boolean;
+  disabled?: boolean | undefined;
   IconComponent: React.ElementType;
-  inputRef?: React.Ref<HTMLSelectElement>;
-  variant?: 'standard' | 'outlined' | 'filled';
-  error?: boolean;
-  sx?: SxProps<Theme>;
+  inputRef?: React.Ref<HTMLSelectElement> | undefined;
+  variant?: 'standard' | 'outlined' | 'filled' | undefined;
+  error?: boolean | undefined;
+  sx?: SxProps<Theme> | undefined;
 }
 declare const NativeSelectInput: React.JSXElementConstructor<NativeSelectInputProps>;
 export default NativeSelectInput;

package/esm/NoSsr/NoSsr.types.d.ts

@@ -9,7 +9,7 @@ export interface NoSsrProps {
    * It will also defer the rendering of the children into a different screen frame.
    * @default false
    */
-  defer?: boolean;
+  defer?: boolean | undefined;
   /**
    * The fallback content to display.
    * @default null

package/esm/OutlinedInput/NotchedOutline.d.ts

@@ -1,9 +1,9 @@
 import * as React from 'react';
 import { InternalStandardProps as StandardProps } from "../internal/index.js";
 export interface NotchedOutlineProps extends StandardProps<React.FieldsetHTMLAttributes<HTMLFieldSetElement>> {
-  disabled?: boolean;
-  error?: boolean;
-  focused?: boolean;
+  disabled?: boolean | undefined;
+  error?: boolean | undefined;
+  focused?: boolean | undefined;
   label?: React.ReactNode;
   notched: boolean;
 }

package/esm/OutlinedInput/OutlinedInput.d.ts

@@ -15,14 +15,14 @@ interface OutlinedInputSlots {
 type OutlinedInputSlotsAndSlotProps = CreateSlotsAndSlotProps<OutlinedInputSlots, {
   notchedOutline: SlotProps<'fieldset', {}, OutlinedInputOwnerState>;
 }> & {
-  slots?: InputBaseProps['slots'];
-  slotProps?: InputBaseProps['slotProps'];
+  slots?: InputBaseProps['slots'] | undefined;
+  slotProps?: InputBaseProps['slotProps'] | undefined;
 };
 export interface OutlinedInputProps extends Omit<StandardProps<InputBaseProps>, 'slots' | 'slotProps'>, OutlinedInputSlotsAndSlotProps {
   /**
    * Override or extend the styles applied to the component.
    */
-  classes?: Partial<OutlinedInputClasses>;
+  classes?: Partial<OutlinedInputClasses> | undefined;
   /**
    * The label of the `input`. It is only used for layout. The actual labelling
    * is handled by `InputLabel`.
@@ -31,11 +31,11 @@ export interface OutlinedInputProps extends Omit<StandardProps<InputBaseProps>,
   /**
    * If `true`, the outline is notched to accommodate the label.
    */
-  notched?: boolean;
+  notched?: boolean | undefined;
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx?: SxProps<Theme>;
+  sx?: SxProps<Theme> | undefined;
 }
 export interface OutlinedInputOwnerState extends Omit<OutlinedInputProps, 'slots' | 'slotProps'> {}
 

package/esm/OverridableComponent/index.d.ts

@@ -32,8 +32,8 @@ export type BaseProps<TypeMap extends OverridableTypeMap> = TypeMap['props'] & C
  * Props that are valid for material-ui components.
  */
 export interface CommonProps extends StyledComponentProps<never> {
-  className?: string;
-  style?: React.CSSProperties;
+  className?: string | undefined;
+  style?: React.CSSProperties | undefined;
 }
 export interface OverridableTypeMap {
   props: {};

package/esm/Pagination/Pagination.d.ts

@@ -18,14 +18,14 @@ export interface PaginationProps extends UsePaginationProps, StandardProps<React
   /**
    * Override or extend the styles applied to the component.
    */
-  classes?: Partial<PaginationClasses>;
+  classes?: Partial<PaginationClasses> | undefined;
   /**
    * The active color.
    * 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 'standard'
    */
-  color?: OverridableStringUnion<'primary' | 'secondary' | 'standard', PaginationPropsColorOverrides>;
+  color?: OverridableStringUnion<'primary' | 'secondary' | 'standard', PaginationPropsColorOverrides> | undefined;
   /**
    * Accepts a function which returns a string value that provides a user-friendly name for the current page.
    * This is important for screen reader users.
@@ -36,7 +36,7 @@ export interface PaginationProps extends UsePaginationProps, StandardProps<React
    * @param {boolean} selected If true, the current page is selected.
    * @returns {string}
    */
-  getItemAriaLabel?: (type: UsePaginationItem['type'], page: UsePaginationItem['page'], selected: UsePaginationItem['selected']) => string;
+  getItemAriaLabel?: ((type: UsePaginationItem['type'], page: UsePaginationItem['page'], selected: UsePaginationItem['selected']) => string) | undefined;
 
   /**
    * Render the item.
@@ -44,26 +44,26 @@ export interface PaginationProps extends UsePaginationProps, StandardProps<React
    * @returns {ReactNode}
    * @default (item) => <PaginationItem {...item} />
    */
-  renderItem?: (params: PaginationRenderItemParams) => React.ReactNode;
+  renderItem?: ((params: PaginationRenderItemParams) => React.ReactNode) | undefined;
   /**
    * The shape of the pagination items.
    * @default 'circular'
    */
-  shape?: 'circular' | 'rounded';
+  shape?: 'circular' | 'rounded' | undefined;
   /**
    * The size of the component.
    * @default 'medium'
    */
-  size?: OverridableStringUnion<'small' | 'medium' | 'large', PaginationPropsSizeOverrides>;
+  size?: OverridableStringUnion<'small' | 'medium' | 'large', PaginationPropsSizeOverrides> | undefined;
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx?: SxProps<Theme>;
+  sx?: SxProps<Theme> | undefined;
   /**
    * The variant to use.
    * @default 'text'
    */
-  variant?: OverridableStringUnion<'text' | 'outlined', PaginationPropsVariantOverrides>;
+  variant?: OverridableStringUnion<'text' | 'outlined', PaginationPropsVariantOverrides> | undefined;
 }
 
 /**

package/esm/PaginationItem/PaginationItem.d.ts

@@ -58,14 +58,14 @@ export interface PaginationItemOwnProps extends PaginationItemSlotsAndSlotProps
   /**
    * Override or extend the styles applied to the component.
    */
-  classes?: Partial<PaginationItemClasses>;
+  classes?: Partial<PaginationItemClasses> | undefined;
   /**
    * The active color.
    * 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 'standard'
    */
-  color?: OverridableStringUnion<'standard' | 'primary' | 'secondary', PaginationItemPropsColorOverrides>;
+  color?: OverridableStringUnion<'standard' | 'primary' | 'secondary', PaginationItemPropsColorOverrides> | undefined;
   /**
    * The components used for each slot inside.
    *
@@ -76,16 +76,16 @@ export interface PaginationItemOwnProps extends PaginationItemSlotsAndSlotProps
    * @deprecated use the `slots` 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.
    */
   components?: {
-    first?: React.ElementType;
-    last?: React.ElementType;
-    next?: React.ElementType;
-    previous?: React.ElementType;
-  };
+    first?: React.ElementType | undefined;
+    last?: React.ElementType | undefined;
+    next?: React.ElementType | undefined;
+    previous?: React.ElementType | undefined;
+  } | undefined;
   /**
    * If `true`, the component is disabled.
    * @default false
    */
-  disabled?: boolean;
+  disabled?: boolean | undefined;
   /**
    * The current page number.
    */
@@ -94,31 +94,31 @@ export interface PaginationItemOwnProps extends PaginationItemSlotsAndSlotProps
    * If `true` the pagination item is selected.
    * @default false
    */
-  selected?: boolean;
+  selected?: boolean | undefined;
   /**
    * The shape of the pagination item.
    * @default 'circular'
    */
-  shape?: 'circular' | 'rounded';
+  shape?: 'circular' | 'rounded' | undefined;
   /**
    * The size of the component.
    * @default 'medium'
    */
-  size?: OverridableStringUnion<'small' | 'medium' | 'large', PaginationItemPropsSizeOverrides>;
+  size?: OverridableStringUnion<'small' | 'medium' | 'large', PaginationItemPropsSizeOverrides> | undefined;
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx?: SxProps<Theme>;
+  sx?: SxProps<Theme> | undefined;
   /**
    * The type of pagination item.
    * @default 'page'
    */
-  type?: UsePaginationItem['type'];
+  type?: UsePaginationItem['type'] | undefined;
   /**
    * The variant to use.
    * @default 'text'
    */
-  variant?: OverridableStringUnion<'text' | 'outlined', PaginationItemPropsVariantOverrides>;
+  variant?: OverridableStringUnion<'text' | 'outlined', PaginationItemPropsVariantOverrides> | undefined;
 }
 export interface PaginationItemTypeMap<AdditionalProps = {}, RootComponent extends React.ElementType = 'div'> {
   props: AdditionalProps & PaginationItemOwnProps;
@@ -138,6 +138,6 @@ export interface PaginationItemTypeMap<AdditionalProps = {}, RootComponent exten
  */
 declare const PaginationItem: OverridableComponent<PaginationItemTypeMap>;
 export type PaginationItemProps<RootComponent extends React.ElementType = PaginationItemTypeMap['defaultComponent'], AdditionalProps = {}> = OverrideProps<PaginationItemTypeMap<AdditionalProps, RootComponent>, RootComponent> & {
-  component?: React.ElementType;
+  component?: React.ElementType | undefined;
 };
 export default PaginationItem;

package/esm/Paper/Paper.d.ts

@@ -13,27 +13,27 @@ export interface PaperOwnProps {
   /**
    * Override or extend the styles applied to the component.
    */
-  classes?: Partial<PaperClasses>;
+  classes?: Partial<PaperClasses> | undefined;
   /**
    * Shadow depth, corresponds to `dp` in the spec.
    * It accepts values between 0 and 24 inclusive.
    * @default 1
    */
-  elevation?: number;
+  elevation?: number | undefined;
   /**
    * If `true`, rounded corners are disabled.
    * @default false
    */
-  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;
   /**
    * The variant to use.
    * @default 'elevation'
    */
-  variant?: OverridableStringUnion<'elevation' | 'outlined', PaperPropsVariantOverrides>;
+  variant?: OverridableStringUnion<'elevation' | 'outlined', PaperPropsVariantOverrides> | undefined;
 }
 export interface PaperTypeMap<AdditionalProps = {}, RootComponent extends React.ElementType = 'div'> {
   props: AdditionalProps & PaperOwnProps;
@@ -57,6 +57,6 @@ export interface ExtendPaperTypeMap<TypeMap extends OverridableTypeMap, Keys ext
   defaultComponent: TypeMap['defaultComponent'];
 }
 export type PaperProps<RootComponent extends React.ElementType = PaperTypeMap['defaultComponent'], AdditionalProps = {}> = OverrideProps<PaperTypeMap<AdditionalProps, RootComponent>, RootComponent> & {
-  component?: React.ElementType;
+  component?: React.ElementType | undefined;
 };
 export default Paper;

package/esm/PigmentContainer/PigmentContainer.d.ts

@@ -8,12 +8,12 @@ export interface PigmentContainerOwnProps {
   /**
    * Override or extend the styles applied to the component.
    */
-  classes?: Partial<ContainerClasses>;
+  classes?: Partial<ContainerClasses> | undefined;
   /**
    * If `true`, the left and right padding is removed.
    * @default false
    */
-  disableGutters?: boolean;
+  disableGutters?: boolean | undefined;
   /**
    * Set the max-width to match the min-width of the current breakpoint.
    * This is useful if you'd prefer to design for a fixed set of sizes
@@ -21,25 +21,25 @@ export interface PigmentContainerOwnProps {
    * It's fluid by default.
    * @default false
    */
-  fixed?: boolean;
+  fixed?: boolean | undefined;
   /**
    * Determine the max-width of the container.
    * The container width grows with the size of the screen.
    * Set to `false` to disable `maxWidth`.
    * @default 'lg'
    */
-  maxWidth?: Breakpoint | false;
+  maxWidth?: Breakpoint | false | undefined;
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx?: SxProps<Theme>;
+  sx?: SxProps<Theme> | undefined;
 }
 export interface PigmentContainerTypeMap<AdditionalProps = {}, RootComponent extends React.ElementType = 'div'> {
   props: AdditionalProps & PigmentContainerOwnProps;
   defaultComponent: RootComponent;
 }
 export type PigmentContainerProps<RootComponent extends React.ElementType = PigmentContainerTypeMap['defaultComponent'], AdditionalProps = {}> = OverrideProps<PigmentContainerTypeMap<AdditionalProps, RootComponent>, RootComponent> & {
-  component?: React.ElementType;
+  component?: React.ElementType | undefined;
 };
 /**
  *

package/esm/PigmentContainer/PigmentContainer.js

@@ -1,3 +1,5 @@
+'use client';
+
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';

package/esm/PigmentGrid/PigmentGrid.d.ts

@@ -16,24 +16,24 @@ export interface GridBaseProps {
    * The number of columns.
    * @default 12
    */
-  columns?: ResponsiveStyleValue<number>;
+  columns?: ResponsiveStyleValue<number> | undefined;
   /**
    * Defines the horizontal space between the type `item` components.
    * It overrides the value of the `spacing` prop.
    */
-  columnSpacing?: ResponsiveStyleValue<GridSpacing>;
+  columnSpacing?: ResponsiveStyleValue<GridSpacing> | undefined;
   /**
    * If `true`, the component will have the flex *container* behavior.
    * You should be wrapping *items* with a *container*.
    * @default false
    */
-  container?: boolean;
+  container?: boolean | undefined;
   /**
    * Defines the `flex-direction` style property.
    * It is applied for all screen sizes.
    * @default 'row'
    */
-  direction?: ResponsiveStyleValue<GridDirection>;
+  direction?: ResponsiveStyleValue<GridDirection> | undefined;
   /**
    * Defines the offset of the grid.
    */
@@ -42,7 +42,7 @@ export interface GridBaseProps {
    * Defines the vertical space between the type `item` components.
    * It overrides the value of the `spacing` prop.
    */
-  rowSpacing?: ResponsiveStyleValue<GridSpacing>;
+  rowSpacing?: ResponsiveStyleValue<GridSpacing> | undefined;
   /**
    * Defines the space between the type `item` components.
    * It can only be used on a type `container` component.
@@ -58,16 +58,16 @@ export interface GridBaseProps {
    * It's applied for all screen sizes.
    * @default 'wrap'
    */
-  wrap?: GridWrap;
+  wrap?: GridWrap | undefined;
 }
 export interface GridTypeMap<AdditionalProps = {}, DefaultComponent extends React.ElementType = 'div'> {
   props: AdditionalProps & GridBaseProps & {
-    sx?: SxProps<Theme>;
+    sx?: SxProps<Theme> | undefined;
   };
   defaultComponent: DefaultComponent;
 }
 export type GridProps<RootComponent extends React.ElementType = GridTypeMap['defaultComponent'], AdditionalProps = {
-  component?: React.ElementType;
+  component?: React.ElementType | undefined;
 }> = OverrideProps<GridTypeMap<AdditionalProps, RootComponent>, RootComponent>;
 /**
  *

package/esm/PigmentGrid/PigmentGrid.js

@@ -1,3 +1,5 @@
+'use client';
+
 import * as React from 'react';
 import clsx from 'clsx';
 import PropTypes from 'prop-types';

package/esm/PigmentStack/PigmentStack.d.ts

@@ -13,12 +13,12 @@ export interface PigmentStackOwnProps {
    * It is applied for all screen sizes.
    * @default 'column'
    */
-  direction?: ResponsiveStyleValue<'row' | 'row-reverse' | 'column' | 'column-reverse'>;
+  direction?: ResponsiveStyleValue<'row' | 'row-reverse' | 'column' | 'column-reverse'> | undefined;
   /**
    * Defines the space between immediate children.
    * @default 0
    */
-  spacing?: ResponsiveStyleValue<number | string>;
+  spacing?: ResponsiveStyleValue<number | string> | undefined;
   /**
    * Add an element between each child.
    */
@@ -26,14 +26,14 @@ export interface PigmentStackOwnProps {
   /**
    * The system prop, which allows defining system overrides as well as additional CSS styles.
    */
-  sx?: SxProps<Theme>;
+  sx?: SxProps<Theme> | undefined;
 }
 export interface PigmentStackTypeMap<AdditionalProps = {}, RootComponent extends React.ElementType = 'div'> {
   props: AdditionalProps & PigmentStackOwnProps;
   defaultComponent: RootComponent;
 }
 export type PigmentStackProps<RootComponent extends React.ElementType = PigmentStackTypeMap['defaultComponent'], AdditionalProps = {}> = OverrideProps<PigmentStackTypeMap<AdditionalProps, RootComponent>, RootComponent> & {
-  component?: React.ElementType;
+  component?: React.ElementType | undefined;
 };
 /**
  *

package/esm/PigmentStack/PigmentStack.js

@@ -1,3 +1,5 @@
+'use client';
+
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';