@mui/material 7.3.7 → 7.3.9

package/Select/Select.d.ts

@@ -15,7 +15,7 @@ export interface BaseSelectProps<Value = unknown> extends StandardProps<InputPro
    * menu, otherwise it will be at least the width of the select input.
    * @default false
    */
-  autoWidth?: boolean;
+  autoWidth?: boolean | undefined;
   /**
    * The option elements to populate the select with.
    * Can be some `MenuItem` when `native` is false and `option` when `native` is true.
@@ -27,17 +27,17 @@ export interface BaseSelectProps<Value = unknown> extends StandardProps<InputPro
    * Override or extend the styles applied to the component.
    * @default {}
    */
-  classes?: Partial<SelectClasses>;
+  classes?: Partial<SelectClasses> | undefined;
   /**
    * If `true`, the component is initially open. Use when the component open state is not controlled (i.e. the `open` prop is not defined).
    * You can only use it when the `native` prop is `false` (default).
    * @default false
    */
-  defaultOpen?: boolean;
+  defaultOpen?: boolean | undefined;
   /**
    * The default value. Use when the component is not controlled.
    */
-  defaultValue?: Value;
+  defaultValue?: Value | undefined;
   /**
    * If `true`, a value is displayed even if no items are selected.
    *
@@ -48,25 +48,25 @@ export interface BaseSelectProps<Value = unknown> extends StandardProps<InputPro
    * The label should either be hidden or forced to a shrunk state.
    * @default false
    */
-  displayEmpty?: boolean;
+  displayEmpty?: boolean | undefined;
   /**
    * The icon that displays the arrow.
    * @default ArrowDropDownIcon
    */
-  IconComponent?: React.ElementType;
+  IconComponent?: React.ElementType | undefined;
   /**
    * The `id` of the wrapper element or the `select` element when `native`.
    */
-  id?: string;
+  id?: string | undefined;
   /**
    * An `Input` element; does not have to be a material-ui specific `Input`.
    */
-  input?: React.ReactElement<unknown, any>;
+  input?: React.ReactElement<unknown, any> | undefined;
   /**
    * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/input#attributes) applied to the `input` element.
    * When `native` is `true`, the attributes are applied on the `select` element.
    */
-  inputProps?: InputProps['inputProps'];
+  inputProps?: InputProps['inputProps'] | undefined;
   /**
    * See [OutlinedInput#label](https://mui.com/material-ui/api/outlined-input/#props)
    */
@@ -75,21 +75,21 @@ export interface BaseSelectProps<Value = unknown> extends StandardProps<InputPro
    * The ID of an element that acts as an additional label. The Select will
    * be labelled by the additional label and the selected value.
    */
-  labelId?: string;
+  labelId?: string | undefined;
   /**
    * Props applied to the [`Menu`](https://mui.com/material-ui/api/menu/) element.
    */
-  MenuProps?: Partial<MenuProps>;
+  MenuProps?: Partial<MenuProps> | undefined;
   /**
    * If `true`, `value` must be an array and the menu will support multiple selections.
    * @default false
    */
-  multiple?: boolean;
+  multiple?: boolean | undefined;
   /**
    * If `true`, the component uses a native `select` element.
    * @default false
    */
-  native?: boolean;
+  native?: boolean | undefined;
   /**
    * Callback fired when a menu item is selected.
    *
@@ -98,26 +98,26 @@ export interface BaseSelectProps<Value = unknown> extends StandardProps<InputPro
    * **Warning**: This is a generic event, not a change event, unless the change event is caused by browser autofill.
    * @param {object} [child] The react element that was selected when `native` is `false` (default).
    */
-  onChange?: SelectInputProps<Value>['onChange'];
+  onChange?: SelectInputProps<Value>['onChange'] | undefined;
   /**
    * Callback fired when the component requests to be closed.
    * Use it in either controlled (see the `open` prop), or uncontrolled mode (to detect when the Select collapses).
    *
    * @param {object} event The event source of the callback.
    */
-  onClose?: (event: React.SyntheticEvent) => void;
+  onClose?: ((event: React.SyntheticEvent) => void) | undefined;
   /**
    * Callback fired when the component requests to be opened.
    * Use it in either controlled (see the `open` prop), or uncontrolled mode (to detect when the Select expands).
    *
    * @param {object} event The event source of the callback.
    */
