Blocked aria-hidden on an element

[saijoro]

when I using a the drawer from shadcn, when i trigger the drawer using TriggerDrawer, then the state updates to true, But the error getting up and nothing happens.

For more info

I have started a vite react js project, by using tanstack start and that uses vinxi, along with tailwind and shadcn, Solve if possible.

Blocked aria-hidden on an element because its descendant retained focus. The focus must not be hidden from assistive technology users. Avoid using aria-hidden on a focused element or its ancestor. Consider using the inert attribute instead, which will also prevent focus. For more details, see the aria-hidden section of the WAI-ARIA specification at https://w3c.github.io/aria/#aria-hidden.
Element with focus: button:

These are some snaps of the configs

[MhL5]

same issue, anyone found a good solution to this?
the issue is the trigger doesnt lose focus after drawer content pops up

im using this

  <DrawerTrigger
          onClick={(e) => {
            e.currentTarget.blur();
          }}
        >

[mustafaidk]

I am not sure if this is the correct way but it works for me

<Drawer open={openDrawer} onOpenChange={setOpenDrawer} autoFocus={openDrawer} />

or

<DrawerTrigger autoFocus={openDrawer} />

[yuritoledo]

It worked for me too, thanks dude.

[yeonsubak]

It worked for me as well! Thank you for the great solution!

[Frankxhh]

nice bro

[dejoma]

Same issue with the component of shadcn.

For this, the autoFocus fix does not work. Haven't found any solution yet.
How to reproduce:

• Dialog with a component inside. Open dialog Click on the Select Close dialog (hit escape) Focus is left inside the dialog; if you do modal={false} on the dialog there is no issue.

[nullideas]

hey dejoma,

I found this solution which worked for me. found it on reddit made by @Aevil_15

https://www.reddit.com/r/nextjs/comments/1hnnbem/help_with_ariahidden_issue_in_dropdown_menu_and/