Skip to content

Replace deprecated @reach/auto-id with React.useId or an alternative hook to ensure React 18 compatibility #2054

@hamza761

Description

@hamza761

Summary

The Garden React packages currently use @reach/auto-id internally, which has a strict peer dependency on React 16 and 17.
When upgrading to React 18, this triggers peer dependency warnings such as:

Although the components still function correctly in React 18, this dependency is now outdated and may cause issues with future React releases.


Details

  • The @reach/auto-id package is effectively deprecated and unmaintained.
  • React 18 introduces the built-in React.useId hook, which provides the same functionality for generating unique, SSR-safe IDs.
  • Using React.useId (with a fallback for React 16/17 if necessary) would remove this dependency and make Garden forward-compatible with React 18.

Proposed Solution

Replace internal usage of @reach/auto-id with React.useId or a custom utility hook that wraps it.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions