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

package/modern/SpeedDial/SpeedDial.d.ts

@@ -0,0 +1,121 @@
+import * as React from 'react';
+import { SxProps } from '@mui/system';
+import { Theme } from "../styles/index.js";
+import { InternalStandardProps as StandardProps } from "../index.js";
+import { FabProps } from "../Fab/index.js";
+import { TransitionProps } from "../transitions/index.js";
+import { SpeedDialClasses } from "./speedDialClasses.js";
+import { CreateSlotsAndSlotProps, SlotComponentProps } from "../utils/types.js";
+export type CloseReason = 'toggle' | 'blur' | 'mouseLeave' | 'escapeKeyDown';
+export type OpenReason = 'toggle' | 'focus' | 'mouseEnter';
+export interface SpeedDialSlots {
+  /**
+   * The component that renders the transition.
+   * [Follow this guide](https://mui.com/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component.
+   * @default Zoom
+   */
+  transition: React.ElementType;
+}
+export type SpeedDialSlotsAndSlotProps = CreateSlotsAndSlotProps<SpeedDialSlots, {
+  /**
+   * Props forwarded to the transition slot.
+   * By default, the avaible props are based on the [Zoom](https://mui.com/material-ui/api/zoom/#props) component.
+   */
+  transition: SlotComponentProps<React.ElementType, TransitionProps, SpeedDialOwnerState>;
+}>;
+export interface SpeedDialProps extends Omit<StandardProps<React.HTMLAttributes<HTMLDivElement>, 'children'>, 'slots' | 'slotProps'>, SpeedDialSlotsAndSlotProps {
+  /**
+   * SpeedDialActions to display when the SpeedDial is `open`.
+   */
+  children?: React.ReactNode;
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes?: Partial<SpeedDialClasses>;
+  /**
+   * The aria-label of the button element.
+   * Also used to provide the `id` for the `SpeedDial` element and its children.
+   */
+  ariaLabel: string;
+  /**
+   * The direction the actions open relative to the floating action button.
+   * @default 'up'
+   */
+  direction?: 'up' | 'down' | 'left' | 'right';
+  /**
+   * If `true`, the SpeedDial is hidden.
+   * @default false
+   */
+  hidden?: boolean;
+  /**
+   * Props applied to the [`Fab`](https://mui.com/material-ui/api/fab/) element.
+   * @default {}
+   */
+  FabProps?: Partial<FabProps>;
+  /**
+   * The icon to display in the SpeedDial Fab. The `SpeedDialIcon` component
+   * provides a default Icon with animation.
+   */
+  icon?: React.ReactNode;
+  /**
+   * Callback fired when the component requests to be closed.
+   *
+   * @param {object} event The event source of the callback.
+   * @param {string} reason Can be: `"toggle"`, `"blur"`, `"mouseLeave"`, `"escapeKeyDown"`.
+   */
+  onClose?: (event: React.SyntheticEvent<{}>, reason: CloseReason) => void;
+  /**
+   * Callback fired when the component requests to be open.
+   *
+   * @param {object} event The event source of the callback.
+   * @param {string} reason Can be: `"toggle"`, `"focus"`, `"mouseEnter"`.
+   */
+  onOpen?: (event: React.SyntheticEvent<{}>, reason: OpenReason) => void;
+  /**
+   * If `true`, the component is shown.
+   */
+  open?: boolean;
+  /**
+   * The icon to display in the SpeedDial Fab when the SpeedDial is open.
+   */
+  openIcon?: React.ReactNode;
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx?: SxProps<Theme>;
+  /**
+   * The component used for the transition.
+   * [Follow this guide](https://mui.com/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component.
+   * @default Zoom
+   * * @deprecated Use `slots.transition` instead. This prop will be removed in v7. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/)
+   */
+  TransitionComponent?: React.JSXElementConstructor<TransitionProps>;
+  /**
+   * The duration for the transition, in milliseconds.
+   * You may specify a single timeout for all transitions, or individually with an object.
+   * @default {
+   *   enter: theme.transitions.duration.enteringScreen,
+   *   exit: theme.transitions.duration.leavingScreen,
+   * }
+   */
+  transitionDuration?: TransitionProps['timeout'];
+  /**
+   * Props applied to the transition element.
+   * By default, the element is based on this [`Transition`](https://reactcommunity.org/react-transition-group/transition/) component.
+   * @deprecated Use `slotProps.transition` instead. This prop will be removed in v7. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/)
+   */
+  TransitionProps?: TransitionProps;
+}
+export interface SpeedDialOwnerState extends SpeedDialProps {}
+
+/**
+ *
+ * Demos:
+ *
+ * - [Speed Dial](https://next.mui.com/material-ui/react-speed-dial/)
+ *
+ * API:
+ *
+ * - [SpeedDial API](https://next.mui.com/material-ui/api/speed-dial/)
+ */
+export default function SpeedDial(props: SpeedDialProps): React.JSX.Element;

