@mui/system 5.15.20 → 5.16.1

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 (48) hide show
  1. package/CHANGELOG.md +93 -0
  2. package/DefaultPropsProvider/DefaultPropsProvider.d.ts +12 -0
  3. package/DefaultPropsProvider/DefaultPropsProvider.js +73 -0
  4. package/DefaultPropsProvider/index.d.ts +1 -0
  5. package/DefaultPropsProvider/index.js +20 -0
  6. package/DefaultPropsProvider/package.json +6 -0
  7. package/InitColorSchemeScript/InitColorSchemeScript.d.ts +49 -0
  8. package/InitColorSchemeScript/InitColorSchemeScript.js +61 -0
  9. package/InitColorSchemeScript/index.d.ts +2 -0
  10. package/InitColorSchemeScript/index.js +13 -0
  11. package/InitColorSchemeScript/package.json +6 -0
  12. package/ThemeProvider/ThemeProvider.js +5 -1
  13. package/cssVars/createCssVarsProvider.d.ts +2 -2
  14. package/cssVars/createCssVarsProvider.js +5 -5
  15. package/cssVars/getInitColorSchemeScript.d.ts +2 -41
  16. package/cssVars/getInitColorSchemeScript.js +7 -42
  17. package/cssVars/useCurrentColorScheme.js +3 -3
  18. package/esm/DefaultPropsProvider/DefaultPropsProvider.js +64 -0
  19. package/esm/DefaultPropsProvider/index.js +1 -0
  20. package/esm/InitColorSchemeScript/InitColorSchemeScript.js +51 -0
  21. package/esm/InitColorSchemeScript/index.js +1 -0
  22. package/esm/ThemeProvider/ThemeProvider.js +5 -1
  23. package/esm/cssVars/createCssVarsProvider.js +2 -2
  24. package/esm/cssVars/getInitColorSchemeScript.js +5 -41
  25. package/esm/cssVars/index.js +1 -0
  26. package/esm/cssVars/useCurrentColorScheme.js +1 -1
  27. package/index.js +1 -1
  28. package/legacy/DefaultPropsProvider/DefaultPropsProvider.js +60 -0
  29. package/legacy/DefaultPropsProvider/index.js +1 -0
  30. package/legacy/InitColorSchemeScript/InitColorSchemeScript.js +35 -0
  31. package/legacy/InitColorSchemeScript/index.js +1 -0
  32. package/legacy/ThemeProvider/ThemeProvider.js +5 -1
  33. package/legacy/cssVars/createCssVarsProvider.js +2 -2
  34. package/legacy/cssVars/getInitColorSchemeScript.js +5 -25
  35. package/legacy/cssVars/index.js +1 -0
  36. package/legacy/cssVars/useCurrentColorScheme.js +1 -1
  37. package/legacy/index.js +1 -1
  38. package/modern/DefaultPropsProvider/DefaultPropsProvider.js +64 -0
  39. package/modern/DefaultPropsProvider/index.js +1 -0
  40. package/modern/InitColorSchemeScript/InitColorSchemeScript.js +51 -0
  41. package/modern/InitColorSchemeScript/index.js +1 -0
  42. package/modern/ThemeProvider/ThemeProvider.js +5 -1
  43. package/modern/cssVars/createCssVarsProvider.js +2 -2
  44. package/modern/cssVars/getInitColorSchemeScript.js +5 -41
  45. package/modern/cssVars/index.js +1 -0
  46. package/modern/cssVars/useCurrentColorScheme.js +1 -1
  47. package/modern/index.js +1 -1
  48. package/package.json +5 -5
package/CHANGELOG.md CHANGED
@@ -1,5 +1,98 @@
1
1
  # [Versions](https://mui.com/versions/)
2
2
 
