@mui/material 5.15.6 → 5.15.7

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.
Files changed (79) hide show
  1. package/Accordion/index.js +0 -2
  2. package/AccordionActions/index.js +0 -2
  3. package/AccordionDetails/index.js +0 -2
  4. package/AccordionSummary/index.js +0 -2
  5. package/Avatar/Avatar.js +2 -2
  6. package/AvatarGroup/AvatarGroup.js +19 -39
  7. package/Badge/Badge.js +2 -2
  8. package/ButtonBase/TouchRipple.js +9 -14
  9. package/CHANGELOG.md +97 -3
  10. package/Collapse/Collapse.js +3 -8
  11. package/Grow/Grow.js +3 -8
  12. package/Rating/index.js +0 -2
  13. package/Select/Select.js +1 -1
  14. package/SpeedDial/SpeedDial.js +7 -12
  15. package/Toolbar/index.js +0 -2
  16. package/Tooltip/Tooltip.js +29 -40
  17. package/index.js +1 -3
  18. package/legacy/Accordion/index.js +0 -2
  19. package/legacy/AccordionActions/index.js +0 -2
  20. package/legacy/AccordionDetails/index.js +0 -2
  21. package/legacy/AccordionSummary/index.js +0 -2
  22. package/legacy/Avatar/Avatar.js +2 -2
  23. package/legacy/AvatarGroup/AvatarGroup.js +6 -31
  24. package/legacy/Badge/Badge.js +2 -2
  25. package/legacy/ButtonBase/TouchRipple.js +9 -14
  26. package/legacy/Collapse/Collapse.js +3 -8
  27. package/legacy/Grow/Grow.js +3 -8
  28. package/legacy/Rating/index.js +0 -2
  29. package/legacy/Select/Select.js +1 -1
  30. package/legacy/SpeedDial/SpeedDial.js +7 -12
  31. package/legacy/Toolbar/index.js +0 -2
  32. package/legacy/Tooltip/Tooltip.js +29 -38
  33. package/legacy/index.js +1 -3
  34. package/legacy/styles/createTheme.js +1 -13
  35. package/legacy/zero-styled/index.js +7 -2
  36. package/modern/Accordion/index.js +0 -2
  37. package/modern/AccordionActions/index.js +0 -2
  38. package/modern/AccordionDetails/index.js +0 -2
  39. package/modern/AccordionSummary/index.js +0 -2
  40. package/modern/Avatar/Avatar.js +2 -2
  41. package/modern/AvatarGroup/AvatarGroup.js +19 -39
  42. package/modern/Badge/Badge.js +2 -2
  43. package/modern/ButtonBase/TouchRipple.js +9 -14
  44. package/modern/Collapse/Collapse.js +3 -8
  45. package/modern/Grow/Grow.js +3 -8
  46. package/modern/Rating/index.js +0 -2
  47. package/modern/Select/Select.js +1 -1
  48. package/modern/SpeedDial/SpeedDial.js +7 -12
  49. package/modern/Toolbar/index.js +0 -2
  50. package/modern/Tooltip/Tooltip.js +29 -40
  51. package/modern/index.js +1 -3
  52. package/modern/styles/createTheme.js +1 -15
  53. package/modern/zero-styled/index.js +7 -2
  54. package/node/Accordion/index.js +0 -1
  55. package/node/AccordionActions/index.js +0 -1
  56. package/node/AccordionDetails/index.js +0 -1
  57. package/node/AccordionSummary/index.js +0 -1
  58. package/node/Avatar/Avatar.js +2 -2
  59. package/node/AvatarGroup/AvatarGroup.js +19 -39
  60. package/node/Badge/Badge.js +2 -2
  61. package/node/ButtonBase/TouchRipple.js +9 -14
  62. package/node/Collapse/Collapse.js +2 -7
  63. package/node/Grow/Grow.js +2 -7
  64. package/node/Rating/index.js +0 -1
  65. package/node/Select/Select.js +1 -1
  66. package/node/SpeedDial/SpeedDial.js +6 -11
  67. package/node/Toolbar/index.js +0 -1
  68. package/node/Tooltip/Tooltip.js +28 -39
  69. package/node/index.js +1 -3
  70. package/node/styles/createTheme.js +1 -15
  71. package/node/zero-styled/index.js +7 -1
  72. package/package.json +6 -6
  73. package/styles/createTheme.d.ts +0 -1
  74. package/styles/createTheme.js +1 -15
  75. package/styles/experimental_extendTheme.d.ts +3 -2
  76. package/umd/material-ui.development.js +367 -289
  77. package/umd/material-ui.production.min.js +4 -4
  78. package/zero-styled/index.d.ts +2 -1
  79. package/zero-styled/index.js +7 -2