-  onOpen?: (event: React.SyntheticEvent) => void;
+  onOpen?: ((event: React.SyntheticEvent) => void) | undefined;
   /**
    * If `true`, the component is shown.
    * You can only use it when the `native` prop is `false` (default).
    */
-  open?: boolean;
+  open?: boolean | undefined;
   /**
    * Render the selected value.
    * You can only use it when the `native` prop is `false` (default).
@@ -125,15 +125,15 @@ export interface BaseSelectProps<Value = unknown> extends StandardProps<InputPro
    * @param {any} value The `value` provided to the component.
    * @returns {ReactNode}
    */
-  renderValue?: (value: Value) => React.ReactNode;
+  renderValue?: ((value: Value) => React.ReactNode) | undefined;
   /**
    * Props applied to the clickable div element.
    */
-  SelectDisplayProps?: React.HTMLAttributes<HTMLDivElement>;
+  SelectDisplayProps?: React.HTMLAttributes<HTMLDivElement> | 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. Providing an empty string will select no options.
    * Set to an empty string `''` if you don't want any of the available options to be selected.
@@ -141,12 +141,12 @@ export interface BaseSelectProps<Value = unknown> extends StandardProps<InputPro
    * If the value is an object it must have reference equality with the option in order to be selected.
    * If the value is not an object, the string representation must match with the string representation of the option in order to be selected.
    */
-  value?: Value | '';
+  value?: Value | '' | undefined;
   /**
    * The variant to use.
    * @default 'outlined'
    */
-  variant?: SelectVariants;
+  variant?: SelectVariants | undefined;
 }
 export interface FilledSelectProps extends Omit<FilledInputProps, 'value' | 'onChange' | 'id' | 'classes' | 'inputProps' | 'placeholder'> {
   /**
@@ -167,7 +167,7 @@ export interface OutlinedSelectProps extends Omit<OutlinedInputProps, 'value' |
    * The variant to use.
    * @default 'outlined'
    */
-  variant?: 'outlined';
+  variant?: 'outlined' | undefined;
 }
 export type SelectVariants = 'outlined' | 'standard' | 'filled';
 export type SelectProps<Value = unknown> = (FilledSelectProps & BaseSelectProps<Value>) | (StandardSelectProps & BaseSelectProps<Value>) | (OutlinedSelectProps & BaseSelectProps<Value>);

package/Select/SelectInput.d.ts

@@ -23,35 +23,35 @@ export type SelectChangeEvent<Value = string> = Value extends (string & {}) | nu
   };
 });
 export interface SelectInputProps<Value = unknown> {
-  autoFocus?: boolean;
+  autoFocus?: boolean | undefined;
   autoWidth: boolean;
-  defaultOpen?: boolean;
-  disabled?: boolean;
-  error?: boolean;
-  IconComponent?: React.ElementType;
-  inputRef?: (ref: HTMLSelectElement | {
+  defaultOpen?: boolean | undefined;
+  disabled?: boolean | undefined;
+  error?: boolean | undefined;
+  IconComponent?: React.ElementType | undefined;
+  inputRef?: ((ref: HTMLSelectElement | {
     node: HTMLInputElement;
     value: SelectInputProps<Value>['value'];
-  }) => void;
-  MenuProps?: Partial<MenuProps>;
+  }) => void) | undefined;
+  MenuProps?: Partial<MenuProps> | undefined;
   multiple: boolean;
-  name?: string;
+  name?: string | undefined;
   native: boolean;
-  onBlur?: React.FocusEventHandler<any>;
-  onChange?: (event: SelectChangeEvent<Value>, child: React.ReactNode) => void;
-  onClose?: (event: React.SyntheticEvent) => void;
-  onFocus?: React.FocusEventHandler<any>;
-  onKeyDown?: React.KeyboardEventHandler;
-  onMouseDown?: React.MouseEventHandler;
-  onOpen?: (event: React.SyntheticEvent) => void;
-  open?: boolean;
-  readOnly?: boolean;
-  renderValue?: (value: SelectInputProps<Value>['value']) => React.ReactNode;
-  SelectDisplayProps?: React.HTMLAttributes<HTMLDivElement>;
-  sx?: SxProps<Theme>;
-  tabIndex?: number;
-  value?: Value;
-  variant?: 'standard' | 'outlined' | 'filled';
+  onBlur?: React.FocusEventHandler<any> | undefined;
+  onChange?: ((event: SelectChangeEvent<Value>, child: React.ReactNode) => void) | undefined;
+  onClose?: ((event: React.SyntheticEvent) => void) | undefined;
+  onFocus?: React.FocusEventHandler<any> | undefined;
+  onKeyDown?: React.KeyboardEventHandler | undefined;
+  onMouseDown?: React.MouseEventHandler | undefined;
+  onOpen?: ((event: React.SyntheticEvent) => void) | undefined;
+  open?: boolean | undefined;
+  readOnly?: boolean | undefined;
+  renderValue?: ((value: SelectInputProps<Value>['value']) => React.ReactNode) | undefined;
+  SelectDisplayProps?: React.HTMLAttributes<HTMLDivElement> | undefined;
+  sx?: SxProps<Theme> | undefined;
+  tabIndex?: number | undefined;
+  value?: Value | undefined;
+  variant?: 'standard' | 'outlined' | 'filled' | undefined;
 }
 declare const SelectInput: React.JSXElementConstructor<SelectInputProps>;
 export default SelectInput;