package/modern/SpeedDial/index.d.ts

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

package/modern/SpeedDial/speedDialClasses.d.ts

@@ -0,0 +1,22 @@
+export interface SpeedDialClasses {
+  /** Styles applied to the root element. */
+  root: string;
+  /** Styles applied to the Fab component. */
+  fab: string;
+  /** Styles applied to the root element if direction="up" */
+  directionUp: string;
+  /** Styles applied to the root element if direction="down" */
+  directionDown: string;
+  /** Styles applied to the root element if direction="left" */
+  directionLeft: string;
+  /** Styles applied to the root element if direction="right" */
+  directionRight: string;
+  /** Styles applied to the actions (`children` wrapper) element. */
+  actions: string;
+  /** Styles applied to the actions (`children` wrapper) element if `open={false}`. */
+  actionsClosed: string;
+}
+export type SpeedDialClassKey = keyof SpeedDialClasses;
+export declare function getSpeedDialUtilityClass(slot: string): string;
+declare const speedDialClasses: SpeedDialClasses;
+export default speedDialClasses;

package/modern/SpeedDialAction/SpeedDialAction.d.ts

@@ -0,0 +1,117 @@
+import * as React from 'react';
+import { SxProps } from '@mui/system';
+import { Theme } from "../styles/index.js";
+import { InternalStandardProps as StandardProps } from "../index.js";
+import { FabProps } from "../Fab/index.js";
+import { TooltipProps } from "../Tooltip/index.js";
+import { SpeedDialActionClasses } from "./speedDialActionClasses.js";
+import { CreateSlotsAndSlotProps, SlotProps } from "../utils/types.js";
+export interface SpeedDialActionSlots {
+  /**
+   * The component that renders the fab.
+   * @default Fab
+   */
+  fab?: React.ElementType;
+  /**
+   * The component that renders the tooltip.
+   * @default Tooltip
+   */
+  tooltip?: React.ElementType;
+  /**
+   * The component that renders the static tooltip.
+   * @default 'span'
+   */
+  staticTooltip?: React.ElementType;
+  /**
+   * The component that renders the static tooltip label.
+   * @default 'span'
+   */
+  staticTooltipLabel?: React.ElementType;
+}
+export interface SpeedDialActionFabSlotPropsOverrides {}
+export interface SpeedDialActionTooltipSlotPropsOverrides {}
+export interface SpeedDialActionStaticTooltipSlotPropsOverrides {}
+export interface SpeedDialActionStaticTooltipLabelSlotPropsOverrides {}
+export type SpeedDialActionSlotsAndSlotProps = CreateSlotsAndSlotProps<SpeedDialActionSlots, {
+  /**
+   * Props forwarded to the fab slot.
+   * By default, the avaible props are based on the [Fab](https://mui.com/material-ui/api/fab/#props) component.
+   */
+  fab: SlotProps<React.ElementType<FabProps>, SpeedDialActionFabSlotPropsOverrides, SpeedDialActionOwnerState>;
+  /**
+   * Props forwarded to the tooltip slot.
+   * By default, the avaible props are based on the [Tooltip](https://mui.com/material-ui/api/tooltip/#props) component.
+   */
+  tooltip: SlotProps<React.ElementType<TooltipProps>, SpeedDialActionTooltipSlotPropsOverrides, SpeedDialActionOwnerState>;
+  /**
+   * Props forwarded to the static tooltip slot.
+   * By default, the avaible props are based on a span element.
+   */
+  staticTooltip: SlotProps<'span', SpeedDialActionStaticTooltipSlotPropsOverrides, SpeedDialActionOwnerState>;
+  /**
+   * Props forwarded to the static tooltip label slot.
+   * By default, the avaible props are based on a span element.
+   */
+  staticTooltipLabel: SlotProps<'span', SpeedDialActionStaticTooltipLabelSlotPropsOverrides, SpeedDialActionOwnerState>;
+}>;
+export interface SpeedDialActionProps extends Omit<StandardProps<Partial<TooltipProps>, 'children'>, 'slotProps' | 'slots'>, SpeedDialActionSlotsAndSlotProps {
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes?: Partial<SpeedDialActionClasses>;
+  /**
+   * Props applied to the [`Fab`](https://mui.com/material-ui/api/fab/) component.
+   * @default {}
+   * @deprecated Use `slotProps.fab` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   */
+  FabProps?: Partial<FabProps>;
+  /**
+   * Adds a transition delay, to allow a series of SpeedDialActions to be animated.
+   * @default 0
+   */
+  delay?: number;
+  /**
+   * The icon to display in the SpeedDial Fab.
+   */
+  icon?: React.ReactNode;
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx?: SxProps<Theme>;
+  /**
+   * `classes` prop applied to the [`Tooltip`](https://mui.com/material-ui/api/tooltip/) element.
+   * @deprecated Use `slotProps.tooltip.classes` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   */
+  TooltipClasses?: TooltipProps['classes'];
+  /**
+   * Placement of the tooltip.
+   * @default 'left'
+   * @deprecated Use `slotProps.tooltip.placement` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   */
+  tooltipPlacement?: TooltipProps['placement'];
+  /**
+   * Label to display in the tooltip.
+   * @deprecated Use `slotProps.tooltip.title` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   */
+  tooltipTitle?: React.ReactNode;
+  /**
+   * Make the tooltip always visible when the SpeedDial is open.
+   * @default false
+   * @deprecated Use `slotProps.tooltip.open` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   */
+  tooltipOpen?: boolean;
+}
+
+/**
+ *
+ * Demos:
+ *
+ * - [Speed Dial](https://next.mui.com/material-ui/react-speed-dial/)
+ *
+ * API:
+ *
+ * - [SpeedDialAction API](https://next.mui.com/material-ui/api/speed-dial-action/)
+ * - inherits [Tooltip API](https://next.mui.com/material-ui/api/tooltip/)
+ */
+export default function SpeedDialAction(props: SpeedDialActionProps): React.JSX.Element;
+export interface SpeedDialActionOwnerState extends Omit<SpeedDialActionProps, 'slots' | 'slotProps'> {}

