@mui/system 5.10.1 → 5.10.2

package/cssVars/getInitColorSchemeScript.d.ts

@@ -1,45 +1,45 @@
-/// <reference types="react" />
-export declare const DEFAULT_MODE_STORAGE_KEY = "mode";
-export declare const DEFAULT_COLOR_SCHEME_STORAGE_KEY = "color-scheme";
-export declare const DEFAULT_ATTRIBUTE = "data-color-scheme";
-export interface GetInitColorSchemeScriptOptions {
-    /**
-     * Indicate to the browser which color scheme is used (light or dark) for rendering built-in UI
-     * @default true
-     */
-    enableColorScheme?: boolean;
-    /**
-     * If `true`, the initial color scheme is set to the user's prefers-color-scheme mode
-     * @default false
-     */
-    enableSystem?: boolean;
-    /**
-     * The default color scheme to be used on the light mode
-     */
-    defaultLightColorScheme?: string;
-    /**
-     * The default color scheme to be used on the dark mode
-     */
-    defaultDarkColorScheme?: string;
-    /**
-     * The node (provided as string) used to attach the color-scheme attribute
-     * @default 'document.documentElement'
-     */
-    colorSchemeNode?: string;
-    /**
-     * localStorage key used to store `mode`
-     * @default 'mode'
-     */
-    modeStorageKey?: string;
-    /**
-     * localStorage key used to store `colorScheme`
-     * @default 'color-scheme'
-     */
-    colorSchemeStorageKey?: string;
-    /**
-     * DOM attribute for applying color scheme
-     * @default 'data-color-scheme'
-     */
-    attribute?: string;
-}
-export default function getInitColorSchemeScript(options?: GetInitColorSchemeScriptOptions): JSX.Element;
+/// <reference types="react" />
+export declare const DEFAULT_MODE_STORAGE_KEY = "mode";
+export declare const DEFAULT_COLOR_SCHEME_STORAGE_KEY = "color-scheme";
+export declare const DEFAULT_ATTRIBUTE = "data-color-scheme";
+export interface GetInitColorSchemeScriptOptions {
+    /**
+     * Indicate to the browser which color scheme is used (light or dark) for rendering built-in UI
+     * @default true
+     */
+    enableColorScheme?: boolean;
+    /**
+     * If `true`, the initial color scheme is set to the user's prefers-color-scheme mode
+     * @default false
+     */
+    enableSystem?: boolean;
+    /**
+     * The default color scheme to be used on the light mode
+     */
+    defaultLightColorScheme?: string;
+    /**
+     * The default color scheme to be used on the dark mode
+     */
+    defaultDarkColorScheme?: string;
+    /**
+     * The node (provided as string) used to attach the color-scheme attribute
+     * @default 'document.documentElement'
+     */
+    colorSchemeNode?: string;
+    /**
+     * localStorage key used to store `mode`
+     * @default 'mode'
+     */
+    modeStorageKey?: string;
+    /**
+     * localStorage key used to store `colorScheme`
+     * @default 'color-scheme'
+     */
+    colorSchemeStorageKey?: string;
+    /**
+     * DOM attribute for applying color scheme
+     * @default 'data-color-scheme'
+     */
+    attribute?: string;
+}
+export default function getInitColorSchemeScript(options?: GetInitColorSchemeScriptOptions): JSX.Element;

package/cssVars/index.d.ts

@@ -1,3 +1,3 @@
-export { default } from './createCssVarsProvider';
-export type { CreateCssVarsProviderResult, CssVarsProviderConfig, ColorSchemeContextValue, } from './createCssVarsProvider';
-export { default as getInitColorSchemeScript } from './getInitColorSchemeScript';
+export { default } from './createCssVarsProvider';
+export type { CreateCssVarsProviderResult, CssVarsProviderConfig, ColorSchemeContextValue, } from './createCssVarsProvider';
+export { default as getInitColorSchemeScript } from './getInitColorSchemeScript';

package/cssVars/useCurrentColorScheme.d.ts

