@mui/lab 5.0.0-alpha.50 → 5.0.0-alpha.54

package/legacy/DateTimePicker/DateTimePicker.js

@@ -170,6 +170,7 @@ process.env.NODE_ENV !== "production" ? DateTimePicker.propTypes
 
   /**
    * If `true`, the picker and text field are disabled.
+   * @default false
    */
   disabled: PropTypes.bool,
 
@@ -401,6 +402,11 @@ process.env.NODE_ENV !== "production" ? DateTimePicker.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.
    */
@@ -408,6 +414,7 @@ process.env.NODE_ENV !== "production" ? DateTimePicker.propTypes
 
   /**
    * Make picker read only.
+   * @default false
    */
   readOnly: PropTypes.bool,
 

package/legacy/DesktopDatePicker/DesktopDatePicker.js

@@ -41,11 +41,12 @@ var DesktopDatePicker = /*#__PURE__*/React.forwardRef(function DesktopDatePicker
 
   var onChange = props.onChange,
       PopperProps = props.PopperProps,
+      PaperProps = props.PaperProps,
       _props$ToolbarCompone = props.ToolbarComponent,
       ToolbarComponent = _props$ToolbarCompone === void 0 ? DatePickerToolbar : _props$ToolbarCompone,
       TransitionComponent = props.TransitionComponent,
       value = props.value,
-      other = _objectWithoutProperties(props, ["onChange", "PopperProps", "ToolbarComponent", "TransitionComponent", "value"]);
+      other = _objectWithoutProperties(props, ["onChange", "PopperProps", "PaperProps", "ToolbarComponent", "TransitionComponent", "value"]);
 
   var AllDateInputProps = _extends({}, inputProps, other, {
     ref: ref,
@@ -56,6 +57,7 @@ var DesktopDatePicker = /*#__PURE__*/React.forwardRef(function DesktopDatePicker
     DateInputProps: AllDateInputProps,
     KeyboardDateInputComponent: KeyboardDateInput,
     PopperProps: PopperProps,
+    PaperProps: PaperProps,
     TransitionComponent: TransitionComponent,
     children: /*#__PURE__*/_jsx(Picker, _extends({}, pickerProps, {
       autoFocus: true,
@@ -134,6 +136,7 @@ process.env.NODE_ENV !== "production" ? DesktopDatePicker.propTypes
 
   /**
    * If `true`, the picker and text field are disabled.
+   * @default false
    */
   disabled: PropTypes.bool,
 
@@ -307,6 +310,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.
    */
@@ -314,6 +322,7 @@ process.env.NODE_ENV !== "production" ? DesktopDatePicker.propTypes
 
   /**
    * Make picker read only.
+   * @default false
    */
   readOnly: PropTypes.bool,
 

package/legacy/DesktopDateRangePicker/DesktopDateRangePicker.js

@@ -187,6 +187,7 @@ process.env.NODE_ENV !== "production" ? DesktopDateRangePicker.propTypes
 
   /**
    * If `true`, the picker and text field are disabled.
+   * @default false
    */
   disabled: PropTypes.bool,
 
@@ -359,6 +360,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.
    */
@@ -366,6 +372,7 @@ process.env.NODE_ENV !== "production" ? DesktopDateRangePicker.propTypes
 
   /**
    * Make picker read only.
+   * @default false
    */
   readOnly: PropTypes.bool,
 

package/legacy/DesktopDateTimePicker/DesktopDateTimePicker.js

@@ -151,6 +151,7 @@ process.env.NODE_ENV !== "production" ? DesktopDateTimePicker.propTypes
 
   /**
    * If `true`, the picker and text field are disabled.
+   * @default false
    */
   disabled: PropTypes.bool,
 
@@ -376,6 +377,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.
    */
@@ -383,6 +389,7 @@ process.env.NODE_ENV !== "production" ? DesktopDateTimePicker.propTypes
 
   /**
    * Make picker read only.
+   * @default false
    */
   readOnly: PropTypes.bool,
 

package/legacy/DesktopTimePicker/DesktopTimePicker.js

@@ -274,6 +274,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/legacy/LoadingButton/LoadingButton.js

@@ -55,6 +55,18 @@ var LoadingButtonRoot = styled(Button, {
     })
   }, "&.".concat(loadingButtonClasses.loading), {
     color: 'transparent'
+  }), ownerState.loadingPosition === 'start' && ownerState.fullWidth && _defineProperty({}, "& .".concat(loadingButtonClasses.startIconLoadingStart, ", & .").concat(loadingButtonClasses.endIconLoadingEnd), {
+    transition: theme.transitions.create(['opacity'], {
+      duration: theme.transitions.duration.short
+    }),
+    opacity: 0,
+    marginRight: -8
+  }), ownerState.loadingPosition === 'end' && ownerState.fullWidth && _defineProperty({}, "& .".concat(loadingButtonClasses.startIconLoadingStart, ", & .").concat(loadingButtonClasses.endIconLoadingEnd), {
+    transition: theme.transitions.create(['opacity'], {
+      duration: theme.transitions.duration.short
+    }),
+    opacity: 0,
+    marginLeft: -8
   }));
 });
 var LoadingButtonLoadingIndicator = styled('div', {
@@ -64,9 +76,9 @@ var LoadingButtonLoadingIndicator = styled('div', {
     var ownerState = props.ownerState;
     return [styles.loadingIndicator, styles["loadingIndicator".concat(capitalize(ownerState.loadingPosition))]];
   }
-})(function (_ref5) {
-  var theme = _ref5.theme,
-      ownerState = _ref5.ownerState;
+})(function (_ref7) {
+  var theme = _ref7.theme,
+      ownerState = _ref7.ownerState;
   return _extends({
     position: 'absolute',
     visibility: 'visible',
@@ -79,6 +91,12 @@ var 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
   });
 });
 
@@ -112,17 +130,25 @@ var LoadingButton = /*#__PURE__*/React.forwardRef(function LoadingButton(inProps
   });
 
   var 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
@@ -180,6 +206,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.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object])), PropTypes.func, PropTypes.object])
 } : void 0;
 export default LoadingButton;