package/Skeleton/Skeleton.d.ts

@@ -11,7 +11,7 @@ export interface SkeletonOwnProps {
    * If `false` the animation effect is disabled.
    * @default 'pulse'
    */
-  animation?: 'pulse' | 'wave' | false;
+  animation?: 'pulse' | 'wave' | false | undefined;
   /**
    * Optional children to infer width and height from.
    */
@@ -19,26 +19,26 @@ export interface SkeletonOwnProps {
   /**
    * Override or extend the styles applied to the component.
    */
-  classes?: Partial<SkeletonClasses>;
+  classes?: Partial<SkeletonClasses> | undefined;
   /**
    * Height of the skeleton.
    * Useful when you don't want to adapt the skeleton to a text element but for instance a card.
    */
-  height?: number | string;
+  height?: number | string | 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 content that will be rendered.
    * @default 'text'
    */
-  variant?: OverridableStringUnion<'text' | 'rectangular' | 'rounded' | 'circular', SkeletonPropsVariantOverrides>;
+  variant?: OverridableStringUnion<'text' | 'rectangular' | 'rounded' | 'circular', SkeletonPropsVariantOverrides> | undefined;
   /**
    * Width of the skeleton.
    * Useful when the skeleton is inside an inline element with no width of its own.
    */
-  width?: number | string;
+  width?: number | string | undefined;
 }
 export interface SkeletonTypeMap<AdditionalProps = {}, RootComponent extends React.ElementType = 'span'> {
   props: AdditionalProps & SkeletonOwnProps;
@@ -57,6 +57,6 @@ export interface SkeletonTypeMap<AdditionalProps = {}, RootComponent extends Rea
  */
 declare const Skeleton: OverridableComponent<SkeletonTypeMap>;
 export type SkeletonProps<RootComponent extends React.ElementType = SkeletonTypeMap['defaultComponent'], AdditionalProps = {}> = OverrideProps<SkeletonTypeMap<AdditionalProps, RootComponent>, RootComponent> & {
-  component?: React.ElementType;
+  component?: React.ElementType | undefined;
 };
 export default Skeleton;

package/Slide/Slide.d.ts

@@ -6,7 +6,7 @@ export interface SlideProps 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 SlideProps extends TransitionProps {
    * An HTML element, or a function that returns one.
    * It's used to set the container the Slide is transitioning from.
    */
-  container?: null | Element | ((element: Element) => Element);
+  container?: null | Element | ((element: Element) => Element) | undefined;
   /**
    * Direction the child node will enter from.
    * @default 'down'
    */
-  direction?: 'left' | 'right' | 'up' | 'down';
+  direction?: 'left' | 'right' | 'up' | 'down' | undefined;
   /**
    * The transition timing function.
    * You may specify a single easing or a object containing enter and exit values.
@@ -29,12 +29,12 @@ export interface SlideProps extends TransitionProps {
    *   exit: theme.transitions.easing.sharp,
    * }
    */
-  easing?: TransitionProps['easing'];
+  easing?: TransitionProps['easing'] | undefined;
   /**
    * If `true`, the component will transition in.
    */
-  in?: TransitionProps['in'];
-  ref?: React.Ref<unknown>;
+  in?: TransitionProps['in'] | 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.
@@ -43,7 +43,7 @@ export interface SlideProps extends TransitionProps {
    *   exit: theme.transitions.duration.leavingScreen,
    * }
    */
-  timeout?: TransitionProps['timeout'];
+  timeout?: TransitionProps['timeout'] | undefined;
 }
 
 /**

package/Slide/Slide.js

@@ -15,6 +15,7 @@ var _chainPropTypes = _interopRequireDefault(require("@mui/utils/chainPropTypes"
 var _HTMLElementType = _interopRequireDefault(require("@mui/utils/HTMLElementType"));
 var _elementAcceptingRef = _interopRequireDefault(require("@mui/utils/elementAcceptingRef"));
 var _getReactElementRef = _interopRequireDefault(require("@mui/utils/getReactElementRef"));
+var _isLayoutSupported = _interopRequireDefault(require("../utils/isLayoutSupported"));
 var _debounce = _interopRequireDefault(require("../utils/debounce"));
 var _useForkRef = _interopRequireDefault(require("../utils/useForkRef"));
 var _zeroStyled = require("../zero-styled");
@@ -270,8 +271,10 @@ process.env.NODE_ENV !== "production" ? Slide.propTypes /* remove-proptypes */ =
       const resolvedContainer = resolveContainer(props.container);
       if (resolvedContainer && resolvedContainer.nodeType === 1) {
         const box = resolvedContainer.getBoundingClientRect();
-        if (process.env.NODE_ENV !== 'test' && box.top === 0 && box.left === 0 && box.right === 0 && box.bottom === 0) {
-          return new Error(['MUI: The `container` prop provided to the component is invalid.', 'The anchor element should be part of the document layout.', "Make sure the element is present in the document or that it's not display none."].join('\n'));
+        if (process.env.NODE_ENV !== 'production') {
+          if ((0, _isLayoutSupported.default)() && box.top === 0 && box.left === 0 && box.right === 0 && box.bottom === 0) {
+            return new Error(['MUI: The `container` prop provided to the component is invalid.', 'The anchor element should be part of the document layout.', "Make sure the element is present in the document or that it's not display none."].join('\n'));
+          }
         }
       } else if (!resolvedContainer || typeof resolvedContainer.getBoundingClientRect !== 'function' || resolvedContainer.contextElement != null && resolvedContainer.contextElement.nodeType !== 1) {
         return new Error(['MUI: The `container` prop provided to the component is invalid.', 'It should be an HTML element instance.'].join('\n'));

package/Slider/Slider.d.ts

@@ -19,22 +19,22 @@ export interface SliderOwnProps<Value extends number | number[]> {
   /**
    * The label of the slider.
    */
-  'aria-label'?: string;
+  'aria-label'?: string | undefined;
   /**
    * The id of the element containing a label for the slider.
    */
-  'aria-labelledby'?: string;
+  'aria-labelledby'?: string | undefined;
   /**
    * A string value that provides a user-friendly name for the current value of the slider.
    */
-  'aria-valuetext'?: string;
+  'aria-valuetext'?: 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 'primary'
    */
-  color?: OverridableStringUnion<'primary' | 'secondary' | 'error' | 'info' | 'success' | 'warning', SliderPropsColorOverrides>;
+  color?: OverridableStringUnion<'primary' | 'secondary' | 'error' | 'info' | 'success' | 'warning', SliderPropsColorOverrides> | undefined;
   /**
    * The components used for each slot inside.
    *
@@ -43,15 +43,15 @@ export interface SliderOwnProps<Value extends number | number[]> {
    * @default {}
    */
   components?: {
-    Root?: React.ElementType;
-    Track?: React.ElementType;
-    Rail?: React.ElementType;
-    Thumb?: React.ElementType;
-    Mark?: React.ElementType;
-    MarkLabel?: React.ElementType;
-    ValueLabel?: React.ElementType;
-    Input?: React.ElementType;
-  };
+    Root?: React.ElementType | undefined;
+    Track?: React.ElementType | undefined;
+    Rail?: React.ElementType | undefined;
+    Thumb?: React.ElementType | undefined;
+    Mark?: React.ElementType | undefined;
+    MarkLabel?: React.ElementType | undefined;
+    ValueLabel?: React.ElementType | undefined;
+    Input?: React.ElementType | undefined;
+  } | undefined;
   /**
    * The extra props for the slot components.
    * You can override the existing props or add new ones.
@@ -61,44 +61,44 @@ export interface SliderOwnProps<Value extends number | number[]> {
    * @default {}
    */
   componentsProps?: {
-    root?: SlotComponentProps<'span', SliderComponentsPropsOverrides, SliderOwnerState>;
-    track?: SlotComponentProps<'span', SliderComponentsPropsOverrides, SliderOwnerState>;
-    rail?: SlotComponentProps<'span', SliderComponentsPropsOverrides, SliderOwnerState>;
-    thumb?: SlotComponentProps<'span', SliderComponentsPropsOverrides, SliderOwnerState>;
-    mark?: SlotComponentProps<'span', SliderComponentsPropsOverrides, SliderOwnerState>;
-    markLabel?: SlotComponentProps<'span', SliderComponentsPropsOverrides, SliderOwnerState>;
-    valueLabel?: SlotComponentProps<typeof SliderValueLabelComponent, SliderComponentsPropsOverrides, SliderOwnerState>;
-    input?: SlotComponentProps<'input', SliderComponentsPropsOverrides, SliderOwnerState>;
-  };
+    root?: SlotComponentProps<'span', SliderComponentsPropsOverrides, SliderOwnerState> | undefined;
+    track?: SlotComponentProps<'span', SliderComponentsPropsOverrides, SliderOwnerState> | undefined;
+    rail?: SlotComponentProps<'span', SliderComponentsPropsOverrides, SliderOwnerState> | undefined;
+    thumb?: SlotComponentProps<'span', SliderComponentsPropsOverrides, SliderOwnerState> | undefined;
+    mark?: SlotComponentProps<'span', SliderComponentsPropsOverrides, SliderOwnerState> | undefined;
+    markLabel?: SlotComponentProps<'span', SliderComponentsPropsOverrides, SliderOwnerState> | undefined;
+    valueLabel?: SlotComponentProps<typeof SliderValueLabelComponent, SliderComponentsPropsOverrides, SliderOwnerState> | undefined;
+    input?: SlotComponentProps<'input', SliderComponentsPropsOverrides, SliderOwnerState> | undefined;
+  } | undefined;
   /**
    * Override or extend the styles applied to the component.
    */
-  classes?: Partial<SliderClasses>;
+  classes?: Partial<SliderClasses> | undefined;
   /**
    * @ignore
    */
-  className?: string;
+  className?: string | undefined;
   /**
    * The default value. Use when the component is not controlled.
    */
-  defaultValue?: Value;
+  defaultValue?: Value | undefined;
   /**
    * If `true`, the component is disabled.
    * @default false
    */
-  disabled?: boolean;
+  disabled?: boolean | undefined;
   /**
    * If `true`, the active thumb doesn't swap when moving pointer over a thumb while dragging another thumb.
    * @default false
    */
-  disableSwap?: boolean;
+  disableSwap?: boolean | undefined;
   /**
    * Accepts a function which returns a string value that provides a user-friendly name for the thumb labels of the slider.
    * This is important for screen reader users.
    * @param {number} index The thumb label's index to format.
    * @returns {string}
    */
-  getAriaLabel?: (index: number) => string;
+  getAriaLabel?: ((index: number) => string) | undefined;
   /**
    * Accepts a function which returns a string value that provides a user-friendly name for the current value of the slider.
    * This is important for screen reader users.
@@ -106,30 +106,30 @@ export interface SliderOwnProps<Value extends number | number[]> {
    * @param {number} index The thumb label's index to format.
    * @returns {string}
    */
-  getAriaValueText?: (value: number, index: number) => string;
+  getAriaValueText?: ((value: number, index: number) => string) | undefined;
   /**
    * Marks indicate predetermined values to which the user can move the slider.
    * If `true` the marks are spaced according the value of the `step` prop.
    * If an array, it should contain objects with `value` and an optional `label` keys.
    * @default false
    */
-  marks?: boolean | readonly Mark[];
+  marks?: boolean | readonly Mark[] | undefined;
   /**
    * The maximum allowed value of the slider.
    * Should not be equal to min.
    * @default 100
    */
-  max?: number;
+  max?: number | undefined;
   /**
    * The minimum allowed value of the slider.
    * Should not be equal to max.
    * @default 0
    */
-  min?: number;
+  min?: number | undefined;
   /**
    * Name attribute of the hidden `input` element.
    */
-  name?: string;
+  name?: string | undefined;
   /**
    * Callback function that is fired when the slider's value changed.
    *
@@ -139,19 +139,19 @@ export interface SliderOwnProps<Value extends number | number[]> {
    * @param {Value} value The new value.
    * @param {number} activeThumb Index of the currently moved thumb.
    */
-  onChange?: (event: Event, value: Value, activeThumb: number) => void;
+  onChange?: ((event: Event, value: Value, activeThumb: number) => void) | undefined;
   /**
    * Callback function that is fired when the `mouseup` is triggered.
    *
    * @param {React.SyntheticEvent | Event} event The event source of the callback. **Warning**: This is a generic event not a change event.
    * @param {Value} value The new value.
    */
-  onChangeCommitted?: (event: React.SyntheticEvent | Event, value: Value) => void;
+  onChangeCommitted?: ((event: React.SyntheticEvent | Event, value: Value) => void) | undefined;
   /**
    * The component orientation.
    * @default 'horizontal'
    */
-  orientation?: 'horizontal' | 'vertical';
+  orientation?: 'horizontal' | 'vertical' | undefined;
   /**
    * A transformation function, to change the scale of the slider.
    * @param {any} x
@@ -160,46 +160,46 @@ export interface SliderOwnProps<Value extends number | number[]> {
    *   return x;
    * }
    */
-  scale?: (value: number) => number;
+  scale?: ((value: number) => number) | undefined;
   /**
    * The granularity with which the slider can step through values when using Page Up/Page Down or Shift + Arrow Up/Arrow Down.
    * @default 10
    */
-  shiftStep?: number;
+  shiftStep?: number | undefined;
   /**
    * The size of the slider.
    * @default 'medium'
    */
-  size?: OverridableStringUnion<'small' | 'medium', SliderPropsSizeOverrides>;
+  size?: OverridableStringUnion<'small' | 'medium', SliderPropsSizeOverrides> | undefined;
   /**
    * The props used for each slot inside the Slider.
    * @default {}
    */
   slotProps?: {
-    root?: SlotComponentProps<'span', SliderComponentsPropsOverrides, SliderOwnerState>;
-    track?: SlotComponentProps<'span', SliderComponentsPropsOverrides, SliderOwnerState>;
-    rail?: SlotComponentProps<'span', SliderComponentsPropsOverrides, SliderOwnerState>;
-    thumb?: SlotComponentProps<'span', SliderComponentsPropsOverrides, SliderOwnerState>;
-    mark?: SlotComponentProps<'span', SliderComponentsPropsOverrides, SliderOwnerState>;
-    markLabel?: SlotComponentProps<'span', SliderComponentsPropsOverrides, SliderOwnerState>;
-    valueLabel?: SlotComponentProps<typeof SliderValueLabelComponent, SliderComponentsPropsOverrides, SliderOwnerState>;
-    input?: SlotComponentProps<'input', SliderComponentsPropsOverrides, SliderOwnerState>;
-  };
+    root?: SlotComponentProps<'span', SliderComponentsPropsOverrides, SliderOwnerState> | undefined;
+    track?: SlotComponentProps<'span', SliderComponentsPropsOverrides, SliderOwnerState> | undefined;
+    rail?: SlotComponentProps<'span', SliderComponentsPropsOverrides, SliderOwnerState> | undefined;
+    thumb?: SlotComponentProps<'span', SliderComponentsPropsOverrides, SliderOwnerState> | undefined;
+    mark?: SlotComponentProps<'span', SliderComponentsPropsOverrides, SliderOwnerState> | undefined;
+    markLabel?: SlotComponentProps<'span', SliderComponentsPropsOverrides, SliderOwnerState> | undefined;
+    valueLabel?: SlotComponentProps<typeof SliderValueLabelComponent, SliderComponentsPropsOverrides, SliderOwnerState> | undefined;
+    input?: SlotComponentProps<'input', SliderComponentsPropsOverrides, SliderOwnerState> | undefined;
+  } | undefined;
   /**
    * The components used for each slot inside the Slider.
    * Either a string to use a HTML element or a component.
    * @default {}
    */
   slots?: {
-    root?: React.ElementType;
-    track?: React.ElementType;
-    rail?: React.ElementType;
-    thumb?: React.ElementType;
-    mark?: React.ElementType;
-    markLabel?: React.ElementType;
-    valueLabel?: React.ElementType;
-    input?: React.ElementType;
-  };
+    root?: React.ElementType | undefined;
+    track?: React.ElementType | undefined;
+    rail?: React.ElementType | undefined;
+    thumb?: React.ElementType | undefined;
+    mark?: React.ElementType | undefined;
+    markLabel?: React.ElementType | undefined;
+    valueLabel?: React.ElementType | undefined;
+    input?: React.ElementType | undefined;
+  } | undefined;
   /**
    * The granularity with which the slider can step through values. (A "discrete" slider.)
    * The `min` prop serves as the origin for the valid values.
@@ -208,15 +208,15 @@ export interface SliderOwnProps<Value extends number | number[]> {
    * When step is `null`, the thumb can only be slid onto marks provided with the `marks` prop.
    * @default 1
    */
-  step?: number | null;
+  step?: number | null | undefined;
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx?: SxProps<Theme>;
+  sx?: SxProps<Theme> | undefined;
   /**
    * Tab index attribute of the hidden `input` element.
    */
-  tabIndex?: number;
+  tabIndex?: number | undefined;
   /**
    * The track presentation:
    *
@@ -225,12 +225,12 @@ export interface SliderOwnProps<Value extends number | number[]> {
    * - `false` the track will render without a bar.
    * @default 'normal'
    */
-  track?: 'normal' | false | 'inverted';
+  track?: 'normal' | false | 'inverted' | undefined;
   /**
    * The value of the slider.
    * For ranged sliders, provide an array with two values.
    */
-  value?: Value;
+  value?: Value | undefined;
   /**
    * Controls when the value label is displayed:
    *
@@ -239,7 +239,7 @@ export interface SliderOwnProps<Value extends number | number[]> {
    * - `off` will never display.
    * @default 'off'
    */
-  valueLabelDisplay?: 'on' | 'auto' | 'off';
+  valueLabelDisplay?: 'on' | 'auto' | 'off' | undefined;
   /**
    * The format function the value label's value.
    *
@@ -253,7 +253,7 @@ export interface SliderOwnProps<Value extends number | number[]> {
    *   return x;
    * }
    */
-  valueLabelFormat?: string | ((value: number, index: number) => React.ReactNode);
+  valueLabelFormat?: string | ((value: number, index: number) => React.ReactNode) | undefined;
 }
 export interface SliderTypeMap<RootComponent extends React.ElementType = 'span', AdditionalProps = {}, Value extends number | number[] = number | number[]> {
   props: AdditionalProps & SliderOwnProps<Value>;
@@ -293,6 +293,6 @@ export declare const SliderValueLabel: React.FC<SliderValueLabelProps>;
  */
 declare const Slider: SliderType;
 export type SliderProps<RootComponent extends React.ElementType = SliderTypeMap['defaultComponent'], AdditionalProps = {}> = OverrideProps<SliderTypeMap<RootComponent, AdditionalProps>, RootComponent> & {
-  component?: React.ElementType;
+  component?: React.ElementType | undefined;
 };
 export default Slider;

package/Slider/SliderValueLabel.d.ts

@@ -4,7 +4,7 @@ import { SliderValueLabelProps } from "./SliderValueLabel.types.js";
  * @ignore - internal component.
  */
 declare function SliderValueLabel(props: SliderValueLabelProps): React.ReactElement<{
-  className?: string;
+  className?: string | undefined;
   children?: React.ReactNode;
 }, string | React.JSXElementConstructor<any>> | null;
 declare namespace SliderValueLabel {