@@ -202,14 +202,14 @@ const TooltipArrow = (0, _styled.default)('span', {
202
202
  }
203
203
  }));
204
204
  let hystersisOpen = false;
205
- let hystersisTimer = null;
205
+ const hystersisTimer = new _utils.unstable_Timeout();
206
206
  let cursorPosition = {
207
207
  x: 0,
208
208
  y: 0
209
209
  };
210
210
  function testReset() {
211
211
  hystersisOpen = false;
212
- clearTimeout(hystersisTimer);
212
+ hystersisTimer.clear();
213
213
  }
214
214
  function composeEventHandler(handler, eventHandler) {
215
215
  return event => {
@@ -268,10 +268,10 @@ const Tooltip = /*#__PURE__*/React.forwardRef(function Tooltip(inProps, ref) {
268
268
  const [arrowRef, setArrowRef] = React.useState(null);
269
269
  const ignoreNonTouchEvents = React.useRef(false);
270
270
  const disableInteractive = disableInteractiveProp || followCursor;
271
- const closeTimer = React.useRef();
272
- const enterTimer = React.useRef();
273
- const leaveTimer = React.useRef();
274
- const touchTimer = React.useRef();
271
+ const closeTimer = (0, _utils.unstable_useTimeout)();
272
+ const enterTimer = (0, _utils.unstable_useTimeout)();
273
+ const leaveTimer = (0, _utils.unstable_useTimeout)();
274
+ const touchTimer = (0, _utils.unstable_useTimeout)();
275
275
  const [openState, setOpenState] = (0, _useControlled.default)({
276
276
  controlled: openProp,
277
277
  default: false,
@@ -294,23 +294,16 @@ const Tooltip = /*#__PURE__*/React.forwardRef(function Tooltip(inProps, ref) {
294
294
  }
295
295
  const id = (0, _useId.default)(idProp);
296
296
  const prevUserSelect = React.useRef();
297
- const stopTouchInteraction = React.useCallback(() => {
297
+ const stopTouchInteraction = (0, _useEventCallback.default)(() => {
298
298
  if (prevUserSelect.current !== undefined) {
299
299
  document.body.style.WebkitUserSelect = prevUserSelect.current;
300
300
  prevUserSelect.current = undefined;
301
301
  }
302
- clearTimeout(touchTimer.current);
303
- }, []);
304
- React.useEffect(() => {
305
- return () => {
306
- clearTimeout(closeTimer.current);
307
- clearTimeout(enterTimer.current);
308
- clearTimeout(leaveTimer.current);
309
- stopTouchInteraction();
310
- };
311
- }, [stopTouchInteraction]);
302
+ touchTimer.clear();
303
+ });
304
+ React.useEffect(() => stopTouchInteraction, [stopTouchInteraction]);
312
305
  const handleOpen = event => {
313
- clearTimeout(hystersisTimer);
306
+ hystersisTimer.clear();
314
307
  hystersisOpen = true;
315
308
 
316
309
  // The mouseover event will trigger for every nested element in the tooltip.
@@ -326,18 +319,16 @@ const Tooltip = /*#__PURE__*/React.forwardRef(function Tooltip(inProps, ref) {
326
319
  * @param {React.SyntheticEvent | Event} event
327
320
  */
328
321
  event => {
329
- clearTimeout(hystersisTimer);
330
- hystersisTimer = setTimeout(() => {
322
+ hystersisTimer.start(800 + leaveDelay, () => {
331
323
  hystersisOpen = false;
332
- }, 800 + leaveDelay);
324
+ });
333
325
  setOpenState(false);
334
326
  if (onClose && open) {
335
327
  onClose(event);
336
328
  }
337
- clearTimeout(closeTimer.current);
338
- closeTimer.current = setTimeout(() => {
329
+ closeTimer.start(theme.transitions.duration.shortest, () => {
339
330
  ignoreNonTouchEvents.current = false;
340
- }, theme.transitions.duration.shortest);
331
+ });
341
332
  });
342
333
  const handleEnter = event => {
343
334
  if (ignoreNonTouchEvents.current && event.type !== 'touchstart') {
@@ -350,22 +341,21 @@ const Tooltip = /*#__PURE__*/React.forwardRef(function Tooltip(inProps, ref) {
350
341
  if (childNode) {
351
342
  childNode.removeAttribute('title');
352
343
  }
353
- clearTimeout(enterTimer.current);
354
- clearTimeout(leaveTimer.current);
344
+ enterTimer.clear();
345
+ leaveTimer.clear();
355
346
  if (enterDelay || hystersisOpen && enterNextDelay) {
356
- enterTimer.current = setTimeout(() => {
347
+ enterTimer.start(hystersisOpen ? enterNextDelay : enterDelay, () => {
357
348
  handleOpen(event);
358
- }, hystersisOpen ? enterNextDelay : enterDelay);
349
+ });
359
350
  } else {
360
351
  handleOpen(event);
361
352
  }
362
353
  };
363
354
  const handleLeave = event => {
364
- clearTimeout(enterTimer.current);
365
- clearTimeout(leaveTimer.current);
366
- leaveTimer.current = setTimeout(() => {
355
+ enterTimer.clear();
356
+ leaveTimer.start(leaveDelay, () => {
367
357
  handleClose(event);
368
- }, leaveDelay);
358
+ });
369
359
  };
370
360
  const {
371
361
  isFocusVisibleRef,
@@ -407,26 +397,25 @@ const Tooltip = /*#__PURE__*/React.forwardRef(function Tooltip(inProps, ref) {
407
397
  const handleMouseLeave = handleLeave;
408
398
  const handleTouchStart = event => {
409
399
  detectTouchStart(event);
410
- clearTimeout(leaveTimer.current);
411
- clearTimeout(closeTimer.current);
400
+ leaveTimer.clear();
401
+ closeTimer.clear();
412
402
  stopTouchInteraction();
413
403
  prevUserSelect.current = document.body.style.WebkitUserSelect;
414
404
  // Prevent iOS text selection on long-tap.
415
405
  document.body.style.WebkitUserSelect = 'none';
416
- touchTimer.current = setTimeout(() => {
406
+ touchTimer.start(enterTouchDelay, () => {
417
407
  document.body.style.WebkitUserSelect = prevUserSelect.current;
418
408
  handleEnter(event);
419
- }, enterTouchDelay);
409
+ });
420
410
  };
421
411
  const handleTouchEnd = event => {
422
412
  if (children.props.onTouchEnd) {
423
413
  children.props.onTouchEnd(event);
424
414
  }
425
415
  stopTouchInteraction();
426
- clearTimeout(leaveTimer.current);
427
- leaveTimer.current = setTimeout(() => {
416
+ leaveTimer.start(leaveTouchDelay, () => {
428
417
  handleClose(event);
429
- }, leaveTouchDelay);
418
+ });
430
419
  };
431
420
  React.useEffect(() => {
432
421
  if (!open) {
package/node/index.js CHANGED
@@ -1,14 +1,12 @@
1
1
  /**
2
- * @mui/material v5.15.6
2
+ * @mui/material v5.15.7
3
3
  *
4
4
  * @license MIT
5
5
  * This source code is licensed under the MIT license found in the
6
6
  * LICENSE file in the root directory of this source tree.
7
7
  */
8
8
  "use strict";
9
- 'use client';
10
9
 
11
- /* eslint-disable import/export */
12
10
  var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
13
11
  Object.defineProperty(exports, "__esModule", {
14
12
  value: true
@@ -40,21 +40,7 @@ Please use another name.` : (0, _formatMuiErrorMessage2.default)(18));
40
40
  shadows: _shadows.default.slice(),
41
41
  typography: (0, _createTypography.default)(palette, typographyInput),
42
42
  transitions: (0, _createTransitions.default)(transitionsInput),
43
- zIndex: (0, _extends2.default)({}, _zIndex.default),
44
- applyDarkStyles(css) {
45
- if (this.vars) {
46
- // If CssVarsProvider is used as a provider,
47
- // returns ':where([data-mui-color-scheme="light|dark"]) &'
48
- const selector = this.getColorSchemeSelector('dark').replace(/(\[[^\]]+\])/, ':where($1)');
49
- return {
50
- [selector]: css
51
- };
52
- }
53
- if (this.palette.mode === 'dark') {
54
- return css;
55
- }
56
- return {};
57
- }
43
+ zIndex: (0, _extends2.default)({}, _zIndex.default)
58
44
  });
59
45
  muiTheme = (0, _utils.deepmerge)(muiTheme, other);
60
46
  muiTheme = args.reduce((acc, argument) => (0, _utils.deepmerge)(acc, argument), muiTheme);
@@ -4,10 +4,16 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
4
4
  Object.defineProperty(exports, "__esModule", {
5
5
  value: true
6
6
  });
7
+ exports.createUseThemeProps = createUseThemeProps;
7
8
  Object.defineProperty(exports, "styled", {
8
9
  enumerable: true,
9
10
  get: function () {
10
11
  return _styled.default;
11
12
  }
12
13
  });
13
- var _styled = _interopRequireDefault(require("../styles/styled"));
14
+ var _useThemeProps = _interopRequireDefault(require("../styles/useThemeProps"));
15
+ var _styled = _interopRequireDefault(require("../styles/styled"));
16
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
17
+ function createUseThemeProps(name) {
18
+ return _useThemeProps.default;
19
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mui/material",
3
- "version": "5.15.6",
3
+ "version": "5.15.7",
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.",
@@ -27,18 +27,18 @@
27
27
  "url": "https://opencollective.com/mui-org"
28
28
  },
29
29
  "dependencies": {
30
- "@babel/runtime": "^7.23.8",
30
+ "@babel/runtime": "^7.23.9",
31
31
  "@types/react-transition-group": "^4.4.10",
32
32
  "clsx": "^2.1.0",
33
33
  "csstype": "^3.1.2",
34
34
  "prop-types": "^15.8.1",
35
35
  "react-is": "^18.2.0",
36
36
  "react-transition-group": "^4.4.5",
37
- "@mui/base": "5.0.0-beta.33",
38
- "@mui/core-downloads-tracker": "^5.15.6",
39
- "@mui/system": "^5.15.6",
37
+ "@mui/base": "5.0.0-beta.34",
40
38
  "@mui/types": "^7.2.13",
41
- "@mui/utils": "^5.15.6"
39
+ "@mui/core-downloads-tracker": "^5.15.7",
40
+ "@mui/system": "^5.15.7",
41
+ "@mui/utils": "^5.15.7"
42
42
  },
43
43
  "peerDependencies": {
44
44
  "@emotion/react": "^11.5.0",
@@ -45,7 +45,6 @@ export interface Theme extends BaseTheme {
45
45
  components?: Components<BaseTheme>;
46
46
  unstable_sx: (props: SxProps<Theme>) => CSSObject;
47
47
  unstable_sxConfig: SxConfig;
48
- applyDarkStyles: (css: CSSObject) => CSSObject;
49
48
  }
50
49
 
51
50
  /**
@@ -32,21 +32,7 @@ Please use another name.` : _formatMuiErrorMessage(18));
32
32
  shadows: shadows.slice(),
33
33
  typography: createTypography(palette, typographyInput),
34
34
  transitions: createTransitions(transitionsInput),
35
- zIndex: _extends({}, zIndex),
36
- applyDarkStyles(css) {
37
- if (this.vars) {
38
- // If CssVarsProvider is used as a provider,
39
- // returns ':where([data-mui-color-scheme="light|dark"]) &'
40
- const selector = this.getColorSchemeSelector('dark').replace(/(\[[^\]]+\])/, ':where($1)');
41
- return {
42
- [selector]: css
43
- };
44
- }
45
- if (this.palette.mode === 'dark') {
46
- return css;
47
- }
48
- return {};
49
- }
35
+ zIndex: _extends({}, zIndex)
50
36
  });
51
37
  muiTheme = deepmerge(muiTheme, other);
52
38
  muiTheme = args.reduce((acc, argument) => deepmerge(acc, argument), muiTheme);
@@ -1,6 +1,6 @@
1
1
  /* eslint-disable @typescript-eslint/naming-convention */
2
2
  import { OverridableStringUnion } from '@mui/types';
3
- import { SxConfig, SxProps, CSSObject } from '@mui/system';
3
+ import { SxConfig, SxProps, CSSObject, ApplyStyles } from '@mui/system';
4
4
  import { ThemeOptions, Theme } from './createTheme';
5
5
  import { Palette, PaletteOptions } from './createPalette';
6
6
  import { Shadows } from './shadows';
@@ -432,6 +432,7 @@ export interface CssVarsTheme extends ColorSystem {
432
432
  shouldSkipGeneratingVar: (keys: string[], value: string | number) => boolean;
433
433
  unstable_sxConfig: SxConfig;
434
434
  unstable_sx: (props: SxProps<CssVarsTheme>) => CSSObject;
435
+ applyStyles: ApplyStyles<SupportedColorScheme>;
435
436
  }
436
437
 
437
438
  /**
@@ -443,4 +444,4 @@ export interface CssVarsTheme extends ColorSystem {
443
444
  export default function experimental_extendTheme(
444
445
  options?: CssVarsThemeOptions,
445
446
  ...args: object[]
446
- ): Omit<Theme, 'palette'> & CssVarsTheme;
447
+ ): Omit<Theme, 'palette' | 'applyStyles'> & CssVarsTheme;