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

package/CalendarPicker/index.js

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

package/CalendarPickerSkeleton/index.js

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

package/ClockPicker/index.js

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

package/DatePicker/index.js

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

package/DateRangePicker/index.js

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

package/DateRangePickerDay/index.js

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

package/DateTimePicker/index.js

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

package/DesktopDatePicker/index.js

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

package/DesktopDateRangePicker/index.js

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

package/DesktopDateTimePicker/index.js

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

package/DesktopTimePicker/index.js

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

package/LoadingButton/LoadingButton.d.ts

@@ -1,78 +1,6 @@
-import { ExtendButton, ExtendButtonTypeMap, ButtonClasses } from '@mui/material/Button';
-import { OverrideProps } from '@mui/material/OverridableComponent';
-import { Theme } from '@mui/material/styles';
-import { SxProps } from '@mui/system';
-
-export interface LoadingButtonOwnProps {
-  /**
-   * Override or extend the styles applied to the component.
-   */
-  classes?: Partial<ButtonClasses> & {
-    /** Styles applied to the root element. */
-    root?: string;
-    /** Styles applied to the root element if `loading={true}`. */
-    loading?: string;
-    /** Styles applied to the loadingIndicator element. */
-    loadingIndicator?: string;
-    /** Styles applied to the loadingIndicator element if `loadingPosition="center"`. */
-    loadingIndicatorCenter?: string;
-    /** Styles applied to the loadingIndicator element if `loadingPosition="start"`. */
-    loadingIndicatorStart?: string;
-    /** Styles applied to the loadingIndicator element if `loadingPosition="end"`. */
-    loadingIndicatorEnd?: string;
-    /** Styles applied to the endIcon element if `loading={true}` and `loadingPosition="end"`. */
-    endIconLoadingEnd?: string;
-    /** Styles applied to the startIcon element if `loading={true}` and `loadingPosition="start"`. */
-    startIconLoadingStart?: string;
-  };
-  /**
-   * If `true`, the loading indicator is shown and the button becomes disabled.
-   * @default false
-   */
-  loading?: boolean;
-  /**
-   * 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?: React.ReactNode;
-  /**
-   * The loading indicator can be positioned on the start, end, or the center of the button.
-   * @default 'center'
-   */
-  loadingPosition?: 'start' | 'end' | 'center';
-  /**
-   * The system prop that allows defining system overrides as well as additional CSS styles.
-   */
-  sx?: SxProps<Theme>;
-}
-
-export type LoadingButtonTypeMap<
-  AdditionalProps = {},
-  RootComponent extends React.ElementType = 'button',
-> = ExtendButtonTypeMap<{
-  props: AdditionalProps & LoadingButtonOwnProps;
-  defaultComponent: RootComponent;
-}>;
-
-/**
- *
- * Demos:
- *
- * - [Button Group](https://next.mui.com/material-ui/react-button-group/)
- * - [Button](https://next.mui.com/material-ui/react-button/)
- *
- * API:
- *
- * - [LoadingButton API](https://next.mui.com/material-ui/api/loading-button/)
- * - inherits [Button API](https://next.mui.com/material-ui/api/button/)
- */
-declare const LoadingButton: ExtendButton<LoadingButtonTypeMap>;
-
-export type LoadingButtonProps<
-  RootComponent extends React.ElementType = LoadingButtonTypeMap['defaultComponent'],
-  AdditionalProps = {},
-> = OverrideProps<LoadingButtonTypeMap<AdditionalProps, RootComponent>, RootComponent>;
-
-export default LoadingButton;
+export { default } from '@mui/material/Button';
+export * from '@mui/material/Button';
+export {
+  ButtonProps as LoadingButtonProps,
+  ButtonClassKey as LoadingButtonClassKey,
+} from '@mui/material/Button';

package/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/LoadingButton/index.d.ts

@@ -1,5 +1,2 @@
 export { default } from './LoadingButton';
 export * from './LoadingButton';
-
-export { default as loadingButtonClasses } from './loadingButtonClasses';
-export * from './loadingButtonClasses';

package/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/LocalizationProvider/index.js

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

package/Masonry/Masonry.d.ts

@@ -56,11 +56,11 @@ export interface MasonryTypeMap<
  *
  * Demos:
  *
- * - [Masonry](https://next.mui.com/material-ui/react-masonry/)
+ * - [Masonry](https://mui.com/material-ui/react-masonry/)
  *
  * API:
  *
- * - [Masonry API](https://next.mui.com/material-ui/api/masonry/)
+ * - [Masonry API](https://mui.com/material-ui/api/masonry/)
  */
 declare const Masonry: OverridableComponent<MasonryTypeMap>;
 

package/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/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/MobileDatePicker/index.js

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

package/MobileDateRangePicker/index.js

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

package/MobileDateTimePicker/index.js

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

package/MobileTimePicker/index.js

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

package/MonthPicker/index.js

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

package/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/PaginationItem/index.js

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

package/PickersDay/index.js

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

package/README.md

@@ -9,7 +9,7 @@ Install the package in your project directory with:
 <!-- #default-branch-switch -->
 
 ```bash
-npm install @mui/lab@next
+npm install @mui/lab
 ```
 
 The lab has peer dependencies on the Material Design components and on the Emotion library.
@@ -18,11 +18,11 @@ If you are not already using them in your project, you can install with:
 <!-- #default-branch-switch -->
 
 ```bash
-npm install @mui/material@next @emotion/react @emotion/styled
+npm install @mui/material @emotion/react @emotion/styled
 ```
 
 ## Documentation
 
 <!-- #default-branch-switch -->
 
-Visit [https://next.mui.com/material-ui/about-the-lab/](https://next.mui.com/material-ui/about-the-lab/) to view the full documentation.
+Visit [https://mui.com/material-ui/about-the-lab/](https://mui.com/material-ui/about-the-lab/) to view the full documentation.

package/Rating/index.js

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

package/Skeleton/index.js

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

package/SpeedDial/index.js

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

package/SpeedDialAction/index.js

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

package/SpeedDialIcon/index.js

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

package/StaticDatePicker/index.js

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

package/StaticDateRangePicker/index.js

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

package/StaticDateTimePicker/index.js

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

package/StaticTimePicker/index.js

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