@mui/material 5.11.9 → 5.11.11

package/useAutocomplete/useAutocomplete.d.ts

@@ -1,2 +1,2 @@
-export { useAutocomplete as default } from '@mui/base/AutocompleteUnstyled';
-export * from '@mui/base/AutocompleteUnstyled';
+export { default } from '@mui/base/useAutocomplete';
+export * from '@mui/base/useAutocomplete';

package/useAutocomplete/useAutocomplete.js

@@ -1,2 +1,2 @@
-export { useAutocomplete as default } from '@mui/base/AutocompleteUnstyled';
-export * from '@mui/base/AutocompleteUnstyled';
+export { default } from '@mui/base/useAutocomplete';
+export * from '@mui/base/useAutocomplete';

package/useMediaQuery/useMediaQuery.d.ts

@@ -16,16 +16,31 @@ export interface MuiMediaQueryList {
  * @deprecated Not used internally. Use `(event: MediaQueryListEvent) => void` instead.
  */
 export type MuiMediaQueryListListener = (event: MuiMediaQueryListEvent) => void;
-export interface Options {
+export interface UseMediaQueryOptions {
+    /**
+     * As `window.matchMedia()` is unavailable on the server,
+     * it returns a default matches during the first mount.
+     * @default false
+     */
     defaultMatches?: boolean;
+    /**
+     * You can provide your own implementation of matchMedia.
+     * This can be used for handling an iframe content window.
+     */
     matchMedia?: typeof window.matchMedia;
     /**
-     * This option is kept for backwards compatibility and has no longer any effect.
-     * It's previous behavior is now handled automatically.
+     * To perform the server-side hydration, the hook needs to render twice.
+     * A first time with `defaultMatches`, the value of the server, and a second time with the resolved value.
+     * This double pass rendering cycle comes with a drawback: it's slower.
+     * You can set this option to `true` if you use the returned value **only** client-side.
+     * @default false
      */
     noSsr?: boolean;
+    /**
+     * You can provide your own implementation of `matchMedia`, it's used when rendering server-side.
+     */
     ssrMatchMedia?: (query: string) => {
         matches: boolean;
     };
 }
-export default function useMediaQuery<Theme = unknown>(queryInput: string | ((theme: Theme) => string), options?: Options): boolean;
+export default function useMediaQuery<Theme = unknown>(queryInput: string | ((theme: Theme) => string), options?: UseMediaQueryOptions): boolean;

package/useMediaQuery/useMediaQuery.js

@@ -7,9 +7,8 @@ import useEnhancedEffect from '../utils/useEnhancedEffect';
  */
 
 function useMediaQueryOld(query, defaultMatches, matchMedia, ssrMatchMedia, noSsr) {
-  const supportMatchMedia = typeof window !== 'undefined' && typeof window.matchMedia !== 'undefined';
   const [match, setMatch] = React.useState(() => {
-    if (noSsr && supportMatchMedia) {
+    if (noSsr && matchMedia) {
       return matchMedia(query).matches;
     }
     if (ssrMatchMedia) {
@@ -22,7 +21,7 @@ function useMediaQueryOld(query, defaultMatches, matchMedia, ssrMatchMedia, noSs
   });
   useEnhancedEffect(() => {
     let active = true;
-    if (!supportMatchMedia) {
+    if (!matchMedia) {
       return undefined;
     }
     const queryList = matchMedia(query);
@@ -41,15 +40,18 @@ function useMediaQueryOld(query, defaultMatches, matchMedia, ssrMatchMedia, noSs
       active = false;
       queryList.removeListener(updateMatch);
     };
-  }, [query, matchMedia, supportMatchMedia]);
+  }, [query, matchMedia]);
   return match;
 }
 
 // eslint-disable-next-line no-useless-concat -- Workaround for https://github.com/webpack/webpack/issues/14814
 const maybeReactUseSyncExternalStore = React['useSyncExternalStore' + ''];
-function useMediaQueryNew(query, defaultMatches, matchMedia, ssrMatchMedia) {
+function useMediaQueryNew(query, defaultMatches, matchMedia, ssrMatchMedia, noSsr) {
   const getDefaultSnapshot = React.useCallback(() => defaultMatches, [defaultMatches]);
   const getServerSnapshot = React.useMemo(() => {
+    if (noSsr && matchMedia) {
+      return () => matchMedia(query).matches;
+    }
     if (ssrMatchMedia !== null) {
       const {
         matches
@@ -57,7 +59,7 @@ function useMediaQueryNew(query, defaultMatches, matchMedia, ssrMatchMedia) {
       return () => matches;
     }
     return getDefaultSnapshot;
-  }, [getDefaultSnapshot, query, ssrMatchMedia]);
+  }, [getDefaultSnapshot, query, ssrMatchMedia, noSsr, matchMedia]);
   const [getSnapshot, subscribe] = React.useMemo(() => {
     if (matchMedia === null) {
       return [getDefaultSnapshot, () => () => {}];
@@ -85,7 +87,7 @@ export default function useMediaQuery(queryInput, options = {}) {
     defaultMatches = false,
     matchMedia = supportMatchMedia ? window.matchMedia : null,
     ssrMatchMedia = null,
-    noSsr
+    noSsr = false
   } = getThemeProps({
     name: 'MuiUseMediaQuery',
     props: options,