package/legacy/Masonry/Masonry.js

@@ -1,15 +1,20 @@
+import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+import _typeof from "@babel/runtime/helpers/esm/typeof";
 import _extends from "@babel/runtime/helpers/esm/extends";
-import * as React from 'react';
-import PropTypes from 'prop-types';
-import clsx from 'clsx';
-import { createUnarySpacing, getValue, handleBreakpoints, unstable_resolveBreakpointValues as resolveBreakpointValues } from '@mui/system';
-import { deepmerge, unstable_useForkRef as useForkRef } from '@mui/utils';
 import { unstable_composeClasses as composeClasses } from '@mui/core';
 import { styled, useThemeProps } from '@mui/material/styles';
+import { createUnarySpacing, getValue, handleBreakpoints, unstable_resolveBreakpointValues as resolveBreakpointValues } from '@mui/system';
+import { deepmerge, unstable_useForkRef as useForkRef } from '@mui/utils';
+import clsx from 'clsx';
+import PropTypes from 'prop-types';
+import * as React from 'react';
 import { getMasonryUtilityClass } from './masonryClasses';
-import MasonryContext from './MasonryContext';
 import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+export var parseToNumber = function parseToNumber(val) {
+  return Number(val.replace('px', ''));
+};
 
 var useUtilityClasses = function useUtilityClasses(ownerState) {
   var classes = ownerState.classes;
@@ -19,53 +24,103 @@ var useUtilityClasses = function useUtilityClasses(ownerState) {
   return composeClasses(slots, getMasonryUtilityClass, classes);
 };
 
-export var style = function style(_ref) {
+export var getStyle = function getStyle(_ref) {
   var ownerState = _ref.ownerState,
       theme = _ref.theme;
   var styles = {
-    display: 'grid',
-    gridAutoRows: 0,
-    padding: 0,
-    overflow: 'auto',
     width: '100%',
-    rowGap: 2,
-    boxSizing: 'border-box'
+    display: 'flex',
+    flexFlow: 'column wrap',
+    alignContent: 'space-between',
+    boxSizing: 'border-box',
+    '& > *': {
+      boxSizing: 'border-box'
+    }
   };
-  var base = {};
-  Object.keys(theme.breakpoints.values).forEach(function (breakpoint) {
-    if (ownerState.spacing[breakpoint] != null) {
-      base[breakpoint] = true;
+  var stylesSSR = {};
+
+  if (ownerState.isSSR) {
+    var orderStyleSSR = {};
+    var defaultSpacing = Number(theme.spacing(ownerState.defaultSpacing).replace('px', ''));
+
+    for (var i = 1; i <= ownerState.defaultColumns; i += 1) {
+      orderStyleSSR["&:nth-of-type(".concat(ownerState.defaultColumns, "n+").concat(i % ownerState.defaultColumns, ")")] = {
+        order: i
+      };
     }
-  });
+
+    stylesSSR.height = ownerState.defaultHeight;
+    stylesSSR.margin = -(defaultSpacing / 2);
+    stylesSSR['& > *'] = _extends({}, styles['& > *'], orderStyleSSR, {
+      margin: defaultSpacing / 2,
+      width: "calc(".concat((100 / ownerState.defaultColumns).toFixed(2), "% - ").concat(defaultSpacing, "px)")
+    });
+    return _extends({}, styles, stylesSSR);
+  }
+
   var spacingValues = resolveBreakpointValues({
     values: ownerState.spacing,
-    base: base
+    breakpoints: theme.breakpoints.values
   });
   var transformer = createUnarySpacing(theme);
 
   var spacingStyleFromPropValue = function spacingStyleFromPropValue(propValue) {
-    return {
-      columnGap: getValue(transformer, propValue)
-    };
+    var themeSpacingValue = Number(propValue);
+    var spacing = Number(getValue(transformer, themeSpacingValue).replace('px', ''));
+    return _extends({
+      margin: -(spacing / 2),
+      '& > *': {
+        margin: spacing / 2
+      }
+    }, ownerState.maxColumnHeight && {
+      height: Math.ceil(ownerState.maxColumnHeight + spacing)
+    });
   };
 
-  styles = _extends({}, styles, handleBreakpoints({
+  styles = deepmerge(styles, handleBreakpoints({
     theme: theme
   }, spacingValues, spacingStyleFromPropValue));
   var columnValues = resolveBreakpointValues({
     values: ownerState.columns,
-    base: base
+    breakpoints: theme.breakpoints.values
   });
 
   var columnStyleFromPropValue = function columnStyleFromPropValue(propValue) {
+    var columnValue = Number(propValue);
+    var width = "".concat((100 / columnValue).toFixed(2), "%");
+    var spacing = _typeof(spacingValues) !== 'object' ? getValue(transformer, Number(spacingValues)) : '0px';
     return {
-      gridTemplateColumns: "repeat(".concat(propValue, ", 1fr)")
+      '& > *': {
+        width: "calc(".concat(width, " - ").concat(spacing, ")")
+      }
     };
   };
 
   styles = deepmerge(styles, handleBreakpoints({
     theme: theme
-  }, columnValues, columnStyleFromPropValue));
+  }, columnValues, columnStyleFromPropValue)); // configure width for responsive spacing values
+
+  if (_typeof(spacingValues) === 'object') {
+    styles = deepmerge(styles, handleBreakpoints({
+      theme: theme
+    }, spacingValues, function (propValue, breakpoint) {
+      if (breakpoint) {
+        var themeSpacingValue = Number(propValue);
+        var lastBreakpoint = Object.keys(columnValues).pop();
+        var spacing = getValue(transformer, themeSpacingValue);
+        var column = _typeof(columnValues) === 'object' ? columnValues[breakpoint] || columnValues[lastBreakpoint] : columnValues;
+        var width = "".concat((100 / column).toFixed(2), "%");
+        return {
+          '& > *': {
+            width: "calc(".concat(width, " - ").concat(spacing, ")")
+          }
+        };
+      }
+
+      return null;
+    }));
+  }
+
   return styles;
 };
 var MasonryRoot = styled('div', {
@@ -74,13 +129,12 @@ var MasonryRoot = styled('div', {
   overridesResolver: function overridesResolver(props, styles) {
     return [styles.root];
   }
-})(style);
+})(getStyle);
 var Masonry = /*#__PURE__*/React.forwardRef(function Masonry(inProps, ref) {
   var props = useThemeProps({
     props: inProps,
     name: 'MuiMasonry'
   });
-  var masonryRef = React.useRef();
 
   var children = props.children,
       className = props.className,
@@ -90,48 +144,138 @@ var Masonry = /*#__PURE__*/React.forwardRef(function Masonry(inProps, ref) {
       columns = _props$columns === void 0 ? 4 : _props$columns,
       _props$spacing = props.spacing,
       spacing = _props$spacing === void 0 ? 1 : _props$spacing,
-      other = _objectWithoutProperties(props, ["children", "className", "component", "columns", "spacing"]);
+      defaultColumns = props.defaultColumns,
+      defaultHeight = props.defaultHeight,
+      defaultSpacing = props.defaultSpacing,
+      other = _objectWithoutProperties(props, ["children", "className", "component", "columns", "spacing", "defaultColumns", "defaultHeight", "defaultSpacing"]);
+
+  var masonryRef = React.useRef();
+
+  var _React$useState = React.useState(),
+      maxColumnHeight = _React$useState[0],
+      setMaxColumnHeight = _React$useState[1];
+
+  var isSSR = !maxColumnHeight && defaultHeight && defaultColumns !== undefined && defaultSpacing !== undefined;
+
+  var _React$useState2 = React.useState(isSSR ? defaultColumns - 1 : 0),
+      numberOfLineBreaks = _React$useState2[0],
+      setNumberOfLineBreaks = _React$useState2[1];
 
   var ownerState = _extends({}, props, {
     spacing: spacing,
-    columns: columns
+    columns: columns,
+    maxColumnHeight: maxColumnHeight,
+    defaultColumns: defaultColumns,
+    defaultHeight: defaultHeight,
+    defaultSpacing: defaultSpacing,
+    isSSR: isSSR
   });
 
   var classes = useUtilityClasses(ownerState);
-  var contextValue = React.useMemo(function () {
-    return {
-      spacing: spacing
-    };
-  }, [spacing]);
-  var didWarn = false;
   React.useEffect(function () {
-    // scroller always appears when masonry's height goes beyond 2,000px on Chrome
-    var handleScroll = function handleScroll() {
-      if (masonryRef.current.clientHeight === 1998 && !didWarn) {
-        console.warn(['MUI: The Masonry can have the maximum height of 2,000px on Chrome browser.', 'Items that go beyond this height fail to be rendered on Chrome browser.', 'You can find more in this open issue: https://github.com/mui-org/material-ui/issues/27934'].join('\n')); // eslint-disable-next-line react-hooks/exhaustive-deps
+    var handleResize = function handleResize() {
+      var parentWidth = masonryRef.current.clientWidth;
+      var childWidth = masonryRef.current.firstChild.clientWidth;
+      var firstChildComputedStyle = window.getComputedStyle(masonryRef.current.firstChild);
+      var firstChildMarginLeft = parseToNumber(firstChildComputedStyle.marginLeft);
+      var firstChildMarginRight = parseToNumber(firstChildComputedStyle.marginRight);
 
-        didWarn = true;
+      if (parentWidth === 0 || childWidth === 0) {
+        return;
       }
-    };
 
+      var currentNumberOfColumns = Math.round(parentWidth / (childWidth + firstChildMarginLeft + firstChildMarginRight));
+      var columnHeights = new Array(currentNumberOfColumns).fill(0);
+      var skip = false;
+      masonryRef.current.childNodes.forEach(function (child) {
+        if (child.nodeType !== Node.ELEMENT_NODE || child.dataset.class === 'line-break' || skip) {
+          return;
+        }
+
+        var childComputedStyle = window.getComputedStyle(child);
+        var childMarginTop = parseToNumber(childComputedStyle.marginTop);
+        var childMarginBottom = parseToNumber(childComputedStyle.marginBottom); // if any one of children isn't rendered yet, masonry's height shouldn't be computed yet
+
+        var childHeight = parseToNumber(childComputedStyle.height) ? Math.ceil(parseToNumber(childComputedStyle.height)) + childMarginTop + childMarginBottom : 0;
+
+        if (childHeight === 0) {
+          skip = true;
+          return;
+        } // if there is a nested image that isn't rendered yet, masonry's height shouldn't be computed yet
+
+
+        for (var i = 0; i < child.childNodes.length; i += 1) {
+          var nestedChild = child.childNodes[i];
+
+          if (nestedChild.tagName === 'IMG' && nestedChild.clientHeight === 0) {
+            skip = true;
+            break;
+          }
+        }
+
+        if (!skip) {
+          // find the current shortest column (where the current item will be placed)
+          var currentMinColumnIndex = columnHeights.indexOf(Math.min.apply(Math, _toConsumableArray(columnHeights)));
+          columnHeights[currentMinColumnIndex] += childHeight;
+          var order = currentMinColumnIndex + 1;
+          child.style.order = order;
+        }
+      });
+
+      if (!skip) {
+        setMaxColumnHeight(Math.max.apply(Math, _toConsumableArray(columnHeights)));
+        var numOfLineBreaks = currentNumberOfColumns > 0 ? currentNumberOfColumns - 1 : 0;
+        setNumberOfLineBreaks(numOfLineBreaks);
+      }
+    }; // IE and old browsers are not supported
+
+
+    if (typeof ResizeObserver === 'undefined') {
+      return undefined;
+    }
+
+    var resizeObserver = new ResizeObserver(handleResize);
     var container = masonryRef.current;
-    container.addEventListener('scroll', handleScroll);
+
+    if (container) {
+      // only the masonry container and its first child are observed for resizing;
+      // this might cause unforeseen problems in some use cases;
+      resizeObserver.observe(container);
+
+      if (container.firstChild) {
+        resizeObserver.observe(container.firstChild);
+      }
+    }
+
     return function () {
-      container.removeEventListener('scroll', handleScroll);
+      resizeObserver.disconnect();
     };
-  }, []);
+  }, [columns, spacing, children]);
   var handleRef = useForkRef(ref, masonryRef);
-  return /*#__PURE__*/_jsx(MasonryContext.Provider, {
-    value: contextValue,
-    children: /*#__PURE__*/_jsx(MasonryRoot, _extends({
-      as: component,
-      className: clsx(classes.root, className),
-      ref: handleRef,
-      ownerState: ownerState
-    }, other, {
-      children: children
-    }))
+  var lineBreakStyle = {
+    flexBasis: '100%',
+    width: 0,
+    margin: 0,
+    padding: 0
+  }; //  columns are likely to have different heights and hence can start to merge;
+  //  a line break at the end of each column prevents columns from merging
+
+  var lineBreaks = new Array(numberOfLineBreaks).fill('').map(function (_, index) {
+    return /*#__PURE__*/_jsx("span", {
+      "data-class": "line-break",
+      style: _extends({}, lineBreakStyle, {
+        order: index + 1
+      })
+    }, index);
   });
+  return /*#__PURE__*/_jsxs(MasonryRoot, _extends({
+    as: component,
+    className: clsx(classes.root, className),
+    ref: handleRef,
+    ownerState: ownerState
+  }, other, {
+    children: [children, lineBreaks]
+  }));
 });
 process.env.NODE_ENV !== "production" ? Masonry.propTypes
 /* remove-proptypes */
@@ -142,7 +286,7 @@ process.env.NODE_ENV !== "production" ? Masonry.propTypes
   // ----------------------------------------------------------------------
 
   /**
-   * The content of the component. It's recommended to be `<MasonryItem />`s.
+   * The content of the component.
    */
   children: PropTypes
   /* @typescript-to-proptypes-ignore */
@@ -170,6 +314,21 @@ process.env.NODE_ENV !== "production" ? Masonry.propTypes
    */
   component: PropTypes.elementType,
 
+  /**
+   * The default number of columns of the component. This is provided for server-side rendering.
+   */
+  defaultColumns: PropTypes.number,
+
+  /**
+   * The default height of the component in px. This is provided for server-side rendering.
+   */
+  defaultHeight: PropTypes.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: PropTypes.number,
+
   /**
    * Defines the space between children. It is a factor of the theme's spacing.
    * @default 1
@@ -179,6 +338,6 @@ process.env.NODE_ENV !== "production" ? Masonry.propTypes
   /**
    * Allows defining system overrides as well as additional CSS styles.
    */
-  sx: PropTypes.object
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object])), PropTypes.func, PropTypes.object])
 } : void 0;
 export default Masonry;

