@mui/lab 5.0.0-alpha.59 → 5.0.0-alpha.63

package/CHANGELOG.md

@@ -1,5 +1,232 @@
 ### [Versions](https://mui.com/versions/)
 
+## 5.2.7
+
+<!-- generated comparing v5.2.6..master -->
+
+_Jan 3, 2022_
+
+A big thanks to the 14 contributors who made this release possible. Here are some highlights ✨:
+
+- 📓 Improvements on the Vietnamese (vi-VN) and Finnish (fi-FI) locales (#30426, #30442) @hckhanh @Certificate
+- And more 🐛 bug fixes and 📚 documentation improvements.
+
+### `@mui/material@5.2.7`
+
+- &#8203;<!-- 14 -->[Autocomplete] Fix calling onChange for duplicate values (#30374) @alisasanib
+- &#8203;<!-- 13 -->[Avatar] Fix TypeScript error on imgProps (#30255) @ahmad-reza619
+- &#8203;<!-- 12 -->[Badge] Fix `classes` prop TypeScript type (#30427) @ZeeshanTamboli
+- &#8203;<!-- 03 -->[SvgIcon] Allow viewBox to inherit from Component through inheritViewBox prop (#29954) @alex-dikusar
+- &#8203;<!-- 04 -->[SvgIcon] Correct API docs and code style (#30470) @michaldudak
+
+### Docs
+
+- &#8203;<!-- 11 -->[blog] 2021 (#30425) @oliviertassinari
+- &#8203;<!-- 15 -->[docs] Fix typo on the Grid docs page (#30446) @abhi45
+- &#8203;<!-- 07 -->[docs] Fix `useMediaQuery` SSR example to v5 theme API (#30454) @ValentinH
+- &#8203;<!-- 11 -->[docs] Improve the migration guide and add examples for transforming to `tss-react` (#30388) @mnajdova
+- &#8203;<!-- 09 -->[docs] Make the reference to the select clearer (#30460) @boazrymland
+- &#8203;<!-- 08 -->[docs] Sync translations with Crowdin (#30385) @l10nbot
+- &#8203;<!-- 06 -->[example] Avoid double rendering in the Remix example (#30366) @mnajdova
+- &#8203;<!-- 05 -->[i18n] improve viVN locale (#30426) @hckhanh
+- &#8203;<!-- 04 -->[l10n] Improve fiFI locale (#30442) @Certificate
+- &#8203;<!-- 02 -->[website] Add new batch of open roles (#30282) @oliviertassinari
+- &#8203;<!-- 01 -->[website] Refactor page context with next router (#30020) @siriwatknp
+
+### Core
+
+- &#8203;<!-- 13 -->[core] Automatically close issues that are incomplete and inactive (#30459) @oliviertassinari
+- &#8203;<!-- 10 -->[core] Remove contrib tweet (#30455) @oliviertassinari
+
+All contributors of this release in alphabetical order: @abhi45, @ahmad-reza619, @alex-dikusar, @alisasanib, @boazrymland, @Certificate, @hckhanh, @l10nbot, @michaldudak, @mnajdova, @oliviertassinari, @siriwatknp, @ValentinH, @ZeeshanTamboli
+
+## 5.2.6
+
+<!-- generated comparing v5.2.5..master -->
+
+_Dec 27, 2021_
+
+A big thanks to the 14 contributors who made this release possible. Here are some highlights ✨:
+
+- 📓 The Norwegian Bokmål (nb-NO) locale was added (#27520) @wogsland
+- 🛠 Introduced a new `useBadge` hook in the `@mui/base` package (#30246) @mnajdova
+- And more 🐛 bug fixes and 📚 documentation improvements.
+
+### `@mui/material@5.2.6`
+
+- &#8203;<!-- 24 -->[ButtonGroup] Fix typo in ButtonGroupContext's interface (#30376) @kealjones-wk
+- &#8203;<!-- 03 -->[l10n] Add Norwegian Bokmål (nb-NO) locale (#27520) @wogsland
+
+### `@mui/base@5.0.0-alpha.62`
+
+- &#8203;<!-- 26 -->[BadgeUnstyled] Add useBadge hook (#30246) @mnajdova
+
+### `@mui/joy@5.0.0-alpha.8`
+
+- &#8203;<!-- 04 -->[Joy] Button API (#29962) @siriwatknp
+
+### Docs
+
+- &#8203;<!-- 27 -->[docs] Fix color coercion (#30319) @Janpot
+- &#8203;<!-- 25 -->[blog] Fix file import conflict resolution (#30391) @oliviertassinari
+- &#8203;<!-- 21 -->[docs] Fix crash on Safari because of unsupported lookahead feature (#30345) @cherniavskii
+- &#8203;<!-- 20 -->[docs] Update to new website domain (#30396) @ryota-murakami
+- &#8203;<!-- 19 -->[docs] Fix text from material-ui to @mui to reflect v5 name changes (#30393) @pupudu
+- &#8203;<!-- 18 -->[docs] Fix a11y in Menu demos (#30378) @ZeeshanTamboli
+- &#8203;<!-- 17 -->[docs] Document how to unmount transition child (#30382) @oliviertassinari
+- &#8203;<!-- 16 -->[docs] The current standard for quotes is QUOTATION MARK @oliviertassinari
+- &#8203;<!-- 15 -->[docs] Fix 404 links (#30380) @oliviertassinari
+- &#8203;<!-- 14 -->[docs] Fix Breadcrumb description (#30307) @jamesmelzer
+- &#8203;<!-- 13 -->[docs] Modify injection order for Gatsby and SSR examples (#30358) @ShuPink
+- &#8203;<!-- 12 -->[docs] Improve the translation experience (#30373) @oliviertassinari
+- &#8203;<!-- 11 -->[docs] Sync translations with Crowdin (#30176) @l10nbot
+- &#8203;<!-- 10 -->[docs] Fix link to /size-snapshot (#30363) @oliviertassinari
+- &#8203;<!-- 09 -->[docs] Fix incorrect aria label in SpeedDial demo (#30354) @chwallen
+- &#8203;<!-- 08 -->[docs] Fix incorrect number of breakpoint helpers (#30353) @chwallen
+- &#8203;<!-- 07 -->[docs] Update outdated links (#30260) @oliviertassinari
+- &#8203;<!-- 06 -->[docs] Support redirects from old urls to /material/\* (#30286) @siriwatknp
+- &#8203;<!-- 05 -->[examples] Fix CSS modules integration (#30381) @oliviertassinari
+- &#8203;<!-- 02 -->[website] Fix SEO issues (#30372) @oliviertassinari
+- &#8203;<!-- 01 -->[website] Sync sponsors (#30259) @oliviertassinari
+
+### Core
+
+- &#8203;<!-- 28 -->[core] Rename Material-UI to MUI (#30338) @ZeeshanTamboli
+- &#8203;<!-- 23 -->[core] Fix warning in dev mode (#30368) @oliviertassinari
+- &#8203;<!-- 22 -->[core] Update `buildApi` script to support new structure (#30245) @siriwatknp
+
+All contributors of this release in alphabetical order: @cherniavskii, @chwallen, @jamesmelzer, @Janpot, @kealjones-wk, @l10nbot, @mnajdova, @oliviertassinari, @pupudu, @ryota-murakami, @ShuPink, @siriwatknp, @wogsland, @ZeeshanTamboli
+
+## 5.2.5
+
+<!-- generated comparing v5.2.4..master -->
+
+_Dec 20, 2021_
+
+A big thanks to the 16 contributors who made this release possible. Here are some highlights ✨:
+
+- 🛠 This release mostly improves what's behind the scenes: infrastructure and tests
+- 📓 Danish (da-DK) locale was added (#29485) @mikk5829
+- 🖌 Polished the design of Base components (#30149) and the docs in general (#29994) @danilo-leal
+- 📚 Many additions and improvements to the documentation were made
+
+### `@mui/material@5.2.5`
+
+- [l10n] Add Danish (da-DK) locale (#29485) @mikk5829
+- [LoadingButton] Label progressbar by the LoadingButton (#30002) @eps1lon
+- [Tabs] Remove unnecessary `Partial<>` type around TabIndicatorProps type (#30254) @ZeeshanTamboli
+
+### `@mui/system@5.2.5`
+
+- [system] Use `useEnhancedEffect` to prevent flicker (#30216) @hbjORbj
+
+### `@mui/lab@5.0.0-alpha.61`
+
+- [pickers] Fix the wrong MuiClockPicker's ArrowSwitcher slot name (#30226) @rejetto
+
+### Docs
+
+- [docs] Run JS compiler on markdown output (#29732) @Janpot
+- [Badge] Add tests for `anchorOrigin` prop (#30147) @daniel-sachs
+- [docs] Add cssmodule injection order comments to Nextjs example (#30213) @ShuPink
+- [docs] Remove extra word in Select component code example comments (#30281) @KThompso
+- [docs] Improve the description of the Accordion (#30253) @jamesmelzer
+- [docs] Heading capitalization convention @oliviertassinari
+- [docs] Rename remaining 'unstyled' references to 'base' (#30206) @michaldudak
+- [docs] Add to migration doc about ref type specificity (#30114) @hbjORbj
+- [docs] Add script to clone pages (#30107) @siriwatknp
+- [docs] Correct colors in breakpoints documentation (#30219) @michaldudak
+- [docs] Sync icon search UI state with the url (#30075) @Janpot
+- [docs] Base components demos design polish (#30149) @danilo-leal
+- [docs] General documentation polish (#29994) @danilo-leal
+- [examples] Fix typo in the remix example's README (#30289) @lemol
+- [website] Remove expired gold sponsor (#30222) @oliviertassinari
+- [website] Remove broken showcase links (#30217) @mnajdova
+
+### Core
+
+- [test] Reduce bundle size comparison memory consumption (#30195) @Janpot
+- [core] make snapshot comparison more resilient (#30183) @Janpot
+- [core] update formatted ts demo to support new structure (#30248) @siriwatknp
+- [core] cache dependencies in github actions (#30211) @siriwatknp
+- [core] fix root package version (#30204) @siriwatknp
+- [core] Fail the build when the dangerjs script errors (#30186) @Janpot
+- [test] Add E2E website tests (#30128) @siriwatknp
+
+All contributors of this release in alphabetical order: @daniel-sachs, @danilo-leal, @eps1lon, @hbjORbj, @jamesmelzer, @Janpot, @KThompso, @lemol, @michaldudak, @mikk5829, @mnajdova, @oliviertassinari, @rejetto, @ShuPink, @siriwatknp, @ZeeshanTamboli
+
+## 5.2.4
+
+<!-- generated comparing v5.2.3..master -->
+
+_Dec 14, 2021_
+
+A big thanks to the 16 contributors who made this release possible. Here are some highlights ✨:
+
+- ✨ Add `not` operator to `theme.breakpoints` (#29311) @Philipp000
+
+  ```js
+  const styles = (theme) => ({
+    root: {
+      backgroundColor: 'blue',
+      // Match [xs, md) and [md + 1, ∞)
+      //       [xs, md) and [lg, ∞)
+      //       [0px, 900px) and [1200px, ∞)
+      [theme.breakpoints.not('md')]: {
+        backgroundColor: 'red',
+      },
+    },
+  });
+  ```
+
+- And many more 🐛 bug fixes and 📚 improvements.
+
+### `@mui/material@5.2.4`
+
+- &#8203;<!-- 14 -->[esm] Correct a styles imports (#29976) @Janpot
+- &#8203;<!-- 12 -->[GlobalStyles] Fix `theme` type (#30072) @mnajdova
+- &#8203;<!-- 11 -->[Grid] Fix grid items to respond to the container's responsive columns (#29715) @kkorach
+- &#8203;<!-- 04 -->[TextField] Fix missing space before asterisk in `OutlinedInput`'s label (#29630) @alisasanib
+- &#8203;<!-- 03 -->[Transition] Allow any valid HTML attribute to be passed (#29888) @Janpot
+- &#8203;<!-- 02 -->[types] Fix discrepancy between core and system `ThemeOptions` (#30095) @fmeum
+- &#8203;<!-- 09 -->[InputBase] Add prop for disabling global styles (#29213) @bryan-hunter
+- &#8203;<!-- 08 -->[Select] Improve multiple logic (#30135) @ladygo93
+
+### `@mui/system@5.2.4`
+
+- &#8203;<!-- 06 -->[system] Don't transition when re-appearing (#30108) @eps1lon
+- &#8203;<!-- 05 -->[system] Add `not` operator to `breakpoints` (#29311) @Philipp000
+
+### `@mui/base@5.0.0-alpha.60`
+
+- &#8203;<!-- 25 -->[BadgeUnstyled] Make it conformant with other base components (#30141) @mnajdova
+
+### `@mui/icons-material@5.2.4`
+
+- &#8203;<!-- 10 -->[icons] Correct location of icon download folder (#29839) @yaboi
+
+### Docs
+
+- &#8203;<!-- 22 -->[docs] Explain the use of Select's label in FormControl (#30189) @michaldudak
+- &#8203;<!-- 21 -->[docs] Don't run nprogress on shallow routing (#30087) @Janpot
+- &#8203;<!-- 20 -->[docs] Add Data Driven Forms to related projects (#30078) @rvsia
+- &#8203;<!-- 19 -->[docs] Sync translations with Crowdin (#30067) @l10nbot
+- &#8203;<!-- 18 -->[docs] Fix link on "Custom variables" section in the Theming page #30100 @danilo-leal
+- &#8203;<!-- 17 -->[docs] Fix justifyContent option in the Grid interactive demo (#30117) @danilo-leal
+- &#8203;<!-- 16 -->[docs] Add tip to help access the docs of a previous version when finding answers in StackOverflow (#30101) @danilo-leal
+- &#8203;<!-- 15 -->[docs] Fix import example inside Unstyled Backdrop section (#30098) @TheodosiouTh
+- &#8203;<!-- 01 -->[website] Column pinning and Tree data are out (#30136) @oliviertassinari
+- &#8203;<!-- 07 -->[survey] Remove survey promotion items (#30122) @danilo-leal
+
+### Core
+
+- &#8203;<!-- 23 -->[core] Fix link to Open Collective @oliviertassinari
+- &#8203;<!-- 26 -->[core] Update snapshots and s3 fallback (#30134) @Janpot
+- &#8203;<!-- 24 -->[ci] Update CI bucket (#30080) @Janpot
+- &#8203;<!-- 13 -->[fix] size:snapshot for mui-material-next and mui-joy components (#30106) @Janpot
+
+All contributors of this release in alphabetical order: @alisasanib, @bryan-hunter, @danilo-leal, @eps1lon, @fmeum, @Janpot, @kkorach, @l10nbot, @ladygo93, @michaldudak, @mnajdova, @oliviertassinari, @Philipp000, @rvsia, @TheodosiouTh, @yaboi
+
 ## 5.2.3
 
 <!-- generated comparing v5.2.2..master -->

package/ClockPicker/ClockPicker.d.ts

@@ -4,7 +4,7 @@ import { TimeValidationProps } from '../internal/pickers/time-utils';
 import { PickerOnChangeFn } from '../internal/pickers/hooks/useViews';
 import { ClockView } from './shared';
 export interface ClockPickerClasses {
-    /** Styles applied to the arrowSwticher element. */
+    /** Styles applied to the arrowSwitcher element. */
     arrowSwitcher: string;
 }
 export declare type ClockPickerClassKey = keyof ClockPickerClasses;

package/ClockPicker/ClockPicker.js

@@ -30,7 +30,7 @@ const useUtilityClasses = ownerState => {
 
 const ClockPickerArrowSwitcher = styled(PickersArrowSwitcher, {
   name: 'MuiClockPicker',
-  slot: 'ArrowSwticher',
+  slot: 'ArrowSwitcher',
   overridesResolver: (props, styles) => styles.arrowSwitcher
 })({
   position: 'absolute',

package/LoadingButton/LoadingButton.d.ts

@@ -36,6 +36,8 @@ export type LoadingButtonTypeMap<
     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;

package/LoadingButton/LoadingButton.js

@@ -1,10 +1,10 @@
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import _extends from "@babel/runtime/helpers/esm/extends";
-const _excluded = ["children", "disabled", "loading", "loadingIndicator", "loadingPosition", "variant"];
+const _excluded = ["children", "disabled", "id", "loading", "loadingIndicator", "loadingPosition", "variant"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import { chainPropTypes } from '@mui/utils';
-import { capitalize } from '@mui/material/utils';
+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';
@@ -112,12 +112,6 @@ const LoadingButtonLoadingIndicator = styled('div', {
   position: 'relative',
   right: -10
 }));
-
-const LoadingIndicator = /*#__PURE__*/_jsx(CircularProgress, {
-  color: "inherit",
-  size: 16
-});
-
 const LoadingButton = /*#__PURE__*/React.forwardRef(function LoadingButton(inProps, ref) {
   const props = useThemeProps({
     props: inProps,
@@ -127,13 +121,21 @@ const LoadingButton = /*#__PURE__*/React.forwardRef(function LoadingButton(inPro
   const {
     children,
     disabled = false,
+    id: idProp,
     loading = false,
-    loadingIndicator = LoadingIndicator,
+    loadingIndicator: loadingIndicatorProp,
     loadingPosition = 'center',
     variant = 'text'
   } = props,
         other = _objectWithoutPropertiesLoose(props, _excluded);
 
+  const id = useId(idProp);
+  const loadingIndicator = loadingIndicatorProp != null ? loadingIndicatorProp : /*#__PURE__*/_jsx(CircularProgress, {
+    "aria-labelledby": id,
+    color: "inherit",
+    size: 16
+  });
+
   const ownerState = _extends({}, props, {
     disabled,
     loading,
@@ -145,6 +147,7 @@ const LoadingButton = /*#__PURE__*/React.forwardRef(function LoadingButton(inPro
   const classes = useUtilityClasses(ownerState);
   return /*#__PURE__*/_jsx(LoadingButtonRoot, _extends({
     disabled: disabled || loading,
+    id: id,
     ref: ref
   }, other, {
     variant: variant,
@@ -189,6 +192,11 @@ process.env.NODE_ENV !== "production" ? LoadingButton.propTypes
    */
   disabled: PropTypes.bool,
 
+  /**
+   * @ignore
+   */
+  id: PropTypes.string,
+
   /**
    * If `true`, the loading indicator is shown.
    * @default false
@@ -197,6 +205,8 @@ process.env.NODE_ENV !== "production" ? LoadingButton.propTypes
 
   /**
    * 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,

package/index.js

@@ -1,4 +1,4 @@
-/** @license MUI v5.0.0-alpha.59
+/** @license MUI v5.0.0-alpha.63
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.

package/legacy/ClockPicker/ClockPicker.js

@@ -28,7 +28,7 @@ var useUtilityClasses = function useUtilityClasses(ownerState) {
 
 var ClockPickerArrowSwitcher = styled(PickersArrowSwitcher, {
   name: 'MuiClockPicker',
-  slot: 'ArrowSwticher',
+  slot: 'ArrowSwitcher',
   overridesResolver: function overridesResolver(props, styles) {
     return styles.arrowSwitcher;
   }

package/legacy/LoadingButton/LoadingButton.js

@@ -4,7 +4,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import { chainPropTypes } from '@mui/utils';
-import { capitalize } from '@mui/material/utils';
+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';
@@ -103,12 +103,6 @@ var LoadingButtonLoadingIndicator = styled('div', {
     right: -10
   });
 });
-
-var LoadingIndicator = /*#__PURE__*/_jsx(CircularProgress, {
-  color: "inherit",
-  size: 16
-});
-
 var LoadingButton = /*#__PURE__*/React.forwardRef(function LoadingButton(inProps, ref) {
   var props = useThemeProps({
     props: inProps,
@@ -118,15 +112,22 @@ var LoadingButton = /*#__PURE__*/React.forwardRef(function LoadingButton(inProps
   var children = props.children,
       _props$disabled = props.disabled,
       disabled = _props$disabled === void 0 ? false : _props$disabled,
+      idProp = props.id,
       _props$loading = props.loading,
       loading = _props$loading === void 0 ? false : _props$loading,
-      _props$loadingIndicat = props.loadingIndicator,
-      loadingIndicator = _props$loadingIndicat === void 0 ? LoadingIndicator : _props$loadingIndicat,
+      loadingIndicatorProp = props.loadingIndicator,
       _props$loadingPositio = props.loadingPosition,
       loadingPosition = _props$loadingPositio === void 0 ? 'center' : _props$loadingPositio,
       _props$variant = props.variant,
       variant = _props$variant === void 0 ? 'text' : _props$variant,
-      other = _objectWithoutProperties(props, ["children", "disabled", "loading", "loadingIndicator", "loadingPosition", "variant"]);
+      other = _objectWithoutProperties(props, ["children", "disabled", "id", "loading", "loadingIndicator", "loadingPosition", "variant"]);
+
+  var id = useId(idProp);
+  var loadingIndicator = loadingIndicatorProp != null ? loadingIndicatorProp : /*#__PURE__*/_jsx(CircularProgress, {
+    "aria-labelledby": id,
+    color: "inherit",
+    size: 16
+  });
 
   var ownerState = _extends({}, props, {
     disabled: disabled,
@@ -139,6 +140,7 @@ var LoadingButton = /*#__PURE__*/React.forwardRef(function LoadingButton(inProps
   var classes = useUtilityClasses(ownerState);
   return /*#__PURE__*/_jsx(LoadingButtonRoot, _extends({
     disabled: disabled || loading,
+    id: id,
     ref: ref
   }, other, {
     variant: variant,
@@ -183,6 +185,11 @@ process.env.NODE_ENV !== "production" ? LoadingButton.propTypes
    */
   disabled: PropTypes.bool,
 
+  /**
+   * @ignore
+   */
+  id: PropTypes.string,
+
   /**
    * If `true`, the loading indicator is shown.
    * @default false
@@ -191,6 +198,8 @@ process.env.NODE_ENV !== "production" ? LoadingButton.propTypes
 
   /**
    * 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,

package/legacy/index.js

@@ -1,4 +1,4 @@
-/** @license MUI v5.0.0-alpha.59
+/** @license MUI v5.0.0-alpha.63
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.

package/modern/ClockPicker/ClockPicker.js

@@ -30,7 +30,7 @@ const useUtilityClasses = ownerState => {
 
 const ClockPickerArrowSwitcher = styled(PickersArrowSwitcher, {
   name: 'MuiClockPicker',
-  slot: 'ArrowSwticher',
+  slot: 'ArrowSwitcher',
   overridesResolver: (props, styles) => styles.arrowSwitcher
 })({
   position: 'absolute',

package/modern/LoadingButton/LoadingButton.js

@@ -1,10 +1,10 @@
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import _extends from "@babel/runtime/helpers/esm/extends";
-const _excluded = ["children", "disabled", "loading", "loadingIndicator", "loadingPosition", "variant"];
+const _excluded = ["children", "disabled", "id", "loading", "loadingIndicator", "loadingPosition", "variant"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import { chainPropTypes } from '@mui/utils';
-import { capitalize } from '@mui/material/utils';
+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';
@@ -112,12 +112,6 @@ const LoadingButtonLoadingIndicator = styled('div', {
   position: 'relative',
   right: -10
 }));
-
-const LoadingIndicator = /*#__PURE__*/_jsx(CircularProgress, {
-  color: "inherit",
-  size: 16
-});
-
 const LoadingButton = /*#__PURE__*/React.forwardRef(function LoadingButton(inProps, ref) {
   const props = useThemeProps({
     props: inProps,
@@ -127,13 +121,22 @@ const LoadingButton = /*#__PURE__*/React.forwardRef(function LoadingButton(inPro
   const {
     children,
     disabled = false,
+    id: idProp,
     loading = false,
-    loadingIndicator = LoadingIndicator,
+    loadingIndicator: loadingIndicatorProp,
     loadingPosition = 'center',
     variant = 'text'
   } = props,
         other = _objectWithoutPropertiesLoose(props, _excluded);
 
+  const id = useId(idProp);
+
+  const loadingIndicator = loadingIndicatorProp ?? /*#__PURE__*/_jsx(CircularProgress, {
+    "aria-labelledby": id,
+    color: "inherit",
+    size: 16
+  });
+
   const ownerState = _extends({}, props, {
     disabled,
     loading,
@@ -145,6 +148,7 @@ const LoadingButton = /*#__PURE__*/React.forwardRef(function LoadingButton(inPro
   const classes = useUtilityClasses(ownerState);
   return /*#__PURE__*/_jsx(LoadingButtonRoot, _extends({
     disabled: disabled || loading,
+    id: id,
     ref: ref
   }, other, {
     variant: variant,
@@ -189,6 +193,11 @@ process.env.NODE_ENV !== "production" ? LoadingButton.propTypes
    */
   disabled: PropTypes.bool,
 
+  /**
+   * @ignore
+   */
+  id: PropTypes.string,
+
   /**
    * If `true`, the loading indicator is shown.
    * @default false
@@ -197,6 +206,8 @@ process.env.NODE_ENV !== "production" ? LoadingButton.propTypes
 
   /**
    * 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,

package/modern/index.js

@@ -1,4 +1,4 @@
-/** @license MUI v5.0.0-alpha.59
+/** @license MUI v5.0.0-alpha.63
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.

package/node/ClockPicker/ClockPicker.js

@@ -59,7 +59,7 @@ const useUtilityClasses = ownerState => {
 
 const ClockPickerArrowSwitcher = (0, _styles.styled)(_PickersArrowSwitcher.default, {
   name: 'MuiClockPicker',
-  slot: 'ArrowSwticher',
+  slot: 'ArrowSwitcher',
   overridesResolver: (props, styles) => styles.arrowSwitcher
 })({
   position: 'absolute',

package/node/LoadingButton/LoadingButton.js

@@ -31,7 +31,7 @@ var _loadingButtonClasses = _interopRequireWildcard(require("./loadingButtonClas
 
 var _jsxRuntime = require("react/jsx-runtime");
 
-const _excluded = ["children", "disabled", "loading", "loadingIndicator", "loadingPosition", "variant"];
+const _excluded = ["children", "disabled", "id", "loading", "loadingIndicator", "loadingPosition", "variant"];
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
@@ -136,10 +136,6 @@ const LoadingButtonLoadingIndicator = (0, _styles.styled)('div', {
   position: 'relative',
   right: -10
 }));
-const LoadingIndicator = /*#__PURE__*/(0, _jsxRuntime.jsx)(_CircularProgress.default, {
-  color: "inherit",
-  size: 16
-});
 const LoadingButton = /*#__PURE__*/React.forwardRef(function LoadingButton(inProps, ref) {
   const props = (0, _styles.useThemeProps)({
     props: inProps,
@@ -148,12 +144,19 @@ const LoadingButton = /*#__PURE__*/React.forwardRef(function LoadingButton(inPro
   const {
     children,
     disabled = false,
+    id: idProp,
     loading = false,
-    loadingIndicator = LoadingIndicator,
+    loadingIndicator: loadingIndicatorProp,
     loadingPosition = 'center',
     variant = 'text'
   } = props,
         other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
+  const id = (0, _utils2.unstable_useId)(idProp);
+  const loadingIndicator = loadingIndicatorProp != null ? loadingIndicatorProp : /*#__PURE__*/(0, _jsxRuntime.jsx)(_CircularProgress.default, {
+    "aria-labelledby": id,
+    color: "inherit",
+    size: 16
+  });
   const ownerState = (0, _extends2.default)({}, props, {
     disabled,
     loading,
@@ -164,6 +167,7 @@ const LoadingButton = /*#__PURE__*/React.forwardRef(function LoadingButton(inPro
   const classes = useUtilityClasses(ownerState);
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(LoadingButtonRoot, (0, _extends2.default)({
     disabled: disabled || loading,
+    id: id,
     ref: ref
   }, other, {
     variant: variant,
@@ -208,6 +212,11 @@ process.env.NODE_ENV !== "production" ? LoadingButton.propTypes
    */
   disabled: _propTypes.default.bool,
 
+  /**
+   * @ignore
+   */
+  id: _propTypes.default.string,
+
   /**
    * If `true`, the loading indicator is shown.
    * @default false
@@ -216,6 +225,8 @@ process.env.NODE_ENV !== "production" ? LoadingButton.propTypes
 
   /**
    * 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.default.node,

package/node/index.js

@@ -1,4 +1,4 @@
-/** @license MUI v5.0.0-alpha.59
+/** @license MUI v5.0.0-alpha.63
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/lab",
-  "version": "5.0.0-alpha.59",
+  "version": "5.0.0-alpha.63",
   "private": false,
   "author": "MUI Team",
   "description": "Laboratory for new MUI modules.",
@@ -60,8 +60,8 @@
     "@date-io/dayjs": "^2.11.0",
     "@date-io/luxon": "^2.11.1",
     "@date-io/moment": "^2.11.0",
-    "@mui/base": "5.0.0-alpha.59",
-    "@mui/system": "^5.2.3",
+    "@mui/base": "5.0.0-alpha.63",
+    "@mui/system": "^5.2.6",
     "@mui/utils": "^5.2.3",
     "clsx": "^1.1.1",
     "prop-types": "^15.7.2",