@mui/utils 9.1.1 → 9.2.0

package/CHANGELOG.md

@@ -1,5 +1,79 @@
 # [Versions](https://mui.com/material-ui/getting-started/versions/)
 
+## 9.2.0
+
+<!-- generated comparing v9.1.2..master -->
+
+_Jul 2, 2026_
+
+A big thanks to the 9 contributors who made this release possible.
+
+- ⚙️ Add support for [`data-*` attributes on `slotProps`](https://mui.com/material-ui/guides/typescript/#allowing-data-attributes-on-slotprops).
+
+### `@mui/material@9.1.3`
+
+- [l10n] Add missing MuiPagination localization to zh-CN locale (#48741) @greymoth-jp
+- [select] Guard display ref during mouse down (#48744) @michelengelen
+
+### `@mui/utils@9.1.3`
+
+- [utils] Add opt-in `DataAttributesOverrides` augmentation for slot props (#48554) @LukasTy
+
+### Docs
+
+- [docs] Improve Icon Dialog responsiveness on small screens (#48639) @Prakash1185
+- [docs] Fix invalid UTF-8 in skill references (#48739) @mturac
+
+### Core
+
+- [code-infra] Resolve Renovate dashboard warnings (#48700) @Sushantplive
+- [code-infra] Validate npm publishing through dry run (#48691) @brijeshb42
+- [code-infra] Run prettier after renovate update (#48754) @Janpot
+- [code-infra] Fix 'A11y results committed?' check on react-pinned nightly jobs (#48740) @Janpot
+- [core] Remove leftover Joy UI references (#48719) @siriwatknp
+- [code-infra] Bump react-router to 7.15.1 (#48725) @Janpot
+- [docs-infra] Drive docs analytics IDs via ANALYTICS_ENV (#48694) @Janpot
+- [docs-infra] Pre-render API page descriptions (#48693) @brijeshb42
+- [code-infra][icons-material] Build lib/package.json with code-infra --no-expand (#48689) @Janpot
+- [code-infra] Fix react@18/next nightly workflow (#48635) @Janpot
+
+All contributors of this release in alphabetical order: @brijeshb42, @greymoth-jp, @Janpot, @LukasTy, @michelengelen, @mturac, @Prakash1185, @siriwatknp, @Sushantplive
+
+## 9.1.2
+
+<!-- generated comparing v9.1.1..master -->
+
+_Jun 23, 2026_
+
+A big thanks to the 5 contributors who made this release possible.
+
+### `@mui/material@9.1.2`
+
+- [autocomplete] Don't submit forms when committing `freeSolo` value with Enter key (#48679) @mj12albert
+- [transitions] Fix RTG import in ESM (#48645) @mj12albert
+
+### `@mui/system@9.1.2`
+
+- [InitColorSchemeScript] Fix script tag warning in Next.js 16 dev mode (#48671) @siriwatknp
+
+### Docs
+
+- Fix typos in release instructions (#48687) @brijeshb42
+- Update @mui/x-\* packages to latest (#48661) @Janpot
+
+### Core
+
+- [code-infra] Convert leaf @mui/system .js+.d.ts pairs to TypeScript (part 1) (#48578) @Janpot
+- [code-infra] Bump to latest code-infra packages (#48672) @brijeshb42
+- [code-infra] Resolve remaining minimatch advisory (#48662) @Janpot
+- [code-infra] Bump nx to resolve minimatch advisory (#48658) @Janpot
+- [core] Drop @babel/\* pnpm overrides (#48710) @Janpot
+- [docs-infra] Revert "Pin StackBlitz demo vite to v7 and plugin-react to v5" (#48709) @Janpot
+- [docs-infra] Fix code-block copy button broken on direct page load (#48653) @brijeshb42
+- [test] Stabilize Data Grid demo data in Argos screenshots (#48654) @LukasTy
+
+All contributors of this release in alphabetical order: @brijeshb42, @Janpot, @LukasTy, @mj12albert, @siriwatknp
+
 ## 9.1.1
 
 <!-- generated comparing v9.1.0..master -->

package/elementAcceptingRef/elementAcceptingRef.js

@@ -21,7 +21,7 @@ function acceptingRef(props, propName, componentName, location, propFullName) {
   // When server-side rendering React doesn't warn either.
   // This is not an accurate check for SSR.
   // This is only in place for Emotion compat.
-  // TODO: Revisit once https://github.com/facebook/react/issues/20047 is resolved.
+  // TODO: Revisit once https://github.com/react/react/issues/20047 is resolved.
   typeof window === 'undefined') {
     return null;
   }

package/elementAcceptingRef/elementAcceptingRef.mjs

@@ -14,7 +14,7 @@ function acceptingRef(props, propName, componentName, location, propFullName) {
   // When server-side rendering React doesn't warn either.
   // This is not an accurate check for SSR.
   // This is only in place for Emotion compat.
-  // TODO: Revisit once https://github.com/facebook/react/issues/20047 is resolved.
+  // TODO: Revisit once https://github.com/react/react/issues/20047 is resolved.
   typeof window === 'undefined') {
     return null;
   }

package/elementTypeAcceptingRef/elementTypeAcceptingRef.js

@@ -23,7 +23,7 @@ function elementTypeAcceptingRef(props, propName, componentName, location, propF
   // When server-side rendering React doesn't warn either.
   // This is not an accurate check for SSR.
   // This is only in place for emotion compat.
-  // TODO: Revisit once https://github.com/facebook/react/issues/20047 is resolved.
+  // TODO: Revisit once https://github.com/react/react/issues/20047 is resolved.
   typeof window === 'undefined') {
     return null;
   }

package/elementTypeAcceptingRef/elementTypeAcceptingRef.mjs

@@ -15,7 +15,7 @@ function elementTypeAcceptingRef(props, propName, componentName, location, propF
   // When server-side rendering React doesn't warn either.
   // This is not an accurate check for SSR.
   // This is only in place for emotion compat.
-  // TODO: Revisit once https://github.com/facebook/react/issues/20047 is resolved.
+  // TODO: Revisit once https://github.com/react/react/issues/20047 is resolved.
   typeof window === 'undefined') {
     return null;
   }

package/getDisplayName/getDisplayName.d.mts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 /**
  * cherry-pick from
- * https://github.com/facebook/react/blob/769b1f270e1251d9dbdce0fcbd9e92e502d059b8/packages/shared/getComponentName.js
+ * https://github.com/react/react/blob/769b1f270e1251d9dbdce0fcbd9e92e502d059b8/packages/shared/getComponentName.js
  * originally forked from recompose/getDisplayName
  */
 export default function getDisplayName(Component: React.ElementType): string | undefined;

package/getDisplayName/getDisplayName.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 /**
  * cherry-pick from
- * https://github.com/facebook/react/blob/769b1f270e1251d9dbdce0fcbd9e92e502d059b8/packages/shared/getComponentName.js
+ * https://github.com/react/react/blob/769b1f270e1251d9dbdce0fcbd9e92e502d059b8/packages/shared/getComponentName.js
  * originally forked from recompose/getDisplayName
  */
 export default function getDisplayName(Component: React.ElementType): string | undefined;

package/getDisplayName/getDisplayName.js

@@ -15,7 +15,7 @@ function getWrappedName(outerType, innerType, wrapperName) {
 
 /**
  * cherry-pick from
- * https://github.com/facebook/react/blob/769b1f270e1251d9dbdce0fcbd9e92e502d059b8/packages/shared/getComponentName.js
+ * https://github.com/react/react/blob/769b1f270e1251d9dbdce0fcbd9e92e502d059b8/packages/shared/getComponentName.js
  * originally forked from recompose/getDisplayName
  */
 function getDisplayName(Component) {

package/getDisplayName/getDisplayName.mjs

@@ -9,7 +9,7 @@ function getWrappedName(outerType, innerType, wrapperName) {
 
 /**
  * cherry-pick from
- * https://github.com/facebook/react/blob/769b1f270e1251d9dbdce0fcbd9e92e502d059b8/packages/shared/getComponentName.js
+ * https://github.com/react/react/blob/769b1f270e1251d9dbdce0fcbd9e92e502d059b8/packages/shared/getComponentName.js
  * originally forked from recompose/getDisplayName
  */
 export default function getDisplayName(Component) {

package/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/utils v9.1.1
+ * @mui/utils v9.2.0
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/index.mjs

@@ -1,5 +1,5 @@
 /**
- * @mui/utils v9.1.1
+ * @mui/utils v9.2.0
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/isMuiElement/isMuiElement.js

@@ -9,7 +9,7 @@ var React = _interopRequireWildcard(require("react"));
 function isMuiElement(element, muiNames) {
   return /*#__PURE__*/React.isValidElement(element) && muiNames.indexOf(
   // For server components `muiName` is available in element.type._payload.value.muiName
-  // relevant info - https://github.com/facebook/react/blob/2807d781a08db8e9873687fccc25c0f12b4fb3d4/packages/react/src/ReactLazy.js#L45
+  // relevant info - https://github.com/react/react/blob/2807d781a08db8e9873687fccc25c0f12b4fb3d4/packages/react/src/ReactLazy.js#L45
   // eslint-disable-next-line no-underscore-dangle
   element.type.muiName ?? element.type?._payload?.value?.muiName) !== -1;
 }

package/isMuiElement/isMuiElement.mjs

@@ -2,7 +2,7 @@ import * as React from 'react';
 export default function isMuiElement(element, muiNames) {
   return /*#__PURE__*/React.isValidElement(element) && muiNames.indexOf(
   // For server components `muiName` is available in element.type._payload.value.muiName
-  // relevant info - https://github.com/facebook/react/blob/2807d781a08db8e9873687fccc25c0f12b4fb3d4/packages/react/src/ReactLazy.js#L45
+  // relevant info - https://github.com/react/react/blob/2807d781a08db8e9873687fccc25c0f12b4fb3d4/packages/react/src/ReactLazy.js#L45
   // eslint-disable-next-line no-underscore-dangle
   element.type.muiName ?? element.type?._payload?.value?.muiName) !== -1;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/utils",
-  "version": "9.1.1",
+  "version": "9.2.0",
   "author": "MUI Team",
   "description": "Utility functions for React components.",
   "license": "MIT",

package/types/DataAttributes.d.mts

@@ -0,0 +1,45 @@
+/**
+ * Opt-in interface for typing `data-*` attributes on MUI slot props.
+ *
+ * Slot prop types reject arbitrary `data-*` keys by design, so this interface is
+ * empty by default. Augment it to declare the keys you want, and they become
+ * assignable on every slot of every component that routes its slot props through
+ * `@mui/utils/types`.
+ *
+ * Choose the form that matches how strict you want to be:
+ *
+ * - Loose index signature: accepts any `data-*` key, like the underlying DOM
+ *   element. Simplest to set up, but you get no autocomplete and typos slip through.
+ * - Explicit keys: lists each `data-*` key you allow. More to declare up front,
+ *   in return for autocomplete and typo-checking on those keys.
+ *
+ * @example
+ * // Loose: accept any `data-*` key.
+ * declare module '@mui/utils/types' {
+ *   interface DataAttributesOverrides {
+ *     [k: `data-${string}`]: string | number | boolean | undefined;
+ *   }
+ * }
+ *
+ * @example
+ * // Explicit: only the keys you declare, with autocomplete.
+ * declare module '@mui/utils/types' {
+ *   interface DataAttributesOverrides {
+ *     'data-testid'?: string;
+ *   }
+ * }
+ */
+export interface DataAttributesOverrides {}
+/**
+ * Widens a slot-props type so that, when a consumer augments
+ * `DataAttributesOverrides`, the augmented keys become assignable to the
+ * widened branch. `DataAttributesOverrides` is empty by default, so this
+ * widening is a no-op until a consumer opts in.
+ *
+ * Implemented as a union between the original type and the intersected widened
+ * form — `T | (T & DataAttributesOverrides)` — so that pre-typed values remain
+ * assignable to the original branch without having to declare a `data-*`
+ * index signature themselves, while object literals can pick up the widened
+ * branch and include the augmented keys.
+ */
+export type WithDataAttributes<T> = T | (T & DataAttributesOverrides);

package/types/DataAttributes.d.ts

@@ -0,0 +1,45 @@
+/**
+ * Opt-in interface for typing `data-*` attributes on MUI slot props.
+ *
+ * Slot prop types reject arbitrary `data-*` keys by design, so this interface is
+ * empty by default. Augment it to declare the keys you want, and they become
+ * assignable on every slot of every component that routes its slot props through
+ * `@mui/utils/types`.
+ *
+ * Choose the form that matches how strict you want to be:
+ *
+ * - Loose index signature: accepts any `data-*` key, like the underlying DOM
+ *   element. Simplest to set up, but you get no autocomplete and typos slip through.
+ * - Explicit keys: lists each `data-*` key you allow. More to declare up front,
+ *   in return for autocomplete and typo-checking on those keys.
+ *
+ * @example
+ * // Loose: accept any `data-*` key.
+ * declare module '@mui/utils/types' {
+ *   interface DataAttributesOverrides {
+ *     [k: `data-${string}`]: string | number | boolean | undefined;
+ *   }
+ * }
+ *
+ * @example
+ * // Explicit: only the keys you declare, with autocomplete.
+ * declare module '@mui/utils/types' {
+ *   interface DataAttributesOverrides {
+ *     'data-testid'?: string;
+ *   }
+ * }
+ */
+export interface DataAttributesOverrides {}
+/**
+ * Widens a slot-props type so that, when a consumer augments
+ * `DataAttributesOverrides`, the augmented keys become assignable to the
+ * widened branch. `DataAttributesOverrides` is empty by default, so this
+ * widening is a no-op until a consumer opts in.
+ *
+ * Implemented as a union between the original type and the intersected widened
+ * form — `T | (T & DataAttributesOverrides)` — so that pre-typed values remain
+ * assignable to the original branch without having to declare a `data-*`
+ * index signature themselves, while object literals can pick up the widened
+ * branch and include the augmented keys.
+ */
+export type WithDataAttributes<T> = T | (T & DataAttributesOverrides);

package/types/DataAttributes.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/types/DataAttributes.mjs

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

package/types/index.d.mts

@@ -1,7 +1,9 @@
 import * as React from 'react';
+import { WithDataAttributes } from "./DataAttributes.mjs";
+export type { DataAttributesOverrides, WithDataAttributes } from "./DataAttributes.mjs";
 export type EventHandlers = Record<string, React.EventHandler<any>>;
 export type WithOptionalOwnerState<Props extends {
   ownerState: unknown;
 }> = Omit<Props, 'ownerState'> & Partial<Pick<Props, 'ownerState'>>;
-export type SlotComponentProps<TSlotComponent extends React.ElementType, TOverrides, TOwnerState> = (Partial<React.ComponentPropsWithRef<TSlotComponent>> & TOverrides) | ((ownerState: TOwnerState) => Partial<React.ComponentPropsWithRef<TSlotComponent>> & TOverrides);
-export type SlotComponentPropsWithSlotState<TSlotComponent extends React.ElementType, TOverrides, TOwnerState, TSlotState> = (Partial<React.ComponentPropsWithRef<TSlotComponent>> & TOverrides) | ((ownerState: TOwnerState, slotState: TSlotState) => Partial<React.ComponentPropsWithRef<TSlotComponent>> & TOverrides);
+export type SlotComponentProps<TSlotComponent extends React.ElementType, TOverrides, TOwnerState> = WithDataAttributes<Partial<React.ComponentPropsWithRef<TSlotComponent>> & TOverrides> | ((ownerState: TOwnerState) => WithDataAttributes<Partial<React.ComponentPropsWithRef<TSlotComponent>> & TOverrides>);
+export type SlotComponentPropsWithSlotState<TSlotComponent extends React.ElementType, TOverrides, TOwnerState, TSlotState> = WithDataAttributes<Partial<React.ComponentPropsWithRef<TSlotComponent>> & TOverrides> | ((ownerState: TOwnerState, slotState: TSlotState) => WithDataAttributes<Partial<React.ComponentPropsWithRef<TSlotComponent>> & TOverrides>);

package/types/index.d.ts

@@ -1,7 +1,9 @@
 import * as React from 'react';
+import { WithDataAttributes } from "./DataAttributes.js";
+export type { DataAttributesOverrides, WithDataAttributes } from "./DataAttributes.js";
 export type EventHandlers = Record<string, React.EventHandler<any>>;
 export type WithOptionalOwnerState<Props extends {
   ownerState: unknown;
 }> = Omit<Props, 'ownerState'> & Partial<Pick<Props, 'ownerState'>>;
-export type SlotComponentProps<TSlotComponent extends React.ElementType, TOverrides, TOwnerState> = (Partial<React.ComponentPropsWithRef<TSlotComponent>> & TOverrides) | ((ownerState: TOwnerState) => Partial<React.ComponentPropsWithRef<TSlotComponent>> & TOverrides);
-export type SlotComponentPropsWithSlotState<TSlotComponent extends React.ElementType, TOverrides, TOwnerState, TSlotState> = (Partial<React.ComponentPropsWithRef<TSlotComponent>> & TOverrides) | ((ownerState: TOwnerState, slotState: TSlotState) => Partial<React.ComponentPropsWithRef<TSlotComponent>> & TOverrides);
+export type SlotComponentProps<TSlotComponent extends React.ElementType, TOverrides, TOwnerState> = WithDataAttributes<Partial<React.ComponentPropsWithRef<TSlotComponent>> & TOverrides> | ((ownerState: TOwnerState) => WithDataAttributes<Partial<React.ComponentPropsWithRef<TSlotComponent>> & TOverrides>);
+export type SlotComponentPropsWithSlotState<TSlotComponent extends React.ElementType, TOverrides, TOwnerState, TSlotState> = WithDataAttributes<Partial<React.ComponentPropsWithRef<TSlotComponent>> & TOverrides> | ((ownerState: TOwnerState, slotState: TSlotState) => WithDataAttributes<Partial<React.ComponentPropsWithRef<TSlotComponent>> & TOverrides>);

package/useEventCallback/useEventCallback.d.mts

@@ -1,5 +1,5 @@
 /**
- * Inspired by https://github.com/facebook/react/issues/14099#issuecomment-440013892
+ * Inspired by https://github.com/react/react/issues/14099#issuecomment-440013892
  * See RFC in https://github.com/reactjs/rfcs/pull/220
  */
 declare function useEventCallback<Fn extends (...args: any[]) => any = (...args: unknown[]) => unknown>(fn: Fn): Fn;

package/useEventCallback/useEventCallback.d.ts

@@ -1,5 +1,5 @@
 /**
- * Inspired by https://github.com/facebook/react/issues/14099#issuecomment-440013892
+ * Inspired by https://github.com/react/react/issues/14099#issuecomment-440013892
  * See RFC in https://github.com/reactjs/rfcs/pull/220
  */
 declare function useEventCallback<Fn extends (...args: any[]) => any = (...args: unknown[]) => unknown>(fn: Fn): Fn;

package/useEventCallback/useEventCallback.js

@@ -10,7 +10,7 @@ exports.default = void 0;
 var React = _interopRequireWildcard(require("react"));
 var _useEnhancedEffect = _interopRequireDefault(require("../useEnhancedEffect"));
 /**
- * Inspired by https://github.com/facebook/react/issues/14099#issuecomment-440013892
+ * Inspired by https://github.com/react/react/issues/14099#issuecomment-440013892
  * See RFC in https://github.com/reactjs/rfcs/pull/220
  */
 

package/useEventCallback/useEventCallback.mjs

@@ -4,7 +4,7 @@ import * as React from 'react';
 import useEnhancedEffect from "../useEnhancedEffect/index.mjs";
 
 /**
- * Inspired by https://github.com/facebook/react/issues/14099#issuecomment-440013892
+ * Inspired by https://github.com/react/react/issues/14099#issuecomment-440013892
  * See RFC in https://github.com/reactjs/rfcs/pull/220
  */
 

package/useForkRef/useForkRef.js

@@ -44,7 +44,7 @@ function useForkRef(...refs) {
     return () => {
       cleanups.forEach(refCleanup => refCleanup?.());
     };
-    // eslint-disable-next-line react-hooks/exhaustive-deps
+    // eslint-disable-next-line react-hooks/exhaustive-deps, react-hooks/use-memo
   }, refs);
   return React.useMemo(() => {
     if (refs.every(ref => ref == null)) {
@@ -60,6 +60,6 @@ function useForkRef(...refs) {
       }
     };
     // TODO: uncomment once we enable eslint-plugin-react-compiler // eslint-disable-next-line react-compiler/react-compiler -- intentionally ignoring that the dependency array must be an array literal
-    // eslint-disable-next-line react-hooks/exhaustive-deps
+    // eslint-disable-next-line react-hooks/exhaustive-deps, react-hooks/use-memo
   }, refs);
 }

package/useForkRef/useForkRef.mjs

@@ -39,7 +39,7 @@ export default function useForkRef(...refs) {
     return () => {
       cleanups.forEach(refCleanup => refCleanup?.());
     };
-    // eslint-disable-next-line react-hooks/exhaustive-deps
+    // eslint-disable-next-line react-hooks/exhaustive-deps, react-hooks/use-memo
   }, refs);
   return React.useMemo(() => {
     if (refs.every(ref => ref == null)) {
@@ -55,6 +55,6 @@ export default function useForkRef(...refs) {
       }
     };
     // TODO: uncomment once we enable eslint-plugin-react-compiler // eslint-disable-next-line react-compiler/react-compiler -- intentionally ignoring that the dependency array must be an array literal
-    // eslint-disable-next-line react-hooks/exhaustive-deps
+    // eslint-disable-next-line react-hooks/exhaustive-deps, react-hooks/use-memo
   }, refs);
 }

package/useId/useId.js

@@ -20,6 +20,7 @@ function useGlobalId(idOverride) {
       // We can't use it server-side.
       // If you want to use random values please consider the Birthday Problem: https://en.wikipedia.org/wiki/Birthday_problem
       globalId += 1;
+      // eslint-disable-next-line react-hooks/set-state-in-effect
       setDefaultId(`mui-${globalId}`);
     }
   }, [defaultId]);

package/useId/useId.mjs

@@ -14,6 +14,7 @@ function useGlobalId(idOverride) {
       // We can't use it server-side.
       // If you want to use random values please consider the Birthday Problem: https://en.wikipedia.org/wiki/Birthday_problem
       globalId += 1;
+      // eslint-disable-next-line react-hooks/set-state-in-effect
       setDefaultId(`mui-${globalId}`);
     }
   }, [defaultId]);

package/useIsFocusVisible/useIsFocusVisible.js

@@ -134,8 +134,8 @@ function useIsFocusVisible() {
     // checking against potential state variable does not suffice if we focus and blur synchronously.
     // React wouldn't have time to trigger a re-render so `focusVisible` would be stale.
     // Ideally we would adjust `isFocusVisible(event)` to look at `relatedTarget` for blur events.
-    // This doesn't work in IE 11 due to https://github.com/facebook/react/issues/3751
-    // TODO: check again if React releases their internal changes to focus event handling (https://github.com/facebook/react/pull/19186).
+    // This doesn't work in IE 11 due to https://github.com/react/react/issues/3751
+    // TODO: check again if React releases their internal changes to focus event handling (https://github.com/react/react/pull/19186).
     if (isFocusVisibleRef.current) {
       // To detect a tab/window switch, we look for a blur event followed
       // rapidly by a visibility change.

package/useIsFocusVisible/useIsFocusVisible.mjs

@@ -127,8 +127,8 @@ export default function useIsFocusVisible() {
     // checking against potential state variable does not suffice if we focus and blur synchronously.
     // React wouldn't have time to trigger a re-render so `focusVisible` would be stale.
     // Ideally we would adjust `isFocusVisible(event)` to look at `relatedTarget` for blur events.
-    // This doesn't work in IE 11 due to https://github.com/facebook/react/issues/3751
-    // TODO: check again if React releases their internal changes to focus event handling (https://github.com/facebook/react/pull/19186).
+    // This doesn't work in IE 11 due to https://github.com/react/react/issues/3751
+    // TODO: check again if React releases their internal changes to focus event handling (https://github.com/react/react/pull/19186).
     if (isFocusVisibleRef.current) {
       // To detect a tab/window switch, we look for a blur event followed
       // rapidly by a visibility change.