@mui/lab 7.0.0-beta.0 → 7.0.0-beta.2

package/esm/Timeline/Timeline.types.d.ts

@@ -0,0 +1,27 @@
+import { InternalStandardProps as StandardProps } from '@mui/material';
+import { Theme } from '@mui/material/styles';
+import { SxProps } from '@mui/system';
+import { TimelineClasses } from "./timelineClasses.js";
+export interface TimelineProps extends StandardProps<React.ComponentProps<'ul'>> {
+  /**
+   * The position where the TimelineContent should appear relative to the time axis.
+   * @default 'right'
+   */
+  position?: 'left' | 'right' | 'alternate' | 'alternate-reverse';
+  /**
+   * The content of the component.
+   */
+  children?: React.ReactNode;
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes?: Partial<TimelineClasses>;
+  /**
+   * className applied to the root element.
+   */
+  className?: string;
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx?: SxProps<Theme>;
+}

package/esm/Timeline/Timeline.types.js

@@ -0,0 +1 @@
+export {};

package/esm/Timeline/TimelineContext.d.ts

@@ -0,0 +1,6 @@
+import * as React from 'react';
+/**
+ * @ignore - internal component.
+ */
+declare const TimelineContext: React.Context<{}>;
+export default TimelineContext;

package/esm/Timeline/TimelineContext.js

@@ -0,0 +1,12 @@
+'use client';
+
+import * as React from 'react';
+
+/**
+ * @ignore - internal component.
+ */
+const TimelineContext = /*#__PURE__*/React.createContext({});
+if (process.env.NODE_ENV !== 'production') {
+  TimelineContext.displayName = 'TimelineContext';
+}
+export default TimelineContext;

package/esm/Timeline/index.d.ts

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

package/esm/Timeline/index.js

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

package/esm/Timeline/timelineClasses.d.ts

@@ -0,0 +1,16 @@
+export interface TimelineClasses {
+  /** Styles applied to the root element. */
+  root: string;
+  /** Styles applied to the root element if `position="left"`. */
+  positionLeft: string;
+  /** Styles applied to the root element if `position="right"`. */
+  positionRight: string;
+  /** Styles applied to the root element if `position="alternate"`. */
+  positionAlternate: string;
+  /** Styles applied to the root element if `position="alternate-reverse"`. */
+  positionAlternateReverse: string;
+}
+export type TimelineClassKey = keyof TimelineClasses;
+export declare function getTimelineUtilityClass(slot: string): string;
+declare const timelineClasses: TimelineClasses;
+export default timelineClasses;

package/esm/Timeline/timelineClasses.js

@@ -0,0 +1,7 @@
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+export function getTimelineUtilityClass(slot) {
+  return generateUtilityClass('MuiTimeline', slot);
+}
+const timelineClasses = generateUtilityClasses('MuiTimeline', ['root', 'positionLeft', 'positionRight', 'positionAlternate', 'positionAlternateReverse']);
+export default timelineClasses;

package/esm/TimelineConnector/TimelineConnector.d.ts

@@ -0,0 +1,31 @@
+import * as React from 'react';
+import { InternalStandardProps as StandardProps } from '@mui/material';
+import { Theme } from '@mui/material/styles';
+import { SxProps } from '@mui/system';
+import { TimelineConnectorClasses } from "./timelineConnectorClasses.js";
+export interface TimelineConnectorProps extends StandardProps<React.HTMLAttributes<HTMLSpanElement>> {
+  /**
+   * The content of the component.
+   */
+  children?: React.ReactNode;
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes?: Partial<TimelineConnectorClasses>;
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx?: SxProps<Theme>;
+}
+
+/**
+ *
+ * Demos:
+ *
+ * - [Timeline](https://next.mui.com/material-ui/react-timeline/)
+ *
+ * API:
+ *
+ * - [TimelineConnector API](https://next.mui.com/material-ui/api/timeline-connector/)
+ */
+export default function TimelineConnector(props: TimelineConnectorProps): React.JSX.Element;

package/{node → esm}/TimelineConnector/TimelineConnector.js

