@mui/material 5.9.3 → 5.10.0

package/BottomNavigationAction/bottomNavigationActionClasses.d.ts

@@ -1,14 +1,14 @@
-export interface BottomNavigationActionClasses {
-    /** Styles applied to the root element. */
-    root: string;
-    /** State class applied to the root element if selected. */
-    selected: string;
-    /** State class applied to the root element if `showLabel={false}` and not selected. */
-    iconOnly: string;
-    /** Styles applied to the label's span element. */
-    label: string;
-}
-export declare type BottomNavigationActionClassKey = keyof BottomNavigationActionClasses;
-export declare function getBottomNavigationActionUtilityClass(slot: string): string;
-declare const bottomNavigationActionClasses: BottomNavigationActionClasses;
-export default bottomNavigationActionClasses;
+export interface BottomNavigationActionClasses {
+    /** Styles applied to the root element. */
+    root: string;
+    /** State class applied to the root element if selected. */
+    selected: string;
+    /** State class applied to the root element if `showLabel={false}` and not selected. */
+    iconOnly: string;
+    /** Styles applied to the label's span element. */
+    label: string;
+}
+export declare type BottomNavigationActionClassKey = keyof BottomNavigationActionClasses;
+export declare function getBottomNavigationActionUtilityClass(slot: string): string;
+declare const bottomNavigationActionClasses: BottomNavigationActionClasses;
+export default bottomNavigationActionClasses;

package/Breadcrumbs/breadcrumbsClasses.d.ts

@@ -1,14 +1,14 @@
-export interface BreadcrumbsClasses {
-    /** Styles applied to the root element. */
-    root: string;
-    /** Styles applied to the ol element. */
-    ol: string;
-    /** Styles applied to the li element. */
-    li: string;
-    /** Styles applied to the separator element. */
-    separator: string;
-}
-export declare type BreadcrumbsClassKey = keyof BreadcrumbsClasses;
-export declare function getBreadcrumbsUtilityClass(slot: string): string;
-declare const breadcrumbsClasses: BreadcrumbsClasses;
-export default breadcrumbsClasses;
+export interface BreadcrumbsClasses {
+    /** Styles applied to the root element. */
+    root: string;
+    /** Styles applied to the ol element. */
+    ol: string;
+    /** Styles applied to the li element. */
+    li: string;
+    /** Styles applied to the separator element. */
+    separator: string;
+}
+export declare type BreadcrumbsClassKey = keyof BreadcrumbsClasses;
+export declare function getBreadcrumbsUtilityClass(slot: string): string;
+declare const breadcrumbsClasses: BreadcrumbsClasses;
+export default breadcrumbsClasses;

package/Button/buttonClasses.d.ts

