Transition: Fix marking next slide as inactive

This commit is contained in:
Alexander Zinchuk 2023-07-05 13:15:39 +02:00
parent 061a6150c7
commit 816b62b6ce

View File

@ -124,6 +124,7 @@ function Transition({
const keys = Object.keys(rendersRef.current).map(Number); const keys = Object.keys(rendersRef.current).map(Number);
const prevActiveIndex = renderCount ? prevActiveKey : keys.indexOf(prevActiveKey); const prevActiveIndex = renderCount ? prevActiveKey : keys.indexOf(prevActiveKey);
const activeIndex = renderCount ? activeKey : keys.indexOf(activeKey); const activeIndex = renderCount ? activeKey : keys.indexOf(activeKey);
const nextIndex = nextKey ? (renderCount ? nextKey : keys.indexOf(nextKey)) : -1;
const childNodes = Array.from(container.childNodes); const childNodes = Array.from(container.childNodes);
if (!childNodes.length) { if (!childNodes.length) {
@ -140,20 +141,19 @@ function Transition({
}); });
if (!activeKeyChanged) { if (!activeKeyChanged) {
if (childElements.length === 1 || (nextKey !== undefined && childElements.length === 2)) { const activeChild = childNodes[activeIndex];
const firstChild = childNodes[activeIndex] as HTMLElement; if (activeChild instanceof HTMLElement) {
addExtraClass(activeChild, CLASSES.active);
addExtraClass(firstChild, CLASSES.active);
if (isSlideOptimized) { if (isSlideOptimized) {
firstChild.style.transition = 'none'; activeChild.style.transition = 'none';
firstChild.style.transform = 'translate3d(0, 0, 0)'; activeChild.style.transform = 'translate3d(0, 0, 0)';
} }
}
if (childElements.length === 2) { const nextChild = nextIndex !== -1 && nextIndex !== activeIndex && childNodes[nextIndex] as HTMLElement;
const nextChild = childElements[0] === firstChild ? childElements[1] : childElements[0]; if (nextChild instanceof HTMLElement) {
addExtraClass(nextChild, CLASSES.inactive); addExtraClass(nextChild, CLASSES.inactive);
}
} }
return; return;