@@ -1,19 +1,12 @@
-"use strict";
 'use client';
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var React = _interopRequireWildcard(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _clsx = _interopRequireDefault(require("clsx"));
-var _base = require("@mui/base");
-var _styles = require("@mui/material/styles");
-var _timelineConnectorClasses = require("./timelineConnectorClasses");
-var _jsxRuntime = require("react/jsx-runtime");
+import * as React from 'react';
+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.js";
+import { jsx as _jsx } from "react/jsx-runtime";
 const useUtilityClasses = ownerState => {
   const {
     classes
@@ -21,9 +14,9 @@ const useUtilityClasses = ownerState => {
   const slots = {
     root: ['root']
   };
-  return (0, _base.unstable_composeClasses)(slots, _timelineConnectorClasses.getTimelineConnectorUtilityClass, classes);
+  return composeClasses(slots, getTimelineConnectorUtilityClass, classes);
 };
-const TimelineConnectorRoot = (0, _styles.styled)('span', {
+const TimelineConnectorRoot = styled('span', {
   name: 'MuiTimelineConnector',
   slot: 'Root',
   overridesResolver: (props, styles) => styles.root
@@ -37,7 +30,7 @@ const TimelineConnectorRoot = (0, _styles.styled)('span', {
   };
 });
 const TimelineConnector = /*#__PURE__*/React.forwardRef(function TimelineConnector(inProps, ref) {
-  const props = (0, _styles.useThemeProps)({
+  const props = useThemeProps({
     props: inProps,
     name: 'MuiTimelineConnector'
   });
@@ -47,8 +40,8 @@ const TimelineConnector = /*#__PURE__*/React.forwardRef(function TimelineConnect
   } = props;
   const ownerState = props;
   const classes = useUtilityClasses(ownerState);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(TimelineConnectorRoot, {
-    className: (0, _clsx.default)(classes.root, className),
+  return /*#__PURE__*/_jsx(TimelineConnectorRoot, {
+    className: clsx(classes.root, className),
     ownerState: ownerState,
     ref: ref,
     ...other
@@ -62,18 +55,18 @@ process.env.NODE_ENV !== "production" ? TimelineConnector.propTypes /* remove-pr
   /**
    * The content of the component.
    */
-  children: _propTypes.default.node,
+  children: PropTypes.node,
   /**
    * Override or extend the styles applied to the component.
    */
-  classes: _propTypes.default.object,
+  classes: PropTypes.object,
   /**
    * @ignore
    */
-  className: _propTypes.default.string,
+  className: PropTypes.string,
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object, _propTypes.default.bool])), _propTypes.default.func, _propTypes.default.object])
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
 } : void 0;
-var _default = exports.default = TimelineConnector;
+export default TimelineConnector;

package/esm/TimelineConnector/index.d.ts

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

package/esm/TimelineConnector/index.js

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

package/esm/TimelineConnector/timelineConnectorClasses.d.ts

@@ -0,0 +1,8 @@
+export interface TimelineConnectorClasses {
+  /** Styles applied to the root element. */
+  root: string;
+}
+export type TimelineConnectorClassKey = keyof TimelineConnectorClasses;
+export declare function getTimelineConnectorUtilityClass(slot: string): string;
+declare const timelineConnectorClasses: TimelineConnectorClasses;
+export default timelineConnectorClasses;

package/esm/TimelineConnector/timelineConnectorClasses.js

@@ -0,0 +1,7 @@
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+export function getTimelineConnectorUtilityClass(slot) {
+  return generateUtilityClass('MuiTimelineConnector', slot);
+}
+const timelineConnectorClasses = generateUtilityClasses('MuiTimelineConnector', ['root']);
+export default timelineConnectorClasses;

package/esm/TimelineContent/TimelineContent.d.ts

@@ -0,0 +1,32 @@
+import * as React from 'react';
+import { SxProps } from '@mui/system';
+import { Theme } from '@mui/material/styles';
+import { InternalStandardProps as StandardProps, TypographyProps } from '@mui/material';
+import { TimelineContentClasses } from "./timelineContentClasses.js";
+export interface TimelineContentProps extends StandardProps<TypographyProps> {
+  /**
+   * The content of the component.
+   */
+  children?: React.ReactNode;
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes?: Partial<TimelineContentClasses>;
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx?: SxProps<Theme>;
+}
+
+/**
+ *
+ * Demos:
+ *
+ * - [Timeline](https://next.mui.com/material-ui/react-timeline/)
+ *
+ * API:
+ *
+ * - [TimelineContent API](https://next.mui.com/material-ui/api/timeline-content/)
+ * - inherits [Typography API](https://next.mui.com/material-ui/api/typography/)
+ */
+export default function TimelineContent(props: TimelineContentProps): React.JSX.Element;

package/esm/TimelineContent/TimelineContent.js

@@ -0,0 +1,89 @@
+'use client';
+
+import * as React from 'react';
+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 Typography from '@mui/material/Typography';
+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 {
+    position,
+    classes
+  } = ownerState;
+  const slots = {
+    root: ['root', convertTimelinePositionToClass(position)]
+  };
+  return composeClasses(slots, getTimelineContentUtilityClass, classes);
+};
+const TimelineContentRoot = styled(Typography, {
+  name: 'MuiTimelineContent',
+  slot: 'Root',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [styles.root, styles[convertTimelinePositionToClass(ownerState.position)]];
+  }
+})(({
+  ownerState
+}) => ({
+  flex: 1,
+  padding: '6px 16px',
+  textAlign: 'left',
+  ...(ownerState.position === 'left' && {
+    textAlign: 'right'
+  })
+}));
+const TimelineContent = /*#__PURE__*/React.forwardRef(function TimelineContent(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiTimelineContent'
+  });
+  const {
+    className,
+    ...other
+  } = props;
+  const {
+    position: positionContext
+  } = React.useContext(TimelineContext);
+  const ownerState = {
+    ...props,
+    position: positionContext || 'right'
+  };
+  const classes = useUtilityClasses(ownerState);
+  return /*#__PURE__*/_jsx(TimelineContentRoot, {
+    component: "div",
+    className: clsx(classes.root, className),
+    ownerState: ownerState,
+    ref: ref,
+    ...other
+  });
+});
+process.env.NODE_ENV !== "production" ? TimelineContent.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,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * 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])
+} : void 0;
+export default TimelineContent;

package/esm/TimelineContent/index.d.ts

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

package/esm/TimelineContent/index.js

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

package/esm/TimelineContent/timelineContentClasses.d.ts

@@ -0,0 +1,16 @@
+export interface TimelineContentClasses {
+  /** Styles applied to the root element. */
+  root: string;
+  /** Styles applied to the root element if `position="right"`. */
+  positionRight: string;
+  /** Styles applied to the root element if `position="left"`. */
+  positionLeft: string;
+  /** Styles applied to the root element if `position="alternate"`. */
+  positionAlternate: string;
+  /** Styles applied to the root element if `position="alternate-reverse"`. */
+  positionAlternateReverse: string;
+}
+export type TimelineContentClassKey = keyof TimelineContentClasses;
+export declare function getTimelineContentUtilityClass(slot: string): string;
+declare const timelineContentClasses: TimelineContentClasses;
+export default timelineContentClasses;

package/esm/TimelineContent/timelineContentClasses.js

@@ -0,0 +1,7 @@
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+export function getTimelineContentUtilityClass(slot) {
+  return generateUtilityClass('MuiTimelineContent', slot);
+}
+const timelineContentClasses = generateUtilityClasses('MuiTimelineContent', ['root', 'positionLeft', 'positionRight', 'positionAlternate', 'positionAlternateReverse']);
+export default timelineContentClasses;

package/esm/TimelineDot/TimelineDot.d.ts

@@ -0,0 +1,44 @@
+import * as React from 'react';
+import { OverridableStringUnion } from '@mui/types';
+import { SxProps } from '@mui/system';
+import { Theme } from '@mui/material/styles';
+import { InternalStandardProps as StandardProps } from '@mui/material';
+import { TimelineDotClasses } from "./timelineDotClasses.js";
+export interface TimelineDotPropsVariantOverrides {}
+export interface TimelineDotPropsColorOverrides {}
+export interface TimelineDotProps extends StandardProps<React.HTMLAttributes<HTMLSpanElement>> {
+  /**
+   * The content of the component.
+   */
+  children?: React.ReactNode;
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes?: Partial<TimelineDotClasses>;
+  /**
+   * The dot can have a different colors.
+   * @default 'grey'
+   */
+  color?: OverridableStringUnion<'inherit' | 'grey' | 'primary' | 'secondary' | 'error' | 'info' | 'success' | 'warning', TimelineDotPropsColorOverrides>;
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx?: SxProps<Theme>;
+  /**
+   * The dot can appear filled or outlined.
+   * @default 'filled'
+   */
+  variant?: OverridableStringUnion<'filled' | 'outlined', TimelineDotPropsVariantOverrides>;
+}
+
+/**
+ *
+ * Demos:
+ *
+ * - [Timeline](https://next.mui.com/material-ui/react-timeline/)
+ *
+ * API:
+ *
+ * - [TimelineDot API](https://next.mui.com/material-ui/api/timeline-dot/)
+ */
+export default function TimelineDot(props: TimelineDotProps): React.JSX.Element;

package/{node → esm}/TimelineDot/TimelineDot.js

@@ -1,20 +1,13 @@
-"use strict";
 'use client';
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var React = _interopRequireWildcard(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _clsx = _interopRequireDefault(require("clsx"));
-var _styles = require("@mui/material/styles");
-var _utils = require("@mui/material/utils");
-var _base = require("@mui/base");
-var _timelineDotClasses = require("./timelineDotClasses");
-var _jsxRuntime = require("react/jsx-runtime");
+import * as React from 'react';
+import PropTypes from 'prop-types';
+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.js";
+import { jsx as _jsx } from "react/jsx-runtime";
 const useUtilityClasses = ownerState => {
   const {
     color,
@@ -22,18 +15,18 @@ const useUtilityClasses = ownerState => {
     classes
   } = ownerState;
   const slots = {
-    root: ['root', variant, color !== 'inherit' && `${variant}${(0, _utils.capitalize)(color)}`]
+    root: ['root', variant, color !== 'inherit' && `${variant}${capitalize(color)}`]
   };
-  return (0, _base.unstable_composeClasses)(slots, _timelineDotClasses.getTimelineDotUtilityClass, classes);
+  return composeClasses(slots, getTimelineDotUtilityClass, classes);
 };
-const TimelineDotRoot = (0, _styles.styled)('span', {
+const TimelineDotRoot = styled('span', {
   name: 'MuiTimelineDot',
   slot: 'Root',
   overridesResolver: (props, styles) => {
     const {
       ownerState
     } = props;
-    return [styles.root, styles[ownerState.color !== 'inherit' && `${ownerState.variant}${(0, _utils.capitalize)(ownerState.color)}`], styles[ownerState.variant]];
+    return [styles.root, styles[ownerState.color !== 'inherit' && `${ownerState.variant}${capitalize(ownerState.color)}`], styles[ownerState.variant]];
   }
 })(({
   ownerState,
@@ -72,7 +65,7 @@ const TimelineDotRoot = (0, _styles.styled)('span', {
   })
 }));
 const TimelineDot = /*#__PURE__*/React.forwardRef(function TimelineDot(inProps, ref) {
-  const props = (0, _styles.useThemeProps)({
+  const props = useThemeProps({
     props: inProps,
     name: 'MuiTimelineDot'
   });
@@ -88,8 +81,8 @@ const TimelineDot = /*#__PURE__*/React.forwardRef(function TimelineDot(inProps,
     variant
   };
   const classes = useUtilityClasses(ownerState);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(TimelineDotRoot, {
-    className: (0, _clsx.default)(classes.root, className),
+  return /*#__PURE__*/_jsx(TimelineDotRoot, {
+    className: clsx(classes.root, className),
     ownerState: ownerState,
     ref: ref,
     ...other
@@ -103,28 +96,28 @@ process.env.NODE_ENV !== "production" ? TimelineDot.propTypes /* remove-proptype
   /**
    * The content of the component.
    */
-  children: _propTypes.default.node,
+  children: PropTypes.node,
   /**
    * Override or extend the styles applied to the component.
    */
-  classes: _propTypes.default.object,
+  classes: PropTypes.object,
   /**
    * @ignore
    */
-  className: _propTypes.default.string,
+  className: PropTypes.string,
   /**
    * The dot can have a different colors.
    * @default 'grey'
    */
-  color: _propTypes.default /* @typescript-to-proptypes-ignore */.oneOfType([_propTypes.default.oneOf(['error', 'grey', 'info', 'inherit', 'primary', 'secondary', 'success', 'warning']), _propTypes.default.string]),
+  color: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['error', 'grey', 'info', 'inherit', 'primary', 'secondary', 'success', 'warning']), PropTypes.string]),
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object, _propTypes.default.bool])), _propTypes.default.func, _propTypes.default.object]),
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
   /**
    * The dot can appear filled or outlined.
    * @default 'filled'
    */
-  variant: _propTypes.default /* @typescript-to-proptypes-ignore */.oneOfType([_propTypes.default.oneOf(['filled', 'outlined']), _propTypes.default.string])
+  variant: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['filled', 'outlined']), PropTypes.string])
 } : void 0;
-var _default = exports.default = TimelineDot;
+export default TimelineDot;

package/esm/TimelineDot/index.d.ts

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

package/esm/TimelineDot/index.js

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

package/esm/TimelineDot/timelineDotClasses.d.ts

@@ -0,0 +1,24 @@
+export interface TimelineDotClasses {
+  /** Styles applied to the root element. */
+  root: string;
+  /** Styles applied to the root element if `variant="filled"`. */
+  filled: string;
+  /** Styles applied to the root element if `variant="outlined"`. */
+  outlined: string;
+  /** Styles applied to the root element if `color="grey"` and `variant="filled"`. */
+  filledGrey: string;
+  /** Styles applied to the root element if `color="grey"` and `variant="outlined"`. */
+  outlinedGrey: string;
+  /** Styles applied to the root element if `color="primary"` and `variant="filled"`. */
+  filledPrimary: string;
+  /** Styles applied to the root element if `color="primary"` and `variant="outlined"`. */
+  outlinedPrimary: string;
+  /** Styles applied to the root element if `color="secondary"` and `variant="filled"`. */
+  filledSecondary: string;
+  /** Styles applied to the root element if `color="secondary"` and `variant="outlined"`. */
+  outlinedSecondary: string;
+}
+export type TimelineDotClassKey = keyof TimelineDotClasses;
+export declare function getTimelineDotUtilityClass(slot: string): string;
+declare const timelineDotClasses: TimelineDotClasses;
+export default timelineDotClasses;

package/esm/TimelineDot/timelineDotClasses.js

@@ -0,0 +1,7 @@
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+export function getTimelineDotUtilityClass(slot) {
+  return generateUtilityClass('MuiTimelineDot', slot);
+}
+const timelineDotClasses = generateUtilityClasses('MuiTimelineDot', ['root', 'filled', 'outlined', 'filledGrey', 'outlinedGrey', 'filledPrimary', 'outlinedPrimary', 'filledSecondary', 'outlinedSecondary']);
+export default timelineDotClasses;

package/esm/TimelineItem/TimelineItem.d.ts

@@ -0,0 +1,35 @@
+import * as React from 'react';
+import { SxProps } from '@mui/system';
+import { Theme } from '@mui/material/styles';
+import { InternalStandardProps as StandardProps } from '@mui/material';
+import { TimelineItemClasses } from "./timelineItemClasses.js";
+export interface TimelineItemProps extends StandardProps<React.HTMLAttributes<HTMLDivElement>> {
+  /**
+   * The position where the timeline's item should appear.
+   */
+  position?: 'left' | 'right' | 'alternate' | 'alternate-reverse';
+  /**
+   * The content of the component.
+   */
+  children?: React.ReactNode;
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes?: Partial<TimelineItemClasses>;
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx?: SxProps<Theme>;
+}
+
+/**
+ *
+ * Demos:
+ *
+ * - [Timeline](https://next.mui.com/material-ui/react-timeline/)
+ *
+ * API:
+ *
+ * - [TimelineItem API](https://next.mui.com/material-ui/api/timeline-item/)
+ */
+export default function TimelineItem(props: TimelineItemProps): React.JSX.Element;