@mui/material 6.0.0-beta.5 → 6.0.0-beta.6

package/node/Menu/Menu.js

@@ -69,7 +69,6 @@ const MenuMenuList = (0, _zeroStyled.styled)(_MenuList.default, {
   outline: 0
 });
 const Menu = /*#__PURE__*/React.forwardRef(function Menu(inProps, ref) {
-  var _slots$paper, _slotProps$paper;
   const props = (0, _DefaultPropsProvider.useDefaultProps)({
     props: inProps,
     name: 'MuiMenu'
@@ -154,8 +153,8 @@ const Menu = /*#__PURE__*/React.forwardRef(function Menu(inProps, ref) {
       }
     }
   });
-  const PaperSlot = (_slots$paper = slots.paper) != null ? _slots$paper : MenuPaper;
-  const paperExternalSlotProps = (_slotProps$paper = slotProps.paper) != null ? _slotProps$paper : PaperProps;
+  const PaperSlot = slots.paper ?? MenuPaper;
+  const paperExternalSlotProps = slotProps.paper ?? PaperProps;
   const rootSlotProps = (0, _useSlotProps.default)({
     elementType: slots.root,
     externalSlotProps: slotProps.root,

package/node/Modal/Modal.js

@@ -184,7 +184,7 @@ const Modal = /*#__PURE__*/React.forwardRef(function Modal(inProps, ref) {
       as: component
     },
     ownerState,
-    className: (0, _clsx.default)(className, classes == null ? void 0 : classes.root, !ownerState.open && ownerState.exited && (classes == null ? void 0 : classes.hidden))
+    className: (0, _clsx.default)(className, classes?.root, !ownerState.open && ownerState.exited && classes?.hidden)
   });
   const [BackdropSlot, backdropProps] = (0, _useSlot.default)('backdrop', {
     elementType: BackdropComponent,
@@ -197,16 +197,16 @@ const Modal = /*#__PURE__*/React.forwardRef(function Modal(inProps, ref) {
           if (onBackdropClick) {
             onBackdropClick(e);
           }
-          if (otherHandlers != null && otherHandlers.onClick) {
+          if (otherHandlers?.onClick) {
             otherHandlers.onClick(e);
           }
         }
       });
     },
-    className: (0, _clsx.default)(BackdropProps == null ? void 0 : BackdropProps.className, classes == null ? void 0 : classes.backdrop),
+    className: (0, _clsx.default)(BackdropProps?.className, classes?.backdrop),
     ownerState
   });
-  const backdropRef = (0, _utils.useForkRef)(BackdropProps == null ? void 0 : BackdropProps.ref, backdropProps.ref);
+  const backdropRef = (0, _utils.useForkRef)(BackdropProps?.ref, backdropProps.ref);
   if (!keepMounted && !open && (!hasTransition || exited)) {
     return null;
   }

package/node/Modal/ModalManager.js

@@ -88,7 +88,7 @@ function handleContainer(containerInfo, props) {
       // https://css-tricks.com/snippets/css/force-vertical-scrollbar/
       const parent = container.parentElement;
       const containerWindow = (0, _utils.unstable_ownerWindow)(container);
-      scrollContainer = (parent == null ? void 0 : parent.nodeName) === 'HTML' && containerWindow.getComputedStyle(parent).overflowY === 'scroll' ? parent : container;
+      scrollContainer = parent?.nodeName === 'HTML' && containerWindow.getComputedStyle(parent).overflowY === 'scroll' ? parent : container;
     }
 
     // Block the scroll even if no scrollbar is visible to account for mobile keyboard

package/node/Modal/useModal.js

@@ -112,8 +112,7 @@ function useModal(parameters) {
     }
   }, [open, handleClose, hasTransition, closeAfterTransition, handleOpen]);
   const createHandleKeyDown = otherHandlers => event => {
-    var _otherHandlers$onKeyD;
-    (_otherHandlers$onKeyD = otherHandlers.onKeyDown) == null || _otherHandlers$onKeyD.call(otherHandlers, event);
+    otherHandlers.onKeyDown?.(event);
 
     // The handler doesn't take event.defaultPrevented into account:
     //
@@ -135,8 +134,7 @@ function useModal(parameters) {
     }
   };
   const createHandleBackdropClick = otherHandlers => event => {
-    var _otherHandlers$onClic;
-    (_otherHandlers$onClic = otherHandlers.onClick) == null || _otherHandlers$onClic.call(otherHandlers, event);
+    otherHandlers.onClick?.(event);
     if (event.target !== event.currentTarget) {
       return;
     }
@@ -187,8 +185,8 @@ function useModal(parameters) {
       }
     };
     return {
-      onEnter: (0, _utils.unstable_createChainedFunction)(handleEnter, children == null ? void 0 : children.props.onEnter),
-      onExited: (0, _utils.unstable_createChainedFunction)(handleExited, children == null ? void 0 : children.props.onExited)
+      onEnter: (0, _utils.unstable_createChainedFunction)(handleEnter, children?.props.onEnter),
+      onExited: (0, _utils.unstable_createChainedFunction)(handleExited, children?.props.onExited)
     };
   };
   return {

package/node/OutlinedInput/OutlinedInput.js

@@ -184,7 +184,7 @@ const OutlinedInputInput = (0, _zeroStyled.styled)(_InputBase.InputBaseInput, {
   }]
 }));
 const OutlinedInput = /*#__PURE__*/React.forwardRef(function OutlinedInput(inProps, ref) {
-  var _ref, _slots$root, _ref2, _slots$input, _React$Fragment;
+  var _React$Fragment;
   const props = (0, _DefaultPropsProvider.useDefaultProps)({
     props: inProps,
     name: 'MuiOutlinedInput'
@@ -220,8 +220,8 @@ const OutlinedInput = /*#__PURE__*/React.forwardRef(function OutlinedInput(inPro
     size: fcs.size,
     type
   };
-  const RootSlot = (_ref = (_slots$root = slots.root) != null ? _slots$root : components.Root) != null ? _ref : OutlinedInputRoot;
-  const InputSlot = (_ref2 = (_slots$input = slots.input) != null ? _slots$input : components.Input) != null ? _ref2 : OutlinedInputInput;
+  const RootSlot = slots.root ?? components.Root ?? OutlinedInputRoot;
+  const InputSlot = slots.input ?? components.Input ?? OutlinedInputInput;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_InputBase.default, {
     slots: {
       root: RootSlot,

package/node/PaginationItem/PaginationItem.js

@@ -274,7 +274,6 @@ const PaginationItemPageIcon = (0, _zeroStyled.styled)('div', {
   }]
 }));
 const PaginationItem = /*#__PURE__*/React.forwardRef(function PaginationItem(inProps, ref) {
-  var _slots$previous, _slots$next, _slots$first, _slots$last;
   const props = (0, _DefaultPropsProvider.useDefaultProps)({
     props: inProps,
     name: 'MuiPaginationItem'
@@ -309,10 +308,10 @@ const PaginationItem = /*#__PURE__*/React.forwardRef(function PaginationItem(inP
   const classes = useUtilityClasses(ownerState);
   const externalForwardedProps = {
     slots: {
-      previous: (_slots$previous = slots.previous) != null ? _slots$previous : components.previous,
-      next: (_slots$next = slots.next) != null ? _slots$next : components.next,
-      first: (_slots$first = slots.first) != null ? _slots$first : components.first,
-      last: (_slots$last = slots.last) != null ? _slots$last : components.last
+      previous: slots.previous ?? components.previous,
+      next: slots.next ?? components.next,
+      first: slots.first ?? components.first,
+      last: slots.last ?? components.last
     },
     slotProps
   };

package/node/Paper/Paper.js

@@ -72,7 +72,6 @@ const PaperRoot = (0, _zeroStyled.styled)('div', {
   }]
 }));
 const Paper = /*#__PURE__*/React.forwardRef(function Paper(inProps, ref) {
-  var _theme$vars$overlays;
   const props = (0, _DefaultPropsProvider.useDefaultProps)({
     props: inProps,
     name: 'MuiPaper'
@@ -109,7 +108,7 @@ const Paper = /*#__PURE__*/React.forwardRef(function Paper(inProps, ref) {
       ...(variant === 'elevation' && {
         '--Paper-shadow': (theme.vars || theme).shadows[elevation],
         ...(theme.vars && {
-          '--Paper-overlay': (_theme$vars$overlays = theme.vars.overlays) == null ? void 0 : _theme$vars$overlays[elevation]
+          '--Paper-overlay': theme.vars.overlays?.[elevation]
         }),
         ...(!theme.vars && theme.palette.mode === 'dark' && {
           '--Paper-overlay': `linear-gradient(${(0, _colorManipulator.alpha)('#fff', (0, _getOverlayAlpha.default)(elevation))}, ${(0, _colorManipulator.alpha)('#fff', (0, _getOverlayAlpha.default)(elevation))})`

package/node/Popover/Popover.js

@@ -93,7 +93,6 @@ const PopoverPaper = exports.PopoverPaper = (0, _zeroStyled.styled)(_Paper.defau
   outline: 0
 });
 const Popover = /*#__PURE__*/React.forwardRef(function Popover(inProps, ref) {
-  var _slotProps$paper;
   const props = (0, _DefaultPropsProvider.useDefaultProps)({
     props: inProps,
     name: 'MuiPopover'
@@ -129,7 +128,7 @@ const Popover = /*#__PURE__*/React.forwardRef(function Popover(inProps, ref) {
     disableScrollLock = false,
     ...other
   } = props;
-  const externalPaperSlotProps = (_slotProps$paper = slotProps == null ? void 0 : slotProps.paper) != null ? _slotProps$paper : PaperPropsProp;
+  const externalPaperSlotProps = slotProps?.paper ?? PaperPropsProp;
   const paperRef = React.useRef();
   const ownerState = {
     ...props,
@@ -320,7 +319,7 @@ const Popover = /*#__PURE__*/React.forwardRef(function Popover(inProps, ref) {
     externalForwardedProps,
     additionalProps: {
       elevation,
-      className: (0, _clsx.default)(classes.paper, externalPaperSlotProps == null ? void 0 : externalPaperSlotProps.className),
+      className: (0, _clsx.default)(classes.paper, externalPaperSlotProps?.className),
       style: isPositioned ? externalPaperSlotProps.style : {
         ...externalPaperSlotProps.style,
         opacity: 0

package/node/Popper/BasePopper.js

@@ -54,7 +54,6 @@ const useUtilityClasses = ownerState => {
 };
 const defaultPopperOptions = {};
 const PopperTooltip = /*#__PURE__*/React.forwardRef(function PopperTooltip(props, forwardedRef) {
-  var _slots$root;
   const {
     anchorEl,
     children,
@@ -158,7 +157,7 @@ const PopperTooltip = /*#__PURE__*/React.forwardRef(function PopperTooltip(props
     childProps.TransitionProps = TransitionProps;
   }
   const classes = useUtilityClasses(props);
-  const Root = (_slots$root = slots.root) != null ? _slots$root : 'div';
+  const Root = slots.root ?? 'div';
   const rootProps = (0, _useSlotProps.default)({
     elementType: Root,
     externalSlotProps: slotProps.root,

package/node/Popper/Popper.js

@@ -36,7 +36,6 @@ const PopperRoot = (0, _zeroStyled.styled)(_BasePopper.default, {
  * - [Popper API](https://next.mui.com/material-ui/api/popper/)
  */
 const Popper = /*#__PURE__*/React.forwardRef(function Popper(inProps, ref) {
-  var _slots$root;
   const isRtl = (0, _RtlProvider.useRtl)();
   const props = (0, _DefaultPropsProvider.useDefaultProps)({
     props: inProps,
@@ -60,7 +59,7 @@ const Popper = /*#__PURE__*/React.forwardRef(function Popper(inProps, ref) {
     slotProps,
     ...other
   } = props;
-  const RootComponent = (_slots$root = slots == null ? void 0 : slots.root) != null ? _slots$root : components == null ? void 0 : components.Root;
+  const RootComponent = slots?.root ?? components?.Root;
   const otherProps = {
     anchorEl,
     container,
@@ -80,7 +79,7 @@ const Popper = /*#__PURE__*/React.forwardRef(function Popper(inProps, ref) {
     slots: {
       root: RootComponent
     },
-    slotProps: slotProps != null ? slotProps : componentsProps,
+    slotProps: slotProps ?? componentsProps,
     ...otherProps,
     ref: ref
   });

package/node/Radio/Radio.js

@@ -112,7 +112,6 @@ const defaultCheckedIcon = /*#__PURE__*/(0, _jsxRuntime.jsx)(_RadioButtonIcon.de
 });
 const defaultIcon = /*#__PURE__*/(0, _jsxRuntime.jsx)(_RadioButtonIcon.default, {});
 const Radio = /*#__PURE__*/React.forwardRef(function Radio(inProps, ref) {
-  var _defaultIcon$props$fo, _defaultCheckedIcon$p;
   const props = (0, _DefaultPropsProvider.useDefaultProps)({
     props: inProps,
     name: 'MuiRadio'
@@ -151,10 +150,10 @@ const Radio = /*#__PURE__*/React.forwardRef(function Radio(inProps, ref) {
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(RadioRoot, {
     type: "radio",
     icon: /*#__PURE__*/React.cloneElement(icon, {
-      fontSize: (_defaultIcon$props$fo = defaultIcon.props.fontSize) != null ? _defaultIcon$props$fo : size
+      fontSize: defaultIcon.props.fontSize ?? size
     }),
     checkedIcon: /*#__PURE__*/React.cloneElement(checkedIcon, {
-      fontSize: (_defaultCheckedIcon$p = defaultCheckedIcon.props.fontSize) != null ? _defaultCheckedIcon$p : size
+      fontSize: defaultCheckedIcon.props.fontSize ?? size
     }),
     ownerState: ownerState,
     classes: classes,

package/node/ScopedCssBaseline/ScopedCssBaseline.js

@@ -38,14 +38,12 @@ const ScopedCssBaselineRoot = (0, _zeroStyled.styled)('div', {
     Object.entries(theme.colorSchemes).forEach(([key, scheme]) => {
       const selector = theme.getColorSchemeSelector(key);
       if (selector.startsWith('@')) {
-        var _scheme$palette;
         colorSchemeStyles[selector] = {
-          colorScheme: (_scheme$palette = scheme.palette) == null ? void 0 : _scheme$palette.mode
+          colorScheme: scheme.palette?.mode
         };
       } else {
-        var _scheme$palette2;
         colorSchemeStyles[`&${selector.replace(/\s*&/, '')}`] = {
-          colorScheme: (_scheme$palette2 = scheme.palette) == null ? void 0 : _scheme$palette2.mode
+          colorScheme: scheme.palette?.mode
         };
       }
     });

package/node/Select/SelectInput.js

@@ -115,7 +115,6 @@ const useUtilityClasses = ownerState => {
  * @ignore - internal component.
  */
 const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, ref) {
-  var _MenuProps$slotProps;
   const {
     'aria-describedby': ariaDescribedby,
     'aria-label': ariaLabel,
@@ -174,7 +173,7 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
       setDisplayNode(node);
     }
   }, []);
-  const anchorElement = displayNode == null ? void 0 : displayNode.parentNode;
+  const anchorElement = displayNode?.parentNode;
   React.useImperativeHandle(handleRef, () => ({
     focus: () => {
       displayRef.current.focus();
@@ -440,7 +439,7 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
   const classes = useUtilityClasses(ownerState);
   const paperProps = {
     ...MenuProps.PaperProps,
-    ...((_MenuProps$slotProps = MenuProps.slotProps) == null ? void 0 : _MenuProps$slotProps.paper)
+    ...MenuProps.slotProps?.paper
   };
   const listboxId = (0, _useId.default)();
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(React.Fragment, {

package/node/Slider/Slider.js

@@ -544,7 +544,6 @@ const Forward = ({
   children
 }) => children;
 const Slider = /*#__PURE__*/React.forwardRef(function Slider(inputProps, ref) {
-  var _ref, _slots$root, _ref2, _slots$rail, _ref3, _slots$track, _ref4, _slots$thumb, _ref5, _slots$valueLabel, _ref6, _slots$mark, _ref7, _slots$markLabel, _ref8, _slots$input, _slotProps$root, _slotProps$rail, _slotProps$track, _slotProps$thumb, _slotProps$valueLabel, _slotProps$mark, _slotProps$markLabel, _slotProps$input;
   const props = (0, _DefaultPropsProvider.useDefaultProps)({
     props: inputProps,
     name: 'MuiSlider'
@@ -630,22 +629,22 @@ const Slider = /*#__PURE__*/React.forwardRef(function Slider(inputProps, ref) {
   const classes = useUtilityClasses(ownerState);
 
   // support both `slots` and `components` for backward compatibility
-  const RootSlot = (_ref = (_slots$root = slots == null ? void 0 : slots.root) != null ? _slots$root : components.Root) != null ? _ref : SliderRoot;
-  const RailSlot = (_ref2 = (_slots$rail = slots == null ? void 0 : slots.rail) != null ? _slots$rail : components.Rail) != null ? _ref2 : SliderRail;
-  const TrackSlot = (_ref3 = (_slots$track = slots == null ? void 0 : slots.track) != null ? _slots$track : components.Track) != null ? _ref3 : SliderTrack;
-  const ThumbSlot = (_ref4 = (_slots$thumb = slots == null ? void 0 : slots.thumb) != null ? _slots$thumb : components.Thumb) != null ? _ref4 : SliderThumb;
-  const ValueLabelSlot = (_ref5 = (_slots$valueLabel = slots == null ? void 0 : slots.valueLabel) != null ? _slots$valueLabel : components.ValueLabel) != null ? _ref5 : SliderValueLabel;
-  const MarkSlot = (_ref6 = (_slots$mark = slots == null ? void 0 : slots.mark) != null ? _slots$mark : components.Mark) != null ? _ref6 : SliderMark;
-  const MarkLabelSlot = (_ref7 = (_slots$markLabel = slots == null ? void 0 : slots.markLabel) != null ? _slots$markLabel : components.MarkLabel) != null ? _ref7 : SliderMarkLabel;
-  const InputSlot = (_ref8 = (_slots$input = slots == null ? void 0 : slots.input) != null ? _slots$input : components.Input) != null ? _ref8 : 'input';
-  const rootSlotProps = (_slotProps$root = slotProps == null ? void 0 : slotProps.root) != null ? _slotProps$root : componentsProps.root;
-  const railSlotProps = (_slotProps$rail = slotProps == null ? void 0 : slotProps.rail) != null ? _slotProps$rail : componentsProps.rail;
-  const trackSlotProps = (_slotProps$track = slotProps == null ? void 0 : slotProps.track) != null ? _slotProps$track : componentsProps.track;
-  const thumbSlotProps = (_slotProps$thumb = slotProps == null ? void 0 : slotProps.thumb) != null ? _slotProps$thumb : componentsProps.thumb;
-  const valueLabelSlotProps = (_slotProps$valueLabel = slotProps == null ? void 0 : slotProps.valueLabel) != null ? _slotProps$valueLabel : componentsProps.valueLabel;
-  const markSlotProps = (_slotProps$mark = slotProps == null ? void 0 : slotProps.mark) != null ? _slotProps$mark : componentsProps.mark;
-  const markLabelSlotProps = (_slotProps$markLabel = slotProps == null ? void 0 : slotProps.markLabel) != null ? _slotProps$markLabel : componentsProps.markLabel;
-  const inputSlotProps = (_slotProps$input = slotProps == null ? void 0 : slotProps.input) != null ? _slotProps$input : componentsProps.input;
+  const RootSlot = slots?.root ?? components.Root ?? SliderRoot;
+  const RailSlot = slots?.rail ?? components.Rail ?? SliderRail;
+  const TrackSlot = slots?.track ?? components.Track ?? SliderTrack;
+  const ThumbSlot = slots?.thumb ?? components.Thumb ?? SliderThumb;
+  const ValueLabelSlot = slots?.valueLabel ?? components.ValueLabel ?? SliderValueLabel;
+  const MarkSlot = slots?.mark ?? components.Mark ?? SliderMark;
+  const MarkLabelSlot = slots?.markLabel ?? components.MarkLabel ?? SliderMarkLabel;
+  const InputSlot = slots?.input ?? components.Input ?? 'input';
+  const rootSlotProps = slotProps?.root ?? componentsProps.root;
+  const railSlotProps = slotProps?.rail ?? componentsProps.rail;
+  const trackSlotProps = slotProps?.track ?? componentsProps.track;
+  const thumbSlotProps = slotProps?.thumb ?? componentsProps.thumb;
+  const valueLabelSlotProps = slotProps?.valueLabel ?? componentsProps.valueLabel;
+  const markSlotProps = slotProps?.mark ?? componentsProps.mark;
+  const markLabelSlotProps = slotProps?.markLabel ?? componentsProps.markLabel;
+  const inputSlotProps = slotProps?.input ?? componentsProps.input;
   const rootProps = (0, _useSlotProps.default)({
     elementType: RootSlot,
     getSlotProps: getRootProps,
@@ -658,7 +657,7 @@ const Slider = /*#__PURE__*/React.forwardRef(function Slider(inputProps, ref) {
     },
     ownerState: {
       ...ownerState,
-      ...(rootSlotProps == null ? void 0 : rootSlotProps.ownerState)
+      ...rootSlotProps?.ownerState
     },
     className: [classes.root, className]
   });
@@ -679,7 +678,7 @@ const Slider = /*#__PURE__*/React.forwardRef(function Slider(inputProps, ref) {
     },
     ownerState: {
       ...ownerState,
-      ...(trackSlotProps == null ? void 0 : trackSlotProps.ownerState)
+      ...trackSlotProps?.ownerState
     },
     className: classes.track
   });
@@ -689,7 +688,7 @@ const Slider = /*#__PURE__*/React.forwardRef(function Slider(inputProps, ref) {
     externalSlotProps: thumbSlotProps,
     ownerState: {
       ...ownerState,
-      ...(thumbSlotProps == null ? void 0 : thumbSlotProps.ownerState)
+      ...thumbSlotProps?.ownerState
     },
     className: classes.thumb
   });
@@ -698,7 +697,7 @@ const Slider = /*#__PURE__*/React.forwardRef(function Slider(inputProps, ref) {
     externalSlotProps: valueLabelSlotProps,
     ownerState: {
       ...ownerState,
-      ...(valueLabelSlotProps == null ? void 0 : valueLabelSlotProps.ownerState)
+      ...valueLabelSlotProps?.ownerState
     },
     className: classes.valueLabel
   });

package/node/Slider/useSlider.js

@@ -19,10 +19,9 @@ function asc(a, b) {
   return a - b;
 }
 function findClosest(values, currentValue) {
-  var _values$reduce;
   const {
     index: closestIndex
-  } = (_values$reduce = values.reduce((acc, value, index) => {
+  } = values.reduce((acc, value, index) => {
     const distance = Math.abs(currentValue - value);
     if (acc === null || distance < acc.distance || distance === acc.distance) {
       return {
@@ -31,7 +30,7 @@ function findClosest(values, currentValue) {
       };
     }
     return acc;
-  }, null)) != null ? _values$reduce : {};
+  }, null) ?? {};
   return closestIndex;
 }
 function trackFinger(event, touchId) {
@@ -91,11 +90,9 @@ function focusThumb({
   activeIndex,
   setActive
 }) {
-  var _sliderRef$current, _doc$activeElement;
   const doc = (0, _utils.unstable_ownerDocument)(sliderRef.current);
-  if (!((_sliderRef$current = sliderRef.current) != null && _sliderRef$current.contains(doc.activeElement)) || Number(doc == null || (_doc$activeElement = doc.activeElement) == null ? void 0 : _doc$activeElement.getAttribute('data-index')) !== activeIndex) {
-    var _sliderRef$current2;
-    (_sliderRef$current2 = sliderRef.current) == null || _sliderRef$current2.querySelector(`[type="range"][data-index="${activeIndex}"]`).focus();
+  if (!sliderRef.current?.contains(doc.activeElement) || Number(doc?.activeElement?.getAttribute('data-index')) !== activeIndex) {
+    sliderRef.current?.querySelector(`[type="range"][data-index="${activeIndex}"]`).focus();
   }
   if (setActive) {
     setActive(activeIndex);
@@ -191,7 +188,7 @@ function useSlider(parameters) {
     tabIndex,
     value: valueProp
   } = parameters;
-  const touchId = React.useRef();
+  const touchId = React.useRef(undefined);
   // We can't use the :active browser pseudo-classes.
   // - The active state isn't triggered when clicking on the rail.
   // - The active state isn't transferred when inversing a range slider.
@@ -201,7 +198,7 @@ function useSlider(parameters) {
   const moveCount = React.useRef(0);
   const [valueDerived, setValueState] = (0, _utils.unstable_useControlled)({
     controlled: valueProp,
-    default: defaultValue != null ? defaultValue : min,
+    default: defaultValue ?? min,
     name: 'Slider'
   });
   const handleChange = onChange && ((event, value, thumbIndex) => {
@@ -229,24 +226,22 @@ function useSlider(parameters) {
   })) : marksProp || [];
   const marksValues = marks.map(mark => mark.value);
   const [focusedThumbIndex, setFocusedThumbIndex] = React.useState(-1);
-  const sliderRef = React.useRef();
+  const sliderRef = React.useRef(null);
   const handleRef = (0, _utils.unstable_useForkRef)(ref, sliderRef);
   const createHandleHiddenInputFocus = otherHandlers => event => {
-    var _otherHandlers$onFocu;
     const index = Number(event.currentTarget.getAttribute('data-index'));
     if ((0, _utils.unstable_isFocusVisible)(event.target)) {
       setFocusedThumbIndex(index);
     }
     setOpen(index);
-    otherHandlers == null || (_otherHandlers$onFocu = otherHandlers.onFocus) == null || _otherHandlers$onFocu.call(otherHandlers, event);
+    otherHandlers?.onFocus?.(event);
   };
   const createHandleHiddenInputBlur = otherHandlers => event => {
-    var _otherHandlers$onBlur;
     if (!(0, _utils.unstable_isFocusVisible)(event.target)) {
       setFocusedThumbIndex(-1);
     }
     setOpen(-1);
-    otherHandlers == null || (_otherHandlers$onBlur = otherHandlers.onBlur) == null || _otherHandlers$onBlur.call(otherHandlers, event);
+    otherHandlers?.onBlur?.(event);
   };
   const changeValue = (event, valueInput) => {
     const index = Number(event.currentTarget.getAttribute('data-index'));
@@ -296,7 +291,6 @@ function useSlider(parameters) {
     }
   };
   const createHandleHiddenInputKeyDown = otherHandlers => event => {
-    var _otherHandlers$onKeyD;
     // The Shift + Up/Down keyboard shortcuts for moving the slider makes sense to be supported
     // only if the step is defined. If the step is null, this means tha the marks are used for specifying the valid values.
     if (step !== null) {
@@ -313,16 +307,15 @@ function useSlider(parameters) {
         event.preventDefault();
       }
     }
-    otherHandlers == null || (_otherHandlers$onKeyD = otherHandlers.onKeyDown) == null || _otherHandlers$onKeyD.call(otherHandlers, event);
+    otherHandlers?.onKeyDown?.(event);
   };
   (0, _utils.unstable_useEnhancedEffect)(() => {
     if (disabled && sliderRef.current.contains(document.activeElement)) {
-      var _document$activeEleme;
       // This is necessary because Firefox and Safari will keep focus
       // on a disabled element:
       // https://codesandbox.io/p/sandbox/mui-pr-22247-forked-h151h?file=/src/App.js
       // @ts-ignore
-      (_document$activeEleme = document.activeElement) == null || _document$activeEleme.blur();
+      document.activeElement?.blur();
     }
   }, [disabled]);
   if (disabled && active !== -1) {
@@ -332,12 +325,11 @@ function useSlider(parameters) {
     setFocusedThumbIndex(-1);
   }
   const createHandleHiddenInputChange = otherHandlers => event => {
-    var _otherHandlers$onChan;
-    (_otherHandlers$onChan = otherHandlers.onChange) == null || _otherHandlers$onChan.call(otherHandlers, event);
+    otherHandlers.onChange?.(event);
     // @ts-ignore
     changeValue(event, event.target.valueAsNumber);
   };
-  const previousIndex = React.useRef();
+  const previousIndex = React.useRef(undefined);
   let axis = orientation;
   if (isRtl && orientation === 'horizontal') {
     axis += '-reverse';
@@ -526,8 +518,7 @@ function useSlider(parameters) {
     }
   }, [disabled, stopListening]);
   const createHandleMouseDown = otherHandlers => event => {
-    var _otherHandlers$onMous;
-    (_otherHandlers$onMous = otherHandlers.onMouseDown) == null || _otherHandlers$onMous.call(otherHandlers, event);
+    otherHandlers.onMouseDown?.(event);
     if (disabled) {
       return;
     }
@@ -585,14 +576,12 @@ function useSlider(parameters) {
     };
   };
   const createHandleMouseOver = otherHandlers => event => {
-    var _otherHandlers$onMous2;
-    (_otherHandlers$onMous2 = otherHandlers.onMouseOver) == null || _otherHandlers$onMous2.call(otherHandlers, event);
+    otherHandlers.onMouseOver?.(event);
     const index = Number(event.currentTarget.getAttribute('data-index'));
     setOpen(index);
   };
   const createHandleMouseLeave = otherHandlers => event => {
-    var _otherHandlers$onMous3;
-    (_otherHandlers$onMous3 = otherHandlers.onMouseLeave) == null || _otherHandlers$onMous3.call(otherHandlers, event);
+    otherHandlers.onMouseLeave?.(event);
     setOpen(-1);
   };
   const getThumbProps = (externalProps = {}) => {
@@ -614,7 +603,6 @@ function useSlider(parameters) {
     };
   };
   const getHiddenInputProps = (externalProps = {}) => {
-    var _parameters$step;
     const externalHandlers = (0, _extractEventHandlers.default)(externalProps);
     const ownEventHandlers = {
       onChange: createHandleHiddenInputChange(externalHandlers || {}),
@@ -636,7 +624,7 @@ function useSlider(parameters) {
       type: 'range',
       min: parameters.min,
       max: parameters.max,
-      step: parameters.step === null && parameters.marks ? 'any' : (_parameters$step = parameters.step) != null ? _parameters$step : undefined,
+      step: parameters.step === null && parameters.marks ? 'any' : parameters.step ?? undefined,
       disabled,
       ...externalProps,
       ...mergedEventHandlers,

package/node/Snackbar/useSnackbar.js

@@ -43,7 +43,7 @@ function useSnackbar(parameters = {}) {
       if (!nativeEvent.defaultPrevented) {
         if (nativeEvent.key === 'Escape') {
           // not calling `preventDefault` since we don't know if people may ignore this event e.g. a permanently open snackbar
-          onClose == null || onClose(nativeEvent, 'escapeKeyDown');
+          onClose?.(nativeEvent, 'escapeKeyDown');
         }
       }
     }
@@ -53,7 +53,7 @@ function useSnackbar(parameters = {}) {
     };
   }, [open, onClose]);
   const handleClose = (0, _utils.unstable_useEventCallback)((event, reason) => {
-    onClose == null || onClose(event, reason);
+    onClose?.(event, reason);
   });
   const setAutoHideTimer = (0, _utils.unstable_useEventCallback)(autoHideDurationParam => {
     if (!onClose || autoHideDurationParam == null) {
@@ -70,7 +70,7 @@ function useSnackbar(parameters = {}) {
     return timerAutoHide.clear;
   }, [open, autoHideDuration, setAutoHideTimer, timerAutoHide]);
   const handleClickAway = event => {
-    onClose == null || onClose(event, 'clickaway');
+    onClose?.(event, 'clickaway');
   };
 
   // Pause the timer when the user is interacting with the Snackbar
@@ -86,22 +86,22 @@ function useSnackbar(parameters = {}) {
   }, [autoHideDuration, resumeHideDuration, setAutoHideTimer]);
   const createHandleBlur = otherHandlers => event => {
     const onBlurCallback = otherHandlers.onBlur;
-    onBlurCallback == null || onBlurCallback(event);
+    onBlurCallback?.(event);
     handleResume();
   };
   const createHandleFocus = otherHandlers => event => {
     const onFocusCallback = otherHandlers.onFocus;
-    onFocusCallback == null || onFocusCallback(event);
+    onFocusCallback?.(event);
     handlePause();
   };
   const createMouseEnter = otherHandlers => event => {
     const onMouseEnterCallback = otherHandlers.onMouseEnter;
-    onMouseEnterCallback == null || onMouseEnterCallback(event);
+    onMouseEnterCallback?.(event);
     handlePause();
   };
   const createMouseLeave = otherHandlers => event => {
     const onMouseLeaveCallback = otherHandlers.onMouseLeave;
-    onMouseLeaveCallback == null || onMouseLeaveCallback(event);
+    onMouseLeaveCallback?.(event);
     handleResume();
   };
   React.useEffect(() => {

package/node/StepLabel/StepLabel.js

@@ -198,7 +198,7 @@ const StepLabel = /*#__PURE__*/React.forwardRef(function StepLabel(inProps, ref)
       ownerState: ownerState,
       children: [children ? /*#__PURE__*/(0, _jsxRuntime.jsx)(LabelSlot, {
         ...labelProps,
-        className: (0, _clsx.default)(classes.label, labelProps == null ? void 0 : labelProps.className),
+        className: (0, _clsx.default)(classes.label, labelProps?.className),
         children: children
       }) : null, optional]
     })]