@mui/material 5.15.9 → 5.15.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -4,9 +4,30 @@ import { OverridableStringUnion } from '@mui/types';
4
4
  import { Theme } from '../styles';
5
5
  import { OverridableComponent, OverrideProps } from '../OverridableComponent';
6
6
  import { AvatarClasses } from './avatarClasses';
7
+ import { CreateSlotsAndSlotProps, SlotProps } from '../utils/types';
8
+
9
+ export interface AvatarSlots {
10
+ /**
11
+ * The component that renders the transition.
12
+ * [Follow this guide](/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component.
13
+ * @default Collapse
14
+ */
15
+ img?: React.JSXElementConstructor<React.ImgHTMLAttributes<HTMLImageElement>>;
16
+ }
7
17
 
8
18
  export interface AvatarPropsVariantOverrides {}
9
19
 
20
+ export type AvatarSlotsAndSlotProps = CreateSlotsAndSlotProps<
21
+ AvatarSlots,
22
+ {
23
+ img: SlotProps<
24
+ React.ElementType<React.ImgHTMLAttributes<HTMLImageElement>>,
25
+ {},
26
+ AvatarOwnProps
27
+ >;
28
+ }
29
+ >;
30
+
10
31
  export interface AvatarOwnProps {
11
32
  /**
12
33
  * Used in combination with `src` or `srcSet` to
@@ -25,6 +46,7 @@ export interface AvatarOwnProps {
25
46
  /**
26
47
  * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#attributes) applied to the `img` element if the component is used to display an image.
27
48
  * It can be used to listen for the loading error event.
49
+ * @deprecated Use `slotProps.img` instead. This prop will be removed in v7. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/).
28
50
  */
29
51
  imgProps?: React.ImgHTMLAttributes<HTMLImageElement> & {
30
52
  sx?: SxProps<Theme>;
@@ -57,7 +79,7 @@ export interface AvatarTypeMap<
57
79
  AdditionalProps = {},
58
80
  RootComponent extends React.ElementType = 'div',
59
81
  > {
60
- props: AdditionalProps & AvatarOwnProps;
82
+ props: AdditionalProps & AvatarOwnProps & AvatarSlotsAndSlotProps;
61
83
  defaultComponent: RootComponent;
62
84
  }
63
85
 
package/Avatar/Avatar.js CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
4
4
  import _extends from "@babel/runtime/helpers/esm/extends";
5
- const _excluded = ["alt", "children", "className", "component", "imgProps", "sizes", "src", "srcSet", "variant"];
5
+ const _excluded = ["alt", "children", "className", "component", "slots", "slotProps", "imgProps", "sizes", "src", "srcSet", "variant"];
6
6
  import * as React from 'react';
7
7
  import PropTypes from 'prop-types';
8
8
  import clsx from 'clsx';
@@ -11,6 +11,7 @@ import styled from '../styles/styled';
11
11
  import useThemeProps from '../styles/useThemeProps';
12
12
  import Person from '../internal/svg-icons/Person';
13
13
  import { getAvatarUtilityClass } from './avatarClasses';
14
+ import useSlot from '../utils/useSlot';
14
15
  import { jsx as _jsx } from "react/jsx-runtime";
15
16
  const useUtilityClasses = ownerState => {
16
17
  const {
@@ -150,6 +151,8 @@ const Avatar = /*#__PURE__*/React.forwardRef(function Avatar(inProps, ref) {
150
151
  children: childrenProp,
151
152
  className,
152
153
  component = 'div',
154
+ slots = {},
155
+ slotProps = {},
153
156
  imgProps,
154
157
  sizes,
155
158
  src,
@@ -172,16 +175,25 @@ const Avatar = /*#__PURE__*/React.forwardRef(function Avatar(inProps, ref) {
172
175
  variant
173
176
  });
174
177
  const classes = useUtilityClasses(ownerState);
178
+ const [ImgSlot, imgSlotProps] = useSlot('img', {
179
+ className: classes.img,
180
+ elementType: AvatarImg,
181
+ externalForwardedProps: {
182
+ slots,
183
+ slotProps: {
184
+ img: _extends({}, imgProps, slotProps.img)
185
+ }
186
+ },
187
+ additionalProps: {
188
+ alt,
189
+ src,
190
+ srcSet,
191
+ sizes
192
+ },
193
+ ownerState
194
+ });
175
195
  if (hasImgNotFailing) {
176
- children = /*#__PURE__*/_jsx(AvatarImg, _extends({
177
- alt: alt,
178
- srcSet: srcSet,
179
- src: src,
180
- sizes: sizes,
181
- ownerState: ownerState,
182
- className: classes.img
183
- }, imgProps));
184
-
196
+ children = /*#__PURE__*/_jsx(ImgSlot, _extends({}, imgSlotProps));
185
197
  // We only render valid children, non valid children are rendered with a fallback
186
198
  // We consider that invalid children are all falsy values, except 0, which is valid.
187
199
  } else if (!!childrenProp || childrenProp === 0) {
@@ -234,12 +246,27 @@ process.env.NODE_ENV !== "production" ? Avatar.propTypes /* remove-proptypes */
234
246
  /**
235
247
  * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#attributes) applied to the `img` element if the component is used to display an image.
236
248
  * It can be used to listen for the loading error event.
249
+ * @deprecated Use `slotProps.img` instead. This prop will be removed in v7. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/).
237
250
  */
238
251
  imgProps: PropTypes.object,
239
252
  /**
240
253
  * The `sizes` attribute for the `img` element.
241
254
  */
242
255
  sizes: PropTypes.string,
256
+ /**
257
+ * The props used for each slot inside.
258
+ * @default {}
259
+ */
260
+ slotProps: PropTypes.shape({
261
+ img: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
262
+ }),
263
+ /**
264
+ * The components used for each slot inside.
265
+ * @default {}
266
+ */
267
+ slots: PropTypes.shape({
268
+ img: PropTypes.elementType
269
+ }),
243
270
  /**
244
271
  * The `src` attribute for the `img` element.
245
272
  */
package/CHANGELOG.md CHANGED
@@ -1,5 +1,56 @@
1
1
  # [Versions](https://mui.com/versions/)
2
2
 
3
+ ## v5.15.10
4
+
5
+ <!-- generated comparing v5.15.9..master -->
6
+
7
+ _Feb 12, 2024_
8
+
9
+ A big thanks to the 8 contributors who made this release possible.
10
+ This release was mostly about 🐛 bug fixes and 📚 documentation improvements.
11
+
12
+ ### `@mui/material@5.15.10`
13
+
14
+ - [Avatar] Add props deprecation with a codemod (#40853) @siriwatknp
15
+
16
+ ### `@mui/system@5.15.10`
17
+
18
+ - [Stack] Update import statement for Stack component (#41032) @sai6855
19
+
20
+ ### `@mui/joy@5.0.0-beta.28`
21
+
22
+ - [Button] Fix `disabled` prop priority when inside button group (#41000) @Smileek
23
+ - [IconButton] Support loading prop (#40949) @Smileek
24
+
25
+ ### Docs
26
+
27
+ - [Button][material-ui] Fix 'File upload' demo a11y (#40943) @oliviertassinari
28
+ - [TableRow][material-ui] Escape markup in `children` prop so docgen tools don't parse it as HTML (#40992) @millerized
29
+ - [material-ui] Remove outdated example projects link (it uses Joy UI now) (#40913) @oliviertassinari
30
+ - [material-ui] Fix the "Intro to the MUI ecosystem" link placement (#40988) @danilo-leal
31
+ - Fix 301 redirection to StackBlitz @oliviertassinari
32
+ - Fix h1 on Joy UI templates @oliviertassinari
33
+ - Have MUI workspace own the CodeSandbox @oliviertassinari
34
+ - Add notification for mui x v7 beta (#41001) @joserodolfofreitas
35
+ - Fix 301 links @oliviertassinari
36
+ - Fix Next.js v13.5.1 <title> SEO regression (#40302) @oliviertassinari
37
+ - Add a 404 page (#40884) @danilo-leal
38
+ - Fix missing GitHub label when opening new issue @oliviertassinari
39
+
40
+ ### Core
41
+
42
+ - [blog] Add post about upcoming plans for Base UI (#40882) @danilo-leal
43
+ - [core] Simplify CodeSandbox reproduction @oliviertassinari
44
+ - [core] Missing redirection @oliviertassinari
45
+ - [core] Export functions from `copyFiles` script to reuse in MUI X repo (#40970) @cherniavskii
46
+ - [core] Avoid variable shorthands @oliviertassinari
47
+ - [docs-infra] Fix search icon issue (#40957) @oliviertassinari
48
+ - [docs-infra] Ignore classes tagged with `@ignore` (#41009) @cherniavskii
49
+ - [docs-infra] Fix selected tab on codeblocks (#41036) @danilo-leal
50
+ - [website] Polish Customer Support Agent role @oliviertassinari
51
+
52
+ All contributors of this release in alphabetical order: @cherniavskii, @danilo-leal, @joserodolfofreitas, @millerized, @oliviertassinari, @sai6855, @siriwatknp, @Smileek
53
+
3
54
  ## v5.15.9<!-- generated comparing v5.15.8..master -->
4
55
 
5
56
  _Feb 8, 2024_
@@ -6,7 +6,7 @@ import { TableRowClasses } from './tableRowClasses';
6
6
 
7
7
  export interface TableRowOwnProps {
8
8
  /**
9
- * Should be valid <tr> children such as `TableCell`.
9
+ * Should be valid `<tr>` children such as `TableCell`.
10
10
  */
11
11
  children?: React.ReactNode;
12
12
  /**
@@ -93,7 +93,7 @@ process.env.NODE_ENV !== "production" ? TableRow.propTypes /* remove-proptypes *
93
93
  // │ To update them, edit the d.ts file and run `pnpm proptypes`. │
94
94
  // └─────────────────────────────────────────────────────────────────────┘
95
95
  /**
96
- * Should be valid <tr> children such as `TableCell`.
96
+ * Should be valid `<tr>` children such as `TableCell`.
97
97
  */
98
98
  children: PropTypes.node,
99
99
  /**
package/index.js CHANGED
@@ -1,5 +1,5 @@
1
1
  /**
2
- * @mui/material v5.15.9
2
+ * @mui/material v5.15.10
3
3
  *
4
4
  * @license MIT
5
5
  * This source code is licensed under the MIT license found in the
@@ -1,5 +1,6 @@
1
1
  'use client';
2
2
 
3
+ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
3
4
  import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
4
5
  import _extends from "@babel/runtime/helpers/esm/extends";
5
6
  import * as React from 'react';
@@ -10,6 +11,7 @@ import styled from '../styles/styled';
10
11
  import useThemeProps from '../styles/useThemeProps';
11
12
  import Person from '../internal/svg-icons/Person';
12
13
  import { getAvatarUtilityClass } from './avatarClasses';
14
+ import useSlot from '../utils/useSlot';
13
15
  import { jsx as _jsx } from "react/jsx-runtime";
14
16
  var useUtilityClasses = function useUtilityClasses(ownerState) {
15
17
  var classes = ownerState.classes,
@@ -151,13 +153,17 @@ var Avatar = /*#__PURE__*/React.forwardRef(function Avatar(inProps, ref) {
151
153
  className = props.className,
152
154
  _props$component = props.component,
153
155
  component = _props$component === void 0 ? 'div' : _props$component,
156
+ _props$slots = props.slots,
157
+ slots = _props$slots === void 0 ? {} : _props$slots,
158
+ _props$slotProps = props.slotProps,
159
+ slotProps = _props$slotProps === void 0 ? {} : _props$slotProps,
154
160
  imgProps = props.imgProps,
155
161
  sizes = props.sizes,
156
162
  src = props.src,
157
163
  srcSet = props.srcSet,
158
164
  _props$variant = props.variant,
159
165
  variant = _props$variant === void 0 ? 'circular' : _props$variant,
160
- other = _objectWithoutProperties(props, ["alt", "children", "className", "component", "imgProps", "sizes", "src", "srcSet", "variant"]);
166
+ other = _objectWithoutProperties(props, ["alt", "children", "className", "component", "slots", "slotProps", "imgProps", "sizes", "src", "srcSet", "variant"]);
161
167
  var children = null;
162
168
 
163
169
  // Use a hook instead of onError on the img element to support server-side rendering.
@@ -173,16 +179,28 @@ var Avatar = /*#__PURE__*/React.forwardRef(function Avatar(inProps, ref) {
173
179
  variant: variant
174
180
  });
175
181
  var classes = useUtilityClasses(ownerState);
182
+ var _useSlot = useSlot('img', {
183
+ className: classes.img,
184
+ elementType: AvatarImg,
185
+ externalForwardedProps: {
186
+ slots: slots,
187
+ slotProps: {
188
+ img: _extends({}, imgProps, slotProps.img)
189
+ }
190
+ },
191
+ additionalProps: {
192
+ alt: alt,
193
+ src: src,
194
+ srcSet: srcSet,
195
+ sizes: sizes
196
+ },
197
+ ownerState: ownerState
198
+ }),
199
+ _useSlot2 = _slicedToArray(_useSlot, 2),
200
+ ImgSlot = _useSlot2[0],
201
+ imgSlotProps = _useSlot2[1];
176
202
  if (hasImgNotFailing) {
177
- children = /*#__PURE__*/_jsx(AvatarImg, _extends({
178
- alt: alt,
179
- srcSet: srcSet,
180
- src: src,
181
- sizes: sizes,
182
- ownerState: ownerState,
183
- className: classes.img
184
- }, imgProps));
185
-
203
+ children = /*#__PURE__*/_jsx(ImgSlot, _extends({}, imgSlotProps));
186
204
  // We only render valid children, non valid children are rendered with a fallback
187
205
  // We consider that invalid children are all falsy values, except 0, which is valid.
188
206
  } else if (!!childrenProp || childrenProp === 0) {
@@ -235,12 +253,27 @@ process.env.NODE_ENV !== "production" ? Avatar.propTypes /* remove-proptypes */
235
253
  /**
236
254
  * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#attributes) applied to the `img` element if the component is used to display an image.
237
255
  * It can be used to listen for the loading error event.
256
+ * @deprecated Use `slotProps.img` instead. This prop will be removed in v7. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/).
238
257
  */
239
258
  imgProps: PropTypes.object,
240
259
  /**
241
260
  * The `sizes` attribute for the `img` element.
242
261
  */
243
262
  sizes: PropTypes.string,
263
+ /**
264
+ * The props used for each slot inside.
265
+ * @default {}
266
+ */
267
+ slotProps: PropTypes.shape({
268
+ img: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
269
+ }),
270
+ /**
271
+ * The components used for each slot inside.
272
+ * @default {}
273
+ */
274
+ slots: PropTypes.shape({
275
+ img: PropTypes.elementType
276
+ }),
244
277
  /**
245
278
  * The `src` attribute for the `img` element.
246
279
  */
@@ -89,7 +89,7 @@ process.env.NODE_ENV !== "production" ? TableRow.propTypes /* remove-proptypes *
89
89
  // │ To update them, edit the d.ts file and run `pnpm proptypes`. │
90
90
  // └─────────────────────────────────────────────────────────────────────┘
91
91
  /**
92
- * Should be valid <tr> children such as `TableCell`.
92
+ * Should be valid `<tr>` children such as `TableCell`.
93
93
  */
94
94
  children: PropTypes.node,
95
95
  /**
package/legacy/index.js CHANGED
@@ -1,5 +1,5 @@
1
1
  /**
2
- * @mui/material v5.15.9
2
+ * @mui/material v5.15.10
3
3
  *
4
4
  * @license MIT
5
5
  * This source code is licensed under the MIT license found in the
@@ -2,7 +2,7 @@
2
2
 
3
3
  import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
4
4
  import _extends from "@babel/runtime/helpers/esm/extends";
5
- const _excluded = ["alt", "children", "className", "component", "imgProps", "sizes", "src", "srcSet", "variant"];
5
+ const _excluded = ["alt", "children", "className", "component", "slots", "slotProps", "imgProps", "sizes", "src", "srcSet", "variant"];
6
6
  import * as React from 'react';
7
7
  import PropTypes from 'prop-types';
8
8
  import clsx from 'clsx';
@@ -11,6 +11,7 @@ import styled from '../styles/styled';
11
11
  import useThemeProps from '../styles/useThemeProps';
12
12
  import Person from '../internal/svg-icons/Person';
13
13
  import { getAvatarUtilityClass } from './avatarClasses';
14
+ import useSlot from '../utils/useSlot';
14
15
  import { jsx as _jsx } from "react/jsx-runtime";
15
16
  const useUtilityClasses = ownerState => {
16
17
  const {
@@ -150,6 +151,8 @@ const Avatar = /*#__PURE__*/React.forwardRef(function Avatar(inProps, ref) {
150
151
  children: childrenProp,
151
152
  className,
152
153
  component = 'div',
154
+ slots = {},
155
+ slotProps = {},
153
156
  imgProps,
154
157
  sizes,
155
158
  src,
@@ -172,16 +175,25 @@ const Avatar = /*#__PURE__*/React.forwardRef(function Avatar(inProps, ref) {
172
175
  variant
173
176
  });
174
177
  const classes = useUtilityClasses(ownerState);
178
+ const [ImgSlot, imgSlotProps] = useSlot('img', {
179
+ className: classes.img,
180
+ elementType: AvatarImg,
181
+ externalForwardedProps: {
182
+ slots,
183
+ slotProps: {
184
+ img: _extends({}, imgProps, slotProps.img)
185
+ }
186
+ },
187
+ additionalProps: {
188
+ alt,
189
+ src,
190
+ srcSet,
191
+ sizes
192
+ },
193
+ ownerState
194
+ });
175
195
  if (hasImgNotFailing) {
176
- children = /*#__PURE__*/_jsx(AvatarImg, _extends({
177
- alt: alt,
178
- srcSet: srcSet,
179
- src: src,
180
- sizes: sizes,
181
- ownerState: ownerState,
182
- className: classes.img
183
- }, imgProps));
184
-
196
+ children = /*#__PURE__*/_jsx(ImgSlot, _extends({}, imgSlotProps));
185
197
  // We only render valid children, non valid children are rendered with a fallback
186
198
  // We consider that invalid children are all falsy values, except 0, which is valid.
187
199
  } else if (!!childrenProp || childrenProp === 0) {
@@ -234,12 +246,27 @@ process.env.NODE_ENV !== "production" ? Avatar.propTypes /* remove-proptypes */
234
246
  /**
235
247
  * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#attributes) applied to the `img` element if the component is used to display an image.
236
248
  * It can be used to listen for the loading error event.
249
+ * @deprecated Use `slotProps.img` instead. This prop will be removed in v7. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/).
237
250
  */
238
251
  imgProps: PropTypes.object,
239
252
  /**
240
253
  * The `sizes` attribute for the `img` element.
241
254
  */
242
255
  sizes: PropTypes.string,
256
+ /**
257
+ * The props used for each slot inside.
258
+ * @default {}
259
+ */
260
+ slotProps: PropTypes.shape({
261
+ img: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
262
+ }),
263
+ /**
264
+ * The components used for each slot inside.
265
+ * @default {}
266
+ */
267
+ slots: PropTypes.shape({
268
+ img: PropTypes.elementType
269
+ }),
243
270
  /**
244
271
  * The `src` attribute for the `img` element.
245
272
  */
@@ -93,7 +93,7 @@ process.env.NODE_ENV !== "production" ? TableRow.propTypes /* remove-proptypes *
93
93
  // │ To update them, edit the d.ts file and run `pnpm proptypes`. │
94
94
  // └─────────────────────────────────────────────────────────────────────┘
95
95
  /**
96
- * Should be valid <tr> children such as `TableCell`.
96
+ * Should be valid `<tr>` children such as `TableCell`.
97
97
  */
98
98
  children: PropTypes.node,
99
99
  /**
package/modern/index.js CHANGED
@@ -1,5 +1,5 @@
1
1
  /**
2
- * @mui/material v5.15.9
2
+ * @mui/material v5.15.10
3
3
  *
4
4
  * @license MIT
5
5
  * This source code is licensed under the MIT license found in the
@@ -16,8 +16,9 @@ var _styled = _interopRequireDefault(require("../styles/styled"));
16
16
  var _useThemeProps = _interopRequireDefault(require("../styles/useThemeProps"));
17
17
  var _Person = _interopRequireDefault(require("../internal/svg-icons/Person"));
18
18
  var _avatarClasses = require("./avatarClasses");
19
+ var _useSlot = _interopRequireDefault(require("../utils/useSlot"));
19
20
  var _jsxRuntime = require("react/jsx-runtime");
20
- const _excluded = ["alt", "children", "className", "component", "imgProps", "sizes", "src", "srcSet", "variant"];
21
+ const _excluded = ["alt", "children", "className", "component", "slots", "slotProps", "imgProps", "sizes", "src", "srcSet", "variant"];
21
22
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
22
23
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
23
24
  const useUtilityClasses = ownerState => {
@@ -158,6 +159,8 @@ const Avatar = /*#__PURE__*/React.forwardRef(function Avatar(inProps, ref) {
158
159
  children: childrenProp,
159
160
  className,
160
161
  component = 'div',
162
+ slots = {},
163
+ slotProps = {},
161
164
  imgProps,
162
165
  sizes,
163
166
  src,
@@ -180,16 +183,25 @@ const Avatar = /*#__PURE__*/React.forwardRef(function Avatar(inProps, ref) {
180
183
  variant
181
184
  });
182
185
  const classes = useUtilityClasses(ownerState);
186
+ const [ImgSlot, imgSlotProps] = (0, _useSlot.default)('img', {
187
+ className: classes.img,
188
+ elementType: AvatarImg,
189
+ externalForwardedProps: {
190
+ slots,
191
+ slotProps: {
192
+ img: (0, _extends2.default)({}, imgProps, slotProps.img)
193
+ }
194
+ },
195
+ additionalProps: {
196
+ alt,
197
+ src,
198
+ srcSet,
199
+ sizes
200
+ },
201
+ ownerState
202
+ });
183
203
  if (hasImgNotFailing) {
184
- children = /*#__PURE__*/(0, _jsxRuntime.jsx)(AvatarImg, (0, _extends2.default)({
185
- alt: alt,
186
- srcSet: srcSet,
187
- src: src,
188
- sizes: sizes,
189
- ownerState: ownerState,
190
- className: classes.img
191
- }, imgProps));
192
-
204
+ children = /*#__PURE__*/(0, _jsxRuntime.jsx)(ImgSlot, (0, _extends2.default)({}, imgSlotProps));
193
205
  // We only render valid children, non valid children are rendered with a fallback
194
206
  // We consider that invalid children are all falsy values, except 0, which is valid.
195
207
  } else if (!!childrenProp || childrenProp === 0) {
@@ -242,12 +254,27 @@ process.env.NODE_ENV !== "production" ? Avatar.propTypes /* remove-proptypes */
242
254
  /**
243
255
  * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#attributes) applied to the `img` element if the component is used to display an image.
244
256
  * It can be used to listen for the loading error event.
257
+ * @deprecated Use `slotProps.img` instead. This prop will be removed in v7. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/).
245
258
  */
246
259
  imgProps: _propTypes.default.object,
247
260
  /**
248
261
  * The `sizes` attribute for the `img` element.
249
262
  */
250
263
  sizes: _propTypes.default.string,
264
+ /**
265
+ * The props used for each slot inside.
266
+ * @default {}
267
+ */
268
+ slotProps: _propTypes.default.shape({
269
+ img: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object])
270
+ }),
271
+ /**
272
+ * The components used for each slot inside.
273
+ * @default {}
274
+ */
275
+ slots: _propTypes.default.shape({
276
+ img: _propTypes.default.elementType
277
+ }),
251
278
  /**
252
279
  * The `src` attribute for the `img` element.
253
280
  */
@@ -101,7 +101,7 @@ process.env.NODE_ENV !== "production" ? TableRow.propTypes /* remove-proptypes *
101
101
  // │ To update them, edit the d.ts file and run `pnpm proptypes`. │
102
102
  // └─────────────────────────────────────────────────────────────────────┘
103
103
  /**
104
- * Should be valid <tr> children such as `TableCell`.
104
+ * Should be valid `<tr>` children such as `TableCell`.
105
105
  */
106
106
  children: _propTypes.default.node,
107
107
  /**
package/node/index.js CHANGED
@@ -1,5 +1,5 @@
1
1
  /**
2
- * @mui/material v5.15.9
2
+ * @mui/material v5.15.10
3
3
  *
4
4
  * @license MIT
5
5
  * This source code is licensed under the MIT license found in the
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mui/material",
3
- "version": "5.15.9",
3
+ "version": "5.15.10",
4
4
  "private": false,
5
5
  "author": "MUI Team",
6
6
  "description": "Material UI is an open-source React component library that implements Google's Material Design. It's comprehensive and can be used in production out of the box.",
@@ -34,11 +34,11 @@
34
34
  "prop-types": "^15.8.1",
35
35
  "react-is": "^18.2.0",
36
36
  "react-transition-group": "^4.4.5",
37
- "@mui/types": "^7.2.13",
38
- "@mui/base": "5.0.0-beta.36",
39
- "@mui/utils": "^5.15.9",
37
+ "@mui/core-downloads-tracker": "^5.15.10",
40
38
  "@mui/system": "^5.15.9",
41
- "@mui/core-downloads-tracker": "^5.15.9"
39
+ "@mui/utils": "^5.15.9",
40
+ "@mui/types": "^7.2.13",
41
+ "@mui/base": "5.0.0-beta.36"
42
42
  },
43
43
  "peerDependencies": {
44
44
  "@emotion/react": "^11.5.0",
@@ -1,5 +1,5 @@
1
1
  /**
2
- * @mui/material v5.15.9
2
+ * @mui/material v5.15.10
3
3
  *
4
4
  * @license MIT
5
5
  * This source code is licensed under the MIT license found in the
@@ -23974,13 +23974,17 @@
23974
23974
  className = props.className,
23975
23975
  _props$component = props.component,
23976
23976
  component = _props$component === void 0 ? 'div' : _props$component,
23977
+ _props$slots = props.slots,
23978
+ slots = _props$slots === void 0 ? {} : _props$slots,
23979
+ _props$slotProps = props.slotProps,
23980
+ slotProps = _props$slotProps === void 0 ? {} : _props$slotProps,
23977
23981
  imgProps = props.imgProps,
23978
23982
  sizes = props.sizes,
23979
23983
  src = props.src,
23980
23984
  srcSet = props.srcSet,
23981
23985
  _props$variant = props.variant,
23982
23986
  variant = _props$variant === void 0 ? 'circular' : _props$variant,
23983
- other = _objectWithoutProperties(props, ["alt", "children", "className", "component", "imgProps", "sizes", "src", "srcSet", "variant"]);
23987
+ other = _objectWithoutProperties(props, ["alt", "children", "className", "component", "slots", "slotProps", "imgProps", "sizes", "src", "srcSet", "variant"]);
23984
23988
  var children = null;
23985
23989
 
23986
23990
  // Use a hook instead of onError on the img element to support server-side rendering.
@@ -23996,16 +24000,28 @@
23996
24000
  variant: variant
23997
24001
  });
23998
24002
  var classes = useUtilityClasses$1w(ownerState);
24003
+ var _useSlot = useSlot('img', {
24004
+ className: classes.img,
24005
+ elementType: AvatarImg,
24006
+ externalForwardedProps: {
24007
+ slots: slots,
24008
+ slotProps: {
24009
+ img: _extends({}, imgProps, slotProps.img)
24010
+ }
24011
+ },
24012
+ additionalProps: {
24013
+ alt: alt,
24014
+ src: src,
24015
+ srcSet: srcSet,
24016
+ sizes: sizes
24017
+ },
24018
+ ownerState: ownerState
24019
+ }),
24020
+ _useSlot2 = _slicedToArray(_useSlot, 2),
24021
+ ImgSlot = _useSlot2[0],
24022
+ imgSlotProps = _useSlot2[1];
23999
24023
  if (hasImgNotFailing) {
24000
- children = /*#__PURE__*/jsxRuntime_1(AvatarImg, _extends({
24001
- alt: alt,
24002
- srcSet: srcSet,
24003
- src: src,
24004
- sizes: sizes,
24005
- ownerState: ownerState,
24006
- className: classes.img
24007
- }, imgProps));
24008
-
24024
+ children = /*#__PURE__*/jsxRuntime_1(ImgSlot, _extends({}, imgSlotProps));
24009
24025
  // We only render valid children, non valid children are rendered with a fallback
24010
24026
  // We consider that invalid children are all falsy values, except 0, which is valid.
24011
24027
  } else if (!!childrenProp || childrenProp === 0) {
@@ -24058,12 +24074,27 @@
24058
24074
  /**
24059
24075
  * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#attributes) applied to the `img` element if the component is used to display an image.
24060
24076
  * It can be used to listen for the loading error event.
24077
+ * @deprecated Use `slotProps.img` instead. This prop will be removed in v7. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/).
24061
24078
  */
24062
24079
  imgProps: PropTypes.object,
24063
24080
  /**
24064
24081
  * The `sizes` attribute for the `img` element.
24065
24082
  */
24066
24083
  sizes: PropTypes.string,
24084
+ /**
24085
+ * The props used for each slot inside.
24086
+ * @default {}
24087
+ */
24088
+ slotProps: PropTypes.shape({
24089
+ img: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
24090
+ }),
24091
+ /**
24092
+ * The components used for each slot inside.
24093
+ * @default {}
24094
+ */
24095
+ slots: PropTypes.shape({
24096
+ img: PropTypes.elementType
24097
+ }),
24067
24098
  /**
24068
24099
  * The `src` attribute for the `img` element.
24069
24100
  */
@@ -48112,7 +48143,7 @@
48112
48143
  // │ To update them, edit the d.ts file and run `pnpm proptypes`. │
48113
48144
  // └─────────────────────────────────────────────────────────────────────┘
48114
48145
  /**
48115
- * Should be valid <tr> children such as `TableCell`.
48146
+ * Should be valid `<tr>` children such as `TableCell`.
48116
48147
  */
48117
48148
  children: PropTypes.node,
48118
48149
  /**