diff --git a/src/Transition.tsx b/src/Transition.tsx index e7fa3f69..4c8a972e 100644 --- a/src/Transition.tsx +++ b/src/Transition.tsx @@ -712,7 +712,11 @@ const Transition = functionModule( {...props} {...(props.timeout != null ? { timeout: props.timeout } - : { nodeRef, addEndListener: endListener() })} + : { + nodeRef, + addEndListener: + props.addEndListener ?? endListener(), + })} > {cloneRef(props.children as ReactNode, nodeRef)} diff --git a/src/utils/cloneRef.ts b/src/utils/cloneRef.ts index 3ab7ab3d..a94fafea 100644 --- a/src/utils/cloneRef.ts +++ b/src/utils/cloneRef.ts @@ -64,13 +64,11 @@ export function endListener() { * @param done A callback function to be executed when the animation ends. */ return (node: HTMLElement, done: () => void) => { - node?.addEventListener( - "transitionend", - (e) => { - if (e.target !== e.currentTarget) return; - done(); - }, - false, - ); + const listener = (e: TransitionEvent) => { + if (e.target !== e.currentTarget) return; + node?.removeEventListener("transitionend", listener, false); + done(); + }; + node?.addEventListener("transitionend", listener, false); }; }