@mui/material 6.0.0-dev.240424162023-9968b4889d → 6.0.0

package/SpeedDialIcon/SpeedDialIcon.js

@@ -1,16 +1,14 @@
 'use client';
 
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-import _extends from "@babel/runtime/helpers/esm/extends";
-const _excluded = ["className", "icon", "open", "openIcon"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import composeClasses from '@mui/utils/composeClasses';
-import styled from '../styles/styled';
-import useThemeProps from '../styles/useThemeProps';
-import AddIcon from '../internal/svg-icons/Add';
-import speedDialIconClasses, { getSpeedDialIconUtilityClass } from './speedDialIconClasses';
+import { styled } from "../zero-styled/index.js";
+import memoTheme from "../utils/memoTheme.js";
+import { useDefaultProps } from "../DefaultPropsProvider/index.js";
+import AddIcon from "../internal/svg-icons/Add.js";
+import speedDialIconClasses, { getSpeedDialIconUtilityClass } from "./speedDialIconClasses.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const useUtilityClasses = ownerState => {
   const {
@@ -44,43 +42,65 @@ const SpeedDialIconRoot = styled('span', {
       [`& .${speedDialIconClasses.openIcon}`]: ownerState.open && styles.openIconOpen
     }, styles.root];
   }
-})(({
-  theme,
-  ownerState
+})(memoTheme(({
+  theme
 }) => ({
   height: 24,
-  [`& .${speedDialIconClasses.icon}`]: _extends({
+  [`& .${speedDialIconClasses.icon}`]: {
     transition: theme.transitions.create(['transform', 'opacity'], {
       duration: theme.transitions.duration.short
     })
-  }, ownerState.open && _extends({
-    transform: 'rotate(45deg)'
-  }, ownerState.openIcon && {
-    opacity: 0
-  })),
-  [`& .${speedDialIconClasses.openIcon}`]: _extends({
+  },
+  [`& .${speedDialIconClasses.openIcon}`]: {
     position: 'absolute',
     transition: theme.transitions.create(['transform', 'opacity'], {
       duration: theme.transitions.duration.short
     }),
     opacity: 0,
     transform: 'rotate(-45deg)'
-  }, ownerState.open && {
-    transform: 'rotate(0deg)',
-    opacity: 1
-  })
-}));
+  },
+  variants: [{
+    props: ({
+      ownerState
+    }) => ownerState.open,
+    style: {
+      [`& .${speedDialIconClasses.icon}`]: {
+        transform: 'rotate(45deg)'
+      }
+    }
+  }, {
+    props: ({
+      ownerState
+    }) => ownerState.open && ownerState.openIcon,
+    style: {
+      [`& .${speedDialIconClasses.icon}`]: {
+        opacity: 0
+      }
+    }
+  }, {
+    props: ({
+      ownerState
+    }) => ownerState.open,
+    style: {
+      [`& .${speedDialIconClasses.openIcon}`]: {
+        transform: 'rotate(0deg)',
+        opacity: 1
+      }
+    }
+  }]
+})));
 const SpeedDialIcon = /*#__PURE__*/React.forwardRef(function SpeedDialIcon(inProps, ref) {
-  const props = useThemeProps({
+  const props = useDefaultProps({
     props: inProps,
     name: 'MuiSpeedDialIcon'
   });
   const {
-      className,
-      icon: iconProp,
-      openIcon: openIconProp
-    } = props,
-    other = _objectWithoutPropertiesLoose(props, _excluded);
+    className,
+    icon: iconProp,
+    open,
+    openIcon: openIconProp,
+    ...other
+  } = props;
   const ownerState = props;
   const classes = useUtilityClasses(ownerState);
   function formatIcon(icon, newClassName) {
@@ -91,15 +111,15 @@ const SpeedDialIcon = /*#__PURE__*/React.forwardRef(function SpeedDialIcon(inPro
     }
     return icon;
   }
-  return /*#__PURE__*/_jsxs(SpeedDialIconRoot, _extends({
+  return /*#__PURE__*/_jsxs(SpeedDialIconRoot, {
     className: clsx(classes.root, className),
     ref: ref,
-    ownerState: ownerState
-  }, other, {
+    ownerState: ownerState,
+    ...other,
     children: [openIconProp ? formatIcon(openIconProp, classes.openIcon) : null, iconProp ? formatIcon(iconProp, classes.icon) : /*#__PURE__*/_jsx(AddIcon, {
       className: classes.icon
     })]
-  }));
+  });
 });
 process.env.NODE_ENV !== "production" ? SpeedDialIcon.propTypes /* remove-proptypes */ = {
   // ┌────────────────────────────── Warning ──────────────────────────────┐

package/SpeedDialIcon/index.js

@@ -1,5 +1,5 @@
 'use client';
 
-export { default } from './SpeedDialIcon';
-export { default as speedDialIconClasses } from './speedDialIconClasses';
-export * from './speedDialIconClasses';
+export { default } from "./SpeedDialIcon.js";
+export { default as speedDialIconClasses } from "./speedDialIconClasses.js";
+export * from "./speedDialIconClasses.js";

package/Stack/Stack.js

@@ -2,8 +2,8 @@
 
 import PropTypes from 'prop-types';
 import { createStack } from '@mui/system';
-import styled from '../styles/styled';
-import useThemeProps from '../styles/useThemeProps';
+import styled from "../styles/styled.js";
+import useThemeProps from "../styles/useThemeProps.js";
 const Stack = createStack({
   createStyledComponent: styled('div', {
     name: 'MuiStack',

package/Stack/index.js

@@ -1,4 +1,4 @@
 'use client';
 
-export { default } from './Stack';
-export { default as stackClasses } from './stackClasses';
+export { default } from "./Stack.js";
+export { default as stackClasses } from "./stackClasses.js";

package/Step/Step.js

@@ -1,19 +1,16 @@
 'use client';
 
-import _extends from "@babel/runtime/helpers/esm/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-const _excluded = ["active", "children", "className", "component", "completed", "disabled", "expanded", "index", "last"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import integerPropType from '@mui/utils/integerPropType';
 import composeClasses from '@mui/utils/composeClasses';
-import StepperContext from '../Stepper/StepperContext';
-import StepContext from './StepContext';
-import { styled, createUseThemeProps } from '../zero-styled';
-import { getStepUtilityClass } from './stepClasses';
+import StepperContext from "../Stepper/StepperContext.js";
+import StepContext from "./StepContext.js";
+import { styled } from "../zero-styled/index.js";
+import { useDefaultProps } from "../DefaultPropsProvider/index.js";
+import { getStepUtilityClass } from "./stepClasses.js";
 import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
-const useThemeProps = createUseThemeProps('MuiStep');
 const useUtilityClasses = ownerState => {
   const {
     classes,
@@ -55,22 +52,22 @@ const StepRoot = styled('div', {
   }]
 });
 const Step = /*#__PURE__*/React.forwardRef(function Step(inProps, ref) {
-  const props = useThemeProps({
+  const props = useDefaultProps({
     props: inProps,
     name: 'MuiStep'
   });
   const {
-      active: activeProp,
-      children,
-      className,
-      component = 'div',
-      completed: completedProp,
-      disabled: disabledProp,
-      expanded = false,
-      index,
-      last
-    } = props,
-    other = _objectWithoutPropertiesLoose(props, _excluded);
+    active: activeProp,
+    children,
+    className,
+    component = 'div',
+    completed: completedProp,
+    disabled: disabledProp,
+    expanded = false,
+    index,
+    last,
+    ...other
+  } = props;
   const {
     activeStep,
     connector,
@@ -95,7 +92,8 @@ const Step = /*#__PURE__*/React.forwardRef(function Step(inProps, ref) {
     completed,
     disabled
   }), [index, last, expanded, active, completed, disabled]);
-  const ownerState = _extends({}, props, {
+  const ownerState = {
+    ...props,
     active,
     orientation,
     alternativeLabel,
@@ -103,16 +101,16 @@ const Step = /*#__PURE__*/React.forwardRef(function Step(inProps, ref) {
     disabled,
     expanded,
     component
-  });
+  };
   const classes = useUtilityClasses(ownerState);
-  const newChildren = /*#__PURE__*/_jsxs(StepRoot, _extends({
+  const newChildren = /*#__PURE__*/_jsxs(StepRoot, {
     as: component,
     className: clsx(classes.root, className),
     ref: ref,
-    ownerState: ownerState
-  }, other, {
+    ownerState: ownerState,
+    ...other,
     children: [connector && alternativeLabel && index !== 0 ? connector : null, children]
-  }));
+  });
   return /*#__PURE__*/_jsx(StepContext.Provider, {
     value: contextValue,
     children: connector && !alternativeLabel && index !== 0 ? /*#__PURE__*/_jsxs(React.Fragment, {

package/Step/index.js

@@ -1,7 +1,7 @@
 'use client';
 
-export { default } from './Step';
-export { default as stepClasses } from './stepClasses';
-export * from './stepClasses';
-export { default as StepContext } from './StepContext';
-export * from './StepContext';
+export { default } from "./Step.js";
+export { default as stepClasses } from "./stepClasses.js";
+export * from "./stepClasses.js";
+export { default as StepContext } from "./StepContext.js";
+export * from "./StepContext.js";

package/StepButton/StepButton.js

@@ -1,21 +1,18 @@
 'use client';
 
-import _extends from "@babel/runtime/helpers/esm/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-const _excluded = ["children", "className", "icon", "optional"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import composeClasses from '@mui/utils/composeClasses';
-import { styled, createUseThemeProps } from '../zero-styled';
-import ButtonBase from '../ButtonBase';
-import StepLabel from '../StepLabel';
-import isMuiElement from '../utils/isMuiElement';
-import StepperContext from '../Stepper/StepperContext';
-import StepContext from '../Step/StepContext';
-import stepButtonClasses, { getStepButtonUtilityClass } from './stepButtonClasses';
+import { styled } from "../zero-styled/index.js";
+import { useDefaultProps } from "../DefaultPropsProvider/index.js";
+import ButtonBase from "../ButtonBase/index.js";
+import StepLabel from "../StepLabel/index.js";
+import isMuiElement from "../utils/isMuiElement.js";
+import StepperContext from "../Stepper/StepperContext.js";
+import StepContext from "../Step/StepContext.js";
+import stepButtonClasses, { getStepButtonUtilityClass } from "./stepButtonClasses.js";
 import { jsx as _jsx } from "react/jsx-runtime";
-const useThemeProps = createUseThemeProps('MuiStepButton');
 const useUtilityClasses = ownerState => {
   const {
     classes,
@@ -58,17 +55,17 @@ const StepButtonRoot = styled(ButtonBase, {
   }]
 });
 const StepButton = /*#__PURE__*/React.forwardRef(function StepButton(inProps, ref) {
-  const props = useThemeProps({
+  const props = useDefaultProps({
     props: inProps,
     name: 'MuiStepButton'
   });
   const {
-      children,
-      className,
-      icon,
-      optional
-    } = props,
-    other = _objectWithoutPropertiesLoose(props, _excluded);
+    children,
+    className,
+    icon,
+    optional,
+    ...other
+  } = props;
   const {
     disabled,
     active
@@ -76,18 +73,20 @@ const StepButton = /*#__PURE__*/React.forwardRef(function StepButton(inProps, re
   const {
     orientation
   } = React.useContext(StepperContext);
-  const ownerState = _extends({}, props, {
+  const ownerState = {
+    ...props,
     orientation
-  });
+  };
   const classes = useUtilityClasses(ownerState);
   const childProps = {
     icon,
     optional
   };
-  const child = isMuiElement(children, ['StepLabel']) ? ( /*#__PURE__*/React.cloneElement(children, childProps)) : /*#__PURE__*/_jsx(StepLabel, _extends({}, childProps, {
+  const child = isMuiElement(children, ['StepLabel']) ? ( /*#__PURE__*/React.cloneElement(children, childProps)) : /*#__PURE__*/_jsx(StepLabel, {
+    ...childProps,
     children: children
-  }));
-  return /*#__PURE__*/_jsx(StepButtonRoot, _extends({
+  });
+  return /*#__PURE__*/_jsx(StepButtonRoot, {
     focusRipple: true,
     disabled: disabled,
     TouchRippleProps: {
@@ -96,10 +95,10 @@ const StepButton = /*#__PURE__*/React.forwardRef(function StepButton(inProps, re
     className: clsx(classes.root, className),
     ref: ref,
     ownerState: ownerState,
-    "aria-current": active ? 'step' : undefined
-  }, other, {
+    "aria-current": active ? 'step' : undefined,
+    ...other,
     children: child
-  }));
+  });
 });
 process.env.NODE_ENV !== "production" ? StepButton.propTypes /* remove-proptypes */ = {
   // ┌────────────────────────────── Warning ──────────────────────────────┐

package/StepButton/index.js

@@ -1,5 +1,5 @@
 'use client';
 
-export { default } from './StepButton';
-export { default as stepButtonClasses } from './stepButtonClasses';
-export * from './stepButtonClasses';
+export { default } from "./StepButton.js";
+export { default as stepButtonClasses } from "./stepButtonClasses.js";
+export * from "./stepButtonClasses.js";

package/StepConnector/StepConnector.d.ts

@@ -4,7 +4,7 @@ import { InternalStandardProps as StandardProps } from '..';
 import { Theme } from '../styles';
 import { StepConnectorClasses } from './stepConnectorClasses';
 
-export type StepConnectorIcon = React.ReactElement | string | number;
+export type StepConnectorIcon = React.ReactElement<unknown> | string | number;
 
 export interface StepConnectorProps
   extends StandardProps<React.HTMLAttributes<HTMLDivElement>, 'children'> {
@@ -30,4 +30,4 @@ export type StepConnectorClasskey = keyof NonNullable<StepConnectorProps['classe
  *
  * - [StepConnector API](https://mui.com/material-ui/api/step-connector/)
  */
-export default function StepConnector(props: StepConnectorProps): JSX.Element;
+export default function StepConnector(props: StepConnectorProps): React.JSX.Element;

package/StepConnector/StepConnector.js

@@ -1,19 +1,17 @@
 'use client';
 
-import _extends from "@babel/runtime/helpers/esm/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-const _excluded = ["className"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import composeClasses from '@mui/utils/composeClasses';
-import capitalize from '../utils/capitalize';
-import { styled, createUseThemeProps } from '../zero-styled';
-import StepperContext from '../Stepper/StepperContext';
-import StepContext from '../Step/StepContext';
-import { getStepConnectorUtilityClass } from './stepConnectorClasses';
+import capitalize from "../utils/capitalize.js";
+import { styled } from "../zero-styled/index.js";
+import memoTheme from "../utils/memoTheme.js";
+import { useDefaultProps } from "../DefaultPropsProvider/index.js";
+import StepperContext from "../Stepper/StepperContext.js";
+import StepContext from "../Step/StepContext.js";
+import { getStepConnectorUtilityClass } from "./stepConnectorClasses.js";
 import { jsx as _jsx } from "react/jsx-runtime";
-const useThemeProps = createUseThemeProps('MuiStepConnector');
 const useUtilityClasses = ownerState => {
   const {
     classes,
@@ -68,7 +66,7 @@ const StepConnectorLine = styled('span', {
     } = props;
     return [styles.line, styles[`line${capitalize(ownerState.orientation)}`]];
   }
-})(({
+})(memoTheme(({
   theme
 }) => {
   const borderColor = theme.palette.mode === 'light' ? theme.palette.grey[400] : theme.palette.grey[600];
@@ -94,16 +92,16 @@ const StepConnectorLine = styled('span', {
       }
     }]
   };
-});
+}));
 const StepConnector = /*#__PURE__*/React.forwardRef(function StepConnector(inProps, ref) {
-  const props = useThemeProps({
+  const props = useDefaultProps({
     props: inProps,
     name: 'MuiStepConnector'
   });
   const {
-      className
-    } = props,
-    other = _objectWithoutPropertiesLoose(props, _excluded);
+    className,
+    ...other
+  } = props;
   const {
     alternativeLabel,
     orientation = 'horizontal'
@@ -113,24 +111,25 @@ const StepConnector = /*#__PURE__*/React.forwardRef(function StepConnector(inPro
     disabled,
     completed
   } = React.useContext(StepContext);
-  const ownerState = _extends({}, props, {
+  const ownerState = {
+    ...props,
     alternativeLabel,
     orientation,
     active,
     completed,
     disabled
-  });
+  };
   const classes = useUtilityClasses(ownerState);
-  return /*#__PURE__*/_jsx(StepConnectorRoot, _extends({
+  return /*#__PURE__*/_jsx(StepConnectorRoot, {
     className: clsx(classes.root, className),
     ref: ref,
-    ownerState: ownerState
-  }, other, {
+    ownerState: ownerState,
+    ...other,
     children: /*#__PURE__*/_jsx(StepConnectorLine, {
       className: classes.line,
       ownerState: ownerState
     })
-  }));
+  });
 });
 process.env.NODE_ENV !== "production" ? StepConnector.propTypes /* remove-proptypes */ = {
   // ┌────────────────────────────── Warning ──────────────────────────────┐

package/StepConnector/index.js

@@ -1,5 +1,5 @@
 'use client';
 
-export { default } from './StepConnector';
-export { default as stepConnectorClasses } from './stepConnectorClasses';
-export * from './stepConnectorClasses';
+export { default } from "./StepConnector.js";
+export { default as stepConnectorClasses } from "./stepConnectorClasses.js";
+export * from "./stepConnectorClasses.js";

package/StepConnector/stepConnectorClasses.d.ts

@@ -16,11 +16,11 @@ export interface StepConnectorClasses {
     /** Styles applied to the line element. */
     line: string;
     /** Styles applied to the line element if `orientation="horizontal"`.
-     * @deprecated Combine the [.MuiStepConnector-horizontal](/material-ui/api/step-connector/#step-connector-classes-horizontal) and [.MuiStepConnector-line](/material-ui/api/step-connector/#step-connector-classes-line) classes instead. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/)
+     * @deprecated Combine the [.MuiStepConnector-horizontal](/material-ui/api/step-connector/#step-connector-classes-horizontal) and [.MuiStepConnector-line](/material-ui/api/step-connector/#step-connector-classes-line) classes instead. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
      */
     lineHorizontal: string;
     /** Styles applied to the line element if `orientation="vertical"`.
-     * @deprecated Combine the [.MuiStepConnector-vertical](/material-ui/api/step-connector/#step-connector-classes-vertical) and [.MuiStepConnector-line](/material-ui/api/step-connector/#step-connector-classes-line) classes instead. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/)
+     * @deprecated Combine the [.MuiStepConnector-vertical](/material-ui/api/step-connector/#step-connector-classes-vertical) and [.MuiStepConnector-line](/material-ui/api/step-connector/#step-connector-classes-line) classes instead. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
      */
     lineVertical: string;
 }

package/StepContent/StepContent.d.ts

@@ -24,7 +24,7 @@ export interface StepContentProps extends StandardProps<React.HTMLAttributes<HTM
    * @default Collapse
    */
   TransitionComponent?: React.JSXElementConstructor<
-    TransitionProps & { children: React.ReactElement<any, any> }
+    TransitionProps & { children: React.ReactElement<unknown, any> }
   >;
   /**
    * Adjust the duration of the content expand transition.
@@ -53,4 +53,4 @@ export type StepContentClasskey = keyof NonNullable<StepContentProps['classes']>
  *
  * - [StepContent API](https://mui.com/material-ui/api/step-content/)
  */
-export default function StepContent(props: StepContentProps): JSX.Element;
+export default function StepContent(props: StepContentProps): React.JSX.Element;

package/StepContent/StepContent.js

@@ -1,19 +1,17 @@
 'use client';
 
-import _extends from "@babel/runtime/helpers/esm/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-const _excluded = ["children", "className", "TransitionComponent", "transitionDuration", "TransitionProps"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import composeClasses from '@mui/utils/composeClasses';
-import { styled, createUseThemeProps } from '../zero-styled';
-import Collapse from '../Collapse';
-import StepperContext from '../Stepper/StepperContext';
-import StepContext from '../Step/StepContext';
-import { getStepContentUtilityClass } from './stepContentClasses';
+import { styled } from "../zero-styled/index.js";
+import memoTheme from "../utils/memoTheme.js";
+import { useDefaultProps } from "../DefaultPropsProvider/index.js";
+import Collapse from "../Collapse/index.js";
+import StepperContext from "../Stepper/StepperContext.js";
+import StepContext from "../Step/StepContext.js";
+import { getStepContentUtilityClass } from "./stepContentClasses.js";
 import { jsx as _jsx } from "react/jsx-runtime";
-const useThemeProps = createUseThemeProps('MuiStepContent');
 const useUtilityClasses = ownerState => {
   const {
     classes,
@@ -34,7 +32,7 @@ const StepContentRoot = styled('div', {
     } = props;
     return [styles.root, ownerState.last && styles.last];
   }
-})(({
+})(memoTheme(({
   theme
 }) => ({
   marginLeft: 12,
@@ -51,25 +49,25 @@ const StepContentRoot = styled('div', {
       borderLeft: 'none'
     }
   }]
-}));
+})));
 const StepContentTransition = styled(Collapse, {
   name: 'MuiStepContent',
   slot: 'Transition',
   overridesResolver: (props, styles) => styles.transition
 })({});
 const StepContent = /*#__PURE__*/React.forwardRef(function StepContent(inProps, ref) {
-  const props = useThemeProps({
+  const props = useDefaultProps({
     props: inProps,
     name: 'MuiStepContent'
   });
   const {
-      children,
-      className,
-      TransitionComponent = Collapse,
-      transitionDuration: transitionDurationProp = 'auto',
-      TransitionProps
-    } = props,
-    other = _objectWithoutPropertiesLoose(props, _excluded);
+    children,
+    className,
+    TransitionComponent = Collapse,
+    transitionDuration: transitionDurationProp = 'auto',
+    TransitionProps,
+    ...other
+  } = props;
   const {
     orientation
   } = React.useContext(StepperContext);
@@ -78,9 +76,10 @@ const StepContent = /*#__PURE__*/React.forwardRef(function StepContent(inProps,
     last,
     expanded
   } = React.useContext(StepContext);
-  const ownerState = _extends({}, props, {
+  const ownerState = {
+    ...props,
     last
-  });
+  };
   const classes = useUtilityClasses(ownerState);
   if (process.env.NODE_ENV !== 'production') {
     if (orientation !== 'vertical') {
@@ -91,22 +90,22 @@ const StepContent = /*#__PURE__*/React.forwardRef(function StepContent(inProps,
   if (transitionDurationProp === 'auto' && !TransitionComponent.muiSupportAuto) {
     transitionDuration = undefined;
   }
-  return /*#__PURE__*/_jsx(StepContentRoot, _extends({
+  return /*#__PURE__*/_jsx(StepContentRoot, {
     className: clsx(classes.root, className),
     ref: ref,
-    ownerState: ownerState
-  }, other, {
-    children: /*#__PURE__*/_jsx(StepContentTransition, _extends({
+    ownerState: ownerState,
+    ...other,
+    children: /*#__PURE__*/_jsx(StepContentTransition, {
       as: TransitionComponent,
       in: active || expanded,
       className: classes.transition,
       ownerState: ownerState,
       timeout: transitionDuration,
-      unmountOnExit: true
-    }, TransitionProps, {
+      unmountOnExit: true,
+      ...TransitionProps,
       children: children
-    }))
-  }));
+    })
+  });
 });
 process.env.NODE_ENV !== "production" ? StepContent.propTypes /* remove-proptypes */ = {
   // ┌────────────────────────────── Warning ──────────────────────────────┐

package/StepContent/index.js

@@ -1,5 +1,5 @@
 'use client';
 
-export { default } from './StepContent';
-export { default as stepContentClasses } from './stepContentClasses';
-export * from './stepContentClasses';
+export { default } from "./StepContent.js";
+export { default as stepContentClasses } from "./stepContentClasses.js";
+export * from "./stepContentClasses.js";

package/StepIcon/StepIcon.d.ts

@@ -47,4 +47,4 @@ export type StepIconClasskey = keyof NonNullable<StepIconProps['classes']>;
  *
  * - [StepIcon API](https://mui.com/material-ui/api/step-icon/)
  */
-export default function StepIcon(props: StepIconProps): JSX.Element;
+export default function StepIcon(props: StepIconProps): React.JSX.Element;