@@ -1,100 +1,100 @@
-export interface ButtonClasses {
-    /** Styles applied to the root element. */
-    root: string;
-    /** Styles applied to the root element if `variant="text"`. */
-    text: string;
-    /** Styles applied to the root element if `variant="text"` and `color="inherit"`. */
-    textInherit: string;
-    /** Styles applied to the root element if `variant="text"` and `color="primary"`. */
-    textPrimary: string;
-    /** Styles applied to the root element if `variant="text"` and `color="secondary"`. */
-    textSecondary: string;
-    /** Styles applied to the root element if `variant="text"` and `color="success"`. */
-    textSuccess: string;
-    /** Styles applied to the root element if `variant="text"` and `color="error"`. */
-    textError: string;
-    /** Styles applied to the root element if `variant="text"` and `color="info"`. */
-    textInfo: string;
-    /** Styles applied to the root element if `variant="text"` and `color="warning"`. */
-    textWarning: string;
-    /** Styles applied to the root element if `variant="outlined"`. */
-    outlined: string;
-    /** Styles applied to the root element if `variant="outlined"` and `color="inherit"`. */
-    outlinedInherit: string;
-    /** Styles applied to the root element if `variant="outlined"` and `color="primary"`. */
-    outlinedPrimary: string;
-    /** Styles applied to the root element if `variant="outlined"` and `color="secondary"`. */
-    outlinedSecondary: string;
-    /** Styles applied to the root element if `variant="outlined"` and `color="success"`. */
-    outlinedSuccess: string;
-    /** Styles applied to the root element if `variant="outlined"` and `color="error"`. */
-    outlinedError: string;
-    /** Styles applied to the root element if `variant="outlined"` and `color="info"`. */
-    outlinedInfo: string;
-    /** Styles applied to the root element if `variant="outlined"` and `color="warning"`. */
-    outlinedWarning: string;
-    /** Styles applied to the root element if `variant="contained"`. */
-    contained: string;
-    /** Styles applied to the root element if `variant="contained"` and `color="inherit"`. */
-    containedInherit: string;
-    /** Styles applied to the root element if `variant="contained"` and `color="primary"`. */
-    containedPrimary: string;
-    /** Styles applied to the root element if `variant="contained"` and `color="secondary"`. */
-    containedSecondary: string;
-    /** Styles applied to the root element if `variant="contained"` and `color="success"`. */
-    containedSuccess: string;
-    /** Styles applied to the root element if `variant="contained"` and `color="info"`. */
-    containedInfo: string;
-    /** Styles applied to the root element if `variant="contained"` and `color="error"`. */
-    containedError: string;
-    /** Styles applied to the root element if `variant="contained"` and `color="warning"`. */
-    containedWarning: string;
-    /** Styles applied to the root element if `disableElevation={true}`. */
-    disableElevation: string;
-    /** State class applied to the ButtonBase root element if the button is keyboard focused. */
-    focusVisible: string;
-    /** State class applied to the root element if `disabled={true}`. */
-    disabled: string;
-    /** Styles applied to the root element if `color="inherit"`. */
-    colorInherit: string;
-    /** Styles applied to the root element if `size="small"` and `variant="text"`. */
-    textSizeSmall: string;
-    /** Styles applied to the root element if `size="medium"` and `variant="text"`. */
-    textSizeMedium: string;
-    /** Styles applied to the root element if `size="large"` and `variant="text"`. */
-    textSizeLarge: string;
-    /** Styles applied to the root element if `size="small"` and `variant="outlined"`. */
-    outlinedSizeSmall: string;
-    /** Styles applied to the root element if `size="medium"` and `variant="outlined"`. */
-    outlinedSizeMedium: string;
-    /** Styles applied to the root element if `size="large"` and `variant="outlined"`. */
-    outlinedSizeLarge: string;
-    /** Styles applied to the root element if `size="small"` and `variant="contained"`. */
-    containedSizeSmall: string;
-    /** Styles applied to the root element if `size="medium"` and `variant="contained"`. */
-    containedSizeMedium: string;
-    /** Styles applied to the root element if `size="large"` and `variant="contained"`. */
-    containedSizeLarge: string;
-    /** Styles applied to the root element if `size="small"`. */
-    sizeSmall: string;
-    /** Styles applied to the root element if `size="medium"`. */
-    sizeMedium: string;
-    /** Styles applied to the root element if `size="large"`. */
-    sizeLarge: string;
-    /** Styles applied to the root element if `fullWidth={true}`. */
-    fullWidth: string;
-    /** Styles applied to the startIcon element if supplied. */
-    startIcon: string;
-    /** Styles applied to the endIcon element if supplied. */
-    endIcon: string;
-    /** Styles applied to the icon element if supplied and `size="small"`. */
-    iconSizeSmall: string;
-    /** Styles applied to the icon element if supplied and `size="medium"`. */
-    iconSizeMedium: string;
-    /** Styles applied to the icon element if supplied and `size="large"`. */
-    iconSizeLarge: string;
-}
-export declare type ButtonClassKey = keyof ButtonClasses;
-export declare function getButtonUtilityClass(slot: string): string;
-declare const buttonClasses: ButtonClasses;
-export default buttonClasses;
+export interface ButtonClasses {
+    /** Styles applied to the root element. */
+    root: string;
+    /** Styles applied to the root element if `variant="text"`. */
+    text: string;
+    /** Styles applied to the root element if `variant="text"` and `color="inherit"`. */
+    textInherit: string;
+    /** Styles applied to the root element if `variant="text"` and `color="primary"`. */
+    textPrimary: string;
+    /** Styles applied to the root element if `variant="text"` and `color="secondary"`. */
+    textSecondary: string;
+    /** Styles applied to the root element if `variant="text"` and `color="success"`. */
+    textSuccess: string;
+    /** Styles applied to the root element if `variant="text"` and `color="error"`. */
+    textError: string;
+    /** Styles applied to the root element if `variant="text"` and `color="info"`. */
+    textInfo: string;
+    /** Styles applied to the root element if `variant="text"` and `color="warning"`. */
+    textWarning: string;
+    /** Styles applied to the root element if `variant="outlined"`. */
+    outlined: string;
+    /** Styles applied to the root element if `variant="outlined"` and `color="inherit"`. */
+    outlinedInherit: string;
+    /** Styles applied to the root element if `variant="outlined"` and `color="primary"`. */
+    outlinedPrimary: string;
+    /** Styles applied to the root element if `variant="outlined"` and `color="secondary"`. */
+    outlinedSecondary: string;
+    /** Styles applied to the root element if `variant="outlined"` and `color="success"`. */
+    outlinedSuccess: string;
+    /** Styles applied to the root element if `variant="outlined"` and `color="error"`. */
+    outlinedError: string;
+    /** Styles applied to the root element if `variant="outlined"` and `color="info"`. */
+    outlinedInfo: string;
+    /** Styles applied to the root element if `variant="outlined"` and `color="warning"`. */
+    outlinedWarning: string;
+    /** Styles applied to the root element if `variant="contained"`. */
+    contained: string;
+    /** Styles applied to the root element if `variant="contained"` and `color="inherit"`. */
+    containedInherit: string;
+    /** Styles applied to the root element if `variant="contained"` and `color="primary"`. */
+    containedPrimary: string;
+    /** Styles applied to the root element if `variant="contained"` and `color="secondary"`. */
+    containedSecondary: string;
+    /** Styles applied to the root element if `variant="contained"` and `color="success"`. */
+    containedSuccess: string;
+    /** Styles applied to the root element if `variant="contained"` and `color="info"`. */
+    containedInfo: string;
+    /** Styles applied to the root element if `variant="contained"` and `color="error"`. */
+    containedError: string;
+    /** Styles applied to the root element if `variant="contained"` and `color="warning"`. */
+    containedWarning: string;
+    /** Styles applied to the root element if `disableElevation={true}`. */
+    disableElevation: string;
+    /** State class applied to the ButtonBase root element if the button is keyboard focused. */
+    focusVisible: string;
+    /** State class applied to the root element if `disabled={true}`. */
+    disabled: string;
+    /** Styles applied to the root element if `color="inherit"`. */
+    colorInherit: string;
+    /** Styles applied to the root element if `size="small"` and `variant="text"`. */
+    textSizeSmall: string;
+    /** Styles applied to the root element if `size="medium"` and `variant="text"`. */
+    textSizeMedium: string;
+    /** Styles applied to the root element if `size="large"` and `variant="text"`. */
+    textSizeLarge: string;
+    /** Styles applied to the root element if `size="small"` and `variant="outlined"`. */
+    outlinedSizeSmall: string;
+    /** Styles applied to the root element if `size="medium"` and `variant="outlined"`. */
+    outlinedSizeMedium: string;
+    /** Styles applied to the root element if `size="large"` and `variant="outlined"`. */
+    outlinedSizeLarge: string;
+    /** Styles applied to the root element if `size="small"` and `variant="contained"`. */
+    containedSizeSmall: string;
+    /** Styles applied to the root element if `size="medium"` and `variant="contained"`. */
+    containedSizeMedium: string;
+    /** Styles applied to the root element if `size="large"` and `variant="contained"`. */
+    containedSizeLarge: string;
+    /** Styles applied to the root element if `size="small"`. */
+    sizeSmall: string;
+    /** Styles applied to the root element if `size="medium"`. */
+    sizeMedium: string;
+    /** Styles applied to the root element if `size="large"`. */
+    sizeLarge: string;
+    /** Styles applied to the root element if `fullWidth={true}`. */
+    fullWidth: string;
+    /** Styles applied to the startIcon element if supplied. */
+    startIcon: string;
+    /** Styles applied to the endIcon element if supplied. */
+    endIcon: string;
+    /** Styles applied to the icon element if supplied and `size="small"`. */
+    iconSizeSmall: string;
+    /** Styles applied to the icon element if supplied and `size="medium"`. */
+    iconSizeMedium: string;
+    /** Styles applied to the icon element if supplied and `size="large"`. */
+    iconSizeLarge: string;
+}
+export declare type ButtonClassKey = keyof ButtonClasses;
+export declare function getButtonUtilityClass(slot: string): string;
+declare const buttonClasses: ButtonClasses;
+export default buttonClasses;