@@ -1,53 +1,53 @@
-export declare type Mode = 'light' | 'dark' | 'system';
-export declare type SystemMode = Exclude<Mode, 'system'>;
-export interface State<SupportedColorScheme extends string> {
-    /**
-     * User selected mode.
-     * Note: on the server, mode is always undefined
-     */
-    mode: Mode | undefined;
-    /**
-     * Only valid if `mode: 'system'`, either 'light' | 'dark'.
-     */
-    systemMode: SystemMode | undefined;
-    /**
-     * The color scheme for the light mode.
-     */
-    lightColorScheme: SupportedColorScheme;
-    /**
-     * The color scheme for the dark mode.
-     */
-    darkColorScheme: SupportedColorScheme;
-}
-export declare type Result<SupportedColorScheme extends string> = State<SupportedColorScheme> & {
-    /**
-     * The current application color scheme. It is always `undefined` on the server.
-     */
-    colorScheme: SupportedColorScheme | undefined;
-    /**
-     * `mode` is saved to internal state and localStorage
-     * If `mode` is null, it will be reset to the defaultMode
-     */
-    setMode: (mode: Mode | null) => void;
-    /**
-     * `colorScheme` is saved to internal state and localStorage
-     * If `colorScheme` is null, it will be reset to the defaultColorScheme (light | dark)
-     */
-    setColorScheme: (colorScheme: SupportedColorScheme | Partial<{
-        light: SupportedColorScheme | null;
-        dark: SupportedColorScheme | null;
-    }> | null) => void;
-};
-export declare function getSystemMode(mode: undefined | string): SystemMode | undefined;
-export declare function getColorScheme<SupportedColorScheme extends string>(state: State<SupportedColorScheme>): SupportedColorScheme | undefined;
-interface UseCurrentColoSchemeOptions<SupportedColorScheme extends string> {
-    defaultLightColorScheme: SupportedColorScheme;
-    defaultDarkColorScheme: SupportedColorScheme;
-    supportedColorSchemes: Array<SupportedColorScheme>;
-    defaultMode?: Mode;
-    modeStorageKey?: string;
-    colorSchemeStorageKey?: string;
-    storageWindow?: Window | null;
-}
-export default function useCurrentColorScheme<SupportedColorScheme extends string>(options: UseCurrentColoSchemeOptions<SupportedColorScheme>): Result<SupportedColorScheme>;
-export {};
+export declare type Mode = 'light' | 'dark' | 'system';
+export declare type SystemMode = Exclude<Mode, 'system'>;
+export interface State<SupportedColorScheme extends string> {
+    /**
+     * User selected mode.
+     * Note: on the server, mode is always undefined
+     */
+    mode: Mode | undefined;
+    /**
+     * Only valid if `mode: 'system'`, either 'light' | 'dark'.
+     */
+    systemMode: SystemMode | undefined;
+    /**
+     * The color scheme for the light mode.
+     */
+    lightColorScheme: SupportedColorScheme;
+    /**
+     * The color scheme for the dark mode.
+     */
+    darkColorScheme: SupportedColorScheme;
+}
+export declare type Result<SupportedColorScheme extends string> = State<SupportedColorScheme> & {
+    /**
+     * The current application color scheme. It is always `undefined` on the server.
+     */
+    colorScheme: SupportedColorScheme | undefined;
+    /**
+     * `mode` is saved to internal state and localStorage
+     * If `mode` is null, it will be reset to the defaultMode
+     */
+    setMode: (mode: Mode | null) => void;
+    /**
+     * `colorScheme` is saved to internal state and localStorage
+     * If `colorScheme` is null, it will be reset to the defaultColorScheme (light | dark)
+     */
+    setColorScheme: (colorScheme: SupportedColorScheme | Partial<{
+        light: SupportedColorScheme | null;
+        dark: SupportedColorScheme | null;
+    }> | null) => void;
+};
+export declare function getSystemMode(mode: undefined | string): SystemMode | undefined;
+export declare function getColorScheme<SupportedColorScheme extends string>(state: State<SupportedColorScheme>): SupportedColorScheme | undefined;
+interface UseCurrentColoSchemeOptions<SupportedColorScheme extends string> {
+    defaultLightColorScheme: SupportedColorScheme;
+    defaultDarkColorScheme: SupportedColorScheme;
+    supportedColorSchemes: Array<SupportedColorScheme>;
+    defaultMode?: Mode;
+    modeStorageKey?: string;
+    colorSchemeStorageKey?: string;
+    storageWindow?: Window | null;
+}
+export default function useCurrentColorScheme<SupportedColorScheme extends string>(options: UseCurrentColoSchemeOptions<SupportedColorScheme>): Result<SupportedColorScheme>;
+export {};