package/modern/SpeedDialAction/index.d.ts

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

package/modern/SpeedDialAction/speedDialActionClasses.d.ts

@@ -0,0 +1,20 @@
+export interface SpeedDialActionClasses {
+  /** Styles applied to the Fab component. */
+  fab: string;
+  /** Styles applied to the Fab component if `open={false}`. */
+  fabClosed: string;
+  /** Styles applied to the root element if `tooltipOpen={true}`. */
+  staticTooltip: string;
+  /** Styles applied to the root element if `tooltipOpen={true}` and `open={false}`. */
+  staticTooltipClosed: string;
+  /** Styles applied to the static tooltip label if `tooltipOpen={true}`. */
+  staticTooltipLabel: string;
+  /** Styles applied to the root element if `tooltipOpen={true}` and `tooltipPlacement="left"`` */
+  tooltipPlacementLeft: string;
+  /** Styles applied to the root element if `tooltipOpen={true}` and `tooltipPlacement="right"`` */
+  tooltipPlacementRight: string;
+}
+export type SpeedDialActionClassKey = keyof SpeedDialActionClasses;
+export declare function getSpeedDialActionUtilityClass(slot: string): string;
+declare const speedDialActionClasses: SpeedDialActionClasses;
+export default speedDialActionClasses;

package/modern/SpeedDialIcon/SpeedDialIcon.d.ts

