"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _xeUtils = _interopRequireDefault(require("xe-utils"));
var _ui = require("../../ui");
var _comp = require("../../ui/src/comp");
var _dom = require("../../ui/src/dom");
var _utils = require("../../ui/src/utils");
var _vn = require("../../ui/src/vn");
var _log = require("../../ui/src/log");
var _tooltip = _interopRequireDefault(require("../../tooltip"));
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
var _createComponentLog = (0, _log.createComponentLog)('button'),
  warnLog = _createComponentLog.warnLog;
var _default2 = exports.default = /* define-vxe-component start */(0, _comp.defineVxeComponent)({
  name: 'VxeButton',
  mixins: [_ui.globalMixins.sizeMixin, _ui.globalMixins.permissionMixin],
  props: {
    /**
     * 按钮类型
     */
    type: String,
    mode: String,
    className: [String, Function],
    popupClassName: [String, Function],
    /**
     * 按钮尺寸
     */
    size: {
      type: String,
      default: function _default() {
        return (0, _ui.getConfig)().button.size || (0, _ui.getConfig)().size;
      }
    },
    zIndex: Number,
    /**
     * 用来标识这一项
     */
    name: [String, Number],
    routerLink: Object,
    /**
     * 权限码
     */
    permissionCode: [String, Number],
    /**
     * 按钮内容
     */
    content: String,
    /**
     * 固定显示下拉面板的方向
     */
    placement: String,
    /**
     * 按钮状态
     */
    status: String,
    /**
     * 标题
     */
    title: String,
    shadow: Boolean,
    /**
     * 按钮的前缀图标，属于 prefix-icon 的简写
     */
    icon: String,
    iconRender: Object,
    /**
     * 按钮的前缀图标
     */
    prefixIcon: String,
    prefixRender: Object,
    /**
     * 按钮的后缀图标
     */
    suffixIcon: String,
    suffixRender: Object,
    /**
     * 圆角边框
     */
    round: Boolean,
    /**
     * 圆角按钮
     */
    circle: Boolean,
    /**
     * 是否禁用
     */
    disabled: Boolean,
    /**
     * 是否加载中
     */
    loading: Boolean,
    trigger: {
      type: String,
      default: function _default() {
        return (0, _ui.getConfig)().button.trigger;
      }
    },
    align: String,
    prefixTooltip: Object,
    suffixTooltip: Object,
    options: Array,
    showDropdownIcon: {
      type: Boolean,
      default: function _default() {
        return (0, _ui.getConfig)().button.showDropdownIcon;
      }
    },
    /**
     * 在下拉面板关闭时销毁内容
     */
    destroyOnClose: {
      type: Boolean,
      default: function _default() {
        return (0, _ui.getConfig)().button.destroyOnClose;
      }
    },
    popupConfig: Object,
    /**
     * 是否将弹框容器插入于 body 内
     */
    transfer: {
      type: Boolean,
      default: null
    }
  },
  inject: {
    $xeModal: {
      default: null
    },
    $xeDrawer: {
      default: null
    },
    $xeTable: {
      default: null
    },
    $xeTree: {
      default: null
    },
    $xeForm: {
      default: null
    },
    $xeButtonGroup: {
      default: null
    }
  },
  data: function data() {
    var reactData = {
      initialized: false,
      visiblePanel: false,
      isAniVisible: false,
      isActivated: false,
      panelIndex: 0,
      panelStyle: {},
      panelPlacement: ''
    };
    var internalData = {
      showTime: undefined
    };
    return {
      xID: _xeUtils.default.uniqueId(),
      reactData: reactData,
      internalData: internalData
    };
  },
  computed: Object.assign(Object.assign({}, {}), {
    computeBtnTransfer: function computeBtnTransfer() {
      var $xeButton = this;
      var props = $xeButton;
      var $xeTable = $xeButton.$xeTable;
      var $xeTree = $xeButton.$xeTree;
      var $xeModal = $xeButton.$xeModal;
      var $xeDrawer = $xeButton.$xeDrawer;
      var $xeForm = $xeButton.$xeForm;
      var transfer = props.transfer;
      var popupOpts = $xeButton.computePopupOpts;
      if (_xeUtils.default.isBoolean(popupOpts.transfer)) {
        return popupOpts.transfer;
      }
      if (transfer === null) {
        var globalTransfer = (0, _ui.getConfig)().button.transfer;
        if (_xeUtils.default.isBoolean(globalTransfer)) {
          return globalTransfer;
        }
        if ($xeTable || $xeTree || $xeModal || $xeDrawer || $xeForm) {
          return true;
        }
      }
      return transfer;
    },
    computeBtnDisabled: function computeBtnDisabled() {
      var $xeButton = this;
      var props = $xeButton;
      var disabled = props.disabled;
      var permissionInfo = $xeButton.computePermissionInfo;
      return disabled || permissionInfo.disabled;
    },
    computeIsFormBtn: function computeIsFormBtn() {
      var $xeButton = this;
      var props = $xeButton;
      var type = props.type;
      if (type) {
        return ['submit', 'reset', 'button'].indexOf(type) > -1;
      }
      return false;
    },
    computeBtnMode: function computeBtnMode() {
      var $xeButton = this;
      var props = $xeButton;
      var type = props.type,
        mode = props.mode;
      var $xeButtonGroup = $xeButton.$xeButtonGroup;
      if (mode === 'text' || type === 'text' || $xeButtonGroup && $xeButtonGroup.mode === 'text') {
        return 'text';
      }
      return 'button';
    },
    computeBtnStatus: function computeBtnStatus() {
      var $xeButton = this;
      var props = $xeButton;
      var status = props.status;
      var $xeButtonGroup = $xeButton.$xeButtonGroup;
      if (status) {
        return status;
      }
      if ($xeButtonGroup) {
        return $xeButtonGroup.status;
      }
      return '';
    },
    computeBtnRound: function computeBtnRound() {
      var $xeButton = this;
      var props = $xeButton;
      var round = props.round;
      var $xeButtonGroup = $xeButton.$xeButtonGroup;
      if (round) {
        return round;
      }
      if ($xeButtonGroup) {
        return $xeButtonGroup.round;
      }
      return false;
    },
    computeBtnAlign: function computeBtnAlign() {
      var $xeButton = this;
      var props = $xeButton;
      var align = props.align;
      var $xeButtonGroup = $xeButton.$xeButtonGroup;
      if (align) {
        return align;
      }
      if ($xeButtonGroup) {
        return $xeButtonGroup.align;
      }
      return false;
    },
    computeBtnCircle: function computeBtnCircle() {
      var $xeButton = this;
      var props = $xeButton;
      var circle = props.circle;
      var $xeButtonGroup = $xeButton.$xeButtonGroup;
      if (circle) {
        return circle;
      }
      if ($xeButtonGroup) {
        return $xeButtonGroup.circle;
      }
      return false;
    },
    computeDownBtnList: function computeDownBtnList() {
      var $xeButton = this;
      var props = $xeButton;
      var options = props.options;
      if (options) {
        return options.filter(function (item) {
          var permissionCode = item.permissionCode;
          return !permissionCode || _ui.permission.checkVisible(permissionCode);
        });
      }
      return [];
    },
    computePopupOpts: function computePopupOpts() {
      var $xeButton = this;
      var props = $xeButton;
      return Object.assign({}, (0, _ui.getConfig)().button.popupConfig, props.popupConfig);
    },
    computePrefixTipOpts: function computePrefixTipOpts() {
      var $xeButton = this;
      var props = $xeButton;
      return Object.assign({}, (0, _ui.getConfig)().button.prefixTooltip, props.prefixTooltip);
    },
    computeSuffixTipOpts: function computeSuffixTipOpts() {
      var $xeButton = this;
      var props = $xeButton;
      return Object.assign({}, (0, _ui.getConfig)().button.suffixTooltip, props.suffixTooltip);
    }
  }),
  methods: {
    //
    // methods
    //
    dispatchEvent: function dispatchEvent(type, params, evnt) {
      var $xeButton = this;
      $xeButton.$emit((0, _vn.getEventCaseName)($xeButton, type), (0, _ui.createEvent)(evnt, {
        $button: $xeButton
      }, params));
    },
    openPanel: function openPanel() {
      var $xeButton = this;
      var props = $xeButton;
      var reactData = $xeButton.reactData;
      var internalData = $xeButton.internalData;
      var trigger = props.trigger;
      var btnTransfer = $xeButton.computeBtnTransfer;
      var panelElem = $xeButton.$refs.refBtnPanel;
      if (panelElem) {
        panelElem.dataset.active = 'Y';
        if (!reactData.initialized) {
          reactData.initialized = true;
          if (btnTransfer) {
            document.body.appendChild(panelElem);
          }
        }
        internalData.showTime = setTimeout(function () {
          if (panelElem.dataset.active === 'Y') {
            $xeButton.mouseenterDropdownEvent();
          } else {
            reactData.isAniVisible = false;
          }
        }, trigger === 'click' ? 50 : 250);
      }
      return $xeButton.$nextTick();
    },
    closePanel: function closePanel() {
      var $xeButton = this;
      return $xeButton.hidePanel();
    },
    hidePanel: function hidePanel() {
      var $xeButton = this;
      var reactData = $xeButton.reactData;
      var internalData = $xeButton.internalData;
      var panelElem = $xeButton.$refs.refBtnPanel;
      clearTimeout(internalData.showTime);
      if (panelElem) {
        panelElem.dataset.active = 'N';
        setTimeout(function () {
          if (panelElem.dataset.active !== 'Y') {
            reactData.visiblePanel = false;
            setTimeout(function () {
              if (panelElem.dataset.active !== 'Y') {
                reactData.isAniVisible = false;
              }
            }, 350);
          }
        }, 100);
      } else {
        reactData.isAniVisible = false;
        reactData.visiblePanel = false;
      }
      return $xeButton.$nextTick();
    },
    focus: function focus() {
      var $xeButton = this;
      var btnElem = $xeButton.$refs.refButton;
      if (btnElem) {
        btnElem.focus();
      }
      return $xeButton.$nextTick();
    },
    blur: function blur() {
      var $xeButton = this;
      var btnElem = $xeButton.$refs.refButton;
      if (btnElem) {
        btnElem.blur();
      }
      return $xeButton.$nextTick();
    },
    //
    // privateMethods
    //
    updateZindex: function updateZindex() {
      var $xeButton = this;
      var props = $xeButton;
      var reactData = $xeButton.reactData;
      var popupOpts = $xeButton.computePopupOpts;
      var customZIndex = popupOpts.zIndex || props.zIndex;
      if (customZIndex) {
        reactData.panelIndex = _xeUtils.default.toNumber(customZIndex);
      } else if (reactData.panelIndex < (0, _utils.getLastZIndex)()) {
        reactData.panelIndex = (0, _utils.nextZIndex)();
      }
    },
    updatePlacement: function updatePlacement() {
      var $xeButton = this;
      var props = $xeButton;
      var reactData = $xeButton.reactData;
      var placement = props.placement;
      var panelIndex = reactData.panelIndex;
      var targetElem = $xeButton.$refs.refButton;
      var panelElem = $xeButton.$refs.refBtnPanel;
      var btnTransfer = $xeButton.computeBtnTransfer;
      var popupOpts = $xeButton.computePopupOpts;
      var handleStyle = function handleStyle() {
        var ppObj = (0, _dom.updatePanelPlacement)(targetElem, panelElem, {
          placement: popupOpts.placement || placement,
          defaultPlacement: popupOpts.defaultPlacement,
          teleportTo: btnTransfer
        });
        var panelStyle = Object.assign(ppObj.style, {
          zIndex: panelIndex
        });
        reactData.panelStyle = panelStyle;
        reactData.panelPlacement = ppObj.placement;
      };
      handleStyle();
      return $xeButton.$nextTick().then(handleStyle);
    },
    clickEvent: function clickEvent(evnt) {
      var $xeButton = this;
      var props = $xeButton;
      var $xeButtonGroup = $xeButton.$xeButtonGroup;
      if ($xeButtonGroup) {
        $xeButtonGroup.handleClick({
          name: props.name
        }, evnt);
      }
      $xeButton.dispatchEvent('click', {
        $event: evnt
      }, evnt);
    },
    downBtnClickEvent: function downBtnClickEvent(params, option) {
      var $xeButton = this;
      var $event = params.$event;
      $xeButton.hidePanel();
      $xeButton.dispatchEvent('dropdown-click', {
        name: option.name,
        option: option
      }, $event);
    },
    mousedownDropdownEvent: function mousedownDropdownEvent(evnt) {
      var isLeftBtn = evnt.button === 0;
      if (isLeftBtn) {
        evnt.stopPropagation();
      }
    },
    clickDropdownEvent: function clickDropdownEvent(evnt) {
      var $xeButton = this;
      var reactData = $xeButton.reactData;
      var dropdownElem = evnt.currentTarget;
      var panelElem = $xeButton.$refs.refBtnPanel;
      var _getEventTargetNode = (0, _dom.getEventTargetNode)(evnt, dropdownElem, 'vxe-button'),
        flag = _getEventTargetNode.flag,
        targetElem = _getEventTargetNode.targetElem;
      if (flag) {
        if (panelElem) {
          panelElem.dataset.active = 'N';
        }
        reactData.visiblePanel = false;
        setTimeout(function () {
          if (!panelElem || panelElem.dataset.active !== 'Y') {
            reactData.isAniVisible = false;
          }
        }, 350);
        $xeButton.dispatchEvent('dropdown-click', {
          name: targetElem.getAttribute('name'),
          option: null,
          $event: evnt
        }, evnt);
      }
    },
    mouseenterDropdownEvent: function mouseenterDropdownEvent() {
      var $xeButton = this;
      var reactData = $xeButton.reactData;
      var panelElem = $xeButton.$refs.refBtnPanel;
      if (panelElem) {
        panelElem.dataset.active = 'Y';
        reactData.isAniVisible = true;
        setTimeout(function () {
          if (panelElem.dataset.active === 'Y') {
            reactData.visiblePanel = true;
            $xeButton.updateZindex();
            $xeButton.updatePlacement();
            setTimeout(function () {
              if (reactData.visiblePanel) {
                $xeButton.updatePlacement();
              }
            }, 50);
          }
        }, 20);
      }
    },
    mouseenterTargetEvent: function mouseenterTargetEvent(evnt) {
      var $xeButton = this;
      var props = $xeButton;
      var loading = props.loading;
      var btnDisabled = $xeButton.computeBtnDisabled;
      if (!(btnDisabled || loading)) {
        $xeButton.openPanel();
        $xeButton.mouseenterEvent(evnt);
      }
    },
    mouseleaveTargetEvent: function mouseleaveTargetEvent(evnt) {
      var $xeButton = this;
      $xeButton.hidePanel();
      $xeButton.mouseleaveEvent(evnt);
    },
    mouseenterEvent: function mouseenterEvent(evnt) {
      var $xeButton = this;
      $xeButton.dispatchEvent('mouseenter', {}, evnt);
    },
    mouseleaveEvent: function mouseleaveEvent(evnt) {
      var $xeButton = this;
      $xeButton.dispatchEvent('mouseleave', {}, evnt);
    },
    contextmenuEvent: function contextmenuEvent(evnt) {
      var $xeButton = this;
      $xeButton.dispatchEvent('contextmenu', {}, evnt);
    },
    clickTargetEvent: function clickTargetEvent(evnt) {
      var $xeButton = this;
      var props = $xeButton;
      var reactData = $xeButton.reactData;
      var loading = props.loading;
      var btnDisabled = $xeButton.computeBtnDisabled;
      if (!(btnDisabled || loading)) {
        var trigger = props.trigger;
        if (trigger === 'click') {
          if (reactData.visiblePanel) {
            $xeButton.hidePanel();
          } else {
            $xeButton.openPanel();
          }
        }
        $xeButton.clickEvent(evnt);
      }
    },
    mouseleaveDropdownEvent: function mouseleaveDropdownEvent() {
      var $xeButton = this;
      $xeButton.hidePanel();
    },
    handleGlobalMousewheelEvent: function handleGlobalMousewheelEvent(evnt) {
      var $xeButton = this;
      var reactData = $xeButton.reactData;
      var panelElem = $xeButton.$refs.refBtnPanel;
      if (reactData.visiblePanel && !(0, _dom.getEventTargetNode)(evnt, panelElem).flag) {
        $xeButton.hidePanel();
      }
    },
    handleGlobalMousedownEvent: function handleGlobalMousedownEvent(evnt) {
      var $xeButton = this;
      var reactData = $xeButton.reactData;
      var btnDisabled = $xeButton.computeBtnDisabled;
      var visiblePanel = reactData.visiblePanel;
      if (!btnDisabled) {
        var el = $xeButton.$refs.refElem;
        var panelElem = $xeButton.$refs.refBtnPanel;
        reactData.isActivated = (0, _dom.getEventTargetNode)(evnt, el).flag || (0, _dom.getEventTargetNode)(evnt, panelElem).flag;
        if (visiblePanel && !reactData.isActivated) {
          $xeButton.hidePanel();
        }
      }
    },
    handleGlobalResizeEvent: function handleGlobalResizeEvent() {
      var $xeButton = this;
      var reactData = $xeButton.reactData;
      var visiblePanel = reactData.visiblePanel;
      if (visiblePanel) {
        $xeButton.updatePlacement();
      }
    },
    //
    // Render
    //
    renderTooltipIcon: function renderTooltipIcon(h, tipOpts, type) {
      return h(_tooltip.default, {
        props: {
          useHtml: _xeUtils.default.isBoolean(tipOpts.useHtml) ? tipOpts.useHtml : tipOpts.useHTML,
          content: tipOpts.content,
          enterable: tipOpts.enterable,
          theme: tipOpts.theme
        },
        scopedSlots: {
          default: function _default() {
            return h('span', {
              class: "vxe-button--item vxe-button--tooltip-".concat(type, "-icon")
            }, [h('i', {
              class: tipOpts.icon || (0, _ui.getIcon)().BUTTON_TOOLTIP_ICON
            })]);
          }
        }
      });
    },
    renderContent: function renderContent(h) {
      var $xeButton = this;
      var props = $xeButton;
      var slots = $xeButton.$scopedSlots;
      var content = props.content,
        suffixIcon = props.suffixIcon,
        loading = props.loading,
        prefixTooltip = props.prefixTooltip,
        suffixTooltip = props.suffixTooltip,
        suffixRender = props.suffixRender;
      var prefixIcon = props.prefixIcon || props.icon;
      var prefixRender = props.prefixRender || props.iconRender;
      var prefixTipOpts = $xeButton.computePrefixTipOpts;
      var suffixTipOpts = $xeButton.computeSuffixTipOpts;
      var prefixIconSlot = slots.prefix || slots.icon;
      var suffixIconSlot = slots.suffix;
      var defaultSlot = slots.default;
      var contVNs = [];
      if (prefixTooltip) {
        contVNs.push($xeButton.renderTooltipIcon(h, prefixTipOpts, 'prefix'));
      }
      if (loading) {
        contVNs.push(h('i', {
          class: ['vxe-button--item vxe-button--loading-icon', (0, _ui.getIcon)().BUTTON_LOADING]
        }));
      } else if (prefixIconSlot) {
        contVNs.push(h('span', {
          class: 'vxe-button--item vxe-button--custom-prefix-icon'
        }, prefixIconSlot.call($xeButton, {})));
      } else if (prefixRender) {
        var compConf = _ui.renderer.get(prefixRender.name);
        var pIconMethod = compConf ? compConf.renderButtonPrefix : null;
        contVNs.push(h('span', {
          class: ['vxe-button--item vxe-button--custom-prefix-icon']
        }, pIconMethod ? (0, _vn.getSlotVNs)(pIconMethod.call($xeButton, h, prefixRender, {
          $button: $xeButton
        })) : []));
      } else if (prefixIcon) {
        contVNs.push(h('i', {
          class: ['vxe-button--item vxe-button--prefix-icon', prefixIcon]
        }));
      }
      if (defaultSlot) {
        contVNs.push(h('span', {
          class: 'vxe-button--item vxe-button--content'
        }, defaultSlot.call($xeButton, {})));
      } else if (content) {
        contVNs.push(h('span', {
          class: 'vxe-button--item vxe-button--content'
        }, (0, _utils.getFuncText)(content)));
      }
      if (suffixIconSlot) {
        contVNs.push(h('span', {
          class: 'vxe-button--item vxe-button--custom-suffix-icon'
        }, suffixIconSlot.call($xeButton, {})));
      } else if (suffixRender) {
        var _compConf = _ui.renderer.get(suffixRender.name);
        var sIconMethod = _compConf ? _compConf.renderButtonSuffix : null;
        contVNs.push(h('span', {
          class: ['vxe-button--item vxe-button--custom-suffix-icon']
        }, sIconMethod ? (0, _vn.getSlotVNs)(sIconMethod.call($xeButton, h, suffixRender, {
          $button: $xeButton
        })) : []));
      } else if (suffixIcon) {
        contVNs.push(h('i', {
          class: ['vxe-button--item vxe-button--suffix-icon', suffixIcon]
        }));
      }
      if (suffixTooltip) {
        contVNs.push($xeButton.renderTooltipIcon(h, suffixTipOpts, 'suffix'));
      }
      return contVNs;
    },
    renderVN: function renderVN(h) {
      var $xeButton = this;
      var props = $xeButton;
      var slots = $xeButton.$scopedSlots;
      var reactData = $xeButton.reactData;
      var className = props.className,
        trigger = props.trigger,
        title = props.title,
        routerLink = props.routerLink,
        type = props.type,
        destroyOnClose = props.destroyOnClose,
        name = props.name,
        loading = props.loading,
        shadow = props.shadow,
        showDropdownIcon = props.showDropdownIcon;
      var initialized = reactData.initialized,
        isAniVisible = reactData.isAniVisible,
        visiblePanel = reactData.visiblePanel;
      var isFormBtn = $xeButton.computeIsFormBtn;
      var btnMode = $xeButton.computeBtnMode;
      var btnStatus = $xeButton.computeBtnStatus;
      var btnRound = $xeButton.computeBtnRound;
      var btnCircle = $xeButton.computeBtnCircle;
      var btnTransfer = $xeButton.computeBtnTransfer;
      var btnAlign = $xeButton.computeBtnAlign;
      var btnDisabled = $xeButton.computeBtnDisabled;
      var permissionInfo = $xeButton.computePermissionInfo;
      var downBtnList = $xeButton.computeDownBtnList;
      var popupOpts = $xeButton.computePopupOpts;
      var vSize = $xeButton.computeSize;
      var dropdownsSlot = slots.dropdowns;
      var ppClassName = popupOpts.className || props.popupClassName;
      if (!permissionInfo.visible) {
        return (0, _ui.renderEmptyElement)($xeButton);
      }
      if (dropdownsSlot || downBtnList.length) {
        var btnOns = {
          contextmenu: $xeButton.contextmenuEvent
        };
        var panelOns = {};
        if (trigger === 'hover') {
          // hover 触发
          btnOns.mouseenter = $xeButton.mouseenterTargetEvent;
          btnOns.mouseleave = $xeButton.mouseleaveTargetEvent;
          panelOns.mouseenter = $xeButton.mouseenterDropdownEvent;
          panelOns.mouseleave = $xeButton.mouseleaveDropdownEvent;
        }
        return h('div', {
          ref: 'refElem',
          class: ['vxe-button--dropdown', className ? _xeUtils.default.isFunction(className) ? className({
            $button: $xeButton
          }) : className : '', _defineProperty(_defineProperty({}, "size--".concat(vSize), vSize), 'is--active', visiblePanel)]
        }, [routerLink ? h('router-link', {
          ref: 'refButton',
          class: ['vxe-button', 'vxe-button--link', "type--".concat(btnMode), btnAlign ? "align--".concat(btnAlign) : '', className ? _xeUtils.default.isFunction(className) ? className({
            $button: $xeButton
          }) : className : '', _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "size--".concat(vSize), vSize), "theme--".concat(btnStatus), btnStatus), 'is--round', btnRound), 'is--circle', btnCircle), 'is--shadow', shadow), 'is--disabled', btnDisabled || loading), 'is--loading', loading)],
          attrs: {
            title: title,
            name: name,
            type: isFormBtn ? type : 'button',
            disabled: btnDisabled || loading,
            custom: true,
            to: routerLink
          },
          on: Object.assign({
            click: $xeButton.clickTargetEvent
          }, btnOns)
        }, $xeButton.renderContent(h).concat(showDropdownIcon ? [h('i', {
          class: "vxe-button--dropdown-arrow ".concat((0, _ui.getIcon)().BUTTON_DROPDOWN)
        })] : [])) : h('button', {
          ref: 'refButton',
          class: ['vxe-button', "type--".concat(btnMode), btnAlign ? "align--".concat(btnAlign) : '', className ? _xeUtils.default.isFunction(className) ? className({
            $button: $xeButton
          }) : className : '', _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "size--".concat(vSize), vSize), "theme--".concat(btnStatus), btnStatus), 'is--round', btnRound), 'is--circle', btnCircle), 'is--shadow', shadow), 'is--disabled', btnDisabled || loading), 'is--loading', loading)],
          attrs: {
            title: title,
            name: name,
            type: isFormBtn ? type : 'button',
            disabled: btnDisabled || loading
          },
          on: Object.assign({
            click: $xeButton.clickTargetEvent
          }, btnOns)
        }, $xeButton.renderContent(h).concat(showDropdownIcon ? [h('i', {
          class: "vxe-button--dropdown-arrow ".concat((0, _ui.getIcon)().BUTTON_DROPDOWN)
        })] : [])), h('div', {
          ref: 'refBtnPanel',
          class: ['vxe-button--dropdown-panel', ppClassName ? _xeUtils.default.isFunction(ppClassName) ? ppClassName({
            $button: $xeButton
          }) : ppClassName : '', _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "size--".concat(vSize), vSize), 'is--transfer', btnTransfer), 'ani--leave', isAniVisible), 'ani--enter', visiblePanel)],
          attrs: {
            placement: reactData.panelPlacement
          },
          style: reactData.panelStyle,
          on: panelOns
        }, initialized && (visiblePanel || isAniVisible) ? [dropdownsSlot ? h('div', {
          class: 'vxe-button--dropdown-wrapper',
          on: {
            mousedown: $xeButton.mousedownDropdownEvent,
            click: $xeButton.clickDropdownEvent
          }
        }, initialized && (destroyOnClose ? visiblePanel || isAniVisible : true) ? dropdownsSlot.call($xeButton, {}) : []) : h('div', {
          class: 'vxe-button--dropdown-wrapper'
        }, initialized && (destroyOnClose ? visiblePanel || isAniVisible : true) ? downBtnList.map(function (option, i) {
          return h('vxe-button', {
            key: i,
            props: {
              type: option.type,
              mode: option.mode || btnMode,
              className: option.className,
              name: option.name,
              routerLink: option.routerLink,
              permissionCode: option.permissionCode,
              title: option.title,
              content: option.content,
              status: option.status,
              icon: option.icon,
              round: _xeUtils.default.isBoolean(option.round) ? option.round : btnMode === 'text' ? false : btnRound,
              circle: _xeUtils.default.isBoolean(option.circle) ? option.circle : btnMode === 'text' ? false : btnCircle,
              disabled: option.disabled,
              loading: option.loading,
              align: option.align
            },
            on: {
              click: function click(params) {
                $xeButton.downBtnClickEvent(params, option);
              }
            }
          });
        }) : [])] : [])]);
      }
      if (routerLink) {
        return h('router-link', {
          ref: 'refButton',
          class: ['vxe-button', 'vxe-button--link', "type--".concat(btnMode), btnAlign ? "align--".concat(btnAlign) : '', className ? _xeUtils.default.isFunction(className) ? className({
            $button: $xeButton
          }) : className : '', _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "size--".concat(vSize), vSize), "theme--".concat(btnStatus), btnStatus), 'is--round', btnRound), 'is--circle', btnCircle), 'is--shadow', shadow), 'is--disabled', btnDisabled || loading), 'is--loading', loading)],
          props: {
            title: title,
            name: name,
            type: isFormBtn ? type : 'button',
            disabled: btnDisabled || loading,
            custom: true,
            to: routerLink
          },
          on: {
            click: $xeButton.clickEvent,
            mouseenter: $xeButton.mouseenterEvent,
            mouseleave: $xeButton.mouseleaveEvent,
            contextmenu: $xeButton.contextmenuEvent
          }
        }, $xeButton.renderContent(h));
      }
      return h('button', {
        ref: 'refButton',
        class: ['vxe-button', "type--".concat(btnMode), btnAlign ? "align--".concat(btnAlign) : '', className ? _xeUtils.default.isFunction(className) ? className({
          $button: $xeButton
        }) : className : '', _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "size--".concat(vSize), vSize), "theme--".concat(btnStatus), btnStatus), 'is--round', btnRound), 'is--circle', btnCircle), 'is--shadow', shadow), 'is--disabled', btnDisabled || loading), 'is--loading', loading)],
        attrs: {
          title: title,
          name: name,
          type: isFormBtn ? type : 'button',
          disabled: btnDisabled || loading
        },
        on: {
          click: $xeButton.clickEvent,
          mouseenter: $xeButton.mouseenterEvent,
          mouseleave: $xeButton.mouseleaveEvent,
          contextmenu: $xeButton.contextmenuEvent
        }
      }, $xeButton.renderContent(h));
    }
  },
  mounted: function mounted() {
    var $xeButton = this;
    var props = $xeButton;
    if (props.type === 'text') {
      warnLog('vxe.error.delProp', ['type=text', 'mode=text']);
    }
    _ui.globalEvents.on($xeButton, 'mousewheel', $xeButton.handleGlobalMousewheelEvent);
    _ui.globalEvents.on($xeButton, 'mousedown', $xeButton.handleGlobalMousedownEvent);
    _ui.globalEvents.on($xeButton, 'resize', $xeButton.handleGlobalResizeEvent);
  },
  beforeDestroy: function beforeDestroy() {
    var $xeButton = this;
    var panelElem = $xeButton.$refs.refBtnPanel;
    if (panelElem && panelElem.parentNode) {
      panelElem.parentNode.removeChild(panelElem);
    }
  },
  destroyed: function destroyed() {
    var $xeButton = this;
    _ui.globalEvents.off($xeButton, 'mousewheel');
    _ui.globalEvents.off($xeButton, 'mousedown');
    _ui.globalEvents.off($xeButton, 'resize');
  },
  render: function render(h) {
    return this.renderVN(h);
  }
});
/* define-vxe-component end */