@mui/lab 6.0.0-beta.3 → 6.0.0-beta.30

package/modern/LoadingButton/LoadingButton.js

@@ -1,297 +1,23 @@
 'use client';
 
 import * as React from 'react';
-import PropTypes from 'prop-types';
-import { chainPropTypes } from '@mui/utils';
-import { capitalize, unstable_useId as useId } from '@mui/material/utils';
-import { unstable_composeClasses as composeClasses } from '@mui/base';
-import { useDefaultProps } from '@mui/material/DefaultPropsProvider';
 import Button from '@mui/material/Button';
-import { ButtonGroupContext } from '@mui/material/ButtonGroup';
-import CircularProgress from '@mui/material/CircularProgress';
-import resolveProps from '@mui/utils/resolveProps';
-import { styled } from '../zero-styled';
-import loadingButtonClasses, { getLoadingButtonUtilityClass } from './loadingButtonClasses';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-const useUtilityClasses = ownerState => {
-  const {
-    loading,
-    loadingPosition,
-    classes
-  } = ownerState;
-  const slots = {
-    root: ['root', loading && 'loading'],
-    startIcon: [loading && `startIconLoading${capitalize(loadingPosition)}`],
-    endIcon: [loading && `endIconLoading${capitalize(loadingPosition)}`],
-    loadingIndicator: ['loadingIndicator', loading && `loadingIndicator${capitalize(loadingPosition)}`]
-  };
-  const composedClasses = composeClasses(slots, getLoadingButtonUtilityClass, classes);
-  return {
-    ...classes,
-    // forward the outlined, color, etc. classes to Button
-    ...composedClasses
-  };
+import { jsx as _jsx } from "react/jsx-runtime";
+let warnedOnce = false;
+const warn = () => {
+  if (!warnedOnce) {
+    console.warn(['MUI: The LoadingButton component functionality is now part of the Button component from Material UI.', '', "You should use `import Button from '@mui/material/Button'`", "or `import { Button } from '@mui/material'`"].join('\n'));
+    warnedOnce = true;
+  }
 };
 
-// TODO use `import rootShouldForwardProp from '../styles/rootShouldForwardProp';` once move to core
-const rootShouldForwardProp = prop => prop !== 'ownerState' && prop !== 'theme' && prop !== 'sx' && prop !== 'as' && prop !== 'classes';
-const LoadingButtonRoot = styled(Button, {
-  shouldForwardProp: prop => rootShouldForwardProp(prop) || prop === 'classes',
-  name: 'MuiLoadingButton',
-  slot: 'Root',
-  overridesResolver: (props, styles) => {
-    return [styles.root, styles.startIconLoadingStart && {
-      [`& .${loadingButtonClasses.startIconLoadingStart}`]: styles.startIconLoadingStart
-    }, styles.endIconLoadingEnd && {
-      [`& .${loadingButtonClasses.endIconLoadingEnd}`]: styles.endIconLoadingEnd
-    }];
-  }
-})(({
-  theme
-}) => ({
-  [`& .${loadingButtonClasses.startIconLoadingStart}, & .${loadingButtonClasses.endIconLoadingEnd}`]: {
-    transition: theme.transitions.create(['opacity'], {
-      duration: theme.transitions.duration.short
-    }),
-    opacity: 0
-  },
-  variants: [{
-    props: {
-      loadingPosition: 'center'
-    },
-    style: {
-      transition: theme.transitions.create(['background-color', 'box-shadow', 'border-color'], {
-        duration: theme.transitions.duration.short
-      }),
-      [`&.${loadingButtonClasses.loading}`]: {
-        color: 'transparent'
-      }
-    }
-  }, {
-    props: ({
-      ownerState
-    }) => ownerState.loadingPosition === 'start' && ownerState.fullWidth,
-    style: {
-      [`& .${loadingButtonClasses.startIconLoadingStart}, & .${loadingButtonClasses.endIconLoadingEnd}`]: {
-        transition: theme.transitions.create(['opacity'], {
-          duration: theme.transitions.duration.short
-        }),
-        opacity: 0,
-        marginRight: -8
-      }
-    }
-  }, {
-    props: ({
-      ownerState
-    }) => ownerState.loadingPosition === 'end' && ownerState.fullWidth,
-    style: {
-      [`& .${loadingButtonClasses.startIconLoadingStart}, & .${loadingButtonClasses.endIconLoadingEnd}`]: {
-        transition: theme.transitions.create(['opacity'], {
-          duration: theme.transitions.duration.short
-        }),
-        opacity: 0,
-        marginLeft: -8
-      }
-    }
-  }]
-}));
-const LoadingButtonLoadingIndicator = styled('span', {
-  name: 'MuiLoadingButton',
-  slot: 'LoadingIndicator',
-  overridesResolver: (props, styles) => {
-    const {
-      ownerState
-    } = props;
-    return [styles.loadingIndicator, styles[`loadingIndicator${capitalize(ownerState.loadingPosition)}`]];
-  }
-})(({
-  theme
-}) => ({
-  position: 'absolute',
-  visibility: 'visible',
-  display: 'flex',
-  variants: [{
-    props: {
-      loadingPosition: 'start',
-      size: 'small'
-    },
-    style: {
-      left: 10
-    }
-  }, {
-    props: ({
-      loadingPosition,
-      ownerState
-    }) => loadingPosition === 'start' && ownerState.size !== 'small',
-    style: {
-      left: 14
-    }
-  }, {
-    props: {
-      variant: 'text',
-      loadingPosition: 'start'
-    },
-    style: {
-      left: 6
-    }
-  }, {
-    props: {
-      loadingPosition: 'center'
-    },
-    style: {
-      left: '50%',
-      transform: 'translate(-50%)',
-      color: (theme.vars || theme).palette.action.disabled
-    }
-  }, {
-    props: {
-      loadingPosition: 'end',
-      size: 'small'
-    },
-    style: {
-      right: 10
-    }
-  }, {
-    props: ({
-      loadingPosition,
-      ownerState
-    }) => loadingPosition === 'end' && ownerState.size !== 'small',
-    style: {
-      right: 14
-    }
-  }, {
-    props: {
-      variant: 'text',
-      loadingPosition: 'end'
-    },
-    style: {
-      right: 6
-    }
-  }, {
-    props: ({
-      ownerState
-    }) => ownerState.loadingPosition === 'start' && ownerState.fullWidth,
-    style: {
-      position: 'relative',
-      left: -10
-    }
-  }, {
-    props: ({
-      ownerState
-    }) => ownerState.loadingPosition === 'end' && ownerState.fullWidth,
-    style: {
-      position: 'relative',
-      right: -10
-    }
-  }]
-}));
-const LoadingButton = /*#__PURE__*/React.forwardRef(function LoadingButton(inProps, ref) {
-  const contextProps = React.useContext(ButtonGroupContext);
-  const resolvedProps = resolveProps(contextProps, inProps);
-  const props = useDefaultProps({
-    props: resolvedProps,
-    name: 'MuiLoadingButton'
-  });
-  const {
-    children,
-    disabled = false,
-    id: idProp,
-    loading = false,
-    loadingIndicator: loadingIndicatorProp,
-    loadingPosition = 'center',
-    variant = 'text',
-    ...other
-  } = props;
-  const id = useId(idProp);
-  const loadingIndicator = loadingIndicatorProp ?? /*#__PURE__*/_jsx(CircularProgress, {
-    "aria-labelledby": id,
-    color: "inherit",
-    size: 16
-  });
-  const ownerState = {
-    ...props,
-    disabled,
-    loading,
-    loadingIndicator,
-    loadingPosition,
-    variant
-  };
-  const classes = useUtilityClasses(ownerState);
-  const loadingButtonLoadingIndicator = loading ? /*#__PURE__*/_jsx(LoadingButtonLoadingIndicator, {
-    className: classes.loadingIndicator,
-    ownerState: ownerState,
-    children: loadingIndicator
-  }) : null;
-  return /*#__PURE__*/_jsxs(LoadingButtonRoot, {
-    disabled: disabled || loading,
-    id: id,
+/**
+ * @ignore - do not document.
+ */
+export default /*#__PURE__*/React.forwardRef(function DeprecatedLoadingButton(props, ref) {
+  warn();
+  return /*#__PURE__*/_jsx(Button, {
     ref: ref,
-    ...other,
-    variant: variant,
-    classes: classes,
-    ownerState: ownerState,
-    children: [ownerState.loadingPosition === 'end' ? /*#__PURE__*/_jsx("span", {
-      children: children
-    }) : loadingButtonLoadingIndicator, ownerState.loadingPosition === 'end' ? loadingButtonLoadingIndicator : /*#__PURE__*/_jsx("span", {
-      children: children
-    })]
+    ...props
   });
-});
-process.env.NODE_ENV !== "production" ? LoadingButton.propTypes /* remove-proptypes */ = {
-  // ┌────────────────────────────── Warning ──────────────────────────────┐
-  // │ These PropTypes are generated from the TypeScript type definitions. │
-  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
-  // └─────────────────────────────────────────────────────────────────────┘
-  /**
-   * The content of the component.
-   */
-  children: PropTypes.node,
-  /**
-   * Override or extend the styles applied to the component.
-   */
-  classes: PropTypes.object,
-  /**
-   * If `true`, the component is disabled.
-   * @default false
-   */
-  disabled: PropTypes.bool,
-  /**
-   * @ignore
-   */
-  id: PropTypes.string,
-  /**
-   * If `true`, the loading indicator is shown and the button becomes disabled.
-   * @default false
-   */
-  loading: PropTypes.bool,
-  /**
-   * Element placed before the children if the button is in loading state.
-   * The node should contain an element with `role="progressbar"` with an accessible name.
-   * By default we render a `CircularProgress` that is labelled by the button itself.
-   * @default <CircularProgress color="inherit" size={16} />
-   */
-  loadingIndicator: PropTypes.node,
-  /**
-   * The loading indicator can be positioned on the start, end, or the center of the button.
-   * @default 'center'
-   */
-  loadingPosition: chainPropTypes(PropTypes.oneOf(['start', 'end', 'center']), props => {
-    if (props.loadingPosition === 'start' && !props.startIcon) {
-      return new Error(`MUI: The loadingPosition="start" should be used in combination with startIcon.`);
-    }
-    if (props.loadingPosition === 'end' && !props.endIcon) {
-      return new Error(`MUI: The loadingPosition="end" should be used in combination with endIcon.`);
-    }
-    return null;
-  }),
-  /**
-   * The system prop that allows defining system overrides as well as additional CSS styles.
-   */
-  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
-  /**
-   * The variant to use.
-   * @default 'text'
-   */
-  variant: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['contained', 'outlined', 'text']), PropTypes.string])
-} : void 0;
-export default LoadingButton;
+});