package/ButtonBase/buttonBaseClasses.d.ts

@@ -1,12 +1,12 @@
-export interface ButtonBaseClasses {
-    /** Styles applied to the root element. */
-    root: string;
-    /** State class applied to the root element if `disabled={true}`. */
-    disabled: string;
-    /** State class applied to the root element if keyboard focused. */
-    focusVisible: string;
-}
-export declare type ButtonBaseClassKey = keyof ButtonBaseClasses;
-export declare function getButtonBaseUtilityClass(slot: string): string;
-declare const buttonBaseClasses: ButtonBaseClasses;
-export default buttonBaseClasses;
+export interface ButtonBaseClasses {
+    /** Styles applied to the root element. */
+    root: string;
+    /** State class applied to the root element if `disabled={true}`. */
+    disabled: string;
+    /** State class applied to the root element if keyboard focused. */
+    focusVisible: string;
+}
+export declare type ButtonBaseClassKey = keyof ButtonBaseClasses;
+export declare function getButtonBaseUtilityClass(slot: string): string;
+declare const buttonBaseClasses: ButtonBaseClasses;
+export default buttonBaseClasses;

package/ButtonBase/touchRippleClasses.d.ts

@@ -1,20 +1,20 @@
-export interface TouchRippleClasses {
-    /** Styles applied to the root element. */
-    root: string;
-    /** Styles applied to the internal `Ripple` components `ripple` class. */
-    ripple: string;
-    /** Styles applied to the internal `Ripple` components `rippleVisible` class. */
-    rippleVisible: string;
-    /** Styles applied to the internal `Ripple` components `ripplePulsate` class. */
-    ripplePulsate: string;
-    /** Styles applied to the internal `Ripple` components `child` class. */
-    child: string;
-    /** Styles applied to the internal `Ripple` components `childLeaving` class. */
-    childLeaving: string;
-    /** Styles applied to the internal `Ripple` components `childPulsate` class. */
-    childPulsate: string;
-}
-export declare type TouchRippleClassKey = keyof TouchRippleClasses;
-export declare function getTouchRippleUtilityClass(slot: string): string;
-declare const touchRippleClasses: TouchRippleClasses;
-export default touchRippleClasses;
+export interface TouchRippleClasses {
+    /** Styles applied to the root element. */
+    root: string;
+    /** Styles applied to the internal `Ripple` components `ripple` class. */
+    ripple: string;
+    /** Styles applied to the internal `Ripple` components `rippleVisible` class. */
+    rippleVisible: string;
+    /** Styles applied to the internal `Ripple` components `ripplePulsate` class. */
+    ripplePulsate: string;
+    /** Styles applied to the internal `Ripple` components `child` class. */
+    child: string;
+    /** Styles applied to the internal `Ripple` components `childLeaving` class. */
+    childLeaving: string;
+    /** Styles applied to the internal `Ripple` components `childPulsate` class. */
+    childPulsate: string;
+}
+export declare type TouchRippleClassKey = keyof TouchRippleClasses;
+export declare function getTouchRippleUtilityClass(slot: string): string;
+declare const touchRippleClasses: TouchRippleClasses;
+export default touchRippleClasses;