@@ -0,0 +1,43 @@
+import * as React from 'react';
+import { SxProps } from '@mui/system';
+import { Theme } from "../styles/index.js";
+import { InternalStandardProps as StandardProps } from "../index.js";
+import { SpeedDialIconClasses } from "./speedDialIconClasses.js";
+export interface SpeedDialIconProps extends StandardProps<React.HTMLAttributes<HTMLSpanElement>, 'children'> {
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes?: Partial<SpeedDialIconClasses>;
+  /**
+   * The icon to display.
+   */
+  icon?: React.ReactNode;
+  /**
+   * The icon to display in the SpeedDial Floating Action Button when the SpeedDial is open.
+   */
+  openIcon?: React.ReactNode;
+  /**
+   * @ignore
+   * If `true`, the component is shown.
+   */
+  open?: boolean;
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx?: SxProps<Theme>;
+}
+
+/**
+ *
+ * Demos:
+ *
+ * - [Speed Dial](https://next.mui.com/material-ui/react-speed-dial/)
+ *
+ * API:
+ *
+ * - [SpeedDialIcon API](https://next.mui.com/material-ui/api/speed-dial-icon/)
+ */
+declare const SpeedDialIcon: ((props: SpeedDialIconProps) => React.JSX.Element) & {
+  muiName: string;
+};
+export default SpeedDialIcon;

package/modern/SpeedDialIcon/index.d.ts

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

package/modern/SpeedDialIcon/speedDialIconClasses.d.ts

@@ -0,0 +1,18 @@
+export interface SpeedDialIconClasses {
+  /** Styles applied to the root element. */
+  root: string;
+  /** Styles applied to the icon component. */
+  icon: string;
+  /** Styles applied to the icon component if `open={true}`. */
+  iconOpen: string;
+  /** Styles applied to the icon when an `openIcon` is provided and if `open={true}`. */
+  iconWithOpenIconOpen: string;
+  /** Styles applied to the `openIcon` if provided. */
+  openIcon: string;
+  /** Styles applied to the `openIcon` if provided and if `open={true}`. */
+  openIconOpen: string;
+}
+export type SpeedDialIconClassKey = keyof SpeedDialIconClasses;
+export declare function getSpeedDialIconUtilityClass(slot: string): string;
+declare const speedDialIconClasses: SpeedDialIconClasses;
+export default speedDialIconClasses;

package/modern/Stack/Stack.d.ts

@@ -0,0 +1,58 @@
+import * as React from 'react';
+import { ResponsiveStyleValue, SxProps, SystemProps } from '@mui/system';
+import { OverrideProps, OverridableComponent } from "../OverridableComponent/index.js";
+import { Theme } from "../styles/createTheme.js";
+export interface StackOwnProps extends SystemProps<Theme> {
+  /**
+   * The content of the component.
+   */
+  children?: React.ReactNode;
+  /**
+   * Defines the `flex-direction` style property.
+   * It is applied for all screen sizes.
+   * @default 'column'
+   */
+  direction?: ResponsiveStyleValue<'row' | 'row-reverse' | 'column' | 'column-reverse'>;
+  /**
+   * Defines the space between immediate children.
+   * @default 0
+   */
+  spacing?: ResponsiveStyleValue<number | string>;
+  /**
+   * Add an element between each child.
+   */
+  divider?: React.ReactNode;
+  /**
+   * If `true`, the CSS flexbox `gap` is used instead of applying `margin` to children.
+   *
+   * While CSS `gap` removes the [known limitations](https://mui.com/joy-ui/react-stack/#limitations),
+   * it is not fully supported in some browsers. We recommend checking https://caniuse.com/?search=flex%20gap before using this flag.
+   *
+   * To enable this flag globally, follow the [theme's default props](https://mui.com/material-ui/customization/theme-components/#default-props) configuration.
+   * @default false
+   */
+  useFlexGap?: boolean;
+  /**
+   * The system prop, which allows defining system overrides as well as additional CSS styles.
+   */
+  sx?: SxProps<Theme>;
+}
+export interface StackTypeMap<AdditionalProps = {}, RootComponent extends React.ElementType = 'div'> {
+  props: AdditionalProps & StackOwnProps;
+  defaultComponent: RootComponent;
+}
+/**
+ *
+ * Demos:
+ *
+ * - [Stack](https://next.mui.com/material-ui/react-stack/)
+ *
+ * API:
+ *
+ * - [Stack API](https://next.mui.com/material-ui/api/stack/)
+ */
+declare const Stack: OverridableComponent<StackTypeMap>;
+export type StackProps<RootComponent extends React.ElementType = StackTypeMap['defaultComponent'], AdditionalProps = {}> = OverrideProps<StackTypeMap<AdditionalProps, RootComponent>, RootComponent> & {
+  component?: React.ElementType;
+};
+export default Stack;

