From 816b62b6ce73d4bc7aa612fb54e66cc715c692a3 Mon Sep 17 00:00:00 2001 From: Alexander Zinchuk Date: Wed, 5 Jul 2023 13:15:39 +0200 Subject: [PATCH] Transition: Fix marking next slide as inactive --- src/components/ui/Transition.tsx | 20 ++++++++++---------- 1 file changed, 10 insertions(+), 10 deletions(-) diff --git a/src/components/ui/Transition.tsx b/src/components/ui/Transition.tsx index de67ac676..09c73713b 100644 --- a/src/components/ui/Transition.tsx +++ b/src/components/ui/Transition.tsx @@ -124,6 +124,7 @@ function Transition({ const keys = Object.keys(rendersRef.current).map(Number); const prevActiveIndex = renderCount ? prevActiveKey : keys.indexOf(prevActiveKey); const activeIndex = renderCount ? activeKey : keys.indexOf(activeKey); + const nextIndex = nextKey ? (renderCount ? nextKey : keys.indexOf(nextKey)) : -1; const childNodes = Array.from(container.childNodes); if (!childNodes.length) { @@ -140,20 +141,19 @@ function Transition({ }); if (!activeKeyChanged) { - if (childElements.length === 1 || (nextKey !== undefined && childElements.length === 2)) { - const firstChild = childNodes[activeIndex] as HTMLElement; - - addExtraClass(firstChild, CLASSES.active); + const activeChild = childNodes[activeIndex]; + if (activeChild instanceof HTMLElement) { + addExtraClass(activeChild, CLASSES.active); if (isSlideOptimized) { - firstChild.style.transition = 'none'; - firstChild.style.transform = 'translate3d(0, 0, 0)'; + activeChild.style.transition = 'none'; + activeChild.style.transform = 'translate3d(0, 0, 0)'; } + } - if (childElements.length === 2) { - const nextChild = childElements[0] === firstChild ? childElements[1] : childElements[0]; - addExtraClass(nextChild, CLASSES.inactive); - } + const nextChild = nextIndex !== -1 && nextIndex !== activeIndex && childNodes[nextIndex] as HTMLElement; + if (nextChild instanceof HTMLElement) { + addExtraClass(nextChild, CLASSES.inactive); } return;