package/modern/LoadingButton/index.js

@@ -1,3 +1 @@
-export { default } from './LoadingButton';
-export { default as loadingButtonClasses } from './loadingButtonClasses';
-export * from './loadingButtonClasses';
+export { default } from "./LoadingButton.js";

package/modern/LocalizationProvider/index.js

@@ -1,2 +1,2 @@
-export { default } from './LocalizationProvider';
-export * from './LocalizationProvider';
+export { default } from "./LocalizationProvider.js";
+export * from "./LocalizationProvider.js";

package/modern/Masonry/Masonry.js

@@ -8,7 +8,7 @@ import { deepmerge, unstable_useForkRef as useForkRef, unstable_useEnhancedEffec
 import clsx from 'clsx';
 import PropTypes from 'prop-types';
 import * as React from 'react';
-import { getMasonryUtilityClass } from './masonryClasses';
+import { getMasonryUtilityClass } from "./masonryClasses.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 export const parseToNumber = val => {
   return Number(val.replace('px', ''));
@@ -254,7 +254,7 @@ const Masonry = /*#__PURE__*/React.forwardRef(function Masonry(inProps, ref) {
     }
     return () => {
       if (animationFrame) {
-        window.cancelAnimationFrame(animationFrame);
+        cancelAnimationFrame(animationFrame);
       }
       if (resizeObserver) {
         resizeObserver.disconnect();

package/modern/Masonry/index.js

@@ -1,3 +1,3 @@
-export { default } from './Masonry';
-export * from './masonryClasses';
-export { default as masonryClasses } from './masonryClasses';
+export { default } from "./Masonry.js";
+export * from "./masonryClasses.js";
+export { default as masonryClasses } from "./masonryClasses.js";

package/modern/MobileDatePicker/index.js

@@ -1,2 +1,2 @@
-export { default } from './MobileDatePicker';
-export * from './MobileDatePicker';
+export { default } from "./MobileDatePicker.js";
+export * from "./MobileDatePicker.js";

package/modern/MobileDateRangePicker/index.js

@@ -1,2 +1,2 @@
-export { default } from './MobileDateRangePicker';
-export * from './MobileDateRangePicker';
+export { default } from "./MobileDateRangePicker.js";
+export * from "./MobileDateRangePicker.js";

package/modern/MobileDateTimePicker/index.js

@@ -1,2 +1,2 @@
-export { default } from './MobileDateTimePicker';
-export * from './MobileDateTimePicker';
+export { default } from "./MobileDateTimePicker.js";
+export * from "./MobileDateTimePicker.js";

package/modern/MobileTimePicker/index.js

@@ -1,2 +1,2 @@
-export { default } from './MobileTimePicker';
-export * from './MobileTimePicker';
+export { default } from "./MobileTimePicker.js";
+export * from "./MobileTimePicker.js";

package/modern/MonthPicker/index.js

@@ -1,2 +1,2 @@
-export { default } from './MonthPicker';
-export * from './MonthPicker';
+export { default } from "./MonthPicker.js";
+export * from "./MonthPicker.js";

package/modern/Pagination/index.js

@@ -1,2 +1,2 @@
-export { default } from './Pagination';
-export { default as usePagination } from './usePagination';
+export { default } from "./Pagination.js";
+export { default as usePagination } from "./usePagination.js";

package/modern/PaginationItem/index.js

@@ -1 +1 @@
-export { default } from './PaginationItem';
+export { default } from "./PaginationItem.js";

package/modern/PickersDay/index.js

@@ -1,2 +1,2 @@
-export { default } from './PickersDay';
-export * from './PickersDay';
+export { default } from "./PickersDay.js";
+export * from "./PickersDay.js";

package/modern/Rating/index.js

@@ -1 +1 @@
-export { default } from './Rating';
+export { default } from "./Rating.js";

package/modern/Skeleton/index.js

@@ -1 +1 @@
-export { default } from './Skeleton';
+export { default } from "./Skeleton.js";

package/modern/SpeedDial/index.js

@@ -1 +1 @@
-export { default } from './SpeedDial';
+export { default } from "./SpeedDial.js";

package/modern/SpeedDialAction/index.js

@@ -1 +1 @@
-export { default } from './SpeedDialAction';
+export { default } from "./SpeedDialAction.js";

package/modern/SpeedDialIcon/index.js

@@ -1 +1 @@
-export { default } from './SpeedDialIcon';
+export { default } from "./SpeedDialIcon.js";

package/modern/StaticDatePicker/index.js

@@ -1,2 +1,2 @@
-export { default } from './StaticDatePicker';
-export * from './StaticDatePicker';
+export { default } from "./StaticDatePicker.js";
+export * from "./StaticDatePicker.js";

package/modern/StaticDateRangePicker/index.js

@@ -1,2 +1,2 @@
-export { default } from './StaticDateRangePicker';
-export * from './StaticDateRangePicker';
+export { default } from "./StaticDateRangePicker.js";
+export * from "./StaticDateRangePicker.js";

package/modern/StaticDateTimePicker/index.js

@@ -1,2 +1,2 @@
-export { default } from './StaticDateTimePicker';
-export * from './StaticDateTimePicker';
+export { default } from "./StaticDateTimePicker.js";
+export * from "./StaticDateTimePicker.js";

package/modern/StaticTimePicker/index.js

@@ -1,2 +1,2 @@
-export { default } from './StaticTimePicker';
-export * from './StaticTimePicker';
+export { default } from "./StaticTimePicker.js";
+export * from "./StaticTimePicker.js";

package/modern/TabContext/index.js

@@ -1,2 +1,2 @@
-export { default } from './TabContext';
-export * from './TabContext';
+export { default } from "./TabContext.js";
+export * from "./TabContext.js";

package/modern/TabList/TabList.js

@@ -3,7 +3,7 @@
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import Tabs from '@mui/material/Tabs';
-import { useTabContext, getTabId, getPanelId } from '../TabContext';
+import { useTabContext, getTabId, getPanelId } from "../TabContext/index.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 const TabList = /*#__PURE__*/React.forwardRef(function TabList(props, ref) {
   const {

package/modern/TabList/index.js

@@ -1 +1 @@
-export { default } from './TabList';
+export { default } from "./TabList.js";

package/modern/TabPanel/TabPanel.js

@@ -5,8 +5,8 @@ import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import { styled, useThemeProps } from '@mui/material/styles';
 import { unstable_composeClasses as composeClasses } from '@mui/base';
-import { getTabPanelUtilityClass } from './tabPanelClasses';
-import { getPanelId, getTabId, useTabContext } from '../TabContext';
+import { getTabPanelUtilityClass } from "./tabPanelClasses.js";
+import { getPanelId, getTabId, useTabContext } from "../TabContext/index.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 const useUtilityClasses = ownerState => {
   const {
@@ -91,6 +91,6 @@ process.env.NODE_ENV !== "production" ? TabPanel.propTypes /* remove-proptypes *
    * The `value` of the corresponding `Tab`. Must use the index of the `Tab` when
    * no `value` was passed to `Tab`.
    */
-  value: PropTypes.string.isRequired
+  value: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired
 } : void 0;
 export default TabPanel;

package/modern/TabPanel/index.js

@@ -1,3 +1,3 @@
-export { default } from './TabPanel';
-export { default as tabPanelClasses } from './tabPanelClasses';
-export * from './tabPanelClasses';
+export { default } from "./TabPanel.js";
+export { default as tabPanelClasses } from "./tabPanelClasses.js";
+export * from "./tabPanelClasses.js";

package/modern/TimePicker/index.js

@@ -1,2 +1,2 @@
-export { default } from './TimePicker';
-export * from './TimePicker';
+export { default } from "./TimePicker.js";
+export * from "./TimePicker.js";

package/modern/Timeline/Timeline.js

@@ -5,9 +5,9 @@ import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import { unstable_composeClasses as composeClasses } from '@mui/base';
 import { styled, useThemeProps } from '@mui/material/styles';
-import TimelineContext from './TimelineContext';
-import { getTimelineUtilityClass } from './timelineClasses';
-import convertTimelinePositionToClass from '../internal/convertTimelinePositionToClass';
+import TimelineContext from "./TimelineContext.js";
+import { getTimelineUtilityClass } from "./timelineClasses.js";
+import convertTimelinePositionToClass from "../internal/convertTimelinePositionToClass.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 const useUtilityClasses = ownerState => {
   const {
@@ -39,11 +39,11 @@ const TimelineRoot = styled('ul', {
  *
  * Demos:
  *
- * - [Timeline](https://next.mui.com/material-ui/react-timeline/)
+ * - [Timeline](https://mui.com/material-ui/react-timeline/)
  *
  * API:
  *
- * - [Timeline API](https://next.mui.com/material-ui/api/timeline/)
+ * - [Timeline API](https://mui.com/material-ui/api/timeline/)
  */
 const Timeline = /*#__PURE__*/React.forwardRef(function Timeline(inProps, ref) {
   const props = useThemeProps({
@@ -67,9 +67,7 @@ const Timeline = /*#__PURE__*/React.forwardRef(function Timeline(inProps, ref) {
     value: contextValue,
     children: /*#__PURE__*/_jsx(TimelineRoot, {
       className: clsx(classes.root, className),
-      ownerState: ownerState
-      // @ts-expect-error TypeScript bug, need to keep unknown for DX
-      ,
+      ownerState: ownerState,
       ref: ref,
       ...other
     })

package/modern/Timeline/TimelineContext.js

@@ -1,3 +1,5 @@
+'use client';
+
 import * as React from 'react';
 
 /**

package/modern/Timeline/index.js

@@ -1,4 +1,4 @@
-export { default } from './Timeline';
-export * from './Timeline.types';
-export { default as timelineClasses } from './timelineClasses';
-export * from './timelineClasses';
+export { default } from "./Timeline.js";
+export * from "./Timeline.types.js";
+export { default as timelineClasses } from "./timelineClasses.js";
+export * from "./timelineClasses.js";

package/modern/TimelineConnector/TimelineConnector.js

@@ -5,7 +5,7 @@ import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import { unstable_composeClasses as composeClasses } from '@mui/base';
 import { styled, useThemeProps } from '@mui/material/styles';
-import { getTimelineConnectorUtilityClass } from './timelineConnectorClasses';
+import { getTimelineConnectorUtilityClass } from "./timelineConnectorClasses.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 const useUtilityClasses = ownerState => {
   const {

package/modern/TimelineConnector/index.js

@@ -1,3 +1,3 @@
-export { default } from './TimelineConnector';
-export { default as timelineConnectorClasses } from './timelineConnectorClasses';
-export * from './timelineConnectorClasses';
+export { default } from "./TimelineConnector.js";
+export { default as timelineConnectorClasses } from "./timelineConnectorClasses.js";
+export * from "./timelineConnectorClasses.js";

package/modern/TimelineContent/TimelineContent.js

@@ -6,9 +6,9 @@ import clsx from 'clsx';
 import { styled, useThemeProps } from '@mui/material/styles';
 import { unstable_composeClasses as composeClasses } from '@mui/base';
 import Typography from '@mui/material/Typography';
-import TimelineContext from '../Timeline/TimelineContext';
-import { getTimelineContentUtilityClass } from './timelineContentClasses';
-import convertTimelinePositionToClass from '../internal/convertTimelinePositionToClass';
+import TimelineContext from "../Timeline/TimelineContext.js";
+import { getTimelineContentUtilityClass } from "./timelineContentClasses.js";
+import convertTimelinePositionToClass from "../internal/convertTimelinePositionToClass.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 const useUtilityClasses = ownerState => {
   const {

package/modern/TimelineContent/index.js

@@ -1,3 +1,3 @@
-export { default } from './TimelineContent';
-export { default as timelineContentClasses } from './timelineContentClasses';
-export * from './timelineContentClasses';
+export { default } from "./TimelineContent.js";
+export { default as timelineContentClasses } from "./timelineContentClasses.js";
+export * from "./timelineContentClasses.js";

package/modern/TimelineDot/TimelineDot.js

@@ -6,7 +6,7 @@ import clsx from 'clsx';
 import { styled, useThemeProps } from '@mui/material/styles';
 import { capitalize } from '@mui/material/utils';
 import { unstable_composeClasses as composeClasses } from '@mui/base';
-import { getTimelineDotUtilityClass } from './timelineDotClasses';
+import { getTimelineDotUtilityClass } from "./timelineDotClasses.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 const useUtilityClasses = ownerState => {
   const {

package/modern/TimelineDot/index.js

@@ -1,3 +1,3 @@
-export { default } from './TimelineDot';
-export { default as timelineDotClasses } from './timelineDotClasses';
-export * from './timelineDotClasses';
+export { default } from "./TimelineDot.js";
+export { default as timelineDotClasses } from "./timelineDotClasses.js";
+export * from "./timelineDotClasses.js";

package/modern/TimelineItem/TimelineItem.js

@@ -6,11 +6,11 @@ import clsx from 'clsx';
 import { isMuiElement } from '@mui/material/utils';
 import { styled, useThemeProps } from '@mui/material/styles';
 import { unstable_composeClasses as composeClasses } from '@mui/base';
-import { timelineContentClasses } from '../TimelineContent';
-import { timelineOppositeContentClasses } from '../TimelineOppositeContent';
-import TimelineContext from '../Timeline/TimelineContext';
-import { getTimelineItemUtilityClass } from './timelineItemClasses';
-import convertTimelinePositionToClass from '../internal/convertTimelinePositionToClass';
+import { timelineContentClasses } from "../TimelineContent/index.js";
+import { timelineOppositeContentClasses } from "../TimelineOppositeContent/index.js";
+import TimelineContext from "../Timeline/TimelineContext.js";
+import { getTimelineItemUtilityClass } from "./timelineItemClasses.js";
+import convertTimelinePositionToClass from "../internal/convertTimelinePositionToClass.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 const useUtilityClasses = ownerState => {
   const {