package/modern/Stack/index.d.ts

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

package/modern/Stack/stackClasses.d.ts

@@ -0,0 +1,6 @@
+import { StackClasses } from '@mui/system';
+export type { StackClassKey } from '@mui/system';
+export type { StackClasses };
+export declare function getStackUtilityClass(slot: string): string;
+declare const stackClasses: StackClasses;
+export default stackClasses;

package/modern/Step/Step.d.ts

@@ -0,0 +1,70 @@
+import * as React from 'react';
+import { SxProps } from '@mui/system';
+import { OverridableComponent, OverrideProps } from "../OverridableComponent/index.js";
+import { Theme } from "../styles/index.js";
+import { StepClasses } from "./stepClasses.js";
+export interface StepOwnProps {
+  /**
+   * Sets the step as active. Is passed to child components.
+   */
+  active?: boolean;
+  /**
+   * Should be `Step` sub-components such as `StepLabel`, `StepContent`.
+   */
+  children?: React.ReactNode;
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes?: Partial<StepClasses>;
+  /**
+   * Mark the step as completed. Is passed to child components.
+   */
+  completed?: boolean;
+  /**
+   * If `true`, the step is disabled, will also disable the button if
+   * `StepButton` is a child of `Step`. Is passed to child components.
+   */
+  disabled?: boolean;
+  /**
+   * Expand the step.
+   * @default false
+   */
+  expanded?: boolean;
+  /**
+   * The position of the step.
+   * The prop defaults to the value inherited from the parent Stepper component.
+   */
+  index?: number;
+  /**
+   * If `true`, the Step is displayed as rendered last.
+   * The prop defaults to the value inherited from the parent Stepper component.
+   */
+  last?: boolean;
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx?: SxProps<Theme>;
+}
+export interface StepTypeMap<AdditionalProps = {}, RootComponent extends React.ElementType = 'div'> {
+  props: AdditionalProps & StepOwnProps;
+  defaultComponent: RootComponent;
+}
+export type StepProps<RootComponent extends React.ElementType = StepTypeMap['defaultComponent'], AdditionalProps = {
+  component?: React.ElementType;
+}> = OverrideProps<StepTypeMap<AdditionalProps, RootComponent>, RootComponent> & {
+  component?: React.ElementType;
+};
+export type StepClasskey = keyof NonNullable<StepProps['classes']>;
+
+/**
+ *
+ * Demos:
+ *
+ * - [Stepper](https://next.mui.com/material-ui/react-stepper/)
+ *
+ * API:
+ *
+ * - [Step API](https://next.mui.com/material-ui/api/step/)
+ */
+declare const Step: OverridableComponent<StepTypeMap>;
+export default Step;

package/modern/Step/StepContext.d.ts

@@ -0,0 +1,20 @@
+import * as React from 'react';
+export interface StepContextType {
+  index: number;
+  last: boolean;
+  expanded: boolean;
+  icon: React.ReactNode;
+  active: boolean;
+  completed: boolean;
+  disabled: boolean;
+}
+/**
+ * Provides information about the current step in Stepper.
+ */
+declare const StepContext: React.Context<{} | StepContextType>;
+/**
+ * Returns the current StepContext or an empty object if no StepContext
+ * has been defined in the component tree.
+ */
+export declare function useStepContext(): StepContextType | {};
+export default StepContext;

package/modern/Step/index.d.ts

@@ -0,0 +1,6 @@
+export { default } from "./Step.js";
+export * 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/modern/Step/stepClasses.d.ts

@@ -0,0 +1,16 @@
+export interface StepClasses {
+  /** Styles applied to the root element. */
+  root: string;
+  /** Styles applied to the root element if `orientation="horizontal"`. */
+  horizontal: string;
+  /** Styles applied to the root element if `orientation="vertical"`. */
+  vertical: string;
+  /** Styles applied to the root element if `alternativeLabel={true}`. */
+  alternativeLabel: string;
+  /** State class applied to the root element if `completed={true}`. */
+  completed: string;
+}
+export type StepClassKey = keyof StepClasses;
+export declare function getStepUtilityClass(slot: string): string;
+declare const stepClasses: StepClasses;
+export default stepClasses;