3
+ ## v5.16.1
4
+
5
+ _Jul 11, 2024_
6
+
7
+ A big thanks to the 4 contributors who made this release possible. Here are some highlights ✨:
8
+
9
+ - ⚛️ All packages, including Material UI, are now compatible with React 18.3.1
10
+
11
+ ### `@mui/material@5.16.1`
12
+
13
+ - [AppBar] Fix inherit color is inconsistent between ThemeProvider and CssVarsProvider (#42713) @ZeeshanTamboli
14
+
15
+ ### `@mui/joy@5.0.0-beta.48`
16
+
17
+ - [Autocomplete] Fix React spread key warning (#42856) @aarongarciah
18
+
19
+ ### Docs
20
+
21
+ - [material-ui] Fix React 18.3 key spread warnings in Autocomplete demos (#42854) @aarongarciah
22
+ - [material-ui] Fix type error in virtualized table demo (#42852) @aarongarciah
23
+ - Fix typos (@omahs) (#42888) @omahs
24
+ - Fix 301 @oliviertassinari
25
+
26
+ ### Core
27
+
28
+ - [core] Bump React to 18.3.1 (#42846) @aarongarciah
29
+ - [core] Remove react-test-renderer (#42853) @aarongarciah
30
+ - [core] Replace enzyme in describeConformance (#42847) @aarongarciah
31
+ - [test] Remove enzyme (#42850) @aarongarciah
32
+ - [test] Remove createMount test util (#42849) @aarongarciah
33
+ - [base-ui] Fix React spread key warning in test (#42855) @aarongarciah
34
+ - [styles][withStyles] Expect React defaultProps warning in test (#42752) (#42851) @aarongarciah
35
+
36
+ All contributors of this release in alphabetical order: @aarongarciah, @oliviertassinari, @omahs, @ZeeshanTamboli
37
+
38
+ ## v5.16.0
39
+
40
+ <!-- generated comparing v5.15.21..master -->
41
+
42
+ _Jul 5, 2024_
43
+
44
+ A big thanks to the 5 contributors who made this release possible. Here are some highlights ✨:
45
+
46
+ - 🚀 Added `InitColorSchemeScript` for Next.js App Router (#42829) @siriwatknp
47
+
48
+ ### `@mui/material@5.16.0`
49
+
50
+ - [Alert] Add ability to override slot props (@alexey-kozlenkov) (#42808) @alexey-kozlenkov
51
+ - Add `InitColorSchemeScript` for Next.js App Router (#42829) @siriwatknp
52
+ - Add `DefaultPropsProvider` (#42820) @siriwatknp
53
+ - Support `CssVarsTheme` in `responsiveFontSizes` return type (@jxdp) (#42806) @jxdp
54
+ - Remove warning from `getInitColorSchemeScript` (#42838) @siriwatknp
55
+
56
+ ### Docs
57
+
58
+ - [docs] Fix 301 MDN redirections @oliviertassinari
59
+
60
+ ### Core
61
+
62
+ - [mui-utils][test] Remove usages of deprecated react-dom APIs (@aarongarciah) (#42813) @aarongarciah
63
+
64
+ All contributors of this release in alphabetical order: @aarongarciah, @alexey-kozlenkov, @jxdp, @oliviertassinari, @siriwatknp
65
+
66
+ ## v5.15.21
67
+
68
+ <!-- generated comparing v5.15.20..master -->
69
+
70
+ _Jun 28, 2024_
71
+
72
+ A big thanks to the 7 contributors who made this release possible.
73
+
74
+ ### `@mui/material@5.15.21`
75
+
76
+ - [Autocomplete] Fix renderOption props type (@DiegoAndai) (#42709) @DiegoAndai
77
+ - [Stepper] Generate class for `nonLinear` prop (@alexismo) (#42677) @alexismo
78
+
79
+ ### Docs
80
+
81
+ - Use new email for sponsoring @oliviertassinari
82
+ - Fix 301 links (@alexfauquette) (#42700) @alexfauquette
83
+ - [material-ui][Select] Fix the `SelectAutoWidth` demo menu item value (@Danielkhakbaz) (#42696) @Danielkhakbaz
84
+ - [material-ui][Autocomplete] Fix more React 18.3 key spread warnings in demos (#42766) @wbt
85
+ - [material-ui] Fix sign in side image (#42708) @zanivan
86
+ - [website] Add Ale to team (#42769) @alelthomas
87
+
88
+ ### Core
89
+
90
+ - [core] Cherry pick pnpm updates (#42763) @DiegoAndai
91
+ - [website] Add Armin to the team members (@arminmeh) (#42681) @arminmeh
92
+ - [website] Open Staff Engineer role for Pigment CSS (@mnajdova) (#42669) @mnajdova
93
+
94
+ All contributors of this release in alphabetical order: @alexfauquette, @alexismo, @arminmeh, @Danielkhakbaz, @DiegoAndai, @mnajdova, @oliviertassinari
95
+
3
96
  ## v5.15.20
4
97
 
5
98
  <!-- generated comparing v5.15.19..master -->
@@ -0,0 +1,12 @@
1
+ import * as React from 'react';
2
+ declare function DefaultPropsProvider({ value, children, }: React.PropsWithChildren<{
3
+ value: Record<string, any> | undefined;
4
+ }>): React.JSX.Element;
5
+ declare namespace DefaultPropsProvider {
6
+ var propTypes: any;
7
+ }
8
+ export declare function useDefaultProps<Props>({ props, name }: {
9
+ props: Props;
10
+ name: string;
11
+ }): Props;
12
+ export default DefaultPropsProvider;
@@ -0,0 +1,73 @@
1
+ "use strict";
2
+ 'use client';
3
+
4
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
5
+ Object.defineProperty(exports, "__esModule", {
6
+ value: true
7
+ });
8
+ exports.default = void 0;
9
+ exports.useDefaultProps = useDefaultProps;
10
+ var React = _interopRequireWildcard(require("react"));
11
+ var _propTypes = _interopRequireDefault(require("prop-types"));
12
+ var _resolveProps = _interopRequireDefault(require("@mui/utils/resolveProps"));
13
+ var _jsxRuntime = require("react/jsx-runtime");
14
+ 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); }
15
+ 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; }
16
+ const PropsContext = /*#__PURE__*/React.createContext(undefined);
17
+ function DefaultPropsProvider({
18
+ value,
19
+ children
20
+ }) {
21
+ return /*#__PURE__*/(0, _jsxRuntime.jsx)(PropsContext.Provider, {
22
+ value: value,
23
+ children: children
24
+ });
25
+ }
26
+ process.env.NODE_ENV !== "production" ? DefaultPropsProvider.propTypes /* remove-proptypes */ = {
27
+ // ┌────────────────────────────── Warning ──────────────────────────────┐
28
+ // │ These PropTypes are generated from the TypeScript type definitions. │
29
+ // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
30
+ // └─────────────────────────────────────────────────────────────────────┘
31
+ /**
32
+ * @ignore
33
+ */
34
+ children: _propTypes.default.node,
35
+ /**
36
+ * @ignore
37
+ */
38
+ value: _propTypes.default.object
39
+ } : void 0;
40
+ function getThemeProps(params) {
41
+ const {
42
+ theme,
43
+ name,
44
+ props
45
+ } = params;
46
+ if (!theme || !theme.components || !theme.components[name]) {
47
+ return props;
48
+ }
49
+ const config = theme.components[name];
50
+ if (config.defaultProps) {
51
+ // compatible with v5 signature
52
+ return (0, _resolveProps.default)(config.defaultProps, props);
53
+ }
54
+ if (!config.styleOverrides && !config.variants) {
55
+ // v6 signature, no property 'defaultProps'
56
+ return (0, _resolveProps.default)(config, props);
57
+ }
58
+ return props;
59
+ }
60
+ function useDefaultProps({
61
+ props,
62
+ name
63
+ }) {
64
+ const ctx = React.useContext(PropsContext);
65
+ return getThemeProps({
66
+ props,
67
+ name,
68
+ theme: {
69
+ components: ctx
70
+ }
71
+ });
72
+ }
73
+ var _default = exports.default = DefaultPropsProvider;
@@ -0,0 +1 @@
1
+ export { default, useDefaultProps } from './DefaultPropsProvider';
@@ -0,0 +1,20 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ Object.defineProperty(exports, "default", {
7
+ enumerable: true,
8
+ get: function () {
9
+ return _DefaultPropsProvider.default;
10
+ }
11
+ });
12
+ Object.defineProperty(exports, "useDefaultProps", {
13
+ enumerable: true,
14
+ get: function () {
15
+ return _DefaultPropsProvider.useDefaultProps;
16
+ }
17
+ });
18
+ var _DefaultPropsProvider = _interopRequireWildcard(require("./DefaultPropsProvider"));
19
+ 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); }
20
+ 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; }
@@ -0,0 +1,6 @@
1
+ {
2
+ "sideEffects": false,
3
+ "module": "../esm/DefaultPropsProvider/index.js",
4
+ "main": "./index.js",
5
+ "types": "./index.d.ts"
6
+ }
@@ -0,0 +1,49 @@
1
+ /**
2
+ * Split this component for RSC import
3
+ */
4
+ import * as React from 'react';
5
+ export declare const DEFAULT_MODE_STORAGE_KEY = "mode";
6
+ export declare const DEFAULT_COLOR_SCHEME_STORAGE_KEY = "color-scheme";
7
+ export declare const DEFAULT_ATTRIBUTE = "data-color-scheme";
8
+ export interface InitColorSchemeScriptProps {
9
+ /**
10
+ * The mode to be used for the first visit
11
+ * @default 'light'
12
+ */
13
+ defaultMode?: 'light' | 'dark' | 'system';
14
+ /**
15
+ * The default color scheme to be used on the light mode
16
+ * @default 'light'
17
+ */
18
+ defaultLightColorScheme?: string;
19
+ /**
20
+ * The default color scheme to be used on the dark mode
21
+ * * @default 'dark'
22
+ */
23
+ defaultDarkColorScheme?: string;
24
+ /**
25
+ * The node (provided as string) used to attach the color-scheme attribute
26
+ * @default 'document.documentElement'
27
+ */
28
+ colorSchemeNode?: string;
29
+ /**
30
+ * localStorage key used to store `mode`
31
+ * @default 'mode'
32
+ */
33
+ modeStorageKey?: string;
34
+ /**
35
+ * localStorage key used to store `colorScheme`
36
+ * @default 'color-scheme'
37
+ */
38
+ colorSchemeStorageKey?: string;
39
+ /**
40
+ * DOM attribute for applying color scheme
41
+ * @default 'data-color-scheme'
42
+ */
43
+ attribute?: string;
44
+ /**
45
+ * Nonce string to pass to the inline script for CSP headers
46
+ */
47
+ nonce?: string | undefined;
48
+ }
49
+ export default function InitColorSchemeScript(options?: InitColorSchemeScriptProps): React.JSX.Element;
@@ -0,0 +1,61 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.DEFAULT_MODE_STORAGE_KEY = exports.DEFAULT_COLOR_SCHEME_STORAGE_KEY = exports.DEFAULT_ATTRIBUTE = void 0;
7
+ exports.default = InitColorSchemeScript;
8
+ var React = _interopRequireWildcard(require("react"));
9
+ var _jsxRuntime = require("react/jsx-runtime");
10
+ 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); }
11
+ 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; }
12
+ /**
13
+ * Split this component for RSC import
14
+ */
15
+
16
+ const DEFAULT_MODE_STORAGE_KEY = exports.DEFAULT_MODE_STORAGE_KEY = 'mode';
17
+ const DEFAULT_COLOR_SCHEME_STORAGE_KEY = exports.DEFAULT_COLOR_SCHEME_STORAGE_KEY = 'color-scheme';
18
+ const DEFAULT_ATTRIBUTE = exports.DEFAULT_ATTRIBUTE = 'data-color-scheme';
19
+ function InitColorSchemeScript(options) {
20
+ const {
21
+ defaultMode = 'light',
22
+ defaultLightColorScheme = 'light',
23
+ defaultDarkColorScheme = 'dark',
24
+ modeStorageKey = DEFAULT_MODE_STORAGE_KEY,
25
+ colorSchemeStorageKey = DEFAULT_COLOR_SCHEME_STORAGE_KEY,
26
+ attribute = DEFAULT_ATTRIBUTE,
27
+ colorSchemeNode = 'document.documentElement',
28
+ nonce
29
+ } = options || {};
30
+ return /*#__PURE__*/(0, _jsxRuntime.jsx)("script", {
31
+ suppressHydrationWarning: true,
32
+ nonce: typeof window === 'undefined' ? nonce : ''
33
+ // eslint-disable-next-line react/no-danger
34
+ ,
35
+ dangerouslySetInnerHTML: {
36
+ __html: `(function() {
37
+ try {
38
+ var mode = localStorage.getItem('${modeStorageKey}') || '${defaultMode}';
39
+ var colorScheme = '';
40
+ if (mode === 'system') {
41
+ // handle system mode
42
+ var mql = window.matchMedia('(prefers-color-scheme: dark)');
43
+ if (mql.matches) {
44
+ colorScheme = localStorage.getItem('${colorSchemeStorageKey}-dark') || '${defaultDarkColorScheme}';
45
+ } else {
46
+ colorScheme = localStorage.getItem('${colorSchemeStorageKey}-light') || '${defaultLightColorScheme}';
47
+ }
48
+ }
49
+ if (mode === 'light') {
50
+ colorScheme = localStorage.getItem('${colorSchemeStorageKey}-light') || '${defaultLightColorScheme}';
51
+ }
52
+ if (mode === 'dark') {
53
+ colorScheme = localStorage.getItem('${colorSchemeStorageKey}-dark') || '${defaultDarkColorScheme}';
54
+ }
55
+ if (colorScheme) {
56
+ ${colorSchemeNode}.setAttribute('${attribute}', colorScheme);
57
+ }
58
+ } catch(e){}})();`
59
+ }
60
+ }, "mui-color-scheme-init");
61
+ }
@@ -0,0 +1,2 @@
1
+ export { default } from './InitColorSchemeScript';
2
+ export type { InitColorSchemeScriptProps } from './InitColorSchemeScript';
@@ -0,0 +1,13 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ Object.defineProperty(exports, "default", {
8
+ enumerable: true,
9
+ get: function () {
10
+ return _InitColorSchemeScript.default;
11
+ }
12
+ });
13
+ var _InitColorSchemeScript = _interopRequireDefault(require("./InitColorSchemeScript"));
@@ -0,0 +1,6 @@
1
+ {
2
+ "sideEffects": false,
3
+ "module": "../esm/InitColorSchemeScript/index.js",
4
+ "main": "./index.js",
5
+ "types": "./index.d.ts"
6
+ }
@@ -14,6 +14,7 @@ var _exactProp = _interopRequireDefault(require("@mui/utils/exactProp"));
14
14
  var _styledEngine = require("@mui/styled-engine");
15
15
  var _useThemeWithoutDefault = _interopRequireDefault(require("../useThemeWithoutDefault"));
16
16
  var _RtlProvider = _interopRequireDefault(require("../RtlProvider"));
17
+ var _DefaultPropsProvider = _interopRequireDefault(require("../DefaultPropsProvider"));
17
18
  var _jsxRuntime = require("react/jsx-runtime");
18
19
  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); }
19
20
  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; }
@@ -68,7 +69,10 @@ function ThemeProvider(props) {
68
69
  value: engineTheme,
69
70
  children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_RtlProvider.default, {
70
71
  value: rtlValue,
71
- children: children
72
+ children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_DefaultPropsProvider.default, {
73
+ value: engineTheme == null ? void 0 : engineTheme.components,
74
+ children: children
75
+ })
72
76
  })
73
77
  })
74
78
  });
@@ -1,5 +1,5 @@
1
1
  import * as React from 'react';
2
- import getInitColorSchemeScript from './getInitColorSchemeScript';
2
+ import InitColorSchemeScript from '../InitColorSchemeScript';
3
3
  import { Mode, Result } from './useCurrentColorScheme';
4
4
 
5
5
  export interface ColorSchemeContextValue<SupportedColorScheme extends string>
@@ -92,7 +92,7 @@ export interface CreateCssVarsProviderResult<
92
92
  >,
93
93
  ) => React.ReactElement;
94
94
  useColorScheme: () => ColorSchemeContextValue<ColorScheme>;
95
- getInitColorSchemeScript: typeof getInitColorSchemeScript;
95
+ getInitColorSchemeScript: typeof InitColorSchemeScript;
96
96
  }
97
97
 
98
98
  export default function createCssVarsProvider<
@@ -15,7 +15,7 @@ var _deepmerge = _interopRequireDefault(require("@mui/utils/deepmerge"));
15
15
  var _styledEngine = require("@mui/styled-engine");
16
16
  var _privateTheming = require("@mui/private-theming");
17
17
  var _ThemeProvider = _interopRequireDefault(require("../ThemeProvider"));
18
- var _getInitColorSchemeScript = _interopRequireWildcard(require("./getInitColorSchemeScript"));
18
+ var _InitColorSchemeScript = _interopRequireWildcard(require("../InitColorSchemeScript/InitColorSchemeScript"));
19
19
  var _useCurrentColorScheme = _interopRequireDefault(require("./useCurrentColorScheme"));
20
20
  var _jsxRuntime = require("react/jsx-runtime");
21
21
  const _excluded = ["colorSchemes", "components", "generateCssVars", "cssVarPrefix"];
@@ -32,9 +32,9 @@ function createCssVarsProvider(options) {
32
32
  * It should also ideally have a vars object created using `prepareCssVars`.
33
33
  */
34
34
  theme: defaultTheme = {},
35
- attribute: defaultAttribute = _getInitColorSchemeScript.DEFAULT_ATTRIBUTE,
36
- modeStorageKey: defaultModeStorageKey = _getInitColorSchemeScript.DEFAULT_MODE_STORAGE_KEY,
37
- colorSchemeStorageKey: defaultColorSchemeStorageKey = _getInitColorSchemeScript.DEFAULT_COLOR_SCHEME_STORAGE_KEY,
35
+ attribute: defaultAttribute = _InitColorSchemeScript.DEFAULT_ATTRIBUTE,
36
+ modeStorageKey: defaultModeStorageKey = _InitColorSchemeScript.DEFAULT_MODE_STORAGE_KEY,
37
+ colorSchemeStorageKey: defaultColorSchemeStorageKey = _InitColorSchemeScript.DEFAULT_COLOR_SCHEME_STORAGE_KEY,
38
38
  defaultMode: designSystemMode = 'light',
39
39
  defaultColorScheme: designSystemColorScheme,
40
40
  disableTransitionOnChange: designSystemTransitionOnChange = false,
@@ -339,7 +339,7 @@ function createCssVarsProvider(options) {
339
339
  } : void 0;
340
340
  const defaultLightColorScheme = typeof designSystemColorScheme === 'string' ? designSystemColorScheme : designSystemColorScheme.light;
341
341
  const defaultDarkColorScheme = typeof designSystemColorScheme === 'string' ? designSystemColorScheme : designSystemColorScheme.dark;
342
- const getInitColorSchemeScript = params => (0, _getInitColorSchemeScript.default)((0, _extends2.default)({
342
+ const getInitColorSchemeScript = params => (0, _InitColorSchemeScript.default)((0, _extends2.default)({
343
343
  attribute: defaultAttribute,
344
344
  colorSchemeStorageKey: defaultColorSchemeStorageKey,
345
345
  defaultMode: designSystemMode,
@@ -1,42 +1,3 @@
1
1
  import * as React from 'react';
2
- export declare const DEFAULT_MODE_STORAGE_KEY = "mode";
3
- export declare const DEFAULT_COLOR_SCHEME_STORAGE_KEY = "color-scheme";
4
- export declare const DEFAULT_ATTRIBUTE = "data-color-scheme";
5
- export interface GetInitColorSchemeScriptOptions {
6
- /**
7
- * The mode to be used for the first visit
8
- * @default 'light'
9
- */
10
- defaultMode?: 'light' | 'dark' | 'system';
11
- /**
12
- * The default color scheme to be used on the light mode
13
- * @default 'light'
14
- */
15
- defaultLightColorScheme?: string;
16
- /**
17
- * The default color scheme to be used on the dark mode
18
- * * @default 'dark'
19
- */
20
- defaultDarkColorScheme?: string;
21
- /**
22
- * The node (provided as string) used to attach the color-scheme attribute
23
- * @default 'document.documentElement'
24
- */
25
- colorSchemeNode?: string;
26
- /**
27
- * localStorage key used to store `mode`
28
- * @default 'mode'
29
- */
30
- modeStorageKey?: string;
31
- /**
32
- * localStorage key used to store `colorScheme`
33
- * @default 'color-scheme'
34
- */
35
- colorSchemeStorageKey?: string;
36
- /**
37
- * DOM attribute for applying color scheme
38
- * @default 'data-color-scheme'
39
- */
40
- attribute?: string;
41
- }
42
- export default function getInitColorSchemeScript(options?: GetInitColorSchemeScriptOptions): React.JSX.Element;
2
+ import { InitColorSchemeScriptProps } from '../InitColorSchemeScript';
3
+ export default function getInitColorSchemeScript(params?: InitColorSchemeScriptProps): React.JSX.Element;
@@ -1,53 +1,18 @@
1
1
  "use strict";
2
2
 
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
3
4
  Object.defineProperty(exports, "__esModule", {
4
5
  value: true
5
6
  });
6
- exports.DEFAULT_MODE_STORAGE_KEY = exports.DEFAULT_COLOR_SCHEME_STORAGE_KEY = exports.DEFAULT_ATTRIBUTE = void 0;
7
7
  exports.default = getInitColorSchemeScript;
8
+ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
8
9
  var React = _interopRequireWildcard(require("react"));
10
+ var _InitColorSchemeScript = _interopRequireDefault(require("../InitColorSchemeScript"));
9
11
  var _jsxRuntime = require("react/jsx-runtime");
10
12
  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); }
11
13
  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; }
12
- const DEFAULT_MODE_STORAGE_KEY = exports.DEFAULT_MODE_STORAGE_KEY = 'mode';
13
- const DEFAULT_COLOR_SCHEME_STORAGE_KEY = exports.DEFAULT_COLOR_SCHEME_STORAGE_KEY = 'color-scheme';
14
- const DEFAULT_ATTRIBUTE = exports.DEFAULT_ATTRIBUTE = 'data-color-scheme';
15
- function getInitColorSchemeScript(options) {
16
- const {
17
- defaultMode = 'light',
18
- defaultLightColorScheme = 'light',
19
- defaultDarkColorScheme = 'dark',
20
- modeStorageKey = DEFAULT_MODE_STORAGE_KEY,
21
- colorSchemeStorageKey = DEFAULT_COLOR_SCHEME_STORAGE_KEY,
22
- attribute = DEFAULT_ATTRIBUTE,
23
- colorSchemeNode = 'document.documentElement'
24
- } = options || {};
25
- return /*#__PURE__*/(0, _jsxRuntime.jsx)("script", {
26
- // eslint-disable-next-line react/no-danger
27
- dangerouslySetInnerHTML: {
28
- __html: `(function() {
29
- try {
30
- var mode = localStorage.getItem('${modeStorageKey}') || '${defaultMode}';
31
- var colorScheme = '';
32
- if (mode === 'system') {
33
- // handle system mode
34
- var mql = window.matchMedia('(prefers-color-scheme: dark)');
35
- if (mql.matches) {
36
- colorScheme = localStorage.getItem('${colorSchemeStorageKey}-dark') || '${defaultDarkColorScheme}';
37
- } else {
38
- colorScheme = localStorage.getItem('${colorSchemeStorageKey}-light') || '${defaultLightColorScheme}';
39
- }
40
- }
41
- if (mode === 'light') {
42
- colorScheme = localStorage.getItem('${colorSchemeStorageKey}-light') || '${defaultLightColorScheme}';
43
- }
44
- if (mode === 'dark') {
45
- colorScheme = localStorage.getItem('${colorSchemeStorageKey}-dark') || '${defaultDarkColorScheme}';
46
- }
47
- if (colorScheme) {
48
- ${colorSchemeNode}.setAttribute('${attribute}', colorScheme);
49
- }
50
- } catch(e){}})();`
51
- }
52
- }, "mui-color-scheme-init");
14
+ // TODO: remove this file in v6
15
+
16
+ function getInitColorSchemeScript(params) {
17
+ return /*#__PURE__*/(0, _jsxRuntime.jsx)(_InitColorSchemeScript.default, (0, _extends2.default)({}, params));
53
18
  }
@@ -10,7 +10,7 @@ exports.getColorScheme = getColorScheme;
10
10
  exports.getSystemMode = getSystemMode;
11
11
  var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
12
12
  var React = _interopRequireWildcard(require("react"));
13
- var _getInitColorSchemeScript = require("./getInitColorSchemeScript");
13
+ var _InitColorSchemeScript = require("../InitColorSchemeScript/InitColorSchemeScript");
14
14
  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); }
15
15
  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; }
16
16
  function getSystemMode(mode) {
@@ -65,8 +65,8 @@ function useCurrentColorScheme(options) {
65
65
  defaultLightColorScheme,
66
66
  defaultDarkColorScheme,
67
67
  supportedColorSchemes = [],
68
- modeStorageKey = _getInitColorSchemeScript.DEFAULT_MODE_STORAGE_KEY,
69
- colorSchemeStorageKey = _getInitColorSchemeScript.DEFAULT_COLOR_SCHEME_STORAGE_KEY,
68
+ modeStorageKey = _InitColorSchemeScript.DEFAULT_MODE_STORAGE_KEY,
69
+ colorSchemeStorageKey = _InitColorSchemeScript.DEFAULT_COLOR_SCHEME_STORAGE_KEY,
70
70
  storageWindow = typeof window === 'undefined' ? undefined : window
71
71
  } = options;
72
72
  const joinedColorSchemes = supportedColorSchemes.join(',');
@@ -0,0 +1,64 @@
1
+ 'use client';
2
+
3
+ import * as React from 'react';
4
+ import PropTypes from 'prop-types';
5
+ import resolveProps from '@mui/utils/resolveProps';
6
+ import { jsx as _jsx } from "react/jsx-runtime";
7
+ const PropsContext = /*#__PURE__*/React.createContext(undefined);
8
+ function DefaultPropsProvider({
9
+ value,
10
+ children
11
+ }) {
12
+ return /*#__PURE__*/_jsx(PropsContext.Provider, {
13
+ value: value,
14
+ children: children
15
+ });
16
+ }
17
+ process.env.NODE_ENV !== "production" ? DefaultPropsProvider.propTypes /* remove-proptypes */ = {
18
+ // ┌────────────────────────────── Warning ──────────────────────────────┐
19
+ // │ These PropTypes are generated from the TypeScript type definitions. │
20
+ // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
21
+ // └─────────────────────────────────────────────────────────────────────┘
22
+ /**
23
+ * @ignore
24
+ */
25
+ children: PropTypes.node,
26
+ /**
27
+ * @ignore
28
+ */
29
+ value: PropTypes.object
30
+ } : void 0;
31
+ function getThemeProps(params) {
32
+ const {
33
+ theme,
34
+ name,
35
+ props
36
+ } = params;
37
+ if (!theme || !theme.components || !theme.components[name]) {
38
+ return props;
39
+ }
40
+ const config = theme.components[name];
41
+ if (config.defaultProps) {
42
+ // compatible with v5 signature
43
+ return resolveProps(config.defaultProps, props);
44
+ }
45
+ if (!config.styleOverrides && !config.variants) {
46
+ // v6 signature, no property 'defaultProps'
47
+ return resolveProps(config, props);
48
+ }
49
+ return props;
50
+ }
51
+ export function useDefaultProps({
52
+ props,
53
+ name
54
+ }) {
55
+ const ctx = React.useContext(PropsContext);
56
+ return getThemeProps({
57
+ props,
58
+ name,
59
+ theme: {
60
+ components: ctx
61
+ }
62
+ });
63
+ }
64
+ export default DefaultPropsProvider;
@@ -0,0 +1 @@
1
+ export { default, useDefaultProps } from './DefaultPropsProvider';