@mui/lab 5.0.0-alpha.98 → 6.0.0-alpha.0

package/LoadingButton/LoadingButton.js

@@ -1,3 +1,5 @@
+'use client';
+
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import _extends from "@babel/runtime/helpers/esm/extends";
 const _excluded = ["children", "disabled", "id", "loading", "loadingIndicator", "loadingPosition", "variant"];
@@ -8,11 +10,11 @@ import { capitalize, unstable_useId as useId } from '@mui/material/utils';
 import { unstable_composeClasses as composeClasses } from '@mui/base';
 import { styled, useThemeProps } from '@mui/material/styles';
 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 loadingButtonClasses, { getLoadingButtonUtilityClass } from './loadingButtonClasses';
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const useUtilityClasses = ownerState => {
   const {
     loading,
@@ -27,11 +29,10 @@ const useUtilityClasses = ownerState => {
   };
   const composedClasses = composeClasses(slots, getLoadingButtonUtilityClass, classes);
   return _extends({}, classes, composedClasses);
-}; // TODO use `import { rootShouldForwardProp } from '../styles/styled';` once move to core
-
+};
 
+// TODO use `import { rootShouldForwardProp } from '../styles/styled';` 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',
@@ -77,7 +78,7 @@ const LoadingButtonRoot = styled(Button, {
     marginLeft: -8
   }
 }));
