@mui/utils 5.1.1 → 5.2.0

package/CHANGELOG.md

@@ -1,5 +1,87 @@
 ### [Versions](https://mui.com/versions/)
 
+## 5.2.0
+
+<!-- generated comparing v5.1.1..master -->
+
+_Nov 23, 2021_
+
+A big thanks to the 18 contributors who made this release possible. Here are some highlights ✨:
+
+- 🧪 Created another unstyled component: [TabsUnstyled](https://mui.com/components/tabs/#unstyled) (#29597) @mnajdova.
+- 🎉 Updated the Material Icons set with the latest changes from Google (#29328) @michaldudak / (#29818) @chao813.
+  This update adds 200 new icons and tweaks the appearance of many more.
+  With it, we're getting close to having 2000 icons in our set.
+- 🐛 Fixed bugs and improved the infrastructure and documentation 📚.
+
+### `@mui/material@5.2.0`
+
+- [IconButton] Remove on hover effect when `disableRipple` is set (#29298) @adamfitzgibbon
+- [i18n] Add the amharic language (#29153) @NatiG100
+- [material] Fix types for `variants.style` to accept callbacks (#29610) @mnajdova
+- [Popper] Simplify prop types (#29680) @michaldudak
+- [Select] Include aria-selected=false when option not selected (#29695) @michaldudak
+- [useMediaQuery] Fix crash in Safari < 14 and IE 11 (#29776) @eps1lon
+- [useMediaQuery] Ensure no tearing in React 18 (#28491) @eps1lon
+
+### `@mui/codemod@5.2.0`
+
+- [codemod] Fix `jss-to-styled` to support multiple withStyles (#29824) @siriwatknp
+
+### `@mui/icons-material@5.2.0`
+
+- [icons] Sync new Google Material Icons (#29818) @chao813
+- [icons] Sync recent Material Icons from Google (#29328) @michaldudak
+
+### `@mui/system@5.2.0`
+
+- [Box] Fix `sx` prop runtime issue when used as function (#29830) @mnajdova
+- [system] Fix `sx` throw error when value is `null` or `undefined` (#29756) @siriwatknp
+- [system] Fix minor CssVars issues (#29747) @siriwatknp
+
+### `@mui/styled-engine@5.2.0`
+
+- [styled-engine] Fix props inference in styled-engine (#29739) @Janpot
+
+### `@mui/base@5.0.0-alpha.56`
+
+- [FormControlUnstyled] `focused` is always false unless explicitly set to `true` @mwilkins91
+- [TabsUnstyled] Introduce new component (#29597) @mnajdova
+
+### `@mui/lab@5.0.0-alpha.56`
+
+- [DatePicker][timepicker] Add missing component declarations (#29517) @longzheng
+- [Masonry] exports from root package (#29754) @abhinav-22-tech
+- [pickers] Widen accepted `luxon` version range (#29761) @eps1lon
+
+### Docs
+
+- [blog] MUI X v5 blog post (#29590) @DanailH
+- [blog] Polish the Benny Joo joins MUI post (#29697) @oliviertassinari
+- [CHANGELOG] Explain why we do breaking changes @oliviertassinari
+- [core] Update latest issue template for codesandbox CI (#29783) @eps1lon
+- [core] Ensure `@mui/core` is an alias for `@mui/base` (#29762) @eps1lon
+- [docs] Fix broken Next and Previous links (#29711) @scallaway
+- [docs] Add a note that ToggleButton exclusive does not enforce selection (#29812) @mmacu
+- [docs] Update the list of supported locales (#29831) @michaldudak
+- [docs] Update tooltip doc to better define touch action (#29717) @gnowland
+- [website] Standardize the background color from the MUI team photos (#29738) @danilo-leal
+- [website] Add Bharat to the About Us Page (#29714) @bharatkashyap
+- [website] Add about page entry for jan (#29701) @Janpot
+- [website] Adding Prakhar to the about page (#29737) @danilo-leal
+
+### Core
+
+- [test] Allow debugging with Chrome and VSCode inspector (#29777) @eps1lon
+- [test] Use renderer clock instead of custom useFakeTimers call (#29778) @eps1lon
+- [test] Only mock Date in regression tests (#29763) @eps1lon
+- [test] Disable nightly integration tests on `next` branch (#29748) @eps1lon
+- [test] Allow configuring clock directly from `createRenderer` (#29684) @eps1lon
+- [test] Accept backslashes as path separators in test CLI (#29694) @michaldudak
+- [utils] Use built-in hook when available for useId (#26489) @eps1lon
+
+All contributors of this release in alphabetical order: @abhinav-22-tech, @adamfitzgibbon, @bharatkashyap, @chao813, @DanailH, @danilo-leal, @eps1lon, @gnowland, @Janpot, @longzheng, @michaldudak, @mmacu, @mnajdova, @mwilkins91, @NatiG100, @oliviertassinari, @scallaway, @siriwatknp
+
 ## 5.1.1
 
 <!-- generated comparing v5.1.0..master -->
@@ -8,7 +90,7 @@ _Nov 16, 2021_
 
 A big thanks to the 15 contributors who made this release possible. Here are some highlights ✨:
 
-- 🛠 Rename `@mui/core` to `@mui/base`. (#29585) @michaldudak
+- 🛠 Renamed `@mui/core` to `@mui/base` (#29585) @michaldudak.
 - And many more 🐛 bug fixes and 📚 improvements.
 
 ### `@mui/material@5.1.1`
@@ -22,10 +104,19 @@ A big thanks to the 15 contributors who made this release possible. Here are som
 
 ### `@mui/base@5.0.0-alpha.55`
 
-#### BREAKING CHANGE
+#### Breaking changes
 
 - &#8203;<!-- 27 -->[core] Rename mui/core to mui/base (#29585) @michaldudak
 
+  Based on the results of the [poll](https://twitter.com/michaldudak/status/1452630484706635779) and our internal discussions, we decided to rename the `@mui/core` package to `@mui/base`. The main rationale for this is the fact that we use the term "Core" to refer to the core components product family, the one that includes Material Design components, unstyled components, System utilities, etc. Therefore, @mui/core was effectively a subset of MUI Core. This was confusing.
+
+  The new name better reflects the purpose of the package: it contains unstyled components, hooks, and utilities that serve as a **base** to build on.
+
+  ```diff
+  -import { useSwitch } from '@mui/core/SwitchUnstyled';
+  +import { useSwitch } from '@mui/base/SwitchUnstyled';
+  ```
+
 ### `@mui/lab@5.0.0-alpha.55`
 
 - &#8203;<!-- 12 -->[LoadingButton] Text variant spacing fixed for both start and end (#29194) @joshua-lawrence

package/HTMLElementType.d.ts

@@ -1,3 +1,3 @@
-export default function HTMLElementType(props: {
-    [key: string]: unknown;
-}, propName: string, componentName: string, location: string, propFullName: string): Error | null;
+export default function HTMLElementType(props: {
+    [key: string]: unknown;
+}, propName: string, componentName: string, location: string, propFullName: string): Error | null;

package/chainPropTypes.d.ts

@@ -1,2 +1,2 @@
-import PropTypes from 'prop-types';
-export default function chainPropTypes<A, B>(propType1: PropTypes.Validator<A>, propType2: PropTypes.Validator<B>): PropTypes.Validator<A & B>;
+import PropTypes from 'prop-types';
+export default function chainPropTypes<A, B>(propType1: PropTypes.Validator<A>, propType2: PropTypes.Validator<B>): PropTypes.Validator<A & B>;

package/createChainedFunction.d.ts

@@ -1,7 +1,7 @@
-/**
- * Safe chained function.
- *
- * Will only create a new function if needed,
- * otherwise will pass back existing functions or null.
- */
-export default function createChainedFunction<Args extends any[], This>(...funcs: Array<(this: This, ...args: Args) => any>): (this: This, ...args: Args) => void;
+/**
+ * Safe chained function.
+ *
+ * Will only create a new function if needed,
+ * otherwise will pass back existing functions or null.
+ */
+export default function createChainedFunction<Args extends any[], This>(...funcs: Array<(this: This, ...args: Args) => any>): (this: This, ...args: Args) => void;

package/deepmerge.d.ts

@@ -1,5 +1,5 @@
-export declare function isPlainObject(item: unknown): item is Record<keyof any, unknown>;
-export interface DeepmergeOptions {
-    clone?: boolean;
-}
-export default function deepmerge<T>(target: T, source: unknown, options?: DeepmergeOptions): T;
+export declare function isPlainObject(item: unknown): item is Record<keyof any, unknown>;
+export interface DeepmergeOptions {
+    clone?: boolean;
+}
+export default function deepmerge<T>(target: T, source: unknown, options?: DeepmergeOptions): T;

package/deepmerge.js

@@ -11,9 +11,7 @@ exports.isPlainObject = isPlainObject;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 
 function isPlainObject(item) {
-  return item !== null && typeof item === 'object' && // TS thinks `item is possibly null` even though this was our first guard.
-  // @ts-expect-error
-  item.constructor === Object;
+  return item !== null && typeof item === 'object' && item.constructor === Object;
 }
 
 function deepmerge(target, source, options = {

package/elementAcceptingRef.d.ts

@@ -1,3 +1,3 @@
-import PropTypes from 'prop-types';
-declare const elementAcceptingRef: PropTypes.Requireable<unknown>;
-export default elementAcceptingRef;
+import PropTypes from 'prop-types';
+declare const elementAcceptingRef: PropTypes.Requireable<unknown>;
+export default elementAcceptingRef;

package/elementTypeAcceptingRef.d.ts

@@ -1,3 +1,3 @@
-import PropTypes from 'prop-types';
-declare const _default: PropTypes.Validator<PropTypes.ReactComponentLike | null | undefined>;
-export default _default;
+import PropTypes from 'prop-types';
+declare const _default: PropTypes.Validator<PropTypes.ReactComponentLike | null | undefined>;
+export default _default;

package/esm/deepmerge.js

@@ -1,8 +1,6 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 export function isPlainObject(item) {
-  return item !== null && typeof item === 'object' && // TS thinks `item is possibly null` even though this was our first guard.
-  // @ts-expect-error
-  item.constructor === Object;
+  return item !== null && typeof item === 'object' && item.constructor === Object;
 }
 export default function deepmerge(target, source, options = {
   clone: true

package/esm/useId.js

@@ -1,5 +1,6 @@
 import * as React from 'react';
-export default function useId(idOverride) {
+
+function useRandomId(idOverride) {
   const [defaultId, setDefaultId] = React.useState(idOverride);
   const id = idOverride || defaultId;
   React.useEffect(() => {
@@ -11,4 +12,22 @@ export default function useId(idOverride) {
     }
   }, [defaultId]);
   return id;
+}
+/**
+ *
+ * @example <div id={useId()} />
+ * @param idOverride
+ * @returns {string}
+ */
+
+
+export default function useReactId(idOverride) {
+  // TODO: Remove `React as any` once `useId` is part of stable types.
+  if (React.useId !== undefined) {
+    const reactId = React.useId();
+    return idOverride != null ? idOverride : reactId;
+  } // eslint-disable-next-line react-hooks/rules-of-hooks -- `React.useId` is invariant at runtime.
+
+
+  return useRandomId(idOverride);
 }

package/exactProp.d.ts

@@ -1,2 +1,2 @@
-import { ValidationMap } from 'prop-types';
-export default function exactProp<T>(propTypes: ValidationMap<T>): ValidationMap<T>;
+import { ValidationMap } from 'prop-types';
+export default function exactProp<T>(propTypes: ValidationMap<T>): ValidationMap<T>;

package/formatMuiErrorMessage.d.ts

@@ -1,6 +1,6 @@
-/**
- * WARNING: Don't import this directly.
- * Use `MuiError` from `@mui/utils/macros/MuiError.macro` instead.
- * @param {number} code
- */
-export default function formatMuiErrorMessage(code: number): string;
+/**
+ * WARNING: Don't import this directly.
+ * Use `MuiError` from `@mui/utils/macros/MuiError.macro` instead.
+ * @param {number} code
+ */
+export default function formatMuiErrorMessage(code: number): string;

package/getDisplayName.d.ts

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

package/getScrollbarSize.d.ts

@@ -1 +1 @@
-export default function getScrollbarSize(doc: Document): number;
+export default function getScrollbarSize(doc: Document): number;

package/index.d.ts

@@ -1,32 +1,32 @@
-export { default as chainPropTypes } from './chainPropTypes';
-export { default as deepmerge } from './deepmerge';
-export { isPlainObject } from './deepmerge';
-export { default as elementAcceptingRef } from './elementAcceptingRef';
-export { default as elementTypeAcceptingRef } from './elementTypeAcceptingRef';
-export { default as exactProp } from './exactProp';
-export { default as formatMuiErrorMessage } from './formatMuiErrorMessage';
-export { default as getDisplayName } from './getDisplayName';
-export { default as HTMLElementType } from './HTMLElementType';
-export { default as ponyfillGlobal } from './ponyfillGlobal';
-export { default as refType } from './refType';
-export { default as unstable_capitalize } from './capitalize';
-export { default as unstable_createChainedFunction } from './createChainedFunction';
-export { default as unstable_debounce } from './debounce';
-export { default as unstable_deprecatedPropType } from './deprecatedPropType';
-export { default as unstable_isMuiElement } from './isMuiElement';
-export { default as unstable_ownerDocument } from './ownerDocument';
-export { default as unstable_ownerWindow } from './ownerWindow';
-export { default as unstable_requirePropFactory } from './requirePropFactory';
-export { default as unstable_setRef } from './setRef';
-export { default as unstable_useEnhancedEffect } from './useEnhancedEffect';
-export { default as unstable_useId } from './useId';
-export { default as unstable_unsupportedProp } from './unsupportedProp';
-export { default as unstable_useControlled } from './useControlled';
-export { default as unstable_useEventCallback } from './useEventCallback';
-export { default as unstable_useForkRef } from './useForkRef';
-export { default as unstable_useIsFocusVisible } from './useIsFocusVisible';
-export { default as unstable_getScrollbarSize } from './getScrollbarSize';
-export { detectScrollType as unstable_detectScrollType, getNormalizedScrollLeft as unstable_getNormalizedScrollLeft, } from './scrollLeft';
-export { default as usePreviousProps } from './usePreviousProps';
-export { default as visuallyHidden } from './visuallyHidden';
-export { default as integerPropType } from './integerPropType';
+export { default as chainPropTypes } from './chainPropTypes';
+export { default as deepmerge } from './deepmerge';
+export { isPlainObject } from './deepmerge';
+export { default as elementAcceptingRef } from './elementAcceptingRef';
+export { default as elementTypeAcceptingRef } from './elementTypeAcceptingRef';
+export { default as exactProp } from './exactProp';
+export { default as formatMuiErrorMessage } from './formatMuiErrorMessage';
+export { default as getDisplayName } from './getDisplayName';
+export { default as HTMLElementType } from './HTMLElementType';
+export { default as ponyfillGlobal } from './ponyfillGlobal';
+export { default as refType } from './refType';
+export { default as unstable_capitalize } from './capitalize';
+export { default as unstable_createChainedFunction } from './createChainedFunction';
+export { default as unstable_debounce } from './debounce';
+export { default as unstable_deprecatedPropType } from './deprecatedPropType';
+export { default as unstable_isMuiElement } from './isMuiElement';
+export { default as unstable_ownerDocument } from './ownerDocument';
+export { default as unstable_ownerWindow } from './ownerWindow';
+export { default as unstable_requirePropFactory } from './requirePropFactory';
+export { default as unstable_setRef } from './setRef';
+export { default as unstable_useEnhancedEffect } from './useEnhancedEffect';
+export { default as unstable_useId } from './useId';
+export { default as unstable_unsupportedProp } from './unsupportedProp';
+export { default as unstable_useControlled } from './useControlled';
+export { default as unstable_useEventCallback } from './useEventCallback';
+export { default as unstable_useForkRef } from './useForkRef';
+export { default as unstable_useIsFocusVisible } from './useIsFocusVisible';
+export { default as unstable_getScrollbarSize } from './getScrollbarSize';
+export { detectScrollType as unstable_detectScrollType, getNormalizedScrollLeft as unstable_getNormalizedScrollLeft, } from './scrollLeft';
+export { default as usePreviousProps } from './usePreviousProps';
+export { default as visuallyHidden } from './visuallyHidden';
+export { default as integerPropType } from './integerPropType';

package/index.js

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

package/integerPropType.d.ts

@@ -1,7 +1,7 @@
-export function getTypeByValue(value: any): any;
-declare function _default(props: any, propName: any, ...other: any[]): RangeError | null;
-declare namespace _default {
-    export { requiredInteger as isRequired };
-}
-export default _default;
-declare function requiredInteger(props: any, propName: any, componentName: any, location: any): RangeError | null;
+export function getTypeByValue(value: any): any;
+declare function _default(props: any, propName: any, ...other: any[]): RangeError | null;
+declare namespace _default {
+    export { requiredInteger as isRequired };
+}
+export default _default;
+declare function requiredInteger(props: any, propName: any, componentName: any, location: any): RangeError | null;

package/isMuiElement.d.ts

@@ -1 +1 @@
-export default function isMuiElement(element: any, muiNames: readonly string[]): boolean;
+export default function isMuiElement(element: any, muiNames: readonly string[]): boolean;

package/legacy/deepmerge.js

@@ -1,9 +1,7 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _typeof from "@babel/runtime/helpers/esm/typeof";
 export function isPlainObject(item) {
-  return item !== null && _typeof(item) === 'object' && // TS thinks `item is possibly null` even though this was our first guard.
-  // @ts-expect-error
-  item.constructor === Object;
+  return item !== null && _typeof(item) === 'object' && item.constructor === Object;
 }
 export default function deepmerge(target, source) {
   var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {

package/legacy/index.js

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

package/legacy/useId.js

@@ -1,5 +1,6 @@
 import * as React from 'react';
-export default function useId(idOverride) {
+
+function useRandomId(idOverride) {
   var _React$useState = React.useState(idOverride),
       defaultId = _React$useState[0],
       setDefaultId = _React$useState[1];
@@ -14,4 +15,22 @@ export default function useId(idOverride) {
     }
   }, [defaultId]);
   return id;
+}
+/**
+ *
+ * @example <div id={useId()} />
+ * @param idOverride
+ * @returns {string}
+ */
+
+
+export default function useReactId(idOverride) {
+  // TODO: Remove `React as any` once `useId` is part of stable types.
+  if (React.useId !== undefined) {
+    var reactId = React.useId();
+    return idOverride != null ? idOverride : reactId;
+  } // eslint-disable-next-line react-hooks/rules-of-hooks -- `React.useId` is invariant at runtime.
+
+
+  return useRandomId(idOverride);
 }

package/modern/deepmerge.js

@@ -1,8 +1,6 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 export function isPlainObject(item) {
-  return item !== null && typeof item === 'object' && // TS thinks `item is possibly null` even though this was our first guard.
-  // @ts-expect-error
-  item.constructor === Object;
+  return item !== null && typeof item === 'object' && item.constructor === Object;
 }
 export default function deepmerge(target, source, options = {
   clone: true

package/modern/index.js

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

package/modern/useId.js

@@ -1,5 +1,6 @@
 import * as React from 'react';
-export default function useId(idOverride) {
+
+function useRandomId(idOverride) {
   const [defaultId, setDefaultId] = React.useState(idOverride);
   const id = idOverride || defaultId;
   React.useEffect(() => {
@@ -11,4 +12,22 @@ export default function useId(idOverride) {
     }
   }, [defaultId]);
   return id;
+}
+/**
+ *
+ * @example <div id={useId()} />
+ * @param idOverride
+ * @returns {string}
+ */
+
+
+export default function useReactId(idOverride) {
+  // TODO: Remove `React as any` once `useId` is part of stable types.
+  if (React.useId !== undefined) {
+    const reactId = React.useId();
+    return idOverride ?? reactId;
+  } // eslint-disable-next-line react-hooks/rules-of-hooks -- `React.useId` is invariant at runtime.
+
+
+  return useRandomId(idOverride);
 }

package/ownerDocument.d.ts

@@ -1 +1 @@
-export default function ownerDocument(node: Node | null | undefined): Document;
+export default function ownerDocument(node: Node | null | undefined): Document;

package/ownerWindow.d.ts

@@ -1 +1 @@
-export default function ownerWindow(node: Node | undefined): Window;
+export default function ownerWindow(node: Node | undefined): Window;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/utils",
-  "version": "5.1.1",
+  "version": "5.2.0",
   "private": false,
   "author": "MUI Team",
   "description": "Utility functions for React components.",

package/ponyfillGlobal.d.ts

@@ -1,2 +1,2 @@
-declare const _default: any;
-export default _default;
+declare const _default: any;
+export default _default;

package/refType.d.ts

@@ -1,3 +1,3 @@
-import PropTypes from 'prop-types';
-declare const refType: PropTypes.Requireable<object>;
-export default refType;
+import PropTypes from 'prop-types';
+declare const refType: PropTypes.Requireable<object>;
+export default refType;

package/setRef.d.ts

@@ -1,15 +1,15 @@
-import * as React from 'react';
-/**
- * TODO v5: consider making it private
- *
- * passes {value} to {ref}
- *
- * WARNING: Be sure to only call this inside a callback that is passed as a ref.
- * Otherwise, make sure to cleanup the previous {ref} if it changes. See
- * https://github.com/mui-org/material-ui/issues/13539
- *
- * Useful if you want to expose the ref of an inner component to the public API
- * while still using it inside the component.
- * @param ref A ref callback or ref object. If anything falsy, this is a no-op.
- */
-export default function setRef<T>(ref: React.MutableRefObject<T | null> | ((instance: T | null) => void) | null | undefined, value: T | null): void;
+import * as React from 'react';
+/**
+ * TODO v5: consider making it private
+ *
+ * passes {value} to {ref}
+ *
+ * WARNING: Be sure to only call this inside a callback that is passed as a ref.
+ * Otherwise, make sure to cleanup the previous {ref} if it changes. See
+ * https://github.com/mui-org/material-ui/issues/13539
+ *
+ * Useful if you want to expose the ref of an inner component to the public API
+ * while still using it inside the component.
+ * @param ref A ref callback or ref object. If anything falsy, this is a no-op.
+ */
+export default function setRef<T>(ref: React.MutableRefObject<T | null> | ((instance: T | null) => void) | null | undefined, value: T | null): void;

package/useEventCallback.d.ts

@@ -1,4 +1,4 @@
-/**
- * https://github.com/facebook/react/issues/14099#issuecomment-440013892
- */
-export default function useEventCallback<Args extends unknown[], Return>(fn: (...args: Args) => Return): (...args: Args) => Return;
+/**
+ * https://github.com/facebook/react/issues/14099#issuecomment-440013892
+ */
+export default function useEventCallback<Args extends unknown[], Return>(fn: (...args: Args) => Return): (...args: Args) => Return;

package/useEventCallback.spec.d.ts

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

package/useForkRef.d.ts

@@ -1,2 +1,2 @@
-import * as React from 'react';
-export default function useForkRef<Instance>(refA: React.Ref<Instance> | null | undefined, refB: React.Ref<Instance> | null | undefined): React.Ref<Instance> | null;
+import * as React from 'react';
+export default function useForkRef<Instance>(refA: React.Ref<Instance> | null | undefined, refB: React.Ref<Instance> | null | undefined): React.Ref<Instance> | null;

package/useId.d.ts

@@ -1 +1,7 @@
-export default function useId(idOverride?: string): string | undefined;
+/**
+ *
+ * @example <div id={useId()} />
+ * @param idOverride
+ * @returns {string}
+ */
+export default function useReactId(idOverride?: string): string | undefined;

package/useId.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = useId;
+exports.default = useReactId;
 
 var React = _interopRequireWildcard(require("react"));
 
@@ -11,7 +11,7 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-function useId(idOverride) {
+function useRandomId(idOverride) {
   const [defaultId, setDefaultId] = React.useState(idOverride);
   const id = idOverride || defaultId;
   React.useEffect(() => {
@@ -23,4 +23,22 @@ function useId(idOverride) {
     }
   }, [defaultId]);
   return id;
+}
+/**
+ *
+ * @example <div id={useId()} />
+ * @param idOverride
+ * @returns {string}
+ */
+
+
+function useReactId(idOverride) {
+  // TODO: Remove `React as any` once `useId` is part of stable types.
+  if (React.useId !== undefined) {
+    const reactId = React.useId();
+    return idOverride != null ? idOverride : reactId;
+  } // eslint-disable-next-line react-hooks/rules-of-hooks -- `React.useId` is invariant at runtime.
+
+
+  return useRandomId(idOverride);
 }

package/usePreviousProps.d.ts

@@ -1,2 +1,2 @@
-declare const usePreviousProps: (value: object) => object;
-export default usePreviousProps;
+declare const usePreviousProps: (value: object) => object;
+export default usePreviousProps;

package/visuallyHidden.d.ts

@@ -1,2 +1,2 @@
-declare const visuallyHidden: import('react').CSSProperties;
-export default visuallyHidden;
+declare const visuallyHidden: import('react').CSSProperties;
+export default visuallyHidden;