@mui/utils 9.0.1 → 9.1.0

package/CHANGELOG.md

@@ -1,5 +1,89 @@
 # [Versions](https://mui.com/material-ui/getting-started/versions/)
 
+## 9.1.0
+
+<!-- generated comparing v9.0.1..master -->
+
+_Jun 8, 2026_
+
+A big thanks to the 15 contributors who made this release possible. Here are some highlights ✨:
+
+- ⚙️ Support for the [prefers-reduced-motion](https://mui.com/material-ui/transitions/#reduced-motion) setting.
+- ♿️ Improved support for Windows High Contrast mode with the [enhanceHighContrast](https://mui.com/material-ui/customization/palette/#windows-high-contrast-mode) theme wrapper.
+
+### `@mui/material@9.1.0`
+
+- [autocomplete] Enable clearing highlight when mouse leaves popup (#48354) @mj12albert
+- [autocomplete] Fix `freeSolo` controlled values cleared by initial `null` (#48611) @mj12albert
+- [autocomplete] Fix item removal when it receives focus from VoiceOver before using Backspace (#48572) @silviuaavram
+- [autocomplete] Fix `resetHighlightOnMouseLeave` JSdoc (#48536) @mj12albert
+- [autocomplete] Guard against null inputRef during unmount (#48617) @noam3127
+- [badge] Add `aria-hidden` to badge content and polish docs demos (#48471) @mj12albert
+- [badge] Use inline CSS variables for anchorOrigin/overlap positioning (#48549) @siriwatknp
+- [button] Fix customized flex gap styles (#48542) @mj12albert
+- [dialog] Fix unwanted `DialogPaper` focus ring (#48535) @mj12albert
+- [focus trap] Fix incorrect tab order when `tabIndex >= 1` (#48546) @mj12albert
+- [progress] Show runtime errors only once (#48591) @silviuaavram
+- [select] Allow spacebar to select elements (#48615) @silviuaavram
+- [select] Support typeahead when closed (#48563) @mj12albert
+- [step button] Choose higher contrast ripple color for dark mode focus (#48612) @silviuaavram
+- [stepper] Include StepConnector inside Step element (#48492) @silviuaavram
+- [stepper] Proper support for vertical alternativeLabel (#48485) @silviuaavram
+- [tabs] Fix React 18 roving tabindex and dedupe invalid-value warning (#48605) @Janpot
+- [theme] Add HighContrast theme enhancer (#48319) @silviuaavram
+- [timeline item] Fix extra ::before spacing when TimelineOppositeContent is present (#46663) @tyalau
+- [tooltip] Prevent stuck-open tooltip when child becomes disabled (#48606) @Janpot
+- [transitions] Custom `Transition` component (#48325) @mj12albert
+- [transitions] Support `prefers-reduced-motion` (#48357) @mj12albert
+
+### `@mui/utils@9.1.0`
+
+- [utils] Prevent prototype pollution in fastDeepAssign (#48580) @Janpot
+
+### Docs
+
+- [docs] Add function `slotProps` documentation (#48574) @mj12albert
+- [docs] Clarify styled-components version compatibility (#48533) @nightt5879
+- [docs] Fix broken URLs (#48520) @oliviertassinari
+- [docs] Fix invalid JSON in Zed MCP setup example (#48490) @pavan-sh
+- [docs] Mention release version for enhanceHighContrast (#48609) @silviuaavram
+- [docs] Remove outdated MUI X v8 notification (#48600) @cherniavskii
+- [docs] Remove redundant enhanceHighContrast information (#48632) @silviuaavram
+- [docs-infra] Decrease loaded bundle size on docs (#48584) @brijeshb42
+- [docs-infra] Drop multi-locale plumbing from API pages (#48370) @brijeshb42
+- [docs-infra] Fix Cookie banner heading (#48529) @oliviertassinari
+- [docs-infra] Infinitely cache all static assets (#48627) @brijeshb42
+- [docs-infra] Remove outdated noSEOadvantage entries (#48527) @oliviertassinari
+- [docs-infra] Restore build-only invariant throws via `NEXT_RUNTIME` guard (#48475) @Janpot
+- [docs-infra] Test HTML validation in broken links checker (#48088) @Janpot
+- [docs][icons] Fix Font Awesome Chip demo in dark mode (#48576) @siriwatknp
+- [docs][icons] Remove redundant font awesome demo (#48493) @ZeeshanTamboli
+- [docs][modal] Add nested modal guidance (#46507) @JakeSaterlay
+- [docs][stepper] Fix focus management in examples (#48494) @silviuaavram
+
+### Core
+
+- Eslint markdown (#48371) @Janpot
+- [agents] Fix some docs links (#48561) @silviuaavram
+- [blog] Copy editing improvement on v9 announcement blog posts (#48543) @joserodolfofreitas
+- [code-infra] Cleanup unused jss packages (#48590) @brijeshb42
+- [code-infra] Collapse canary workflows into nightly and nightly-cron (#48556) @Janpot
+- [code-infra] Convert @mui/private-theming to TypeScript (#48565) @Janpot
+- [code-infra] Convert @mui/styled-engine to TypeScript (#48544) @Janpot
+- [code-infra] Convert @mui/styled-engine-sc to TypeScript (#48577) @Janpot
+- [code-infra] Fix duplicate resource_class in test_regressions CI job (#48601) @LukasTy
+- [code-infra] Make @mui/internal-docs-utils compatible with TypeScript 6 (#48594) @Janpot
+- [code-infra] Migrate CircleCI jobs to Gen2 resource classes (#48593) @LukasTy
+- [code-infra] Parallelize visual regression screenshots (#48557) @Janpot
+- [code-infra] Run nightly-cron on v7.x (#48579) @Janpot
+- [core] Fix typescript@next typecheck (#48587) @Janpot
+- [pnpm] Add security settings to pnpm-workspace.yaml (#48582) @Janpot
+- [styled-engine-sc] Fix compatibility with Vite and Vitest (#48558) @mj12albert
+- [test] Add axe-core tests for mui-material (#48341) @siriwatknp
+- [test] Configure Tailwind CSS in the visual-regression app (#48575) @Janpot
+
+All contributors of this release in alphabetical order: @brijeshb42, @cherniavskii, @JakeSaterlay, @Janpot, @joserodolfofreitas, @LukasTy, @mj12albert, @nightt5879, @noam3127, @oliviertassinari, @pavan-sh, @silviuaavram, @siriwatknp, @tyalau, @ZeeshanTamboli
+
 ## 9.0.1
 
 <!-- generated comparing v9.0.0..master -->

package/LICENSE

@@ -1,4 +1,4 @@
-The MIT License (MIT)
+MIT License
 
 Copyright (c) 2014 Call-Em-All
 

package/fastDeepAssign/fastDeepAssign.js

@@ -9,7 +9,6 @@ exports.default = fastDeepAssign;
 // MIT License
 // Copyright (c) 2012 - 2022 James Halliday, Josh Duff, and other contributors of deepmerge
 
-/* eslint-disable guard-for-in */
 /* eslint-disable no-else-return */
 
 /**
@@ -43,6 +42,9 @@ function cloneArray(value) {
 function cloneObject(target) {
   const result = {};
   for (const key in target) {
+    if (key === '__proto__' || key === 'constructor' || key === 'prototype') {
+      continue;
+    }
     result[key] = clone(target[key]);
   }
   return result;
@@ -69,6 +71,9 @@ function clone(entry) {
 }
 function mergeObject(target, source) {
   for (const key in source) {
+    if (key === '__proto__' || key === 'constructor' || key === 'prototype') {
+      continue;
+    }
     if (key in target) {
       target[key] = fastDeepAssign(target[key], source[key]);
     } else {

package/fastDeepAssign/fastDeepAssign.mjs

@@ -3,7 +3,6 @@
 // MIT License
 // Copyright (c) 2012 - 2022 James Halliday, Josh Duff, and other contributors of deepmerge
 
-/* eslint-disable guard-for-in */
 /* eslint-disable no-else-return */
 
 /**
@@ -37,6 +36,9 @@ function cloneArray(value) {
 function cloneObject(target) {
   const result = {};
   for (const key in target) {
+    if (key === '__proto__' || key === 'constructor' || key === 'prototype') {
+      continue;
+    }
     result[key] = clone(target[key]);
   }
   return result;
@@ -63,6 +65,9 @@ function clone(entry) {
 }
 function mergeObject(target, source) {
   for (const key in source) {
+    if (key === '__proto__' || key === 'constructor' || key === 'prototype') {
+      continue;
+    }
     if (key in target) {
       target[key] = fastDeepAssign(target[key], source[key]);
     } else {

package/index.d.mts

@@ -35,6 +35,7 @@ export { default as unstable_useTimeout, Timeout as unstable_Timeout } from "./u
 export { default as unstable_useOnMount } from "./useOnMount/index.mjs";
 export { default as unstable_useIsFocusVisible } from "./useIsFocusVisible/index.mjs";
 export { default as unstable_useForcedRerendering } from "./useForcedRerendering/index.mjs";
+export { default as unstable_useValueAsRef } from "./useValueAsRef/index.mjs";
 export { default as unstable_isFocusVisible } from "./isFocusVisible/index.mjs";
 export { default as unstable_getScrollbarSize } from "./getScrollbarSize/index.mjs";
 export { default as usePreviousProps } from "./usePreviousProps/index.mjs";

package/index.d.ts

@@ -35,6 +35,7 @@ export { default as unstable_useTimeout, Timeout as unstable_Timeout } from "./u
 export { default as unstable_useOnMount } from "./useOnMount/index.js";
 export { default as unstable_useIsFocusVisible } from "./useIsFocusVisible/index.js";
 export { default as unstable_useForcedRerendering } from "./useForcedRerendering/index.js";
+export { default as unstable_useValueAsRef } from "./useValueAsRef/index.js";
 export { default as unstable_isFocusVisible } from "./isFocusVisible/index.js";
 export { default as unstable_getScrollbarSize } from "./getScrollbarSize/index.js";
 export { default as usePreviousProps } from "./usePreviousProps/index.js";

package/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/utils v9.0.1
+ * @mui/utils v9.1.0
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the
@@ -51,6 +51,7 @@ var _exportNames = {
   unstable_useOnMount: true,
   unstable_useIsFocusVisible: true,
   unstable_useForcedRerendering: true,
+  unstable_useValueAsRef: true,
   unstable_isFocusVisible: true,
   unstable_getScrollbarSize: true,
   usePreviousProps: true,
@@ -401,6 +402,12 @@ Object.defineProperty(exports, "unstable_useTimeout", {
     return _useTimeout.default;
   }
 });
+Object.defineProperty(exports, "unstable_useValueAsRef", {
+  enumerable: true,
+  get: function () {
+    return _useValueAsRef.default;
+  }
+});
 Object.defineProperty(exports, "usePreviousProps", {
   enumerable: true,
   get: function () {
@@ -449,6 +456,7 @@ var _useTimeout = _interopRequireWildcard(require("./useTimeout"));
 var _useOnMount = _interopRequireDefault(require("./useOnMount"));
 var _useIsFocusVisible = _interopRequireDefault(require("./useIsFocusVisible"));
 var _useForcedRerendering = _interopRequireDefault(require("./useForcedRerendering"));
+var _useValueAsRef = _interopRequireDefault(require("./useValueAsRef"));
 var _isFocusVisible = _interopRequireDefault(require("./isFocusVisible"));
 var _getScrollbarSize = _interopRequireDefault(require("./getScrollbarSize"));
 var _usePreviousProps = _interopRequireDefault(require("./usePreviousProps"));

package/index.mjs

@@ -1,5 +1,5 @@
 /**
- * @mui/utils v9.0.1
+ * @mui/utils v9.1.0
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the
@@ -42,6 +42,7 @@ export { default as unstable_useTimeout, Timeout as unstable_Timeout } from "./u
 export { default as unstable_useOnMount } from "./useOnMount/index.mjs";
 export { default as unstable_useIsFocusVisible } from "./useIsFocusVisible/index.mjs";
 export { default as unstable_useForcedRerendering } from "./useForcedRerendering/index.mjs";
+export { default as unstable_useValueAsRef } from "./useValueAsRef/index.mjs";
 export { default as unstable_isFocusVisible } from "./isFocusVisible/index.mjs";
 export { default as unstable_getScrollbarSize } from "./getScrollbarSize/index.mjs";
 export { default as usePreviousProps } from "./usePreviousProps/index.mjs";

package/isHostComponent/isHostComponent.d.mts

@@ -2,5 +2,5 @@ import * as React from 'react';
 /**
  * Determines if a given element is a DOM element name (i.e. not a React component).
  */
-declare function isHostComponent(element: React.ElementType): element is "symbol" | "object" | "search" | "big" | "link" | "small" | "sub" | "sup" | "map" | "filter" | "input" | "set" | "base" | "code" | "data" | "time" | "progress" | "stop" | "track" | "source" | "button" | "address" | "center" | "view" | "clipPath" | "marker" | "mask" | "a" | "abbr" | "area" | "article" | "aside" | "audio" | "b" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "canvas" | "caption" | "cite" | "col" | "colgroup" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "ins" | "kbd" | "label" | "legend" | "li" | "main" | "mark" | "menu" | "meta" | "meter" | "nav" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "picture" | "pre" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "script" | "section" | "select" | "slot" | "span" | "strong" | "style" | "summary" | "table" | "tbody" | "td" | "template" | "textarea" | "tfoot" | "th" | "thead" | "title" | "tr" | "u" | "ul" | "var" | "video" | "wbr" | "keygen" | "menuitem" | "param" | "animate" | "animateMotion" | "animateTransform" | "circle" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "svg" | "switch" | "text" | "textPath" | "tspan" | "use" | "noindex" | "webview";
+declare function isHostComponent(element: React.ElementType): element is "symbol" | "object" | "search" | "big" | "link" | "small" | "sub" | "sup" | "map" | "filter" | "input" | "set" | "base" | "code" | "data" | "time" | "source" | "progress" | "stop" | "track" | "button" | "address" | "center" | "view" | "clipPath" | "marker" | "mask" | "a" | "abbr" | "area" | "article" | "aside" | "audio" | "b" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "canvas" | "caption" | "cite" | "col" | "colgroup" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "ins" | "kbd" | "label" | "legend" | "li" | "main" | "mark" | "menu" | "meta" | "meter" | "nav" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "picture" | "pre" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "script" | "section" | "select" | "slot" | "span" | "strong" | "style" | "summary" | "table" | "tbody" | "td" | "template" | "textarea" | "tfoot" | "th" | "thead" | "title" | "tr" | "u" | "ul" | "var" | "video" | "wbr" | "keygen" | "menuitem" | "param" | "animate" | "animateMotion" | "animateTransform" | "circle" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "svg" | "switch" | "text" | "textPath" | "tspan" | "use" | "noindex" | "webview";
 export default isHostComponent;

package/isHostComponent/isHostComponent.d.ts

@@ -2,5 +2,5 @@ import * as React from 'react';
 /**
  * Determines if a given element is a DOM element name (i.e. not a React component).
  */
-declare function isHostComponent(element: React.ElementType): element is "symbol" | "object" | "search" | "big" | "link" | "small" | "sub" | "sup" | "map" | "filter" | "input" | "set" | "base" | "code" | "data" | "time" | "progress" | "stop" | "track" | "source" | "button" | "address" | "center" | "view" | "clipPath" | "marker" | "mask" | "a" | "abbr" | "area" | "article" | "aside" | "audio" | "b" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "canvas" | "caption" | "cite" | "col" | "colgroup" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "ins" | "kbd" | "label" | "legend" | "li" | "main" | "mark" | "menu" | "meta" | "meter" | "nav" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "picture" | "pre" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "script" | "section" | "select" | "slot" | "span" | "strong" | "style" | "summary" | "table" | "tbody" | "td" | "template" | "textarea" | "tfoot" | "th" | "thead" | "title" | "tr" | "u" | "ul" | "var" | "video" | "wbr" | "keygen" | "menuitem" | "param" | "animate" | "animateMotion" | "animateTransform" | "circle" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "svg" | "switch" | "text" | "textPath" | "tspan" | "use" | "noindex" | "webview";
+declare function isHostComponent(element: React.ElementType): element is "symbol" | "object" | "search" | "big" | "link" | "small" | "sub" | "sup" | "map" | "filter" | "input" | "set" | "base" | "code" | "data" | "time" | "source" | "progress" | "stop" | "track" | "button" | "address" | "center" | "view" | "clipPath" | "marker" | "mask" | "a" | "abbr" | "area" | "article" | "aside" | "audio" | "b" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "canvas" | "caption" | "cite" | "col" | "colgroup" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "ins" | "kbd" | "label" | "legend" | "li" | "main" | "mark" | "menu" | "meta" | "meter" | "nav" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "picture" | "pre" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "script" | "section" | "select" | "slot" | "span" | "strong" | "style" | "summary" | "table" | "tbody" | "td" | "template" | "textarea" | "tfoot" | "th" | "thead" | "title" | "tr" | "u" | "ul" | "var" | "video" | "wbr" | "keygen" | "menuitem" | "param" | "animate" | "animateMotion" | "animateTransform" | "circle" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "svg" | "switch" | "text" | "textPath" | "tspan" | "use" | "noindex" | "webview";
 export default isHostComponent;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/utils",
-  "version": "9.0.1",
+  "version": "9.1.0",
   "author": "MUI Team",
   "description": "Utility functions for React components.",
   "license": "MIT",
@@ -28,7 +28,7 @@
     "@types/prop-types": "^15.7.15",
     "clsx": "^2.1.1",
     "prop-types": "^15.8.1",
-    "react-is": "^19.2.4",
+    "react-is": "^19.2.6",
     "@mui/types": "^9.0.0"
   },
   "peerDependencies": {
@@ -904,6 +904,20 @@
         "default": "./useTimeout/index.mjs"
       }
     },
+    "./useValueAsRef": {
+      "import": {
+        "types": "./useValueAsRef/index.d.mts",
+        "default": "./useValueAsRef/index.mjs"
+      },
+      "require": {
+        "types": "./useValueAsRef/index.d.ts",
+        "default": "./useValueAsRef/index.js"
+      },
+      "default": {
+        "types": "./useValueAsRef/index.d.mts",
+        "default": "./useValueAsRef/index.mjs"
+      }
+    },
     "./visuallyHidden": {
       "import": {
         "types": "./visuallyHidden/index.d.mts",

package/useRovingTabIndex/useRovingTabIndex.js

@@ -36,10 +36,10 @@ function useRovingTabIndexRoot(params) {
     wrap = true
   } = params;
   const [activeItemIdState, setActiveItemIdState] = React.useState(activeItemIdProp);
-  const previousActiveItemIdPropRef = React.useRef(activeItemIdProp);
+  const [previousActiveItemIdProp, setPreviousActiveItemIdProp] = React.useState(activeItemIdProp);
   let activeItemIdCandidate = activeItemIdState;
-  if (activeItemIdProp !== previousActiveItemIdPropRef.current) {
-    previousActiveItemIdPropRef.current = activeItemIdProp;
+  if (activeItemIdProp !== previousActiveItemIdProp) {
+    setPreviousActiveItemIdProp(activeItemIdProp);
     if (activeItemIdProp !== undefined && activeItemIdProp !== activeItemIdState) {
       activeItemIdCandidate = activeItemIdProp;
       setActiveItemIdState(activeItemIdProp);

package/useRovingTabIndex/useRovingTabIndex.mjs

@@ -27,10 +27,10 @@ export function useRovingTabIndexRoot(params) {
     wrap = true
   } = params;
   const [activeItemIdState, setActiveItemIdState] = React.useState(activeItemIdProp);
-  const previousActiveItemIdPropRef = React.useRef(activeItemIdProp);
+  const [previousActiveItemIdProp, setPreviousActiveItemIdProp] = React.useState(activeItemIdProp);
   let activeItemIdCandidate = activeItemIdState;
-  if (activeItemIdProp !== previousActiveItemIdPropRef.current) {
-    previousActiveItemIdPropRef.current = activeItemIdProp;
+  if (activeItemIdProp !== previousActiveItemIdProp) {
+    setPreviousActiveItemIdProp(activeItemIdProp);
     if (activeItemIdProp !== undefined && activeItemIdProp !== activeItemIdState) {
       activeItemIdCandidate = activeItemIdProp;
       setActiveItemIdState(activeItemIdProp);

package/useValueAsRef/index.d.mts

@@ -0,0 +1 @@
+export { default } from "./useValueAsRef.mjs";

package/useValueAsRef/index.d.ts

@@ -0,0 +1 @@
+export { default } from "./useValueAsRef.js";

package/useValueAsRef/index.js

@@ -0,0 +1,13 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function () {
+    return _useValueAsRef.default;
+  }
+});
+var _useValueAsRef = _interopRequireDefault(require("./useValueAsRef"));

package/useValueAsRef/index.mjs

@@ -0,0 +1 @@
+export { default } from "./useValueAsRef.mjs";

package/useValueAsRef/useValueAsRef.d.mts

@@ -0,0 +1,14 @@
+interface ValueRef<T> {
+  current: T;
+  next: T;
+  effect: () => void;
+}
+/**
+ * Copied from `@base-ui/utils/useValueAsRef`.
+ *
+ * Stores the latest value in a stable ref. The ref updates after React commits,
+ * so effects and delayed callbacks can read the current value without depending
+ * on it and rerunning.
+ */
+export default function useValueAsRef<T>(value: T): ValueRef<T>;
+export {};

package/useValueAsRef/useValueAsRef.d.ts

@@ -0,0 +1,14 @@
+interface ValueRef<T> {
+  current: T;
+  next: T;
+  effect: () => void;
+}
+/**
+ * Copied from `@base-ui/utils/useValueAsRef`.
+ *
+ * Stores the latest value in a stable ref. The ref updates after React commits,
+ * so effects and delayed callbacks can read the current value without depending
+ * on it and rerunning.
+ */
+export default function useValueAsRef<T>(value: T): ValueRef<T>;
+export {};

package/useValueAsRef/useValueAsRef.js

@@ -0,0 +1,35 @@
+"use strict";
+'use client';
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = useValueAsRef;
+var _useEnhancedEffect = _interopRequireDefault(require("../useEnhancedEffect/useEnhancedEffect"));
+var _useLazyRef = _interopRequireDefault(require("../useLazyRef/useLazyRef"));
+/**
+ * Copied from `@base-ui/utils/useValueAsRef`.
+ *
+ * Stores the latest value in a stable ref. The ref updates after React commits,
+ * so effects and delayed callbacks can read the current value without depending
+ * on it and rerunning.
+ */
+function useValueAsRef(value) {
+  const latest = (0, _useLazyRef.default)(() => createValueRef(value)).current;
+  latest.next = value;
+
+  // eslint-disable-next-line react-hooks/exhaustive-deps -- effect never changes; it reads latest.next.
+  (0, _useEnhancedEffect.default)(latest.effect);
+  return latest;
+}
+function createValueRef(value) {
+  const latest = {
+    current: value,
+    next: value,
+    effect: () => {
+      latest.current = latest.next;
+    }
+  };
+  return latest;
+}

package/useValueAsRef/useValueAsRef.mjs

@@ -0,0 +1,29 @@
+'use client';
+
+import useEnhancedEffect from "../useEnhancedEffect/useEnhancedEffect.mjs";
+import useLazyRef from "../useLazyRef/useLazyRef.mjs";
+/**
+ * Copied from `@base-ui/utils/useValueAsRef`.
+ *
+ * Stores the latest value in a stable ref. The ref updates after React commits,
+ * so effects and delayed callbacks can read the current value without depending
+ * on it and rerunning.
+ */
+export default function useValueAsRef(value) {
+  const latest = useLazyRef(() => createValueRef(value)).current;
+  latest.next = value;
+
+  // eslint-disable-next-line react-hooks/exhaustive-deps -- effect never changes; it reads latest.next.
+  useEnhancedEffect(latest.effect);
+  return latest;
+}
+function createValueRef(value) {
+  const latest = {
+    current: value,
+    next: value,
+    effect: () => {
+      latest.current = latest.next;
+    }
+  };
+  return latest;
+}