package/ButtonGroup/ButtonGroupContext.d.ts

@@ -1,18 +1,18 @@
-import * as React from 'react';
-import type { ButtonGroupProps } from './ButtonGroup';
-interface IButtonGroupContext {
-    className?: string;
-    color?: ButtonGroupProps['color'];
-    disabled?: boolean;
-    disableElevation?: boolean;
-    disableFocusRipple?: boolean;
-    disableRipple?: boolean;
-    fullWidth?: boolean;
-    size?: ButtonGroupProps['size'];
-    variant?: ButtonGroupProps['variant'];
-}
-/**
- * @ignore - internal component.
- */
-declare const ButtonGroupContext: React.Context<IButtonGroupContext>;
-export default ButtonGroupContext;
+import * as React from 'react';
+import type { ButtonGroupProps } from './ButtonGroup';
+interface IButtonGroupContext {
+    className?: string;
+    color?: ButtonGroupProps['color'];
+    disabled?: boolean;
+    disableElevation?: boolean;
+    disableFocusRipple?: boolean;
+    disableRipple?: boolean;
+    fullWidth?: boolean;
+    size?: ButtonGroupProps['size'];
+    variant?: ButtonGroupProps['variant'];
+}
+/**
+ * @ignore - internal component.
+ */
+declare const ButtonGroupContext: React.Context<IButtonGroupContext>;
+export default ButtonGroupContext;

