@mui/material 6.0.0-alpha.8 → 6.0.0-alpha.9

package/locale/index.js

@@ -991,7 +991,7 @@ export const enUS = {
       },
       labelRowsPerPage: 'Rows per page:',
       labelDisplayedRows: ({ from, to, count }) =>
-  `${from}–${to} of ${count !== -1 ? count : `more than ${to}`}`,
+  `${from}–${to} of ${count !== -1 ? count : `more than ${to}`}`, 
     }},
     MuiRating: { defaultProps: {
       getLabelText: value => `${value} Star${value !== 1 ? 's' : ''}`,
@@ -3037,6 +3037,79 @@ export const plPL = {
     }
   }
 };
+export const psAF = {
+  components: {
+    MuiBreadcrumbs: {
+      defaultProps: {
+        expandText: 'لاره ښکاره کړه'
+      }
+    },
+    MuiTablePagination: {
+      defaultProps: {
+        getItemAriaLabel: type => {
+          if (type === 'first') {
+            return 'لومړۍ پاڼې ته لاړ شه';
+          }
+          if (type === 'last') {
+            return 'ورستۍ پاڼې ته لاړ شه';
+          }
+          if (type === 'next') {
+            return 'بلی پاڼې ته لاړ شه';
+          }
+          // if (type === 'previous') {
+          return 'مخکینۍ پاڼې ته لاړ شه';
+        },
+        labelRowsPerPage: 'په پاڼه کی د کرښو شمیر',
+        labelDisplayedRows: ({
+          from,
+          to,
+          count
+        }) => `${count !== -1 ? count : `${to} زیات له`} ${to}- ${from} د`
+      }
+    },
+    MuiRating: {
+      defaultProps: {
+        getLabelText: value => `${value} ستوری`,
+        emptyLabelText: 'خالی'
+      }
+    },
+    MuiAutocomplete: {
+      defaultProps: {
+        clearText: 'پاک کول',
+        closeText: 'تړل',
+        loadingText: '... لوډ کیږی',
+        noOptionsText: 'بی پایلی',
+        openText: 'خلاصول'
+      }
+    },
+    MuiAlert: {
+      defaultProps: {
+        closeText: 'تړل'
+      }
+    },
+    MuiPagination: {
+      defaultProps: {
+        'aria-label': 'د پاڼو ترتیب',
+        getItemAriaLabel: (type, page, selected) => {
+          if (type === 'page') {
+            return `${selected ? '' : ' ته لاړ شه'}پاڼې ${page}`;
+          }
+          if (type === 'first') {
+            return 'لومړۍ پاڼی ته لاړ شه';
+          }
+          if (type === 'last') {
+            return 'وروستۍ پاڼې ته لاړه شه';
+          }
+          if (type === 'next') {
+            return 'بلې پاڼې ته لاړ شه';
+          }
+          // if (type === 'previous') {
+          return 'مخکنۍ پاڼې ته لاړ شه';
+        }
+      }
+    }
+  }
+};
 export const ptBR = {
   components: {
     MuiBreadcrumbs: {

package/modern/Avatar/Avatar.js

@@ -175,6 +175,8 @@ const Avatar = /*#__PURE__*/React.forwardRef(function Avatar(inProps, ref) {
     component,
     variant
   };
+  // This issue explains why this is required: https://github.com/mui/material-ui/issues/42184
+  delete ownerState.ownerState;
   const classes = useUtilityClasses(ownerState);
   const [ImgSlot, imgSlotProps] = useSlot('img', {
     className: classes.img,
@@ -214,10 +216,10 @@ const Avatar = /*#__PURE__*/React.forwardRef(function Avatar(inProps, ref) {
   }
   return /*#__PURE__*/_jsx(AvatarRoot, {
     as: component,
-    ownerState: ownerState,
     className: clsx(classes.root, className),
     ref: ref,
     ...other,
+    ownerState: ownerState,
     children: children
   });
 });

package/modern/AvatarGroup/AvatarGroup.js

@@ -9,6 +9,7 @@ import composeClasses from '@mui/utils/composeClasses';
 import { styled, createUseThemeProps } from '../zero-styled';
 import Avatar, { avatarClasses } from '../Avatar';
 import avatarGroupClasses, { getAvatarGroupUtilityClass } from './avatarGroupClasses';
+import useSlot from '../utils/useSlot';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const SPACINGS = {
   small: -16,
@@ -55,10 +56,11 @@ const AvatarGroup = /*#__PURE__*/React.forwardRef(function AvatarGroup(inProps,
     children: childrenProp,
     className,
     component = 'div',
-    componentsProps = {},
+    componentsProps,
     max = 5,
     renderSurplus,
     slotProps = {},
+    slots = {},
     spacing = 'medium',
     total,
     variant = 'circular',
@@ -89,22 +91,36 @@ const AvatarGroup = /*#__PURE__*/React.forwardRef(function AvatarGroup(inProps,
   const maxAvatars = Math.min(children.length, clampedMax - 1);
   const extraAvatars = Math.max(totalAvatars - clampedMax, totalAvatars - maxAvatars, 0);
   const extraAvatarsElement = renderSurplus ? renderSurplus(extraAvatars) : `+${extraAvatars}`;
-  const additionalAvatarSlotProps = slotProps.additionalAvatar ?? componentsProps.additionalAvatar;
   const marginValue = ownerState.spacing && SPACINGS[ownerState.spacing] !== undefined ? SPACINGS[ownerState.spacing] : -ownerState.spacing || -8;
+  const externalForwardedProps = {
+    slots,
+    slotProps: {
+      surplus: slotProps.additionalAvatar ?? componentsProps?.additionalAvatar,
+      ...componentsProps,
+      ...slotProps
+    }
+  };
+  const [SurplusSlot, surplusProps] = useSlot('surplus', {
+    elementType: Avatar,
+    externalForwardedProps,
+    className: classes.avatar,
+    ownerState,
+    additionalProps: {
+      variant,
+      style: {
+        '--AvatarRoot-spacing': marginValue ? `${marginValue}px` : undefined,
+        ...other.style
+      }
+    }
+  });
   return /*#__PURE__*/_jsxs(AvatarGroupRoot, {
     as: component,
     ownerState: ownerState,
     className: clsx(classes.root, className),
     ref: ref,
     ...other,
-    children: [extraAvatars ? /*#__PURE__*/_jsx(Avatar, {
-      variant: variant,
-      ...additionalAvatarSlotProps,
-      className: clsx(classes.avatar, additionalAvatarSlotProps?.className),
-      style: {
-        '--AvatarRoot-spacing': marginValue ? `${marginValue}px` : undefined,
-        ...other.style
-      },
+    children: [extraAvatars ? /*#__PURE__*/_jsx(SurplusSlot, {
+      ...surplusProps,
       children: extraAvatarsElement
     }) : null, children.slice(0, maxAvatars).reverse().map(child => {
       return /*#__PURE__*/React.cloneElement(child, {
@@ -141,9 +157,8 @@ process.env.NODE_ENV !== "production" ? AvatarGroup.propTypes /* remove-proptype
    * You can override the existing props or add new ones.
    *
    * This prop is an alias for the `slotProps` prop.
-   * It's recommended to use the `slotProps` prop instead, as `componentsProps` will be deprecated in the future.
    *
-   * @default {}
+   * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    */
   componentsProps: PropTypes.shape({
     additionalAvatar: PropTypes.object
@@ -165,15 +180,19 @@ process.env.NODE_ENV !== "production" ? AvatarGroup.propTypes /* remove-proptype
    */
   renderSurplus: PropTypes.func,
   /**
-   * The extra props for the slot components.
-   * You can override the existing props or add new ones.
-   *
-   * This prop is an alias for the `componentsProps` prop, which will be deprecated in the future.
-   *
+   * The props used for each slot inside.
    * @default {}
    */
   slotProps: PropTypes.shape({
-    additionalAvatar: PropTypes.object
+    additionalAvatar: PropTypes.object,
+    surplus: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
+  }),
+  /**
+   * The components used for each slot inside.
+   * @default {}
+   */
+  slots: PropTypes.shape({
+    surplus: PropTypes.elementType
   }),
   /**
    * Spacing between avatars.

package/modern/Grid/Grid.js

@@ -530,6 +530,7 @@ process.env.NODE_ENV !== "production" ? Grid.propTypes /* remove-proptypes */ =
    * Defines the `flex-wrap` style property.
    * It's applied for all screen sizes.
    * @default 'wrap'
+   * @deprecated Use `flexWrap` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    */
   wrap: PropTypes.oneOf(['nowrap', 'wrap-reverse', 'wrap']),
   /**

package/modern/Hidden/Hidden.js

@@ -7,6 +7,8 @@ import HiddenCss from './HiddenCss';
 
 /**
  * Responsively hides children based on the selected implementation.
+ *
+ * @deprecated The Hidden component was deprecated in Material UI v5. To learn more, see [the Hidden section](/material-ui/migration/v5-component-changes/#hidden) of the migration docs.
  */
 import { jsx as _jsx } from "react/jsx-runtime";
 function Hidden(props) {

package/modern/ListItem/ListItem.js

@@ -223,7 +223,7 @@ const ListItem = /*#__PURE__*/React.forwardRef(function ListItem(inProps, ref) {
   }, [autoFocus]);
   const children = React.Children.toArray(childrenProp);
 
-  // v4 implementation, deprecated in v5, will be removed in v6
+  // v4 implementation, deprecated in v6, will be removed in v7
   const hasSecondaryAction = children.length && isMuiElement(children[children.length - 1], ['ListItemSecondaryAction']);
   const ownerState = {
     ...props,
@@ -254,7 +254,7 @@ const ListItem = /*#__PURE__*/React.forwardRef(function ListItem(inProps, ref) {
     Component = ButtonBase;
   }
 
-  // v4 implementation, deprecated in v5, will be removed in v6
+  // v4 implementation, deprecated in v6, will be removed in v7
   if (hasSecondaryAction) {
     // Use div by default.
     Component = !componentProps.component && !componentProp ? 'div' : Component;
@@ -372,9 +372,7 @@ process.env.NODE_ENV !== "production" ? ListItem.propTypes /* remove-proptypes *
   /**
    * The components used for each slot inside.
    *
-   * This prop is an alias for the `slots` prop.
-   * It's recommended to use the `slots` prop instead.
-   *
+   * @deprecated Use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    * @default {}
    */
   components: PropTypes.shape({
@@ -384,9 +382,7 @@ process.env.NODE_ENV !== "production" ? ListItem.propTypes /* remove-proptypes *
    * The extra props for the slot components.
    * You can override the existing props or add new ones.
    *
-   * This prop is an alias for the `slotProps` prop.
-   * It's recommended to use the `slotProps` prop instead, as `componentsProps` will be deprecated in the future.
-   *
+   * @deprecated Use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    * @default {}
    */
   componentsProps: PropTypes.shape({
@@ -395,13 +391,13 @@ process.env.NODE_ENV !== "production" ? ListItem.propTypes /* remove-proptypes *
   /**
    * The container component used when a `ListItemSecondaryAction` is the last child.
    * @default 'li'
-   * @deprecated
+   * @deprecated Use the `component` or `slots.root` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    */
   ContainerComponent: elementTypeAcceptingRef,
   /**
    * Props applied to the container component if used.
    * @default {}
-   * @deprecated
+   * @deprecated Use the `slotProps.root` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    */
   ContainerProps: PropTypes.object,
   /**
@@ -449,8 +445,6 @@ process.env.NODE_ENV !== "production" ? ListItem.propTypes /* remove-proptypes *
    * The extra props for the slot components.
    * You can override the existing props or add new ones.
    *
-   * This prop is an alias for the `componentsProps` prop, which will be deprecated in the future.
-   *
    * @default {}
    */
   slotProps: PropTypes.shape({
@@ -459,8 +453,6 @@ process.env.NODE_ENV !== "production" ? ListItem.propTypes /* remove-proptypes *
   /**
    * The components used for each slot inside.
    *
-   * This prop is an alias for the `components` prop, which will be deprecated in the future.
-   *
    * @default {}
    */
   slots: PropTypes.shape({

package/modern/ListItemSecondaryAction/ListItemSecondaryAction.js

@@ -45,6 +45,8 @@ const ListItemSecondaryActionRoot = styled('div', {
 
 /**
  * Must be used as the last child of ListItem to function properly.
+ *
+ * @deprecated Use the `secondaryAction` prop in the `ListItem` component instead. This component will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
  */
 const ListItemSecondaryAction = /*#__PURE__*/React.forwardRef(function ListItemSecondaryAction(inProps, ref) {
   const props = useThemeProps({

package/modern/Popper/Popper.js

@@ -99,6 +99,8 @@ process.env.NODE_ENV !== "production" ? Popper.propTypes /* remove-proptypes */
   /**
    * The components used for each slot inside the Popper.
    * Either a string to use a HTML element or a component.
+   *
+   * @deprecated use the `slots` prop instead. This prop will be removed in v7. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/).
    * @default {}
    */
   components: PropTypes.shape({
@@ -106,6 +108,8 @@ process.env.NODE_ENV !== "production" ? Popper.propTypes /* remove-proptypes */
   }),
   /**
    * The props used for each slot inside the Popper.
+   *
+   * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/).
    * @default {}
    */
   componentsProps: PropTypes.shape({

package/modern/Slider/Slider.js

@@ -324,7 +324,7 @@ export const SliderThumb = styled('span', {
       },
       [`&.${sliderClasses.active}`]: {
         ...(theme.vars ? {
-          boxShadow: `0px 0px 0px 14px rgba(${theme.vars.palette[color].mainChannel} / 0.16)}`
+          boxShadow: `0px 0px 0px 14px rgba(${theme.vars.palette[color].mainChannel} / 0.16)`
         } : {
           boxShadow: `0px 0px 0px 14px ${alpha(theme.palette[color].main, 0.16)}`
         })

package/modern/Tooltip/Tooltip.js

@@ -709,8 +709,7 @@ process.env.NODE_ENV !== "production" ? Tooltip.propTypes /* remove-proptypes */
   /**
    * The components used for each slot inside.
    *
-   * This prop is an alias for the `slots` prop.
-   * It's recommended to use the `slots` prop instead.
+   * @deprecated use the `slots` prop instead. This prop will be removed in v7. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/).
    *
    * @default {}
    */
@@ -724,8 +723,7 @@ process.env.NODE_ENV !== "production" ? Tooltip.propTypes /* remove-proptypes */
    * The extra props for the slot components.
    * You can override the existing props or add new ones.
    *
-   * This prop is an alias for the `slotProps` prop.
-   * It's recommended to use the `slotProps` prop instead, as `componentsProps` will be deprecated in the future.
+   * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/).
    *
    * @default {}
    */

package/modern/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/material v6.0.0-alpha.8
+ * @mui/material v6.0.0-alpha.9
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/modern/locale/index.js

@@ -991,7 +991,7 @@ export const enUS = {
       },
       labelRowsPerPage: 'Rows per page:',
       labelDisplayedRows: ({ from, to, count }) =>
-  `${from}–${to} of ${count !== -1 ? count : `more than ${to}`}`,
+  `${from}–${to} of ${count !== -1 ? count : `more than ${to}`}`, 
     }},
     MuiRating: { defaultProps: {
       getLabelText: value => `${value} Star${value !== 1 ? 's' : ''}`,
@@ -3037,6 +3037,79 @@ export const plPL = {
     }
   }
 };
+export const psAF = {
+  components: {
+    MuiBreadcrumbs: {
+      defaultProps: {
+        expandText: 'لاره ښکاره کړه'
+      }
+    },
+    MuiTablePagination: {
+      defaultProps: {
+        getItemAriaLabel: type => {
+          if (type === 'first') {
+            return 'لومړۍ پاڼې ته لاړ شه';
+          }
+          if (type === 'last') {
+            return 'ورستۍ پاڼې ته لاړ شه';
+          }
+          if (type === 'next') {
+            return 'بلی پاڼې ته لاړ شه';
+          }
+          // if (type === 'previous') {
+          return 'مخکینۍ پاڼې ته لاړ شه';
+        },
+        labelRowsPerPage: 'په پاڼه کی د کرښو شمیر',
+        labelDisplayedRows: ({
+          from,
+          to,
+          count
+        }) => `${count !== -1 ? count : `${to} زیات له`} ${to}- ${from} د`
+      }
+    },
+    MuiRating: {
+      defaultProps: {
+        getLabelText: value => `${value} ستوری`,
+        emptyLabelText: 'خالی'
+      }
+    },
+    MuiAutocomplete: {
+      defaultProps: {
+        clearText: 'پاک کول',
+        closeText: 'تړل',
+        loadingText: '... لوډ کیږی',
+        noOptionsText: 'بی پایلی',
+        openText: 'خلاصول'
+      }
+    },
+    MuiAlert: {
+      defaultProps: {
+        closeText: 'تړل'
+      }
+    },
+    MuiPagination: {
+      defaultProps: {
+        'aria-label': 'د پاڼو ترتیب',
+        getItemAriaLabel: (type, page, selected) => {
+          if (type === 'page') {
+            return `${selected ? '' : ' ته لاړ شه'}پاڼې ${page}`;
+          }
+          if (type === 'first') {
+            return 'لومړۍ پاڼی ته لاړ شه';
+          }
+          if (type === 'last') {
+            return 'وروستۍ پاڼې ته لاړه شه';
+          }
+          if (type === 'next') {
+            return 'بلې پاڼې ته لاړ شه';
+          }
+          // if (type === 'previous') {
+          return 'مخکنۍ پاڼې ته لاړ شه';
+        }
+      }
+    }
+  }
+};
 export const ptBR = {
   components: {
     MuiBreadcrumbs: {

package/modern/styles/CssVarsProvider.js

@@ -1,14 +1,13 @@
 'use client';
 
-// do not remove the following import (https://github.com/microsoft/TypeScript/issues/29808#issuecomment-1320713018)
-/* eslint-disable @typescript-eslint/no-unused-vars */
-// @ts-ignore
+import * as React from 'react';
 import { unstable_createCssVarsProvider as createCssVarsProvider } from '@mui/system';
 import styleFunctionSx from '@mui/system/styleFunctionSx';
-import experimental_extendTheme from './experimental_extendTheme';
+import extendTheme from './extendTheme';
 import createTypography from './createTypography';
 import THEME_ID from './identifier';
-const defaultTheme = experimental_extendTheme();
+import { jsx as _jsx } from "react/jsx-runtime";
+const defaultTheme = extendTheme();
 const {
   CssVarsProvider,
   useColorScheme,
@@ -37,4 +36,16 @@ const {
     return newTheme;
   }
 });
-export { useColorScheme, getInitColorSchemeScript, CssVarsProvider as Experimental_CssVarsProvider };
+let warnedOnce = false;
+
+// eslint-disable-next-line @typescript-eslint/naming-convention
+function Experimental_CssVarsProvider(props) {
+  if (!warnedOnce) {
+    console.warn(['MUI: The Experimental_CssVarsProvider component has been stabilized.', '', "You should use `import { CssVarsProvider } from '@mui/material/styles'`"].join('\n'));
+    warnedOnce = true;
+  }
+  return /*#__PURE__*/_jsx(CssVarsProvider, {
+    ...props
+  });
+}
+export { useColorScheme, getInitColorSchemeScript, CssVarsProvider, Experimental_CssVarsProvider };