package/legacy/MobileDatePicker/MobileDatePicker.js

@@ -155,6 +155,7 @@ process.env.NODE_ENV !== "production" ? MobileDatePicker.propTypes
 
   /**
    * If `true`, the picker and text field are disabled.
+   * @default false
    */
   disabled: PropTypes.bool,
 
@@ -336,6 +337,7 @@ process.env.NODE_ENV !== "production" ? MobileDatePicker.propTypes
 
   /**
    * Make picker read only.
+   * @default false
    */
   readOnly: PropTypes.bool,
 

package/legacy/MobileDateRangePicker/MobileDateRangePicker.js

@@ -206,6 +206,7 @@ process.env.NODE_ENV !== "production" ? MobileDateRangePicker.propTypes
 
   /**
    * If `true`, the picker and text field are disabled.
+   * @default false
    */
   disabled: PropTypes.bool,
 
@@ -386,6 +387,7 @@ process.env.NODE_ENV !== "production" ? MobileDateRangePicker.propTypes
 
   /**
    * Make picker read only.
+   * @default false
    */
   readOnly: PropTypes.bool,
 

package/legacy/MobileDateTimePicker/MobileDateTimePicker.js

@@ -172,6 +172,7 @@ process.env.NODE_ENV !== "production" ? MobileDateTimePicker.propTypes
 
   /**
    * If `true`, the picker and text field are disabled.
+   * @default false
    */
   disabled: PropTypes.bool,
 
@@ -405,6 +406,7 @@ process.env.NODE_ENV !== "production" ? MobileDateTimePicker.propTypes
 
   /**
    * Make picker read only.
+   * @default false
    */
   readOnly: PropTypes.bool,