package/ButtonGroup/buttonGroupClasses.d.ts

@@ -1,58 +1,58 @@
-export interface ButtonGroupClasses {
-    /** Styles applied to the root element. */
-    root: string;
-    /** Styles applied to the root element if `variant="contained"`. */
-    contained: string;
-    /** Styles applied to the root element if `variant="outlined"`. */
-    outlined: string;
-    /** Styles applied to the root element if `variant="text"`. */
-    text: string;
-    /** Styles applied to the root element if `disableElevation={true}`. */
-    disableElevation: string;
-    /** State class applied to the child elements if `disabled={true}`. */
-    disabled: string;
-    /** Styles applied to the root element if `fullWidth={true}`. */
-    fullWidth: string;
-    /** Styles applied to the root element if `orientation="vertical"`. */
-    vertical: string;
-    /** Styles applied to the children. */
-    grouped: string;
-    /** Styles applied to the children if `orientation="horizontal"`. */
-    groupedHorizontal: string;
-    /** Styles applied to the children if `orientation="vertical"`. */
-    groupedVertical: string;
-    /** Styles applied to the children if `variant="text"`. */
-    groupedText: string;
-    /** Styles applied to the children if `variant="text"` and `orientation="horizontal"`. */
-    groupedTextHorizontal: string;
-    /** Styles applied to the children if `variant="text"` and `orientation="vertical"`. */
-    groupedTextVertical: string;
-    /** Styles applied to the children if `variant="text"` and `color="primary"`. */
-    groupedTextPrimary: string;
-    /** Styles applied to the children if `variant="text"` and `color="secondary"`. */
-    groupedTextSecondary: string;
-    /** Styles applied to the children if `variant="outlined"`. */
-    groupedOutlined: string;
-    /** Styles applied to the children if `variant="outlined"` and `orientation="horizontal"`. */
-    groupedOutlinedHorizontal: string;
-    /** Styles applied to the children if `variant="outlined"` and `orientation="vertical"`. */
-    groupedOutlinedVertical: string;
-    /** Styles applied to the children if `variant="outlined"` and `color="primary"`. */
-    groupedOutlinedPrimary: string;
-    /** Styles applied to the children if `variant="outlined"` and `color="secondary"`. */
-    groupedOutlinedSecondary: string;
-    /** Styles applied to the children if `variant="contained"`. */
-    groupedContained: string;
-    /** Styles applied to the children if `variant="contained"` and `orientation="horizontal"`. */
-    groupedContainedHorizontal: string;
-    /** Styles applied to the children if `variant="contained"` and `orientation="vertical"`. */
-    groupedContainedVertical: string;
-    /** Styles applied to the children if `variant="contained"` and `color="primary"`. */
-    groupedContainedPrimary: string;
-    /** Styles applied to the children if `variant="contained"` and `color="secondary"`. */
-    groupedContainedSecondary: string;
-}
-export declare type ButtonGroupClassKey = keyof ButtonGroupClasses;
-export declare function getButtonGroupUtilityClass(slot: string): string;
-declare const buttonGroupClasses: ButtonGroupClasses;
-export default buttonGroupClasses;
+export interface ButtonGroupClasses {
+    /** Styles applied to the root element. */
+    root: string;
+    /** Styles applied to the root element if `variant="contained"`. */
+    contained: string;
+    /** Styles applied to the root element if `variant="outlined"`. */
+    outlined: string;
+    /** Styles applied to the root element if `variant="text"`. */
+    text: string;
+    /** Styles applied to the root element if `disableElevation={true}`. */
+    disableElevation: string;
+    /** State class applied to the child elements if `disabled={true}`. */
+    disabled: string;
+    /** Styles applied to the root element if `fullWidth={true}`. */
+    fullWidth: string;
+    /** Styles applied to the root element if `orientation="vertical"`. */
+    vertical: string;
+    /** Styles applied to the children. */
+    grouped: string;
+    /** Styles applied to the children if `orientation="horizontal"`. */
+    groupedHorizontal: string;
+    /** Styles applied to the children if `orientation="vertical"`. */
+    groupedVertical: string;
+    /** Styles applied to the children if `variant="text"`. */
+    groupedText: string;
+    /** Styles applied to the children if `variant="text"` and `orientation="horizontal"`. */
+    groupedTextHorizontal: string;
+    /** Styles applied to the children if `variant="text"` and `orientation="vertical"`. */
+    groupedTextVertical: string;
+    /** Styles applied to the children if `variant="text"` and `color="primary"`. */
+    groupedTextPrimary: string;
+    /** Styles applied to the children if `variant="text"` and `color="secondary"`. */
+    groupedTextSecondary: string;
+    /** Styles applied to the children if `variant="outlined"`. */
+    groupedOutlined: string;
+    /** Styles applied to the children if `variant="outlined"` and `orientation="horizontal"`. */
+    groupedOutlinedHorizontal: string;
+    /** Styles applied to the children if `variant="outlined"` and `orientation="vertical"`. */
+    groupedOutlinedVertical: string;
+    /** Styles applied to the children if `variant="outlined"` and `color="primary"`. */
+    groupedOutlinedPrimary: string;
+    /** Styles applied to the children if `variant="outlined"` and `color="secondary"`. */
+    groupedOutlinedSecondary: string;
+    /** Styles applied to the children if `variant="contained"`. */
+    groupedContained: string;
+    /** Styles applied to the children if `variant="contained"` and `orientation="horizontal"`. */
+    groupedContainedHorizontal: string;
+    /** Styles applied to the children if `variant="contained"` and `orientation="vertical"`. */
+    groupedContainedVertical: string;
+    /** Styles applied to the children if `variant="contained"` and `color="primary"`. */
+    groupedContainedPrimary: string;
+    /** Styles applied to the children if `variant="contained"` and `color="secondary"`. */
+    groupedContainedSecondary: string;
+}
+export declare type ButtonGroupClassKey = keyof ButtonGroupClasses;
+export declare function getButtonGroupUtilityClass(slot: string): string;
+declare const buttonGroupClasses: ButtonGroupClasses;
+export default buttonGroupClasses;

