mui / mui/base-ui

[collapsible] Exit animation doesn't run when using motion and Tailwind v4

Open
#1,608 1 comment 1 reaction 0 assignees View on GitHub
component: collapsible has workaround
Dominant language
TypeScript
Stars
10.9k
Forks
543
Avg merge
1d 20h
Merged PRs (30d)
101

Description

https://codesandbox.io/p/devbox/suspicious-kate-j22y8v

Tailwind v4's reset sets `display: none !important` on the `[hidden]` selector, and the way motion sets styles cannot override `!important`

The workaround is to set `hidden={undefined}` on the panel, it will be unmounted as soon as hidden becomes true anyway:

```jsx



{open && (

}
>
{/* panel content */}

)}

```

## Base UI version

1.0.0-alpha.7

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.