How to use the css-animation function in css-animation

function animate(node: HTMLElement, show: boolean, done: () => void) {
  let height: number;
  let requestAnimationFrameId: number;
  return cssAnimation(node, 'fishd-motion-collapse', {
    start() {
      if (!show) {
        node.style.height = `${node.offsetHeight}px`;
        node.style.opacity = '1';
      } else {
        height = node.offsetHeight;
        node.style.height = '0px';
        node.style.opacity = '0';
      }
    },
    active() {
      if (requestAnimationFrameId) {
        raf.cancel(requestAnimationFrameId);
      }
      requestAnimationFrameId = raf(() => {
        node.style.height = `${show ? height : 0}px`;

toggle(node, show, done) {
    const { opacity } = this.props;
    const nodeNew = node;
    cssAnim(nodeNew, `__css-animation__${prefixClass('mask')}`, {
      start() {
        if (show) {
          nodeNew.style.opacity = 0;
        }
      },
      active() {
        nodeNew.style.opacity = show ? opacity : 0;
      },
      end() {
        done();
      },
    });
  }

function animate(node: HTMLElement, show: boolean, done: () => void) {
  let height: number;
  let requestAnimationFrameId: number;
  return cssAnimation(node, 'collapse', {
    start() {
      if (!show) {
        node.style.height = `${node.offsetHeight}px`;
        node.style.opacity = '1';
      } else {
        height = node.offsetHeight;
        node.style.height = '0px';
        node.style.opacity = '0';
      }
    },
    active() {
      if (requestAnimationFrameId) {
        raf.cancel(requestAnimationFrameId);
      }
      requestAnimationFrameId = raf(() => {
        node.style.height = `${show ? height : 0}px`;

const props = this.props;
    const transitionName = props.transitionName;
    const nameIsObj = typeof transitionName === 'object';
    this.stop();
    const end = () => {
      this.stopper = null;
      finishCallback();
    };
    if ((isCssAnimationSupported || !props.animation[animationType]) &&
      transitionName && props[transitionMap[animationType]]) {
      const name = nameIsObj ? transitionName[animationType] : `${transitionName}-${animationType}`;
      let activeName = `${name}-active`;
      if (nameIsObj && transitionName[`${animationType}Active`]) {
        activeName = transitionName[`${animationType}Active`];
      }
      this.stopper = cssAnimate(node, {
        name,
        active: activeName,
      }, end);
    } else {
      this.stopper = props.animation[animationType](node, end);
    }
  }

const toggleHeightAnim = (node, show, done) => {
  let height;
  cssAni(node, '__css-animation__', {
    start() {
      node.style.overflow = 'hidden';
      if (!show) {
        node.style.height = `${node.offsetHeight}px`;
        node.style.opacity = 0;
      } else {
        height = node.offsetHeight;
        node.style.height = 0;
        node.style.opacity = 1;
      }
    },
    active() {
      node.style.height = `${show ? height : 0}px`;
    },
    end() {
      node.style.height = '';

function animate (node, show, done) {
  let height
  return cssAnimation(node, 'NEUI-collapse', {
    start () {
      if (!show) {
        node.style.height = `${node.offsetHeight}px`
      } else {
        height = node.offsetHeight
        node.style.height = 0
      }
    },
    active () {
      node.style.height = `${show ? height : 0}px`
    },
    end () {
      node.style.height = ''
      done()
    }
  })

enter(node, done) {
        let height;
        return animate(node, 'yh-menu-collapse', {
            start() {
                height = node.offsetHeight;
                node.style.height = 0;
            },
            active() {
                node.style.height = `${height}px`;
            },
            end() {
                node.style.height = '';
                done();
            },
        });
    },