search

tailwindlabs / headlessui

Completely unstyled, fully accessible UI components, designed to integrate beautifully with Tailwind CSS.
https://headlessui.com
MIT License
25.81k stars 1.07k forks source link

Issue after upgrading healdessui to latest version in a react17 project: Uncaught TypeError: (0 , import_react45.useId #3185

Closed crissadriana closed 4 months ago

crissadriana commented 4 months ago

What package within Headless UI are you using? @headlessui/react v2.0.3

What version of that package are you using? v2.0.3

What browser are you using? Chrome / Safari / FF

Reproduction URL N/A

Describe your issue

We've got a project using react 17 currently and we've just upgraded to the v2.0.3 of react headlessui, but we keep getting this error: Uncaught TypeError: (0 , import_react45.useId

Are there any requirements in order to upgrade to this version?

thecrypticace commented 4 months ago

Hi! Headless UI v2 now requires React 18 as we're making use of some React 18+ features now. You can see this in our peer dependencies here: https://github.com/tailwindlabs/headlessui/blob/031b39d52259c81b9906d86ec7118755da6ef916/packages/%40headlessui-react/package.json#L44-L47

You should've seen warnings from NPM when you installed it into a React 17 project. So, if you want to use Headless UI v2 you will need to upgrade your project first.

cjoderati commented 4 months ago

I have this same issue but i'm already on React 18...

    "react": "^18.2.0",
    "react-color": "^2.19.3",
    "react-dom": "^18.2.0",
@headlessui_react.js?v=657b1b39:6175 Uncaught TypeError: (0 , import_react45.useId) is not a function