"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _comp = require("../../ui/src/comp");
var _xeUtils = _interopRequireDefault(require("xe-utils"));
var _ui = require("../../ui");
var _vn = require("../../ui/src/vn");
var _dom = require("../../ui/src/dom");
var _utils = require("../../ui/src/utils");
var _log = require("../../ui/src/log");
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)('splitter'),
  warnLog = _createComponentLog.warnLog,
  errLog = _createComponentLog.errLog;
var _default2 = exports.default = /* define-vxe-component start */(0, _comp.defineVxeComponent)({
  name: 'VxeSplitter',
  mixins: [_ui.globalMixins.sizeMixin],
  props: {
    width: [Number, String],
    height: [Number, String],
    vertical: {
      type: Boolean,
      default: function _default() {
        return (0, _ui.getConfig)().splitter.vertical;
      }
    },
    border: {
      type: Boolean,
      default: function _default() {
        return (0, _ui.getConfig)().splitter.border;
      }
    },
    padding: {
      type: Boolean,
      default: function _default() {
        return (0, _ui.getConfig)().splitter.padding;
      }
    },
    resize: {
      type: Boolean,
      default: function _default() {
        return (0, _ui.getConfig)().splitter.resize;
      }
    },
    items: Array,
    itemConfig: Object,
    barConfig: Object,
    resizeConfig: Object,
    actionConfig: Object,
    size: {
      type: String,
      default: function _default() {
        return (0, _ui.getConfig)().splitter.size || (0, _ui.getConfig)().size;
      }
    }
  },
  data: function data() {
    var xID = _xeUtils.default.uniqueId();
    var reactData = {
      staticItems: [],
      itemList: [],
      barWidth: 0,
      barHeight: 0,
      resizeFlag: 0
    };
    var internalData = {
      wrapperWidth: 0,
      wrapperHeight: 0
    };
    return {
      xID: xID,
      reactData: reactData,
      internalData: internalData,
      reFlag: 0
    };
  },
  provide: function provide() {
    var $xeSplitter = this;
    return {
      $xeSplitter: $xeSplitter
    };
  },
  computed: Object.assign(Object.assign({}, {}), {
    computeItemOpts: function computeItemOpts() {
      var $xeSplitter = this;
      var props = $xeSplitter;
      return Object.assign({}, (0, _ui.getConfig)().splitter.itemConfig, props.itemConfig);
    },
    computeBarOpts: function computeBarOpts() {
      var $xeSplitter = this;
      var props = $xeSplitter;
      return Object.assign({}, (0, _ui.getConfig)().splitter.barConfig, props.barConfig);
    },
    computeResizeOpts: function computeResizeOpts() {
      var $xeSplitter = this;
      var props = $xeSplitter;
      return Object.assign({}, (0, _ui.getConfig)().splitter.resizeConfig, props.resizeConfig);
    },
    computeActionOpts: function computeActionOpts() {
      var $xeSplitter = this;
      var props = $xeSplitter;
      return Object.assign({}, (0, _ui.getConfig)().splitter.actionConfig, props.actionConfig);
    },
    computeIsFoldNext: function computeIsFoldNext() {
      var $xeSplitter = this;
      var actionOpts = $xeSplitter.computeActionOpts;
      return actionOpts.direction === 'next';
    },
    computeVisibleItems: function computeVisibleItems() {
      var $xeSplitter = this;
      var reactData = $xeSplitter.reactData;
      return reactData.itemList.filter(function (item) {
        return item.isExpand;
      });
    },
    computeAutoItems: function computeAutoItems() {
      var $xeSplitter = this;
      var props = $xeSplitter;
      var reactData = $xeSplitter.reactData;
      var vertical = props.vertical;
      var autoItems = [];
      reactData.itemList.forEach(vertical ? function (item) {
        if (!item.height) {
          autoItems.push(item);
        }
      } : function (item) {
        if (!item.width) {
          autoItems.push(item);
        }
      });
      return {
        autoItems: autoItems
      };
    },
    computeWrapperStyle: function computeWrapperStyle() {
      var $xeSplitter = this;
      var props = $xeSplitter;
      var width = props.width,
        height = props.height;
      var barOpts = $xeSplitter.computeBarOpts;
      var barWidth = barOpts.width,
        barHeight = barOpts.height;
      var stys = {};
      if (height) {
        stys.height = (0, _dom.toCssUnit)(height);
      }
      if (width) {
        stys.width = (0, _dom.toCssUnit)(width);
      }
      if (barHeight) {
        stys['--vxe-ui-splitter-handle-bar-vertical-height'] = (0, _dom.toCssUnit)(barHeight);
      }
      if (barWidth) {
        stys['--vxe-ui-splitter-handle-bar-horizontal-width'] = (0, _dom.toCssUnit)(barWidth);
      }
      return stys;
    },
    computeSItemSize: function computeSItemSize() {
      var $xeSplitter = this;
      var reactData = $xeSplitter.reactData;
      return reactData.staticItems.length;
    }
  }),
  watch: {
    items: function items(val) {
      var $xeSplitter = this;
      $xeSplitter.loadItem(val || []);
    },
    computeSItemSize: function computeSItemSize() {
      var $xeSplitter = this;
      var props = $xeSplitter;
      var reactData = $xeSplitter.reactData;
      var actionOpts = $xeSplitter.computeActionOpts;
      var showPrevButton = actionOpts.showPrevButton,
        showNextButton = actionOpts.showNextButton;
      if (props.items && props.items.length) {
        errLog('vxe.error.errConflicts', ['<vxe-splitter-panel ...>', 'items']);
      }
      reactData.itemList = reactData.staticItems || [];
      if ((showPrevButton || showNextButton) && reactData.itemList.length > 2) {
        errLog('vxe.error.modelConflicts', ['action-config.showPrevButton | action-config.showNextButton', '<vxe-splitter-panel ...> Only supports 2 panel']);
      }
      reactData.itemList.forEach(function (item) {
        if (item.showAction) {
          warnLog('vxe.error.removeProp', ['show-action']);
        }
      });
      $xeSplitter.recalculate();
    }
  },
  methods: {
    //
    // Method
    //
    dispatchEvent: function dispatchEvent(type, params, evnt) {
      var $xeSplitter = this;
      $xeSplitter.$emit(type, (0, _ui.createEvent)(evnt, {
        $splitter: $xeSplitter
      }, params));
    },
    callSlot: function callSlot(slotFunc, params) {
      var $xeSplitter = this;
      var slots = $xeSplitter.$scopedSlots;
      if (slotFunc) {
        if (_xeUtils.default.isString(slotFunc)) {
          slotFunc = slots[slotFunc] || null;
        }
        if (_xeUtils.default.isFunction(slotFunc)) {
          return (0, _vn.getSlotVNs)(slotFunc(params));
        }
      }
      return [];
    },
    reset: function reset() {
      var $xeSplitter = this;
      var reactData = $xeSplitter.reactData;
      var itemList = reactData.itemList;
      itemList.forEach(function (item) {
        item.isExpand = true;
        item.foldHeight = 0;
        item.foldWidth = 0;
        item.resizeHeight = 0;
        item.resizeWidth = 0;
      });
      return $xeSplitter.$nextTick();
    },
    handleLoadItem: function handleLoadItem(list, isReset) {
      var $xeSplitter = this;
      var slots = $xeSplitter.$scopedSlots;
      var reactData = $xeSplitter.reactData;
      var staticItems = reactData.staticItems;
      var itemDef = {
        isExpand: true,
        renderWidth: 0,
        resizeWidth: 0,
        foldWidth: 0,
        renderHeight: 0,
        resizeHeight: 0,
        foldHeight: 0
      };
      reactData.itemList = list.map(function (item) {
        if (item.slots) {
          _xeUtils.default.each(item.slots, function (func) {
            if (!_xeUtils.default.isFunction(func)) {
              if (!slots[func]) {
                errLog('vxe.error.notSlot', [func]);
              }
            }
          });
        }
        return Object.assign({}, isReset ? null : itemDef, item, isReset ? itemDef : null, {
          id: _xeUtils.default.uniqueId()
        });
      });
      if (staticItems.length) {
        errLog('vxe.error.errConflicts', ['<vxe-splitter-panel ...>', 'items']);
      }
      return $xeSplitter.recalculate();
    },
    loadItem: function loadItem(list) {
      var $xeSplitter = this;
      return $xeSplitter.handleLoadItem(list || [], false);
    },
    reloadItem: function reloadItem(list) {
      var $xeSplitter = this;
      return $xeSplitter.handleLoadItem(list || [], true);
    },
    handleItemByName: function handleItemByName(name) {
      var $xeSplitter = this;
      var reactData = $xeSplitter.reactData;
      var itemList = reactData.itemList;
      var index = -1;
      var currItem = null;
      var prevItem = null;
      var nextItem = null;
      for (var i = 0; i < itemList.length; i++) {
        var item = itemList[i];
        if (item.name === name) {
          index = i;
          currItem = item;
          prevItem = itemList[i - 1] || null;
          nextItem = itemList[i + 1] || null;
          break;
        }
      }
      return {
        index: index,
        currItem: currItem,
        prevItem: prevItem,
        nextItem: nextItem
      };
    },
    setItemExpand: function setItemExpand(name, expanded) {
      var $xeSplitter = this;
      var restItem = $xeSplitter.handleItemByName(name);
      if (restItem) {
        var currItem = restItem.currItem,
          prevItem = restItem.prevItem,
          nextItem = restItem.nextItem;
        if (currItem) {
          if (expanded ? !currItem.isExpand : currItem.isExpand) {
            if (nextItem) {
              if (nextItem.isExpand) {
                $xeSplitter.handleItemActionEvent(null, currItem, nextItem, false);
              }
            } else if (prevItem) {
              if (prevItem.isExpand) {
                $xeSplitter.handleItemActionEvent(null, prevItem, currItem, true);
              }
            }
          }
        }
      }
      return $xeSplitter.$nextTick();
    },
    toggleItemExpand: function toggleItemExpand(name) {
      var $xeSplitter = this;
      var restItem = $xeSplitter.handleItemByName(name);
      if (restItem) {
        var currItem = restItem.currItem;
        if (currItem) {
          return $xeSplitter.setItemExpand(name, !currItem.isExpand);
        }
      }
      return $xeSplitter.$nextTick();
    },
    getItemVisible: function getItemVisible(name) {
      var $xeSplitter = this;
      var restItem = $xeSplitter.handleItemByName(name);
      if (restItem) {
        var currItem = restItem.currItem;
        if (currItem) {
          return $xeSplitter.setItemExpand(name, !currItem.isExpand);
        }
      }
      return false;
    },
    recalculate: function recalculate() {
      var $xeSplitter = this;
      var props = $xeSplitter;
      var reactData = $xeSplitter.reactData;
      var internalData = $xeSplitter.internalData;
      return $xeSplitter.$nextTick().then(function () {
        var vertical = props.vertical;
        var itemList = reactData.itemList;
        var el = $xeSplitter.$refs.refElem;
        var barInfoElem = $xeSplitter.$refs.refBarInfoElem;
        if (!el) {
          return;
        }
        var wWidth = el.clientWidth;
        var wHeight = el.clientHeight;
        if (!wWidth || !wHeight) {
          return;
        }
        if (barInfoElem) {
          reactData.barWidth = barInfoElem.offsetWidth;
          reactData.barHeight = barInfoElem.offsetHeight;
        }
        var contentWidth = wWidth - (vertical ? 0 : reactData.barWidth * (itemList.length - 1));
        var contentHeight = wHeight - (vertical ? reactData.barHeight * (itemList.length - 1) : 0);
        var itemOpts = $xeSplitter.computeItemOpts;
        var allMinWidth = _xeUtils.default.toNumber(itemOpts.minWidth);
        var allMinHeight = _xeUtils.default.toNumber(itemOpts.minHeight);
        var residueItems = [];
        if (vertical) {
          var countHeight = 0;
          itemList.forEach(function (item) {
            var height = item.height;
            var itemHeight = 0;
            if (height) {
              if ((0, _dom.isScale)(height)) {
                itemHeight = contentHeight * _xeUtils.default.toNumber(height) / 100;
              } else {
                itemHeight = _xeUtils.default.toNumber(height);
              }
              item.renderHeight = itemHeight;
            } else {
              residueItems.push(item);
            }
            countHeight += itemHeight;
          });
          if (residueItems.length) {
            var reMeanHeight = (contentHeight - countHeight) / residueItems.length;
            residueItems.forEach(function (item) {
              item.renderHeight = Math.max(_xeUtils.default.toNumber((0, _utils.getGlobalDefaultConfig)(item.minHeight, allMinHeight)), reMeanHeight);
            });
          }
        } else {
          var countWidth = 0;
          itemList.forEach(function (item) {
            var width = item.width;
            var itemWidth = 0;
            if (width) {
              if ((0, _dom.isScale)(width)) {
                itemWidth = contentWidth * _xeUtils.default.toNumber(width) / 100;
              } else {
                itemWidth = _xeUtils.default.toNumber(width);
              }
              item.renderWidth = itemWidth;
            } else {
              residueItems.push(item);
            }
            countWidth += itemWidth;
          });
          if (residueItems.length) {
            var reMeanWidth = (contentWidth - countWidth) / residueItems.length;
            residueItems.forEach(function (item) {
              item.renderWidth = Math.max(_xeUtils.default.toNumber((0, _utils.getGlobalDefaultConfig)(item.minWidth, allMinWidth)), reMeanWidth);
            });
          }
        }
        internalData.wrapperWidth = contentWidth;
        internalData.wrapperHeight = contentHeight;
      });
    },
    dragEvent: function dragEvent(evnt) {
      var $xeSplitter = this;
      var props = $xeSplitter;
      var reactData = $xeSplitter.reactData;
      var resize = props.resize,
        vertical = props.vertical;
      var itemList = reactData.itemList;
      if (!resize) {
        return;
      }
      evnt.preventDefault();
      var barEl = evnt.currentTarget;
      var handleEl = barEl.parentElement;
      var el = $xeSplitter.$refs.refElem;
      if (!el) {
        return;
      }
      var prevEl = handleEl.previousElementSibling;
      var nextEl = handleEl.nextElementSibling;
      if (!prevEl || !nextEl) {
        return;
      }
      var prevId = prevEl.getAttribute('itemid');
      var nextId = nextEl.getAttribute('itemid');
      var prevItem = itemList.find(function (item) {
        return item.id === prevId;
      });
      var nextItem = itemList.find(function (item) {
        return item.id === nextId;
      });
      if (!prevItem || !nextItem) {
        return;
      }
      var containerRect = el.getBoundingClientRect();
      var barRect = barEl.getBoundingClientRect();
      var rsSplitterLineEl = $xeSplitter.$refs.refResizableSplitterTip;
      var rsSplitterTipEl = rsSplitterLineEl ? rsSplitterLineEl.children[0] : null;
      var itemOpts = $xeSplitter.computeItemOpts;
      var resizeOpts = $xeSplitter.computeResizeOpts;
      var immediate = resizeOpts.immediate;
      var allMinWidth = _xeUtils.default.toNumber(itemOpts.minWidth);
      var allMinHeight = _xeUtils.default.toNumber(itemOpts.minHeight);
      var barOffsetX = Math.ceil(barRect.width - (evnt.clientX - barRect.left));
      var barOffsetY = Math.ceil(evnt.clientY - barRect.top);
      var prevWidth = prevEl.offsetWidth;
      var nextWidth = nextEl.offsetWidth;
      var prevMinWidth = _xeUtils.default.toNumber(prevItem ? (0, _utils.getGlobalDefaultConfig)(prevItem.minWidth, allMinWidth) : allMinWidth);
      var nextMinWidth = _xeUtils.default.toNumber(nextItem ? (0, _utils.getGlobalDefaultConfig)(nextItem.minWidth, allMinWidth) : allMinWidth);
      var minOffsetLeft = prevEl.offsetLeft + prevMinWidth - barOffsetX;
      var maxOffsetLeft = nextEl.offsetLeft + nextEl.offsetWidth - nextMinWidth - barOffsetX;
      var startOffsetLeft = evnt.clientX - containerRect.left;
      var targetOffsetWidth = -1;
      var prevResizeWidth = 0;
      var nextResizeWidth = 0;
      var offsetLeft = startOffsetLeft;
      var prevHeight = prevEl.offsetHeight;
      var nextHeight = nextEl.offsetHeight;
      var prevMinHeight = _xeUtils.default.toNumber(prevItem ? (0, _utils.getGlobalDefaultConfig)(prevItem.minHeight, allMinHeight) : allMinHeight);
      var nextMinHeight = _xeUtils.default.toNumber(nextItem ? (0, _utils.getGlobalDefaultConfig)(nextItem.minHeight, allMinHeight) : allMinHeight);
      var minOffsetTop = prevEl.offsetTop + prevMinHeight + barOffsetY;
      var maxOffsetTop = nextEl.offsetTop + nextEl.offsetHeight - nextMinHeight + barOffsetY;
      var startOffsetTop = evnt.clientY - containerRect.top;
      var targetOffsetHeight = -1;
      var prevResizeHeight = 0;
      var nextResizeHeight = 0;
      var offsetTop = startOffsetTop;
      var handleReStyle = function handleReStyle(evnt) {
        if (!rsSplitterLineEl) {
          return;
        }
        var rsNumPrevEl = rsSplitterTipEl ? rsSplitterTipEl.children[0] : null;
        var rsNumNextEl = rsSplitterTipEl ? rsSplitterTipEl.children[1] : null;
        if (vertical) {
          var tipWidth = 0;
          if (rsNumPrevEl) {
            if (targetOffsetHeight < 0) {
              rsNumPrevEl.style.display = 'none';
            } else {
              rsNumPrevEl.textContent = "".concat(Math.floor(prevResizeHeight), "px");
              rsNumPrevEl.style.display = 'block';
              tipWidth = rsNumPrevEl.offsetWidth;
            }
          }
          if (rsNumNextEl) {
            if (targetOffsetHeight < 0) {
              rsNumNextEl.textContent = "".concat(Math.floor(nextResizeHeight), "px");
              rsNumNextEl.style.display = 'block';
              tipWidth = rsNumNextEl.offsetWidth;
            } else {
              rsNumNextEl.style.display = 'none';
            }
          }
          var rsLeft = Math.max(1, evnt.clientX - containerRect.left - tipWidth / 2);
          if (rsLeft > containerRect.width - tipWidth - 1) {
            rsLeft = containerRect.width - tipWidth - 1;
          }
          rsSplitterLineEl.style.left = '0';
          rsSplitterLineEl.style.top = "".concat(offsetTop, "px");
          if (rsSplitterTipEl) {
            rsSplitterTipEl.style.left = "".concat(rsLeft, "px");
          }
        } else {
          var tipHeight = 0;
          if (rsNumPrevEl) {
            if (targetOffsetWidth < 0) {
              rsNumPrevEl.style.display = 'none';
            } else {
              rsNumPrevEl.textContent = "".concat(Math.floor(prevResizeWidth), "px");
              rsNumPrevEl.style.display = 'block';
              tipHeight = rsNumPrevEl.offsetHeight;
            }
          }
          if (rsNumNextEl) {
            if (targetOffsetWidth < 0) {
              rsNumNextEl.textContent = "".concat(Math.floor(nextResizeWidth), "px");
              rsNumNextEl.style.display = 'block';
              tipHeight = rsNumNextEl.offsetHeight;
            } else {
              rsNumNextEl.style.display = 'none';
            }
          }
          var rsTop = Math.max(1, evnt.clientY - containerRect.top - tipHeight / 2);
          if (rsTop > containerRect.height - tipHeight - 1) {
            rsTop = containerRect.height - tipHeight - 1;
          }
          rsSplitterLineEl.style.top = '0';
          rsSplitterLineEl.style.left = "".concat(offsetLeft, "px");
          if (rsSplitterTipEl) {
            rsSplitterTipEl.style.top = "".concat(rsTop, "px");
          }
        }
      };
      var handleUpdate = function handleUpdate() {
        if (vertical) {
          prevItem.resizeHeight = prevResizeHeight;
          nextItem.resizeHeight = nextResizeHeight;
        } else {
          prevItem.resizeWidth = prevResizeWidth;
          nextItem.resizeWidth = nextResizeWidth;
        }
      };
      var handleDrag = function handleDrag(evnt) {
        if (vertical) {
          offsetTop = evnt.clientY - containerRect.top;
          if (offsetTop < minOffsetTop) {
            offsetTop = minOffsetTop;
          }
          if (offsetTop > maxOffsetTop) {
            offsetTop = maxOffsetTop;
          }
          targetOffsetHeight = offsetTop - startOffsetTop;
          prevResizeHeight = prevHeight + targetOffsetHeight;
          nextResizeHeight = nextHeight - targetOffsetHeight;
        } else {
          offsetLeft = evnt.clientX - containerRect.left;
          if (offsetLeft < minOffsetLeft) {
            offsetLeft = minOffsetLeft;
          }
          if (offsetLeft > maxOffsetLeft) {
            offsetLeft = maxOffsetLeft;
          }
          targetOffsetWidth = offsetLeft - startOffsetLeft;
          prevResizeWidth = prevWidth + targetOffsetWidth;
          nextResizeWidth = nextWidth - targetOffsetWidth;
        }
        if (immediate) {
          if (vertical) {
            prevEl.style.height = (0, _dom.toCssUnit)(prevResizeHeight);
            nextEl.style.height = (0, _dom.toCssUnit)(nextResizeHeight);
          } else {
            prevEl.style.width = (0, _dom.toCssUnit)(prevResizeWidth);
            nextEl.style.width = (0, _dom.toCssUnit)(nextResizeWidth);
          }
        }
        if (rsSplitterLineEl) {
          handleReStyle(evnt);
        }
        $xeSplitter.dispatchEvent('resize-drag', {
          prevItem: prevItem,
          nextItem: nextItem,
          offsetHeight: targetOffsetHeight,
          offsetWidth: targetOffsetWidth
        }, evnt);
      };
      document.onmousemove = function (evnt) {
        evnt.preventDefault();
        handleDrag(evnt);
        reactData.resizeFlag++;
      };
      document.onmouseup = function (evnt) {
        document.onmousemove = null;
        document.onmouseup = null;
        if (rsSplitterLineEl) {
          rsSplitterLineEl.style.display = '';
        }
        handleUpdate();
        (0, _dom.removeClass)(el, 'is--drag');
        $xeSplitter.dispatchEvent('resize-end', {
          prevItem: prevItem,
          nextItem: nextItem,
          offsetHeight: targetOffsetHeight,
          offsetWidth: targetOffsetWidth
        }, evnt);
        $xeSplitter.recalculate();
        reactData.resizeFlag++;
      };
      if (rsSplitterLineEl) {
        rsSplitterLineEl.style.display = 'block';
        handleReStyle(evnt);
      }
      handleDrag(evnt);
      (0, _dom.addClass)(el, 'is--drag');
      $xeSplitter.dispatchEvent('resize-start', {
        prevItem: prevItem,
        nextItem: nextItem
      }, evnt);
    },
    handleItemActionEvent: function handleItemActionEvent(evnt, prevItem, nextItem, isNext) {
      var $xeSplitter = this;
      var props = $xeSplitter;
      var reactData = $xeSplitter.reactData;
      var vertical = props.vertical;
      var expanded = false;
      var item = prevItem;
      if (isNext) {
        item = nextItem;
        expanded = !nextItem.isExpand;
        nextItem.isExpand = expanded;
      } else {
        expanded = !prevItem.isExpand;
        prevItem.isExpand = expanded;
      }
      if (vertical) {
        if (prevItem.isExpand && nextItem.isExpand) {
          prevItem.foldHeight = 0;
          nextItem.foldHeight = 0;
        } else if (prevItem.isExpand) {
          nextItem.foldHeight = 0;
          prevItem.foldHeight = (prevItem.resizeHeight || prevItem.renderHeight) + (nextItem.resizeHeight || nextItem.renderHeight);
        } else {
          prevItem.foldHeight = 0;
          nextItem.foldHeight = (prevItem.resizeHeight || prevItem.renderHeight) + (nextItem.resizeHeight || nextItem.renderHeight);
        }
      } else {
        if (prevItem.isExpand && nextItem.isExpand) {
          prevItem.foldWidth = 0;
          nextItem.foldWidth = 0;
        } else if (prevItem.isExpand) {
          nextItem.foldWidth = 0;
          prevItem.foldWidth = (prevItem.resizeWidth || prevItem.renderWidth) + (nextItem.resizeWidth || nextItem.renderWidth);
        } else {
          prevItem.foldWidth = 0;
          nextItem.foldWidth = (prevItem.resizeWidth || prevItem.renderWidth) + (nextItem.resizeWidth || nextItem.renderWidth);
        }
      }
      if (evnt) {
        $xeSplitter.dispatchEvent('toggle-expand', {
          prevItem: prevItem,
          nextItem: nextItem,
          expanded: expanded,
          item: item
        }, evnt);
      }
      $xeSplitter.recalculate();
      reactData.resizeFlag++;
    },
    handlePrevActionDblclickEvent: function handlePrevActionDblclickEvent(evnt) {
      var $xeSplitter = this;
      var reactData = $xeSplitter.reactData;
      var itemList = reactData.itemList;
      var actionOpts = $xeSplitter.computeActionOpts;
      var btnEl = evnt.currentTarget;
      var btnWrapperEl = btnEl.parentElement;
      var handleEl = btnWrapperEl.parentElement;
      var prevEl = handleEl.previousElementSibling;
      var prevId = prevEl.getAttribute('itemid');
      var prevItem = itemList.find(function (item) {
        return item.id === prevId;
      });
      var nextEl = handleEl.nextElementSibling;
      var nextId = nextEl.getAttribute('itemid');
      var nextItem = itemList.find(function (item) {
        return item.id === nextId;
      });
      if (actionOpts.trigger === 'dblclick') {
        if (prevItem && nextItem && nextItem.isExpand) {
          $xeSplitter.handleItemActionEvent(evnt, prevItem, nextItem, false);
        }
      }
      $xeSplitter.dispatchEvent('action-dblclick', {
        prevItem: prevItem,
        nextItem: nextItem
      }, evnt);
    },
    handlePrevActionClickEvent: function handlePrevActionClickEvent(evnt) {
      var $xeSplitter = this;
      var reactData = $xeSplitter.reactData;
      var itemList = reactData.itemList;
      var actionOpts = $xeSplitter.computeActionOpts;
      var btnEl = evnt.currentTarget;
      var btnWrapperEl = btnEl.parentElement;
      var handleEl = btnWrapperEl.parentElement;
      var prevEl = handleEl.previousElementSibling;
      var prevId = prevEl.getAttribute('itemid');
      var prevItem = itemList.find(function (item) {
        return item.id === prevId;
      });
      var nextEl = handleEl.nextElementSibling;
      var nextId = nextEl.getAttribute('itemid');
      var nextItem = itemList.find(function (item) {
        return item.id === nextId;
      });
      if (actionOpts.trigger !== 'dblclick') {
        if (prevItem && nextItem && nextItem.isExpand) {
          $xeSplitter.handleItemActionEvent(evnt, prevItem, nextItem, false);
        }
      }
      $xeSplitter.dispatchEvent('action-click', {
        prevItem: prevItem,
        nextItem: nextItem
      }, evnt);
    },
    handleNextActionDblclickEvent: function handleNextActionDblclickEvent(evnt) {
      var $xeSplitter = this;
      var reactData = $xeSplitter.reactData;
      var itemList = reactData.itemList;
      var actionOpts = $xeSplitter.computeActionOpts;
      var btnEl = evnt.currentTarget;
      var btnWrapperEl = btnEl.parentElement;
      var handleEl = btnWrapperEl.parentElement;
      var prevEl = handleEl.previousElementSibling;
      var prevId = prevEl.getAttribute('itemid');
      var prevItem = itemList.find(function (item) {
        return item.id === prevId;
      });
      var nextEl = handleEl.nextElementSibling;
      var nextId = nextEl.getAttribute('itemid');
      var nextItem = itemList.find(function (item) {
        return item.id === nextId;
      });
      if (actionOpts.trigger === 'dblclick') {
        if (prevItem && nextItem && prevItem.isExpand) {
          $xeSplitter.handleItemActionEvent(evnt, prevItem, nextItem, true);
        }
      }
      $xeSplitter.dispatchEvent('action-dblclick', {
        prevItem: prevItem,
        nextItem: nextItem
      }, evnt);
    },
    handleNextActionClickEvent: function handleNextActionClickEvent(evnt) {
      var $xeSplitter = this;
      var reactData = $xeSplitter.reactData;
      var itemList = reactData.itemList;
      var actionOpts = $xeSplitter.computeActionOpts;
      var btnEl = evnt.currentTarget;
      var btnWrapperEl = btnEl.parentElement;
      var handleEl = btnWrapperEl.parentElement;
      var prevEl = handleEl.previousElementSibling;
      var prevId = prevEl.getAttribute('itemid');
      var prevItem = itemList.find(function (item) {
        return item.id === prevId;
      });
      var nextEl = handleEl.nextElementSibling;
      var nextId = nextEl.getAttribute('itemid');
      var nextItem = itemList.find(function (item) {
        return item.id === nextId;
      });
      if (actionOpts.trigger !== 'dblclick') {
        if (prevItem && nextItem && prevItem.isExpand) {
          $xeSplitter.handleItemActionEvent(evnt, prevItem, nextItem, true);
        }
      }
      $xeSplitter.dispatchEvent('action-click', {
        prevItem: prevItem,
        nextItem: nextItem
      }, evnt);
    },
    handleGlobalResizeEvent: function handleGlobalResizeEvent() {
      var $xeSplitter = this;
      $xeSplitter.recalculate();
    },
    getActionIcon: function getActionIcon(prevItem, nextItem, isNext) {
      var $xeSplitter = this;
      var props = $xeSplitter;
      var vertical = props.vertical;
      var topIcon = 'SPLIT_TOP_ACTION';
      var bottomIcon = 'SPLIT_BOTTOM_ACTION';
      var leftIcon = 'SPLIT_LEFT_ACTION';
      var rightIcon = 'SPLIT_RIGHT_ACTION';
      var iconName = '';
      if (vertical) {
        if (isNext) {
          iconName = nextItem.isExpand ? bottomIcon : topIcon;
        } else {
          iconName = prevItem.isExpand ? topIcon : bottomIcon;
        }
      } else {
        if (isNext) {
          iconName = nextItem.isExpand ? rightIcon : leftIcon;
        } else {
          iconName = prevItem.isExpand ? leftIcon : rightIcon;
        }
      }
      if (iconName) {
        return (0, _ui.getIcon)()[iconName];
      }
      return '';
    },
    //
    // Render
    //
    renderHandleBar: function renderHandleBar(h, prevItem, nextItem) {
      var $xeSplitter = this;
      var props = $xeSplitter;
      var reactData = $xeSplitter.reactData;
      var border = props.border,
        resize = props.resize,
        vertical = props.vertical;
      var itemList = reactData.itemList;
      var actionOpts = $xeSplitter.computeActionOpts;
      var direction = actionOpts.direction;
      var showPrevButton = _xeUtils.default.isBoolean(actionOpts.showPrevButton) ? actionOpts.showPrevButton : itemList.some(function (item) {
        return item.showAction;
      });
      var showNextButton = _xeUtils.default.isBoolean(actionOpts.showNextButton) ? actionOpts.showNextButton : direction === 'next' && itemList.some(function (item) {
        return item.showAction;
      });
      var resizeOpts = $xeSplitter.computeResizeOpts;
      var immediate = resizeOpts.immediate;
      return h('div', {
        class: ['vxe-splitter-panel-handle', vertical ? 'is--vertical' : 'is--horizontal', immediate ? 'is-resize--immediate' : 'is-resize--lazy', {
          'is--resize': resize,
          'is--border': border
        }]
      }, [h('div', {
        class: 'vxe-splitter-panel-handle-bar',
        on: {
          mousedown: $xeSplitter.dragEvent
        }
      }), itemList.length === 2 ? h('div', {
        class: 'vxe-splitter-panel-action-btn-wrapper'
      }, [showPrevButton && nextItem.isExpand ? h('div', {
        class: ['vxe-splitter-panel-action-btn', prevItem.isExpand ? 'is--prev' : 'is--next'],
        on: {
          dblclick: $xeSplitter.handlePrevActionDblclickEvent,
          click: $xeSplitter.handlePrevActionClickEvent
        }
      }, [h('i', {
        class: $xeSplitter.getActionIcon(prevItem, nextItem, false)
      })]) : (0, _ui.renderEmptyElement)($xeSplitter), showNextButton && prevItem.isExpand ? h('div', {
        class: ['vxe-splitter-panel-action-btn', nextItem.isExpand ? 'is--next' : 'is--prev'],
        on: {
          dblclick: $xeSplitter.handleNextActionDblclickEvent,
          click: $xeSplitter.handleNextActionClickEvent
        }
      }, [h('i', {
        class: $xeSplitter.getActionIcon(prevItem, nextItem, true)
      })]) : (0, _ui.renderEmptyElement)($xeSplitter)]) : (0, _ui.renderEmptyElement)($xeSplitter)]);
    },
    renderItems: function renderItems(h) {
      var $xeSplitter = this;
      var props = $xeSplitter;
      var reactData = $xeSplitter.reactData;
      var border = props.border,
        padding = props.padding,
        resize = props.resize,
        vertical = props.vertical;
      var itemList = reactData.itemList;
      var vSize = $xeSplitter.computeSize;
      var actionOpts = $xeSplitter.computeActionOpts;
      var autoHideButton = actionOpts.autoHideButton;
      var resizeOpts = $xeSplitter.computeResizeOpts;
      var immediate = resizeOpts.immediate;
      var visibleItems = $xeSplitter.computeVisibleItems;
      var autoItems = $xeSplitter.computeAutoItems.autoItems;
      var isOnlyView = visibleItems.length <= 1;
      var itemVNs = [];
      itemList.forEach(function (prevItem, index) {
        var id = prevItem.id,
          name = prevItem.name,
          slots = prevItem.slots,
          renderHeight = prevItem.renderHeight,
          resizeHeight = prevItem.resizeHeight,
          foldHeight = prevItem.foldHeight,
          renderWidth = prevItem.renderWidth,
          resizeWidth = prevItem.resizeWidth,
          foldWidth = prevItem.foldWidth,
          isExpand = prevItem.isExpand;
        var nextItem = itemList[index + 1];
        var defaultSlot = slots ? slots.default : null;
        var stys = {};
        var itemWidth = isExpand ? foldWidth || resizeWidth || renderWidth : 0;
        var itemHeight = isExpand ? foldHeight || resizeHeight || renderHeight : 0;
        // 至少存在一个自适应
        if (autoItems.length === 1) {
          if (vertical) {
            if (!prevItem.height) {
              itemHeight = 0;
            }
          } else {
            if (!prevItem.width) {
              itemWidth = 0;
            }
          }
        }
        var isFill = true;
        if (vertical) {
          if (itemHeight && visibleItems.length > 1) {
            isFill = false;
            stys.height = (0, _dom.toCssUnit)(itemHeight);
          }
        } else {
          if (itemWidth && visibleItems.length > 1) {
            isFill = false;
            stys.width = (0, _dom.toCssUnit)(itemWidth);
          }
        }
        itemVNs.push(h('div', {
          attrs: {
            itemid: id
          },
          class: ['vxe-splitter-panel', vertical ? 'is--vertical' : 'is--horizontal', immediate ? 'is-resize--immediate' : 'is-resize--lazy', _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "size--".concat(vSize), vSize), 'is--resize', resize), 'is--padding', padding), 'is--border', border), 'is--height', itemHeight), 'is--width', itemWidth), 'is--visible', isExpand), 'is--hidden', !isExpand), 'is--fill', isExpand && isFill)],
          style: stys
        }, [h('div', {
          attrs: {
            itemid: id
          },
          class: 'vxe-splitter-panel--wrapper'
        }, [h('div', {
          class: 'vxe-splitter-panel--inner'
        }, defaultSlot ? $xeSplitter.callSlot(defaultSlot, {
          name: name,
          isExpand: isExpand
        }) : [])])]));
        if (nextItem) {
          itemVNs.push($xeSplitter.renderHandleBar(h, prevItem, nextItem));
        }
      });
      return h('div', {
        class: ['vxe-splitter-wrapper', {
          'is--ah-btn': autoHideButton,
          'is--only-view': isOnlyView
        }]
      }, itemVNs);
    },
    renderVN: function renderVN(h) {
      var $xeSplitter = this;
      var props = $xeSplitter;
      var slots = $xeSplitter.$scopedSlots;
      var vertical = props.vertical;
      var vSize = $xeSplitter.computeSize;
      var resizeOpts = $xeSplitter.computeResizeOpts;
      var wrapperStyle = $xeSplitter.computeWrapperStyle;
      var immediate = resizeOpts.immediate,
        showTip = resizeOpts.showTip;
      var defaultSlot = slots.default;
      return h('div', {
        ref: 'refElem',
        class: ['vxe-splitter', vertical ? 'is--vertical' : 'is--horizontal', immediate ? 'is-resize--immediate' : 'is-resize--lazy', _defineProperty({}, "size--".concat(vSize), vSize)],
        style: wrapperStyle
      }, [h('div', {
        class: 'vxe-splitter-slots'
      }, defaultSlot ? defaultSlot({}) : []), $xeSplitter.renderItems(h), h('div', {
        ref: 'refResizableSplitterTip',
        class: ['vxe-splitter--resizable-splitter-tip', vertical ? 'is--vertical' : 'is--horizontal', immediate ? 'is-resize--immediate' : 'is-resize--lazy']
      }, showTip ? [h('div', {
        class: 'vxe-splitter--resizable-splitter-tip-number'
      }, [h('div', {
        class: 'vxe-splitter--resizable-splitter-number-prev'
      }), h('div', {
        class: 'vxe-splitter--resizable-splitter-number-next'
      })])] : []), h('div', {
        class: 'vxe-splitter--render-vars'
      }, [h('div', {
        ref: 'refBarInfoElem',
        class: 'vxe-splitter--handle-bar-info'
      })])]);
    }
  },
  created: function created() {
    var $xeSplitter = this;
    _ui.globalEvents.on($xeSplitter, 'resize', $xeSplitter.handleGlobalResizeEvent);
  },
  mounted: function mounted() {
    var $xeSplitter = this;
    var props = $xeSplitter;
    var el = $xeSplitter.$refs.refElem;
    if (el) {
      var resizeObserver = _ui.globalResize.create(function () {
        $xeSplitter.recalculate();
      });
      resizeObserver.observe(el);
      this.$resize = resizeObserver;
    }
    if (props.items) {
      $xeSplitter.loadItem(props.items);
    }
    var actionOpts = $xeSplitter.computeActionOpts;
    if (actionOpts.direction) {
      errLog('vxe.error.delProp', ['action-config.direction', 'action-config.showPrevButton | action-config.showNextButton']);
    }
    $xeSplitter.$nextTick(function () {
      $xeSplitter.recalculate();
    });
  },
  beforeDestroy: function beforeDestroy() {
    var $xeSplitter = this;
    if (this.$resize) {
      this.$resize.disconnect();
    }
    _ui.globalEvents.off($xeSplitter, 'resize');
  },
  render: function render(h) {
    return this.renderVN(h);
  }
});
/* define-vxe-component end */