@mui/lab 5.0.0-alpha.49 → 5.0.0-alpha.53

package/DateTimePicker/shared.d.ts

@@ -1,63 +1,67 @@
-import * as React from 'react';
-import { ExportedClockPickerProps } from '../ClockPicker/ClockPicker';
-import { ExportedCalendarPickerProps } from '../CalendarPicker/CalendarPicker';
-import { DateTimeValidationError, ValidationProps } from '../internal/pickers/hooks/useValidation';
-import { ParseableDate } from '../internal/pickers/constants/prop-types';
-import { BasePickerProps, ToolbarComponentProps } from '../internal/pickers/typings/BasePicker';
-import { ExportedDateInputProps } from '../internal/pickers/PureDateInput';
-export declare type DateTimePickerView = 'year' | 'day' | 'month' | 'hours' | 'minutes' | 'seconds';
-export interface BaseDateTimePickerProps<TDate> extends ExportedClockPickerProps<TDate>, ExportedCalendarPickerProps<TDate>, BasePickerProps<ParseableDate<TDate>, TDate | null>, ValidationProps<DateTimeValidationError, ParseableDate<TDate>>, ExportedDateInputProps<ParseableDate<TDate>, TDate | null> {
-    /**
-     * The components used for each slot.
-     * Either a string to use a HTML element or a component.
-     * @default {}
-     */
-    components?: ExportedCalendarPickerProps<TDate>['components'] & ExportedDateInputProps<ParseableDate<TDate>, TDate | null>['components'];
-    /**
-     * To show tabs.
-     */
-    hideTabs?: boolean;
-    /**
-     * Date tab icon.
-     */
-    dateRangeIcon?: React.ReactNode;
-    /**
-     * Time tab icon.
-     */
-    timeIcon?: React.ReactNode;
-    /**
-     * Minimal selectable moment of time with binding to date, to set min time in each day use `minTime`.
-     */
-    minDateTime?: TDate;
-    /**
-     * Minimal selectable moment of time with binding to date, to set max time in each day use `maxTime`.
-     */
-    maxDateTime?: TDate;
-    /**
-     * First view to show.
-     */
-    openTo?: DateTimePickerView;
-    /**
-     * Component that will replace default toolbar renderer.
-     * @default DateTimePickerToolbar
-     */
-    ToolbarComponent?: React.JSXElementConstructor<ToolbarComponentProps<TDate | null>>;
-    /**
-     * Mobile picker title, displaying in the toolbar.
-     * @default 'Select date & time'
-     */
-    toolbarTitle?: React.ReactNode;
-    /**
-     * Date format, that is displaying in toolbar.
-     */
-    toolbarFormat?: string;
-    /**
-     * Array of views to show.
-     */
-    views?: readonly DateTimePickerView[];
-}
-declare type DefaultizedProps<Props> = Props & {
-    inputFormat: string;
-};
-export declare function useDateTimePickerDefaultizedProps<Props extends BaseDateTimePickerProps<unknown>>({ ampm, inputFormat, maxDate: maxDateProp, maxDateTime, maxTime, minDate: minDateProp, minDateTime, minTime, openTo, orientation, views, ...other }: Props, name: string): DefaultizedProps<Props>;
-export {};
+import * as React from 'react';
+import { ExportedClockPickerProps } from '../ClockPicker/ClockPicker';
+import { ExportedCalendarPickerProps } from '../CalendarPicker/CalendarPicker';
+import { DateTimeValidationError, ValidationProps } from '../internal/pickers/hooks/useValidation';
+import { ParseableDate } from '../internal/pickers/constants/prop-types';
+import { BasePickerProps, ToolbarComponentProps } from '../internal/pickers/typings/BasePicker';
+import { ExportedDateInputProps } from '../internal/pickers/PureDateInput';
+export declare type DateTimePickerView = 'year' | 'day' | 'month' | 'hours' | 'minutes' | 'seconds';
+export interface BaseDateTimePickerProps<TDate> extends ExportedClockPickerProps<TDate>, ExportedCalendarPickerProps<TDate>, BasePickerProps<ParseableDate<TDate>, TDate | null>, ValidationProps<DateTimeValidationError, ParseableDate<TDate>>, ExportedDateInputProps<ParseableDate<TDate>, TDate | null> {
+    /**
+     * The components used for each slot.
+     * Either a string to use a HTML element or a component.
+     * @default {}
+     */
+    components?: ExportedCalendarPickerProps<TDate>['components'] & ExportedDateInputProps<ParseableDate<TDate>, TDate | null>['components'];
+    /**
+     * To show tabs.
+     */
+    hideTabs?: boolean;
+    /**
+     * Date tab icon.
+     */
+    dateRangeIcon?: React.ReactNode;
+    /**
+     * Time tab icon.
+     */
+    timeIcon?: React.ReactNode;
+    /**
+     * Minimal selectable moment of time with binding to date, to set min time in each day use `minTime`.
+     */
+    minDateTime?: TDate;
+    /**
+     * Minimal selectable moment of time with binding to date, to set max time in each day use `maxTime`.
+     */
+    maxDateTime?: TDate;
+    /**
+     * Callback fired on view change.
+     */
+    onViewChange?: (view: DateTimePickerView) => void;
+    /**
+     * First view to show.
+     */
+    openTo?: DateTimePickerView;
+    /**
+     * Component that will replace default toolbar renderer.
+     * @default DateTimePickerToolbar
+     */
+    ToolbarComponent?: React.JSXElementConstructor<ToolbarComponentProps<TDate | null>>;
+    /**
+     * Mobile picker title, displaying in the toolbar.
+     * @default 'Select date & time'
+     */
+    toolbarTitle?: React.ReactNode;
+    /**
+     * Date format, that is displaying in toolbar.
+     */
+    toolbarFormat?: string;
+    /**
+     * Array of views to show.
+     */
+    views?: readonly DateTimePickerView[];
+}
+declare type DefaultizedProps<Props> = Props & {
+    inputFormat: string;
+};
+export declare function useDateTimePickerDefaultizedProps<Props extends BaseDateTimePickerProps<unknown>>({ ampm, inputFormat, maxDate: maxDateProp, maxDateTime, maxTime, minDate: minDateProp, minDateTime, minTime, openTo, orientation, views, ...other }: Props, name: string): DefaultizedProps<Props> & Required<Pick<BaseDateTimePickerProps<unknown>, 'openTo' | 'views'>>;
+export {};