package/cssVars/useCurrentColorScheme.js

@@ -103,8 +103,9 @@ function useCurrentColorScheme(options) {
         return currentState;
       }
 
-      if (typeof localStorage !== 'undefined') {
+      try {
         localStorage.setItem(modeStorageKey, newMode);
+      } catch (e) {// Unsupported
       }
 
       return (0, _extends2.default)({}, currentState, {
@@ -129,7 +130,10 @@ function useCurrentColorScheme(options) {
           }
 
           processState(currentState, mode => {
-            localStorage.setItem(`${colorSchemeStorageKey}-${mode}`, value);
+            try {
+              localStorage.setItem(`${colorSchemeStorageKey}-${mode}`, value);
+            } catch (e) {// Unsupported
+            }
 
             if (mode === 'light') {
               newState.lightColorScheme = value;
@@ -159,12 +163,15 @@ function useCurrentColorScheme(options) {
         return newState;
       });
 
-      if (value.light) {
-        localStorage.setItem(`${colorSchemeStorageKey}-light`, value.light);
-      }
+      try {
+        if (value.light) {
+          localStorage.setItem(`${colorSchemeStorageKey}-light`, value.light);
+        }
 
-      if (value.dark) {
-        localStorage.setItem(`${colorSchemeStorageKey}-dark`, value.dark);
+        if (value.dark) {
+          localStorage.setItem(`${colorSchemeStorageKey}-dark`, value.dark);
+        }
+      } catch (e) {// Unsupported
       }
     }
   }, [joinedColorSchemes, colorSchemeStorageKey, defaultLightColorScheme, defaultDarkColorScheme]);
@@ -190,19 +197,22 @@ function useCurrentColorScheme(options) {
   }, []); // Save mode, lightColorScheme & darkColorScheme to localStorage
 
   React.useEffect(() => {
-    if (state.mode) {
-      localStorage.setItem(modeStorageKey, state.mode);
-    }
-
-    processState(state, mode => {
-      if (mode === 'light') {
-        localStorage.setItem(`${colorSchemeStorageKey}-light`, state.lightColorScheme);
+    try {
+      if (state.mode) {
+        localStorage.setItem(modeStorageKey, state.mode);
       }
 
-      if (mode === 'dark') {
-        localStorage.setItem(`${colorSchemeStorageKey}-dark`, state.darkColorScheme);
-      }
-    });
+      processState(state, mode => {
+        if (mode === 'light') {
+          localStorage.setItem(`${colorSchemeStorageKey}-light`, state.lightColorScheme);
+        }
+
+        if (mode === 'dark') {
+          localStorage.setItem(`${colorSchemeStorageKey}-dark`, state.darkColorScheme);
+        }
+      });
+    } catch (e) {// Unsupported
+    }
   }, [state, colorSchemeStorageKey, modeStorageKey]); // Handle when localStorage has changed
 
   React.useEffect(() => {

package/esm/cssVars/useCurrentColorScheme.js

@@ -85,8 +85,9 @@ export default function useCurrentColorScheme(options) {
         return currentState;
       }
 
-      if (typeof localStorage !== 'undefined') {
+      try {
         localStorage.setItem(modeStorageKey, newMode);
+      } catch (e) {// Unsupported
       }
 
       return _extends({}, currentState, {
@@ -111,7 +112,10 @@ export default function useCurrentColorScheme(options) {
           }
 
           processState(currentState, mode => {
-            localStorage.setItem(`${colorSchemeStorageKey}-${mode}`, value);
+            try {
+              localStorage.setItem(`${colorSchemeStorageKey}-${mode}`, value);
+            } catch (e) {// Unsupported
+            }
 
             if (mode === 'light') {
               newState.lightColorScheme = value;
@@ -141,12 +145,15 @@ export default function useCurrentColorScheme(options) {
         return newState;
       });
 
-      if (value.light) {
-        localStorage.setItem(`${colorSchemeStorageKey}-light`, value.light);
-      }
+      try {
+        if (value.light) {
+          localStorage.setItem(`${colorSchemeStorageKey}-light`, value.light);
+        }
 
-      if (value.dark) {
-        localStorage.setItem(`${colorSchemeStorageKey}-dark`, value.dark);
+        if (value.dark) {
+          localStorage.setItem(`${colorSchemeStorageKey}-dark`, value.dark);
+        }
+      } catch (e) {// Unsupported
       }
     }
   }, [joinedColorSchemes, colorSchemeStorageKey, defaultLightColorScheme, defaultDarkColorScheme]);
@@ -172,19 +179,22 @@ export default function useCurrentColorScheme(options) {
   }, []); // Save mode, lightColorScheme & darkColorScheme to localStorage
 
   React.useEffect(() => {
-    if (state.mode) {
-      localStorage.setItem(modeStorageKey, state.mode);
-    }
-
-    processState(state, mode => {
-      if (mode === 'light') {
-        localStorage.setItem(`${colorSchemeStorageKey}-light`, state.lightColorScheme);
+    try {
+      if (state.mode) {
+        localStorage.setItem(modeStorageKey, state.mode);
       }
 
-      if (mode === 'dark') {
-        localStorage.setItem(`${colorSchemeStorageKey}-dark`, state.darkColorScheme);
-      }
-    });
+      processState(state, mode => {
+        if (mode === 'light') {
+          localStorage.setItem(`${colorSchemeStorageKey}-light`, state.lightColorScheme);
+        }
+
+        if (mode === 'dark') {
+          localStorage.setItem(`${colorSchemeStorageKey}-dark`, state.darkColorScheme);
+        }
+      });
+    } catch (e) {// Unsupported
+    }
   }, [state, colorSchemeStorageKey, modeStorageKey]); // Handle when localStorage has changed
 
   React.useEffect(() => {

package/index.js

@@ -1,4 +1,4 @@
-/** @license MUI v5.10.1
+/** @license MUI v5.10.2
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.

package/index.spec.d.ts

@@ -1 +1 @@
-export {};
+export {};

package/legacy/cssVars/useCurrentColorScheme.js

@@ -92,8 +92,9 @@ export default function useCurrentColorScheme(options) {
         return currentState;
       }
 
-      if (typeof localStorage !== 'undefined') {
+      try {
         localStorage.setItem(modeStorageKey, newMode);
+      } catch (e) {// Unsupported
       }
 
       return _extends({}, currentState, {
@@ -118,7 +119,10 @@ export default function useCurrentColorScheme(options) {
           }
 
           processState(currentState, function (mode) {
-            localStorage.setItem("".concat(colorSchemeStorageKey, "-").concat(mode), value);
+            try {
+              localStorage.setItem("".concat(colorSchemeStorageKey, "-").concat(mode), value);
+            } catch (e) {// Unsupported
+            }
 
             if (mode === 'light') {
               newState.lightColorScheme = value;
@@ -148,12 +152,15 @@ export default function useCurrentColorScheme(options) {
         return newState;
       });
 
-      if (value.light) {
-        localStorage.setItem("".concat(colorSchemeStorageKey, "-light"), value.light);
-      }
+      try {
+        if (value.light) {
+          localStorage.setItem("".concat(colorSchemeStorageKey, "-light"), value.light);
+        }
 
-      if (value.dark) {
-        localStorage.setItem("".concat(colorSchemeStorageKey, "-dark"), value.dark);
+        if (value.dark) {
+          localStorage.setItem("".concat(colorSchemeStorageKey, "-dark"), value.dark);
+        }
+      } catch (e) {// Unsupported
       }
     }
   }, [joinedColorSchemes, colorSchemeStorageKey, defaultLightColorScheme, defaultDarkColorScheme]);
@@ -185,19 +192,22 @@ export default function useCurrentColorScheme(options) {
   }, []); // Save mode, lightColorScheme & darkColorScheme to localStorage
 
   React.useEffect(function () {
-    if (state.mode) {
-      localStorage.setItem(modeStorageKey, state.mode);
-    }
-
-    processState(state, function (mode) {
-      if (mode === 'light') {
-        localStorage.setItem("".concat(colorSchemeStorageKey, "-light"), state.lightColorScheme);
+    try {
+      if (state.mode) {
+        localStorage.setItem(modeStorageKey, state.mode);
       }
 
-      if (mode === 'dark') {
-        localStorage.setItem("".concat(colorSchemeStorageKey, "-dark"), state.darkColorScheme);
-      }
-    });
+      processState(state, function (mode) {
+        if (mode === 'light') {
+          localStorage.setItem("".concat(colorSchemeStorageKey, "-light"), state.lightColorScheme);
+        }
+
+        if (mode === 'dark') {
+          localStorage.setItem("".concat(colorSchemeStorageKey, "-dark"), state.darkColorScheme);
+        }
+      });
+    } catch (e) {// Unsupported
+    }
   }, [state, colorSchemeStorageKey, modeStorageKey]); // Handle when localStorage has changed
 
   React.useEffect(function () {

package/legacy/index.js

@@ -1,4 +1,4 @@
-/** @license MUI v5.10.1
+/** @license MUI v5.10.2
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.

package/modern/cssVars/useCurrentColorScheme.js

@@ -85,8 +85,9 @@ export default function useCurrentColorScheme(options) {
         return currentState;
       }
 
-      if (typeof localStorage !== 'undefined') {
+      try {
         localStorage.setItem(modeStorageKey, newMode);
+      } catch (e) {// Unsupported
       }
 
       return _extends({}, currentState, {
@@ -111,7 +112,10 @@ export default function useCurrentColorScheme(options) {
           }
 
           processState(currentState, mode => {
-            localStorage.setItem(`${colorSchemeStorageKey}-${mode}`, value);
+            try {
+              localStorage.setItem(`${colorSchemeStorageKey}-${mode}`, value);
+            } catch (e) {// Unsupported
+            }
 
             if (mode === 'light') {
               newState.lightColorScheme = value;
@@ -141,12 +145,15 @@ export default function useCurrentColorScheme(options) {
         return newState;
       });
 
-      if (value.light) {
-        localStorage.setItem(`${colorSchemeStorageKey}-light`, value.light);
-      }
+      try {
+        if (value.light) {
+          localStorage.setItem(`${colorSchemeStorageKey}-light`, value.light);
+        }
 
-      if (value.dark) {
-        localStorage.setItem(`${colorSchemeStorageKey}-dark`, value.dark);
+        if (value.dark) {
+          localStorage.setItem(`${colorSchemeStorageKey}-dark`, value.dark);
+        }
+      } catch (e) {// Unsupported
       }
     }
   }, [joinedColorSchemes, colorSchemeStorageKey, defaultLightColorScheme, defaultDarkColorScheme]);
@@ -172,19 +179,22 @@ export default function useCurrentColorScheme(options) {
   }, []); // Save mode, lightColorScheme & darkColorScheme to localStorage
 
   React.useEffect(() => {
-    if (state.mode) {
-      localStorage.setItem(modeStorageKey, state.mode);
-    }
-
-    processState(state, mode => {
-      if (mode === 'light') {
-        localStorage.setItem(`${colorSchemeStorageKey}-light`, state.lightColorScheme);
+    try {
+      if (state.mode) {
+        localStorage.setItem(modeStorageKey, state.mode);
       }
 
-      if (mode === 'dark') {
-        localStorage.setItem(`${colorSchemeStorageKey}-dark`, state.darkColorScheme);
-      }
-    });
+      processState(state, mode => {
+        if (mode === 'light') {
+          localStorage.setItem(`${colorSchemeStorageKey}-light`, state.lightColorScheme);
+        }
+
+        if (mode === 'dark') {
+          localStorage.setItem(`${colorSchemeStorageKey}-dark`, state.darkColorScheme);
+        }
+      });
+    } catch (e) {// Unsupported
+    }
   }, [state, colorSchemeStorageKey, modeStorageKey]); // Handle when localStorage has changed
 
   React.useEffect(() => {

package/modern/index.js

@@ -1,4 +1,4 @@
-/** @license MUI v5.10.1
+/** @license MUI v5.10.2
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/system",
-  "version": "5.10.1",
+  "version": "5.10.2",
   "private": false,
   "author": "MUI Team",
   "description": "CSS utilities for rapidly laying out custom designs.",
@@ -45,7 +45,7 @@
   "dependencies": {
     "@babel/runtime": "^7.17.2",
     "@mui/private-theming": "^5.9.3",
-    "@mui/styled-engine": "^5.10.1",
+    "@mui/styled-engine": "^5.10.2",
     "@mui/types": "^7.1.5",
     "@mui/utils": "^5.9.3",
     "clsx": "^1.2.1",

package/styleFunctionSx/styleFunctionSx.spec.d.ts

@@ -1 +1 @@
-export {};
+export {};