Got undefined error from Dialog

[ChristoRibeiro]

Hi @RobinMalfait,

I'm using headlessui/react@dev and I'm going through an error with the Dialog component:

TypeError: Cannot read property 'Overlay' of undefined

Here the code, copy/pasted from the documentation:

<Dialog open={showForm} onClose={setShowForm}>
  <Dialog.Overlay />

  <Dialog.Title>Deactivate account</Dialog.Title>
  <Dialog.Description>This will permanently deactivate your account</Dialog.Description>

  <p>
      Are you sure you want to deactivate your account? All of your data will be permanently
      removed. This action cannot be undone.
  </p>

  <button onClick={() => setShowForm(false)}>Deactivate</button>
  <button onClick={() => setShowForm(false)}>Cancel</button>
</Dialog>

[RobinMalfait]

Hey! Thank you for your bug report!
Much appreciated! 🙏

Do you have your imports at the top? Can you share the full code?

[ChristoRibeiro]

Yes

...
import { Dialog } from "@headlessui/react"

export default function Dashboard() {  
  const [ showForm, setShowForm ] = useState(false)
  
  return (
    <>
      <Dialog open={showForm} onClose={setShowForm}>
        <Dialog.Overlay />

        <Dialog.Title>Deactivate account</Dialog.Title>
        <Dialog.Description>This will permanently deactivate your account</Dialog.Description>

        <p>
          Are you sure you want to deactivate your account? All of your data will be permanently
          removed. This action cannot be undone.
        </p>

        <button onClick={() => setShowForm(false)}>Deactivate</button>
        <button onClick={() => setShowForm(false)}>Cancel</button>
      </Dialog>

      <div onClick={() => setShowForm(true)}>open dialog</div>
    </>
  )
}

[RobinMalfait]

Could you Verify that you are on the latest version?

[ChristoRibeiro]

when I did yarn add @headlessui/react I got this one: "@headlessui/react": "^0.3.1-d519f7d".

Is it the last version?

[paperfella-ceo]

I got the same problem

[RobinMalfait]

@ChristoRibeiro make it a pinned version like "@headlessui/react": "0.3.1-d519f7d" (without the caret). Also nuke your node_modules just in case! See this reply: #269 (comment)