package/DesktopDatePicker/DesktopDatePicker.d.ts

@@ -1,20 +1,20 @@
-import * as React from 'react';
-import { BaseDatePickerProps } from '../DatePicker/shared';
-import { DesktopWrapperProps } from '../internal/pickers/wrappers/DesktopWrapper';
-export interface DesktopDatePickerProps<TDate = unknown> extends BaseDatePickerProps<TDate>, DesktopWrapperProps {
-}
-declare type DesktopDatePickerComponent = (<TDate>(props: DesktopDatePickerProps<TDate> & React.RefAttributes<HTMLDivElement>) => JSX.Element) & {
-    propTypes?: any;
-};
-/**
- *
- * Demos:
- *
- * - [Date Picker](https://mui.com/components/date-picker/)
- *
- * API:
- *
- * - [DesktopDatePicker API](https://mui.com/api/desktop-date-picker/)
- */
-declare const DesktopDatePicker: DesktopDatePickerComponent;
-export default DesktopDatePicker;
+import * as React from 'react';
+import { BaseDatePickerProps } from '../DatePicker/shared';
+import { DesktopWrapperProps } from '../internal/pickers/wrappers/DesktopWrapper';
+export interface DesktopDatePickerProps<TDate = unknown> extends BaseDatePickerProps<TDate>, DesktopWrapperProps {
+}
+declare type DesktopDatePickerComponent = (<TDate>(props: DesktopDatePickerProps<TDate> & React.RefAttributes<HTMLDivElement>) => JSX.Element) & {
+    propTypes?: any;
+};
+/**
+ *
+ * Demos:
+ *
+ * - [Date Picker](https://mui.com/components/date-picker/)
+ *
+ * API:
+ *
+ * - [DesktopDatePicker API](https://mui.com/api/desktop-date-picker/)
+ */
+declare const DesktopDatePicker: DesktopDatePickerComponent;
+export default DesktopDatePicker;

package/DesktopDatePicker/DesktopDatePicker.js

