Const defaultPhases
defaultPhases: object[] = [{delay: 0, // beforeapply({mode, previous, nodeY, current, node}: Readonly<IAnimationItem>) {node.dataset.animation = EAnimationMode[mode].toLowerCase();node.style.transform = `translate(0, ${previous.y - nodeY}px)`;if (mode === EAnimationMode.SHOW) {// already target heightnode.style.height = current.height !== null ? `${current.height}px` : null;} else { // always set previous height for default height changesnode.style.height = `${previous.height}px`;}node.style.opacity = mode === EAnimationMode.SHOW ? '0' : (mode === EAnimationMode.HIDE ? '1' : null);}},{delay: 10, // after some delay for the before phase have been applied visuallyapply({mode, current, nodeY, node}: Readonly<IAnimationItem>) {// null for added/update since already at the right positionnode.style.transform = (mode === EAnimationMode.HIDE || mode === EAnimationMode.UPDATE_REMOVE) ? `translate(0, ${current.y - nodeY}px)` : '';if (mode !== EAnimationMode.HIDE) { // keep height for removalnode.style.height = current.height !== null ? `${current.height}px` : null;}node.style.opacity = mode === EAnimationMode.SHOW ? '1' : (mode === EAnimationMode.HIDE ? '0' : null);}},{delay: MAX_ANIMATION_TIME, // cleanupapply({node}: Readonly<IAnimationItem>) {delete node.dataset.animation;node.style.opacity = null;node.style.transform = '';}}]