fix(@clayui/core): Vertical Bar open panel shouldn't disappear on resize #5434
Conversation
| @@ -60,7 +46,7 @@ export function Panel({children, keyValue, tabIndex}: Props) { | |||
| <CSSTransition | |||
| aria-labelledby={`${id}-tab-${keyValue}`} | |||
| className={classNames('sidebar', { | |||
| 'c-slideout-show': activePanel === keyValue && isFirst, | |||
There was a problem hiding this comment.
@pat270 we have to ignore this in the first rendering, for example when opening the panel it is not doing animation anymore.
There was a problem hiding this comment.
Is the panel disappearing because the panelWidth is being changed?
There was a problem hiding this comment.
@matuzalemsteles Yes sort of, React ends up re-rendering which removes c-slideout-show.
|
@matuzalemsteles I solved the disappearing panel and also fixed the transition between close and open panels. This seems a bit messy, but can't figure out a better way at the moment. |
There was a problem hiding this comment.
fixed the transition between close and open panels
I'm not sure about this behavior, I think the old behavior was expected but it's also tricky because the design and implementation of VerticalBar is old and will change so we don't know what the ideal behavior would be yet.
| const isPanelOpen = (() => { | ||
| if (isFirst) { | ||
| return activePanel !== null; | ||
| } else if (previousActivePanelRef.current === activePanel) { | ||
| return true; | ||
| } else if (activePanel === null) { | ||
| return false; | ||
| } else { | ||
| return previousActivePanelRef.current !== null; | ||
| } | ||
| })(); |
There was a problem hiding this comment.
I think this is better to be a function you call than to make an immediate function, this seems a little strange.
|
@matuzalemsteles I remember there being a transition between panels somewhere but I can't seem to find it. @emiliano-cicero @marcoscv-work how should the Vertical Bar transition between two panels?
|
|
@pat270 without the transition it shouldn't blink just render new content because the panel is already open. Just as it is in the master. Kapture.2023-03-28.at.17.17.25.mp4 |
|
@matuzalemsteles The panels should function how it did previously. We can revert to sliding panels in the future if it's needed. |
There was a problem hiding this comment.
@pat270 seems to work great, could you just check the tests before going ahead with this?
|
@matuzalemsteles Vertical Bar tests should be passing now |
…el on transitionend
fixes #5433