@@ -1,6 +1,6 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-const _excluded = ["onChange", "PopperProps", "ToolbarComponent", "TransitionComponent", "value"];
+const _excluded = ["onChange", "PopperProps", "PaperProps", "ToolbarComponent", "TransitionComponent", "value"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import { useDatePickerDefaultizedProps } from '../DatePicker/shared';
@@ -40,6 +40,7 @@ const DesktopDatePicker = /*#__PURE__*/React.forwardRef(function DesktopDatePick
 
   const {
     PopperProps,
+    PaperProps,
     ToolbarComponent = DatePickerToolbar,
     TransitionComponent
   } = props,
@@ -54,6 +55,7 @@ const DesktopDatePicker = /*#__PURE__*/React.forwardRef(function DesktopDatePick
     DateInputProps: AllDateInputProps,
     KeyboardDateInputComponent: KeyboardDateInput,
     PopperProps: PopperProps,
+    PaperProps: PaperProps,
     TransitionComponent: TransitionComponent,
     children: /*#__PURE__*/_jsx(Picker, _extends({}, pickerProps, {
       autoFocus: true,
@@ -305,6 +307,11 @@ process.env.NODE_ENV !== "production" ? DesktopDatePicker.propTypes
    */
   orientation: PropTypes.oneOf(['landscape', 'portrait']),
 
+  /**
+   * Paper props passed down to [Paper](https://mui.com/api/paper/) component.
+   */
+  PaperProps: PropTypes.object,
+
   /**
    * Popper props passed down to [Popper](https://mui.com/api/popper/) component.
    */

package/DesktopDatePicker/index.d.ts

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

package/DesktopDateRangePicker/DesktopDateRangePicker.d.ts

@@ -1,64 +1,64 @@
-import * as React from 'react';
-import { RangeInput, DateRange } from '../DateRangePicker/RangeTypes';
-import { DateRangeValidationError, ValidationProps } from '../internal/pickers/hooks/useValidation';
-import { ExportedDateRangePickerViewProps } from '../DateRangePicker/DateRangePickerView';
-import { ExportedDateRangePickerInputProps } from '../DateRangePicker/DateRangePickerInput';
-import { DesktopWrapperProps } from '../internal/pickers/wrappers/DesktopWrapper';
-interface BaseDateRangePickerProps<TDate> extends ExportedDateRangePickerViewProps<TDate>, ValidationProps<DateRangeValidationError, RangeInput<TDate>>, ExportedDateRangePickerInputProps {
-    /**
-     * The components used for each slot.
-     * Either a string to use a HTML element or a component.
-     * @default {}
-     */
-    components?: ExportedDateRangePickerViewProps<TDate>['components'] & ExportedDateRangePickerInputProps['components'];
-    /**
-     * Text for end input label and toolbar placeholder.
-     * @default 'End'
-     */
-    endText?: React.ReactNode;
-    /**
-     * Custom mask. Can be used to override generate from format. (e.g. `__/__/____ __:__` or `__/__/____ __:__ _M`).
-     * @default '__/__/____'
-     */
-    mask?: ExportedDateRangePickerInputProps['mask'];
-    /**
-     * Min selectable date. @DateIOType
-     * @default defaultMinDate
-     */
-    minDate?: TDate;
-    /**
-     * Max selectable date. @DateIOType
-     * @default defaultMaxDate
-     */
-    maxDate?: TDate;
-    /**
-     * Callback fired when the value (the selected date range) changes @DateIOType.
-     */
-    onChange: (date: DateRange<TDate>, keyboardInputValue?: string) => void;
-    /**
-     * Text for start input label and toolbar placeholder.
-     * @default 'Start'
-     */
-    startText?: React.ReactNode;
-    /**
-     * The value of the date range picker.
-     */
-    value: RangeInput<TDate>;
-}
-export interface DesktopDateRangePickerProps<TDate = unknown> extends BaseDateRangePickerProps<TDate>, DesktopWrapperProps {
-}
-declare type DesktopDateRangePickerComponent = (<TDate>(props: DesktopDateRangePickerProps<TDate> & React.RefAttributes<HTMLDivElement>) => JSX.Element) & {
-    propTypes: unknown;
-};
-/**
- *
- * Demos:
- *
- * - [Date Range Picker](https://mui.com/components/date-range-picker/)
- *
- * API:
- *
- * - [DesktopDateRangePicker API](https://mui.com/api/desktop-date-range-picker/)
- */
-declare const DesktopDateRangePicker: DesktopDateRangePickerComponent;
-export default DesktopDateRangePicker;
+import * as React from 'react';
+import { RangeInput, DateRange } from '../DateRangePicker/RangeTypes';
+import { DateRangeValidationError, ValidationProps } from '../internal/pickers/hooks/useValidation';
+import { ExportedDateRangePickerViewProps } from '../DateRangePicker/DateRangePickerView';
+import { ExportedDateRangePickerInputProps } from '../DateRangePicker/DateRangePickerInput';
+import { DesktopWrapperProps } from '../internal/pickers/wrappers/DesktopWrapper';
+interface BaseDateRangePickerProps<TDate> extends ExportedDateRangePickerViewProps<TDate>, ValidationProps<DateRangeValidationError, RangeInput<TDate>>, ExportedDateRangePickerInputProps {
+    /**
+     * The components used for each slot.
+     * Either a string to use a HTML element or a component.
+     * @default {}
+     */
+    components?: ExportedDateRangePickerViewProps<TDate>['components'] & ExportedDateRangePickerInputProps['components'];
+    /**
+     * Text for end input label and toolbar placeholder.
+     * @default 'End'
+     */
+    endText?: React.ReactNode;
+    /**
+     * Custom mask. Can be used to override generate from format. (e.g. `__/__/____ __:__` or `__/__/____ __:__ _M`).
+     * @default '__/__/____'
+     */
+    mask?: ExportedDateRangePickerInputProps['mask'];
+    /**
+     * Min selectable date. @DateIOType
+     * @default defaultMinDate
+     */
+    minDate?: TDate;
+    /**
+     * Max selectable date. @DateIOType
+     * @default defaultMaxDate
+     */
+    maxDate?: TDate;
+    /**
+     * Callback fired when the value (the selected date range) changes @DateIOType.
+     */
+    onChange: (date: DateRange<TDate>, keyboardInputValue?: string) => void;
+    /**
+     * Text for start input label and toolbar placeholder.
+     * @default 'Start'
+     */
+    startText?: React.ReactNode;
+    /**
+     * The value of the date range picker.
+     */
+    value: RangeInput<TDate>;
+}
+export interface DesktopDateRangePickerProps<TDate = unknown> extends BaseDateRangePickerProps<TDate>, DesktopWrapperProps {
+}
+declare type DesktopDateRangePickerComponent = (<TDate>(props: DesktopDateRangePickerProps<TDate> & React.RefAttributes<HTMLDivElement>) => JSX.Element) & {
+    propTypes: unknown;
+};
+/**
+ *
+ * Demos:
+ *
+ * - [Date Range Picker](https://mui.com/components/date-range-picker/)
+ *
+ * API:
+ *
+ * - [DesktopDateRangePicker API](https://mui.com/api/desktop-date-range-picker/)
+ */
+declare const DesktopDateRangePicker: DesktopDateRangePickerComponent;
+export default DesktopDateRangePicker;

package/DesktopDateRangePicker/DesktopDateRangePicker.js

@@ -353,6 +353,11 @@ process.env.NODE_ENV !== "production" ? DesktopDateRangePicker.propTypes
    */
   orientation: PropTypes.oneOf(['landscape', 'portrait']),
 
+  /**
+   * Paper props passed down to [Paper](https://mui.com/api/paper/) component.
+   */
+  PaperProps: PropTypes.object,
+
   /**
    * Popper props passed down to [Popper](https://mui.com/api/popper/) component.
    */

package/DesktopDateRangePicker/index.d.ts

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

package/DesktopDateTimePicker/DesktopDateTimePicker.d.ts

@@ -1,20 +1,20 @@
-import * as React from 'react';
-import { BaseDateTimePickerProps } from '../DateTimePicker/shared';
-import { DesktopWrapperProps } from '../internal/pickers/wrappers/DesktopWrapper';
-export interface DesktopDateTimePickerProps<TDate = unknown> extends BaseDateTimePickerProps<TDate>, DesktopWrapperProps {
-}
-declare type DesktopDateTimePickerComponent = (<TDate>(props: DesktopDateTimePickerProps<TDate> & React.RefAttributes<HTMLDivElement>) => JSX.Element) & {
-    propTypes?: any;
-};
-/**
- *
- * Demos:
- *
- * - [Date Time Picker](https://mui.com/components/date-time-picker/)
- *
- * API:
- *
- * - [DesktopDateTimePicker API](https://mui.com/api/desktop-date-time-picker/)
- */
-declare const DesktopDateTimePicker: DesktopDateTimePickerComponent;
-export default DesktopDateTimePicker;
+import * as React from 'react';
+import { BaseDateTimePickerProps } from '../DateTimePicker/shared';
+import { DesktopWrapperProps } from '../internal/pickers/wrappers/DesktopWrapper';
+export interface DesktopDateTimePickerProps<TDate = unknown> extends BaseDateTimePickerProps<TDate>, DesktopWrapperProps {
+}
+declare type DesktopDateTimePickerComponent = (<TDate>(props: DesktopDateTimePickerProps<TDate> & React.RefAttributes<HTMLDivElement>) => JSX.Element) & {
+    propTypes?: any;
+};
+/**
+ *
+ * Demos:
+ *
+ * - [Date Time Picker](https://mui.com/components/date-time-picker/)
+ *
+ * API:
+ *
+ * - [DesktopDateTimePicker API](https://mui.com/api/desktop-date-time-picker/)
+ */
+declare const DesktopDateTimePicker: DesktopDateTimePickerComponent;
+export default DesktopDateTimePicker;

package/DesktopDateTimePicker/DesktopDateTimePicker.js

@@ -374,6 +374,11 @@ process.env.NODE_ENV !== "production" ? DesktopDateTimePicker.propTypes
    */
   orientation: PropTypes.oneOf(['landscape', 'portrait']),
 
+  /**
+   * Paper props passed down to [Paper](https://mui.com/api/paper/) component.
+   */
+  PaperProps: PropTypes.object,
+
   /**
    * Popper props passed down to [Popper](https://mui.com/api/popper/) component.
    */

package/DesktopDateTimePicker/index.d.ts

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

package/DesktopTimePicker/DesktopTimePicker.d.ts

@@ -1,20 +1,20 @@
-import * as React from 'react';
-import { BaseTimePickerProps } from '../TimePicker/shared';
-import { DesktopWrapperProps } from '../internal/pickers/wrappers/DesktopWrapper';
-export interface DesktopTimePickerProps<TDate = unknown> extends BaseTimePickerProps<TDate>, DesktopWrapperProps {
-}
-declare type DesktopTimePickerComponent = (<TDate>(props: DesktopTimePickerProps<TDate> & React.RefAttributes<HTMLDivElement>) => JSX.Element) & {
-    propTypes?: any;
-};
-/**
- *
- * Demos:
- *
- * - [Time Picker](https://mui.com/components/time-picker/)
- *
- * API:
- *
- * - [DesktopTimePicker API](https://mui.com/api/desktop-time-picker/)
- */
-declare const DesktopTimePicker: DesktopTimePickerComponent;
-export default DesktopTimePicker;
+import * as React from 'react';
+import { BaseTimePickerProps } from '../TimePicker/shared';
+import { DesktopWrapperProps } from '../internal/pickers/wrappers/DesktopWrapper';
+export interface DesktopTimePickerProps<TDate = unknown> extends BaseTimePickerProps<TDate>, DesktopWrapperProps {
+}
+declare type DesktopTimePickerComponent = (<TDate>(props: DesktopTimePickerProps<TDate> & React.RefAttributes<HTMLDivElement>) => JSX.Element) & {
+    propTypes?: any;
+};
+/**
+ *
+ * Demos:
+ *
+ * - [Time Picker](https://mui.com/components/time-picker/)
+ *
+ * API:
+ *
+ * - [DesktopTimePicker API](https://mui.com/api/desktop-time-picker/)
+ */
+declare const DesktopTimePicker: DesktopTimePickerComponent;
+export default DesktopTimePicker;

package/DesktopTimePicker/DesktopTimePicker.js

@@ -247,6 +247,11 @@ process.env.NODE_ENV !== "production" ? DesktopTimePicker.propTypes
    */
   onOpen: PropTypes.func,
 
+  /**
+   * Callback fired on view change.
+   */
+  onViewChange: PropTypes.func,
+
   /**
    * Control the popup or dialog open state.
    */
@@ -267,6 +272,11 @@ process.env.NODE_ENV !== "production" ? DesktopTimePicker.propTypes
    */
   orientation: PropTypes.oneOf(['landscape', 'portrait']),
 
+  /**
+   * Paper props passed down to [Paper](https://mui.com/api/paper/) component.
+   */
+  PaperProps: PropTypes.object,
+
   /**
    * Popper props passed down to [Popper](https://mui.com/api/popper/) component.
    */

package/DesktopTimePicker/index.d.ts

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

package/LICENSE

@@ -1,21 +1,21 @@
-The MIT License (MIT)
-
-Copyright (c) 2014 Call-Em-All
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.
+The MIT License (MIT)
+
+Copyright (c) 2014 Call-Em-All
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/LoadingButton/LoadingButton.js

@@ -60,6 +60,22 @@ const LoadingButtonRoot = styled(Button, {
   [`&.${loadingButtonClasses.loading}`]: {
     color: 'transparent'
   }
+}, ownerState.loadingPosition === 'start' && ownerState.fullWidth && {
+  [`& .${loadingButtonClasses.startIconLoadingStart}, & .${loadingButtonClasses.endIconLoadingEnd}`]: {
+    transition: theme.transitions.create(['opacity'], {
+      duration: theme.transitions.duration.short
+    }),
+    opacity: 0,
+    marginRight: -8
+  }
+}, ownerState.loadingPosition === 'end' && ownerState.fullWidth && {
+  [`& .${loadingButtonClasses.startIconLoadingStart}, & .${loadingButtonClasses.endIconLoadingEnd}`]: {
+    transition: theme.transitions.create(['opacity'], {
+      duration: theme.transitions.duration.short
+    }),
+    opacity: 0,
+    marginLeft: -8
+  }
 }));
 const LoadingButtonLoadingIndicator = styled('div', {
   name: 'MuiLoadingButton',
@@ -85,6 +101,12 @@ const LoadingButtonLoadingIndicator = styled('div', {
   color: theme.palette.action.disabled
 }, ownerState.loadingPosition === 'end' && {
   right: 14
+}, ownerState.loadingPosition === 'start' && ownerState.fullWidth && {
+  position: 'relative',
+  left: -10
+}, ownerState.loadingPosition === 'end' && ownerState.fullWidth && {
+  position: 'relative',
+  right: -10
 }));
 
 const LoadingIndicator = /*#__PURE__*/_jsx(CircularProgress, {
@@ -115,17 +137,25 @@ const LoadingButton = /*#__PURE__*/React.forwardRef(function LoadingButton(inPro
   });
 
   const classes = useUtilityClasses(ownerState);
-  return /*#__PURE__*/_jsxs(LoadingButtonRoot, _extends({
+  return /*#__PURE__*/_jsx(LoadingButtonRoot, _extends({
     disabled: disabled || loading,
     ref: ref
   }, other, {
     classes: classes,
     ownerState: ownerState,
-    children: [loading && /*#__PURE__*/_jsx(LoadingButtonLoadingIndicator, {
-      className: classes.loadingIndicator,
-      ownerState: ownerState,
-      children: loadingIndicator
-    }), children]
+    children: ownerState.loadingPosition === 'end' ? /*#__PURE__*/_jsxs(React.Fragment, {
+      children: [children, loading && /*#__PURE__*/_jsx(LoadingButtonLoadingIndicator, {
+        className: classes.loadingIndicator,
+        ownerState: ownerState,
+        children: loadingIndicator
+      })]
+    }) : /*#__PURE__*/_jsxs(React.Fragment, {
+      children: [loading && /*#__PURE__*/_jsx(LoadingButtonLoadingIndicator, {
+        className: classes.loadingIndicator,
+        ownerState: ownerState,
+        children: loadingIndicator
+      }), children]
+    })
   }));
 });
 process.env.NODE_ENV !== "production" ? LoadingButton.propTypes
@@ -183,6 +213,6 @@ process.env.NODE_ENV !== "production" ? LoadingButton.propTypes
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: PropTypes.object
+  sx: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
 } : void 0;
 export default LoadingButton;