/*
 * @Author: wei.li
 * @Date: 2023-03-04 08:54:51
 * @LastEditors: wei.li
 * @LastEditTime: 2023-03-04 08:57:29
 * @Description: file content
 */
import { h, defineComponent, withDirectives, resolveDirective } from 'vue';

/** 封装@vueuse/motion动画库中的自定义指令v-motion */
export default defineComponent({
  name: 'UtMotion',
  props: {
    delay: {
      type: Number,
      default: 50
    }
  },
  render() {
    const { delay } = this;
    const motion = resolveDirective('motion');
    return withDirectives(
      h(
        'div',
        {},
        {
          default: () => [this.$slots.default()]
        }
      ),
      [
        [
          motion,
          {
            initial: { opacity: 0, y: 100 },
            enter: {
              opacity: 1,
              y: 0,
              transition: {
                delay
              }
            }
          }
        ]
      ]
    );
  }
});