-const LoadingButtonLoadingIndicator = styled('div', {
+const LoadingButtonLoadingIndicator = styled('span', {
   name: 'MuiLoadingButton',
   slot: 'LoadingIndicator',
   overridesResolver: (props, styles) => {
@@ -113,29 +114,28 @@ const LoadingButtonLoadingIndicator = styled('div', {
   right: -10
 }));
 const LoadingButton = /*#__PURE__*/React.forwardRef(function LoadingButton(inProps, ref) {
+  const contextProps = React.useContext(ButtonGroupContext);
+  const resolvedProps = resolveProps(contextProps, inProps);
   const props = useThemeProps({
-    props: inProps,
+    props: resolvedProps,
     name: 'MuiLoadingButton'
   });
-
   const {
-    children,
-    disabled = false,
-    id: idProp,
-    loading = false,
-    loadingIndicator: loadingIndicatorProp,
-    loadingPosition = 'center',
-    variant = 'text'
-  } = props,
-        other = _objectWithoutPropertiesLoose(props, _excluded);
-
+      children,
+      disabled = false,
+      id: idProp,
+      loading = false,
+      loadingIndicator: loadingIndicatorProp,
+      loadingPosition = 'center',
+      variant = 'text'
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
   const id = useId(idProp);
-  const loadingIndicator = loadingIndicatorProp != null ? loadingIndicatorProp : /*#__PURE__*/_jsx(CircularProgress, {
+  const loadingIndicator = loadingIndicatorProp ?? /*#__PURE__*/_jsx(CircularProgress, {
     "aria-labelledby": id,
     color: "inherit",
     size: 16
   });
-
   const ownerState = _extends({}, props, {
     disabled,
     loading,
@@ -143,7 +143,6 @@ const LoadingButton = /*#__PURE__*/React.forwardRef(function LoadingButton(inPro
     loadingPosition,
     variant
   });
-
   const classes = useUtilityClasses(ownerState);
   const loadingButtonLoadingIndicator = loading ? /*#__PURE__*/_jsx(LoadingButtonLoadingIndicator, {
     className: classes.loadingIndicator,
@@ -161,41 +160,33 @@ const LoadingButton = /*#__PURE__*/React.forwardRef(function LoadingButton(inPro
     children: [ownerState.loadingPosition === 'end' ? children : loadingButtonLoadingIndicator, ownerState.loadingPosition === 'end' ? loadingButtonLoadingIndicator : children]
   }));
 });
-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 "yarn proptypes"     |
-  // ----------------------------------------------------------------------
-
+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.
+   * 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.
@@ -203,7 +194,6 @@ process.env.NODE_ENV !== "production" ? LoadingButton.propTypes
    * @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'
@@ -212,25 +202,19 @@ process.env.NODE_ENV !== "production" ? LoadingButton.propTypes
     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])
+  variant: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['contained', 'outlined', 'text']), PropTypes.string])
 } : void 0;
 export default LoadingButton;

package/LoadingButton/loadingButtonClasses.d.ts

@@ -16,7 +16,7 @@ export interface LoadingButtonClasses {
     /** Styles applied to the startIcon element if `loading={true}` and `loadingPosition="start"`. */
     startIconLoadingStart: string;
 }
-export declare type LoadingButtonClassKey = keyof LoadingButtonClasses;
+export type LoadingButtonClassKey = keyof LoadingButtonClasses;
 export declare function getLoadingButtonUtilityClass(slot: string): string;
 declare const loadingButtonClasses: LoadingButtonClasses;
 export default loadingButtonClasses;

package/LoadingButton/loadingButtonClasses.js

@@ -1,4 +1,5 @@
-import { generateUtilityClass, generateUtilityClasses } from '@mui/base';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
 export function getLoadingButtonUtilityClass(slot) {
   return generateUtilityClass('MuiLoadingButton', slot);
 }

package/LocalizationProvider/LocalizationProvider.d.ts

@@ -1,10 +1,11 @@
 import * as React from 'react';
-declare type LocalizationProviderComponent = ((props: LocalizationProviderProps & React.RefAttributes<HTMLDivElement>) => JSX.Element) & {
+type LocalizationProviderComponent = ((props: LocalizationProviderProps & React.RefAttributes<HTMLDivElement>) => JSX.Element) & {
     propTypes?: any;
 };
 /**
+ * @deprecated The LocalizationProvider component was moved from `@mui/lab` to `@mui/x-date-pickers`. More information about this migration on our blog: https://mui.com/blog/lab-date-pickers-to-mui-x/.
  * @ignore - do not document.
  */
 declare const LocalizationProvider: LocalizationProviderComponent;
 export default LocalizationProvider;
-export declare type LocalizationProviderProps = Record<any, any>;
+export type LocalizationProviderProps = Record<any, any>;

package/LocalizationProvider/LocalizationProvider.js

@@ -1,14 +1,15 @@
+'use client';
+
 import * as React from 'react';
 let warnedOnce = false;
-
 const warn = () => {
   if (!warnedOnce) {
     console.warn(['MUI: The LocalizationProvider component was moved from `@mui/lab` to `@mui/x-date-pickers`.', '', "You should use `import { LocalizationProvider } from '@mui/x-date-pickers'`", "or `import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider'`", '', 'More information about this migration on our blog: https://mui.com/blog/lab-date-pickers-to-mui-x/.'].join('\n'));
     warnedOnce = true;
   }
 };
-
 /**
+ * @deprecated The LocalizationProvider component was moved from `@mui/lab` to `@mui/x-date-pickers`. More information about this migration on our blog: https://mui.com/blog/lab-date-pickers-to-mui-x/.
  * @ignore - do not document.
  */
 const LocalizationProvider = /*#__PURE__*/React.forwardRef(function DeprecatedLocalizationProvider() {

package/Masonry/Masonry.d.ts

@@ -3,44 +3,54 @@ import { OverridableComponent, OverrideProps } from '@mui/material/OverridableCo
 import { Theme } from '@mui/material/styles';
 import { MasonryClasses } from './masonryClasses';
 
-export interface MasonryTypeMap<P = {}, D extends React.ElementType = 'div'> {
-  props: P & {
-    /**
-     * The content of the component.
-     */
-    children: NonNullable<React.ReactNode>;
-    /**
-     * Override or extend the styles applied to the component.
-     */
-    classes?: Partial<MasonryClasses>;
-    /**
-     * Number of columns.
-     * @default 4
-     */
-    columns?: ResponsiveStyleValue<number | string>;
-    /**
-     * The default number of columns of the component. This is provided for server-side rendering.
-     */
-    defaultColumns?: number;
-    /**
-     * The default height of the component in px. This is provided for server-side rendering.
-     */
-    defaultHeight?: number;
-    /**
-     * The default spacing of the component. Like `spacing`, it is a factor of the theme's spacing. This is provided for server-side rendering.
-     */
-    defaultSpacing?: number;
-    /**
-     * Defines the space between children. It is a factor of the theme's spacing.
-     * @default 1
-     */
-    spacing?: ResponsiveStyleValue<number | string>;
-    /**
-     * Allows defining system overrides as well as additional CSS styles.
-     */
-    sx?: SxProps<Theme>;
-  };
-  defaultComponent: D;
+export interface MasonryOwnProps {
+  /**
+   * The content of the component.
+   */
+  children: NonNullable<React.ReactNode>;
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes?: Partial<MasonryClasses>;
+  /**
+   * Number of columns.
+   * @default 4
+   */
+  columns?: ResponsiveStyleValue<number | string>;
+  /**
+   * The default number of columns of the component. This is provided for server-side rendering.
+   */
+  defaultColumns?: number;
+  /**
+   * The default height of the component in px. This is provided for server-side rendering.
+   */
+  defaultHeight?: number;
+  /**
+   * The default spacing of the component. Like `spacing`, it is a factor of the theme's spacing. This is provided for server-side rendering.
+   */
+  defaultSpacing?: number;
+  /**
+   * Defines the space between children. It is a factor of the theme's spacing.
+   * @default 1
+   */
+  spacing?: ResponsiveStyleValue<number | string>;
+  /**
+   * Allows using sequential order rather than adding to shortest column
+   * @default false
+   */
+  sequential?: boolean;
+  /**
+   * Allows defining system overrides as well as additional CSS styles.
+   */
+  sx?: SxProps<Theme>;
+}
+
+export interface MasonryTypeMap<
+  AdditionalProps = {},
+  RootComponent extends React.ElementType = 'div',
+> {
+  props: AdditionalProps & MasonryOwnProps;
+  defaultComponent: RootComponent;
 }
 /**
  *
@@ -55,8 +65,8 @@ export interface MasonryTypeMap<P = {}, D extends React.ElementType = 'div'> {
 declare const Masonry: OverridableComponent<MasonryTypeMap>;
 
 export type MasonryProps<
-  D extends React.ElementType = MasonryTypeMap['defaultComponent'],
-  P = {},
-> = OverrideProps<MasonryTypeMap<P, D>, D>;
+  RootComponent extends React.ElementType = MasonryTypeMap['defaultComponent'],
+  AdditionalProps = {},
+> = OverrideProps<MasonryTypeMap<AdditionalProps, RootComponent>, RootComponent>;
 
 export default Masonry;