winbox-ui-next/lib/spin/spin.js

We Design Vue 2.0: A Vue.js 3 UI Library

"use strict";
var vue = require("vue");
var globalConfig = require("../_utils/global-config.js");
var index = require("../icon/icon-loading/index.js");
var dotLoading = require("./dot-loading.js");
var vueUtils = require("../_utils/vue-utils.js");
var _Spin = vue.defineComponent({
  name: "Spin",
  props: {
    size: {
      type: Number
    },
    loading: Boolean,
    dot: Boolean,
    tip: String
  },
  setup(props, {
    slots,
    attrs
  }) {
    const prefixCls = globalConfig.getPrefixCls("spin");
    const cls = vue.computed(() => [prefixCls, {
      [`${prefixCls}-loading`]: props.loading,
      [`${prefixCls}-with-tip`]: props.tip && !slots.default
    }]);
    const renderIcon = () => {
      if (slots.icon) {
        const iconVNode = vueUtils.getFirstComponent(slots.icon());
        if (iconVNode) {
          return vue.cloneVNode(iconVNode, {
            spin: true
          });
        }
      }
      if (slots.element) {
        return slots.element();
      }
      if (props.dot) {
        return vue.createVNode(dotLoading, {
          "size": props.size
        }, null);
      }
      return vue.createVNode(index, {
        "spin": true
      }, null);
    };
    const renderSpinIcon = () => {
      const style = props.size ? {
        fontSize: `${props.size}px`
      } : void 0;
      return vue.createVNode(vue.Fragment, null, [vue.createVNode("div", {
        "class": `${prefixCls}-icon`,
        "style": style
      }, [renderIcon()]), props.tip && vue.createVNode("div", {
        "class": `${prefixCls}-tip`
      }, [props.tip])]);
    };
    return () => vue.createVNode("div", {
      "class": cls.value
    }, [slots.default ? vue.createVNode(vue.Fragment, null, [slots.default(), props.loading && vue.createVNode("div", {
      "class": `${prefixCls}-mask`
    }, [vue.createVNode("div", {
      "class": `${prefixCls}-mask-icon`
    }, [renderSpinIcon()])])]) : renderSpinIcon()]);
  }
});
module.exports = _Spin;