package/modern/StepButton/StepButton.d.ts

@@ -0,0 +1,51 @@
+import * as React from 'react';
+import { SxProps } from '@mui/system';
+import { ButtonBaseTypeMap, ExtendButtonBase, ExtendButtonBaseTypeMap } from "../ButtonBase/index.js";
+import { OverrideProps } from "../OverridableComponent/index.js";
+import { Theme } from "../styles/index.js";
+import { StepButtonClasses } from "./stepButtonClasses.js";
+export interface StepButtonOwnProps {
+  /**
+   * Can be a `StepLabel` or a node to place inside `StepLabel` as children.
+   */
+  children?: React.ReactNode;
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes?: Partial<StepButtonClasses>;
+  /**
+   * The icon displayed by the step label.
+   */
+  icon?: React.ReactNode;
+  /**
+   * The optional node to display.
+   */
+  optional?: React.ReactNode;
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx?: SxProps<Theme>;
+}
+export type StepButtonTypeMap<AdditionalProps, RootComponent extends React.ElementType> = ExtendButtonBaseTypeMap<{
+  props: AdditionalProps & StepButtonOwnProps;
+  defaultComponent: RootComponent;
+  ignoredProps: 'disabled';
+}>;
+
+/**
+ *
+ * Demos:
+ *
+ * - [Stepper](https://next.mui.com/material-ui/react-stepper/)
+ *
+ * API:
+ *
+ * - [StepButton API](https://next.mui.com/material-ui/api/step-button/)
+ * - inherits [ButtonBase API](https://next.mui.com/material-ui/api/button-base/)
+ */
+declare const StepButton: ExtendButtonBase<StepButtonTypeMap<{}, ButtonBaseTypeMap['defaultComponent']>>;
+export type StepButtonClasskey = keyof NonNullable<StepButtonProps['classes']>;
+export type StepButtonProps<RootComponent extends React.ElementType = ButtonBaseTypeMap['defaultComponent'], AdditionalProps = {}> = OverrideProps<StepButtonTypeMap<AdditionalProps, RootComponent>, RootComponent> & {
+  component?: React.ElementType;
+};
+export default StepButton;

package/modern/StepButton/index.d.ts

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

package/modern/StepButton/stepButtonClasses.d.ts

@@ -0,0 +1,14 @@
+export interface StepButtonClasses {
+  /** Styles applied to the root element. */
+  root: string;
+  /** Styles applied to the root element if `orientation="horizontal"`. */
+  horizontal: string;
+  /** Styles applied to the root element if `orientation="vertical"`. */
+  vertical: string;
+  /** Styles applied to the `ButtonBase` touch-ripple. */
+  touchRipple: string;
+}
+export type StepButtonClassKey = keyof StepButtonClasses;
+export declare function getStepButtonUtilityClass(slot: string): string;
+declare const stepButtonClasses: StepButtonClasses;
+export default stepButtonClasses;

package/modern/StepConnector/StepConnector.d.ts

@@ -0,0 +1,29 @@
+import * as React from 'react';
+import { SxProps } from '@mui/system';
+import { InternalStandardProps as StandardProps } from "../index.js";
+import { Theme } from "../styles/index.js";
+import { StepConnectorClasses } from "./stepConnectorClasses.js";
+export type StepConnectorIcon = React.ReactElement<unknown> | string | number;
+export interface StepConnectorProps extends StandardProps<React.HTMLAttributes<HTMLDivElement>, 'children'> {
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes?: Partial<StepConnectorClasses>;
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx?: SxProps<Theme>;
+}
+export type StepConnectorClasskey = keyof NonNullable<StepConnectorProps['classes']>;
+
+/**
+ *
+ * Demos:
+ *
+ * - [Stepper](https://next.mui.com/material-ui/react-stepper/)
+ *
+ * API:
+ *
+ * - [StepConnector API](https://next.mui.com/material-ui/api/step-connector/)
+ */
+export default function StepConnector(props: StepConnectorProps): React.JSX.Element;

package/modern/StepConnector/index.d.ts

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