fix(accordion): animate visibility#7539
Conversation
|
Preview: https://patternfly-pr-7539.surge.sh A11y report: https://patternfly-pr-7539-a11y.surge.sh |
There was a problem hiding this comment.
Noticing in React for a fixed implementation, if the accordion item content has a scrollbar, the overflow is removed as the collapsing animation occurs. Adding overflow-y of auto to .pf-v6-c-accordion__expandable-content seems to help.
Basically looks like we're only applying the overflow auto when the content is expanded, causing the overflow content to break out of its container when the collapse animation is occuring.
Video of the behavior I'm seeing just pulling into React, no react changes made:
Screen.Recording.2025-05-21.at.12.03.18.PM.mov
| @starting-style { | ||
| --#{$accordion}__expandable-content--Opacity: 0; | ||
| --#{$accordion}__expandable-content--TranslateY: -.5rem; | ||
| max-height: 9999px; |
There was a problem hiding this comment.
Rather than setting an arbitrary max-height, would we be able to just unset the max-height: 0 declaration?
There was a problem hiding this comment.
Per convo with Coker we need a px value to transition correctly
thatblindgeye
left a comment
There was a problem hiding this comment.
lgtm, my other comment above about max-height isnt blocking
srambach
left a comment
There was a problem hiding this comment.
I also see a lag at 20x CPU loading here.
Fine to merge with that imho.
|
🎉 This PR is included in version 6.3.0-prerelease.24 🎉 The release is available on: Your semantic-release bot 📦🚀 |
fixes #7538