package/CHANGELOG.md

@@ -1,5 +1,66 @@
 # [Versions](https://mui.com/versions/)
 
+## 5.10.0
+
+<!-- generated comparing v5.9.3..master -->
+
+_Aug 8, 2022_
+
+A big thanks to the 16 contributors who made this release possible. Here are some highlights ✨:
+
+- ✨ [Stack](https://mui.com/system/react-stack/) component is added to MUI System and Joy UI #33760 #33800 @mnajdova
+- ✨ [Breadcrumbs](https://mui.com/joy-ui/react-breadcrumbs/) component is added to Joy UI (#32697) @hbjORbj
+- Many other 🐛 bug fixes, 📚 documentation, and ⚙️ infrastructure improvements
+
+### `@mui/material@5.10.0`
+
+- [Grid] Prevent crash if spacing is set to zero in theme (#33777) @PunitSoniME
+- [Grid] Export interface `RegularBreakpoints` to fix type error (#33751) @ZeeshanTamboli
+- [Skeleton] Add `rounded` variant (#33687) @siriwatknp
+- [Stepper] Fix classes for icon container (#33734) @pratikkarad
+- [TableCell] Enable size prop overrides via module augmentation (#33816) @brentertz
+- [Tooltip] Fix tooltip arrow css var background (#33753) @TimoWilhelm
+- [useScrollTrigger] Add passive flag to scroll trigger event listener #32437 (#33749) @Dsalazar1685
+
+### `@mui/system@5.10.0`
+
+- Fix unnecessary styles created from `sx` (#33752) @siriwatknp
+- Fix duplicated styles in Box (#33774) @iamxukai
+- Don't spread props to DOM for string tags (#33761) @siriwatknp
+- Add `Stack` component (#33760) @mnajdova
+
+### `@mui/joy@5.0.0-alpha.40`
+
+- [Stack] Add new component (#33800) @mnajdova
+- [Breadcrumbs] Add `Breadcrumbs` component (#32697) @hbjORbj
+- [Card] Fix wrong api description for `size` prop (#33862) @hbjORbj
+- Miscellaneous fixes (#33796, #33750) @siriwatknp
+
+### Docs
+
+- [docs] Create, revise, and expand System "Getting started" docs (#33503) @samuelsycamore
+- [docs] Test new image best practice @oliviertassinari
+- [docs] Fix typo in the ClickAwayListerner name (#33813) @pawelsmigielski
+- [docs] Fix link to `Basics` section in `Trap Focus` docs (#33772) @ZeeshanTamboli
+- [docs] z-index added in popper when used by split button (#33763) @PunitSoniME
+- [docs] Improve the guide for using @mui/base with Tailwind CSS (#33670) @mnajdova
+- [docs] Fix warnings related to Next.js' links (#33693) @mnajdova
+- [docs] Add notification to aggregation blogpost (#33745) @joserodolfofreitas
+- [docs] Add Grid version 2 docs (#33554) @siriwatknp
+- [examples] Fix `NextLinkComposedProps` type error (#33842) @adham618
+
+### Core
+
+- [blog] Add social card to Tenerife retreat post (#33764)
+- [blog] Fix blue outline bug (#33707) @oliviertassinari
+- [blog] Improve the width of the layout (#33706) @oliviertassinari@samuelsycamore
+- [core] Remove unnecessary packageName attribute from pages (#33488) @cherniavskii
+- [core] Remove duplicated CODE_OF_CONDUCT (#33702) @oliviertassinari
+- [core] Update Playwright packages together (#33737) @michaldudak
+- [website] Fix notifications not being marked as read in production (#33756) @cherniavskii
+
+All contributors of this release in alphabetical order: @adham618, @brentertz, @cherniavskii, @Dsalazar1685, @hbjORbj, @iamxukai, @joserodolfofreitas, @michaldudak, @mnajdova, @oliviertassinari, @pawelsmigielski, @pratikkarad, @PunitSoniME, @siriwatknp, @TimoWilhelm, @ZeeshanTamboli
+
 ## 5.9.3
 
 <!-- generated comparing v5.9.2..master -->
@@ -6880,7 +6941,7 @@ A big thanks to the 34 contributors who made this release possible. Here are som
 
   While the source code is currently hosted in the [main repository](https://github.com/mui/material-ui), we might move it to the [x repository](https://github.com/mui/mui-x) in the future, depending on what is easier for the commercial date range picker. The date picker will stay open source no matter what.
 
-- 📚 Revamp the documentation for [the system](https://mui.com/system/basics/). The System contains CSS utilities. The documentation now promotes the use of the `sx` prop. It's ideal for adding one-off styles, e.g. padding, but when pushed to its limits, it can be used to implement quickly a complete page.
+- 📚 Revamp the documentation for [the system](https://mui.com/system/getting-started/overview/). The System contains CSS utilities. The documentation now promotes the use of the `sx` prop. It's ideal for adding one-off styles, e.g. padding, but when pushed to its limits, it can be used to implement quickly a complete page.
 - 👩‍🎨 Upgrade emotion to v11 (#23007) @mnajdova.
 - And many more 🐛 bug fixes and 📚 improvements.
 
@@ -7282,7 +7343,7 @@ Here are some highlights ✨:
   If you target IE11, you need to use the new bundle (`legacy`). We are treating IE11 as a second class-citizen, which is a continuation of the direction taken in #22873.
 
 - 🚀 Improve the internal benchmark suite (#22923, #23058) @mnajdova.
-  This was a prerequisite step to improve the [system](https://mui.com/system/basics/). We needed to be able to measure performance. After #22945, we have measured that the `Box` component is x3 faster in v5-alpha compared to v4.
+  This was a prerequisite step to improve the [system](https://mui.com/system/getting-started/overview/). We needed to be able to measure performance. After #22945, we have measured that the `Box` component is x3 faster in v5-alpha compared to v4.
 - ✏️ A new blog post: [Q3 2020 Update](https://mui.com/blog/2020-q3-update/) (#23055) @oliviertassinari.
 - 🐙 Migrate more tests to react-testing-library @deiga, @Morteza-Jenabzadeh, @nicholas-l.
 - And many more 🐛 bug fixes and 📚 improvements.
@@ -7623,7 +7684,7 @@ Here are some highlights ✨:
 
   The new styling solution saves 2kB gzipped in the bundle compared to JSS, and about 14 kB gzipped if you were already using emotion or styled-components.
 
-  Last but not least, the change allows us to take advantage dynamic style props. We will use them for dynamic color props, variant props, and new style props (an improved [system](https://mui.com/system/basics/)).
+  Last but not least, the change allows us to take advantage dynamic style props. We will use them for dynamic color props, variant props, and new style props (an improved [system](https://mui.com/system/getting-started/overview/)).
 
   This change has been in our roadmap for more than a year.
   We announced it in the [v4 release blog post](https://mui.com/blog/material-ui-v4-is-out/) as a direction v5 would take.
@@ -8876,7 +8937,7 @@ A big thanks to the 33 contributors who made this release possible. Here are som
   />
   ```
 
-- [Typography] Replace the `srOnly` prop so as to not duplicate the capabilities of [System](https://mui.com/system/basics/) (#21413) @mnajdova.
+- [Typography] Replace the `srOnly` prop so as to not duplicate the capabilities of [System](https://mui.com/system/getting-started/overview/) (#21413) @mnajdova.
 
   ```diff
   -import Typography from '@material-ui/core/Typography';

package/Card/cardClasses.d.ts

@@ -1,8 +1,8 @@
-export interface CardClasses {
-    /** Styles applied to the root element. */
-    root: string;
-}
-export declare type CardClassKey = keyof CardClasses;
-export declare function getCardUtilityClass(slot: string): string;
-declare const cardClasses: CardClasses;
-export default cardClasses;
+export interface CardClasses {
+    /** Styles applied to the root element. */
+    root: string;
+}
+export declare type CardClassKey = keyof CardClasses;
+export declare function getCardUtilityClass(slot: string): string;
+declare const cardClasses: CardClasses;
+export default cardClasses;

package/CardActionArea/cardActionAreaClasses.d.ts

@@ -1,12 +1,12 @@
-export interface CardActionAreaClasses {
-    /** Styles applied to the root element. */
-    root: string;
-    /** State class applied to the ButtonBase root element if the action area is keyboard focused. */
-    focusVisible: string;
-    /** Styles applied to the overlay that covers the action area when it is keyboard focused. */
-    focusHighlight: string;
-}
-export declare type CardActionAreaClassKey = keyof CardActionAreaClasses;
-export declare function getCardActionAreaUtilityClass(slot: string): string;
-declare const cardActionAreaClasses: CardActionAreaClasses;
-export default cardActionAreaClasses;
+export interface CardActionAreaClasses {
+    /** Styles applied to the root element. */
+    root: string;
+    /** State class applied to the ButtonBase root element if the action area is keyboard focused. */
+    focusVisible: string;
+    /** Styles applied to the overlay that covers the action area when it is keyboard focused. */
+    focusHighlight: string;
+}
+export declare type CardActionAreaClassKey = keyof CardActionAreaClasses;
+export declare function getCardActionAreaUtilityClass(slot: string): string;
+declare const cardActionAreaClasses: CardActionAreaClasses;
+export default cardActionAreaClasses;