vxe-pc-ui 3.17.6 → 3.17.8

package/lib/index.umd.js

@@ -13261,7 +13261,7 @@ var es_array_join = __webpack_require__(8598);
 
 
 var log_log = VxeUI.log;
-var uiVersion = "ui v".concat("3.17.6");
+var uiVersion = "ui v".concat("3.17.8");
 function createComponentLog(name) {
   var tableVersion = VxeUI.tableVersion ? "table v".concat(VxeUI.tableVersion) : '';
   var ganttVersion = VxeUI.ganttVersion ? "gantt v".concat(VxeUI.ganttVersion) : '';
@@ -13281,7 +13281,7 @@ var errLog = log_log.create('error', uiVersion);
 
 
 
-var ui_version = "3.17.6";
+var ui_version = "3.17.8";
 VxeUI.uiVersion = ui_version;
 VxeUI.dynamicApp = dynamicApp;
 function config(options) {
@@ -13698,7 +13698,8 @@ setConfig({
     theme: 'dark',
     enterDelay: 500,
     leaveDelay: 300,
-    isArrow: true
+    isArrow: true,
+    defaultPlacement: 'top'
   },
   transfer: {},
   tree: {
@@ -13712,8 +13713,7 @@ setConfig({
     tooltipConfig: {
       mode: 'tooltip',
       enterable: true,
-      leaveDelay: 300,
-      defaultPlacement: 'top'
+      leaveDelay: 300
     },
     dragConfig: {
       showIcon: true,
@@ -15237,12 +15237,17 @@ function dom_triggerEvent(targetElem, type) {
 function isNodeElement(elem) {
   return elem && elem.nodeType === 1;
 }
+/**
+ * 通用定位计算
+ */
 function updatePanelPlacement(targetElem, panelElem, options) {
   var _Object$assign = Object.assign({
       teleportTo: false,
       marginSize: 18,
       isMinWidth: true
     }, options),
+    defaultTop = _Object$assign.defaultTop,
+    defaultLeft = _Object$assign.defaultLeft,
     placement = _Object$assign.placement,
     defaultPlacement = _Object$assign.defaultPlacement,
     teleportTo = _Object$assign.teleportTo,
@@ -15251,114 +15256,138 @@ function updatePanelPlacement(targetElem, panelElem, options) {
   var panelPlacement = 'bottom';
   var top = '';
   var bottom = '';
-  var left = '';
-  var right = '';
+  var left = 0;
   var minWidth = '';
+  var arrowLeft = '';
   var stys = {};
   if (panelElem && targetElem) {
-    var documentElement = document.documentElement;
-    var bodyElem = document.body;
-    var targetHeight = targetElem.offsetHeight;
-    var panelHeight = panelElem.offsetHeight;
-    var panelWidth = panelElem.offsetWidth;
-    var panelRect = panelElem.getBoundingClientRect();
-    var targetRect = targetElem.getBoundingClientRect();
-    var visibleHeight = documentElement.clientHeight || bodyElem.clientHeight;
-    var visibleWidth = documentElement.clientWidth || bodyElem.clientWidth;
-    minWidth = targetElem.offsetWidth;
-    if (teleportTo) {
-      left = targetRect.left;
-      top = targetRect.top + targetHeight;
-      if (placement === 'top') {
-        panelPlacement = 'top';
-        top = targetRect.top - panelHeight;
-      } else if (!placement) {
-        if (defaultPlacement === 'top') {
+    var parentEl = panelElem.parentElement;
+    var parentWrapperEl = parentEl === document.body ? document.documentElement : parentEl;
+    if (parentWrapperEl) {
+      var targetWidth = targetElem.offsetWidth;
+      var targetHeight = targetElem.offsetHeight;
+      var panelHeight = panelElem.offsetHeight;
+      var panelWidth = panelElem.offsetWidth;
+      var parentWrapperRect = parentWrapperEl.getBoundingClientRect();
+      var panelRect = panelElem.getBoundingClientRect();
+      var targetRect = targetElem.getBoundingClientRect();
+      var visibleHeight = parentWrapperEl.clientHeight;
+      var visibleWidth = parentWrapperEl.clientWidth;
+      var offsetLeft = parentWrapperRect.left;
+      var offsetTop = parentWrapperRect.top;
+      var targetLeft = targetRect.left;
+      var targetTop = targetRect.top;
+      minWidth = targetElem.offsetWidth;
+      if (teleportTo) {
+        left = defaultLeft || targetLeft;
+        top = defaultTop || targetTop + targetHeight;
+        if (placement === 'top') {
           panelPlacement = 'top';
-          top = targetRect.top - panelHeight;
-          // 如果上面不够放，则向下
-          if (top < marginSize) {
-            panelPlacement = 'bottom';
-            top = targetRect.top + targetHeight;
-          }
-          // 如果下面不够放，则向上（优先）
-          if (top + panelHeight + marginSize > visibleHeight) {
+          top = targetTop - panelHeight;
+        } else if (!placement) {
+          if (defaultPlacement === 'top') {
             panelPlacement = 'top';
-            top = targetRect.top - panelHeight;
+            top = targetTop - panelHeight;
+            // 如果上面不够放，则向下
+            if (top < marginSize) {
+              panelPlacement = 'bottom';
+              top = targetTop + targetHeight;
+            }
+            // 如果下面不够放，则向上（优先）
+            if (top + panelHeight + marginSize > visibleHeight) {
+              panelPlacement = 'top';
+              top = targetTop - panelHeight;
+            }
+          } else {
+            // 如果下面不够放，则向上
+            if (top + panelHeight + marginSize > visibleHeight) {
+              panelPlacement = 'top';
+              top = targetTop - panelHeight;
+            }
+            // 如果上面不够放，则向下（优先）
+            if (top < marginSize) {
+              panelPlacement = 'bottom';
+              top = targetTop + targetHeight;
+            }
           }
-        } else {
+        }
+        // 如果溢出右边
+        if (left + panelWidth + marginSize > visibleWidth) {
+          left -= left + panelWidth + marginSize - visibleWidth;
+        }
+        // 如果溢出左边
+        if (left < marginSize) {
+          left = marginSize;
+        }
+        // 偏移
+        top -= offsetTop;
+        left -= offsetLeft;
+      } else {
+        if (placement === 'top') {
+          panelPlacement = 'top';
+          bottom = targetHeight;
+        } else if (!placement) {
           // 如果下面不够放，则向上
-          if (top + panelHeight + marginSize > visibleHeight) {
-            panelPlacement = 'top';
-            top = targetRect.top - panelHeight;
-          }
-          // 如果上面不够放，则向下（优先）
-          if (top < marginSize) {
-            panelPlacement = 'bottom';
-            top = targetRect.top + targetHeight;
+          top = targetHeight;
+          if (targetTop + targetHeight + panelHeight + marginSize > visibleHeight) {
+            // 如果上面不够放，则向下（优先）
+            if (targetTop - targetHeight - panelHeight > marginSize) {
+              panelPlacement = 'top';
+              top = '';
+              bottom = targetHeight;
+            }
           }
         }
+        // 是否超出右侧
+        if (panelRect.left + panelRect.width + marginSize > visibleWidth) {
+          left = -(panelRect.left + panelRect.width + marginSize - visibleWidth);
+        }
       }
-      // 如果溢出右边
-      if (left + panelWidth + marginSize > visibleWidth) {
-        left -= left + panelWidth + marginSize - visibleWidth;
+      if (external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isNumber(top)) {
+        stys.top = toCssUnit(top);
       }
-      // 如果溢出左边
-      if (left < marginSize) {
-        left = marginSize;
+      if (external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isNumber(bottom)) {
+        stys.bottom = toCssUnit(bottom);
       }
-    } else {
-      if (placement === 'top') {
-        panelPlacement = 'top';
-        bottom = targetHeight;
-      } else if (!placement) {
-        // 如果下面不够放，则向上
-        top = targetHeight;
-        if (targetRect.top + targetHeight + panelHeight + marginSize > visibleHeight) {
-          // 如果上面不够放，则向下（优先）
-          if (targetRect.top - targetHeight - panelHeight > marginSize) {
-            panelPlacement = 'top';
-            top = '';
-            bottom = targetHeight;
-          }
-        }
+      if (external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isNumber(left)) {
+        stys.left = toCssUnit(left);
       }
-      // 是否超出右侧
-      if (panelRect.left + panelRect.width + marginSize > visibleWidth) {
-        left = -(panelRect.left + panelRect.width + marginSize - visibleWidth);
+      if (isMinWidth && external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isNumber(minWidth)) {
+        stys.minWidth = toCssUnit(minWidth);
+      }
+      // 箭头
+      if (left === targetLeft) {
+        if (targetWidth <= panelWidth) {
+          arrowLeft = targetWidth / 2;
+        }
+      } else if (left < targetLeft) {
+        if (left + panelWidth > targetLeft + targetWidth) {
+          arrowLeft = targetLeft - left + targetWidth / 2;
+        } else {
+          arrowLeft = targetLeft - left + (panelWidth - (targetLeft - left)) / 2;
+        }
       }
-    }
-    if (external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isNumber(top)) {
-      stys.top = toCssUnit(top);
-    }
-    if (external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isNumber(bottom)) {
-      stys.bottom = toCssUnit(bottom);
-    }
-    if (external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isNumber(left)) {
-      stys.left = toCssUnit(left);
-    }
-    if (external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isNumber(right)) {
-      stys.right = toCssUnit(right);
-    }
-    if (isMinWidth && external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isNumber(minWidth)) {
-      stys.minWidth = toCssUnit(minWidth);
     }
   }
   return {
     top: top || 0,
     bottom: bottom || 0,
     left: left || 0,
-    right: right || 0,
+    arrowLeft: arrowLeft || 0,
     style: stys,
     placement: panelPlacement
   };
 }
 function getPopupContainer(appendTo) {
   var selectElem = appendTo && external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isFunction(appendTo) ? appendTo({}) : appendTo;
+  return selectElem || 'body';
+}
+function getPopupAppendElement(appendTo) {
+  var selectElem = getPopupContainer(appendTo);
   if (external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isString(selectElem)) {
     return document.querySelector(selectElem) || document.body;
   }
-  return selectElem || document.body;
+  return selectElem;
 }
 // EXTERNAL MODULE: ./node_modules/core-js/modules/es.iterator.filter.js
 var es_iterator_filter = __webpack_require__(2489);
@@ -16283,6 +16312,12 @@ function createInternalData() {
       default: function _default() {
         return getConfig().tooltip.leaveDelay;
       }
+    },
+    appendTo: {
+      type: [String, Function],
+      default: function _default() {
+        return getConfig().tooltip.appendTo;
+      }
     }
   },
   data: function data() {
@@ -16387,24 +16422,59 @@ function createInternalData() {
       var $xeTooltip = this;
       return $xeTooltip.handleVisible(target, content);
     },
-    updatePlacement: function updatePlacement() {
+    updateTipStyle: function updateTipStyle() {
       var $xeTooltip = this;
+      var props = $xeTooltip;
       var reactData = $xeTooltip.reactData;
-      var visible = reactData.visible,
-        tipTarget = reactData.tipTarget;
-      var el = $xeTooltip.$refs.refElem;
-      if (visible && tipTarget && el) {
-        $xeTooltip.updateTipStyle();
+      var placement = props.placement,
+        defaultPlacement = props.defaultPlacement,
+        isArrow = props.isArrow;
+      var targetElem = reactData.tipTarget,
+        tipStore = reactData.tipStore,
+        tipPos = reactData.tipPos,
+        tipZindex = reactData.tipZindex;
+      var panelElem = $xeTooltip.$refs.refElem;
+      if (!targetElem || !panelElem) {
+        return;
       }
-      return $xeTooltip.$nextTick().then(function () {
-        var tipTarget = reactData.tipTarget;
-        el = $xeTooltip.$refs.refElem;
-        if (tipTarget && el) {
-          $xeTooltip.updateTipStyle();
-          return $xeTooltip.$nextTick().then(function () {
-            $xeTooltip.updateTipStyle();
-          });
+      var targetRect = targetElem.getBoundingClientRect();
+      var targetWidth = targetElem.offsetWidth;
+      var targetHeight = targetElem.offsetHeight;
+      var panelWidth = panelElem.offsetWidth;
+      var targetLeft = targetRect.left;
+      var targetTop = targetRect.top;
+      // 支持特殊定位逻辑
+      var left = targetLeft;
+      var top = targetTop + targetHeight;
+      if (tipPos && (tipPos.oLeft || tipPos.oTop)) {
+        if (isArrow) {
+          left = left + Math.max(8, Math.min(targetWidth - 8, tipPos.oLeft)) - panelWidth / 2;
+        } else {
+          left = tipPos.x + 1;
+          top = tipPos.y + 1;
         }
+      } else {
+        left = targetLeft + (targetWidth - panelWidth) / 2;
+      }
+      var ppObj = updatePanelPlacement(targetElem, panelElem, {
+        defaultTop: top,
+        defaultLeft: left,
+        placement: placement,
+        defaultPlacement: defaultPlacement,
+        teleportTo: true
+      });
+      var panelStyle = Object.assign(ppObj.style, {
+        zIndex: tipZindex
+      });
+      tipStore.placement = ppObj.placement;
+      tipStore.style = panelStyle;
+      tipStore.arrowStyle.left = "".concat(ppObj.arrowLeft, "px");
+    },
+    updatePlacement: function updatePlacement() {
+      var $xeTooltip = this;
+      $xeTooltip.updateTipStyle();
+      return $xeTooltip.$nextTick().then(function () {
+        return $xeTooltip.updateTipStyle();
       });
     },
     isActived: function isActived() {
@@ -16417,100 +16487,6 @@ function createInternalData() {
       var reactData = $xeTooltip.reactData;
       reactData.tipActive = !!active;
     },
-    updateTipStyle: function updateTipStyle() {
-      var $xeTooltip = this;
-      var props = $xeTooltip;
-      var reactData = $xeTooltip.reactData;
-      var isArrow = props.isArrow,
-        placement = props.placement,
-        defaultPlacement = props.defaultPlacement;
-      var targetElem = reactData.tipTarget,
-        tipStore = reactData.tipStore,
-        tipPos = reactData.tipPos;
-      var top = '';
-      var left = '';
-      var panelPlacement = 'bottom';
-      var arrowLeft = '';
-      var panelElem = $xeTooltip.$refs.refElem;
-      if (panelElem && targetElem) {
-        var documentElement = document.documentElement;
-        var bodyElem = document.body;
-        var targetWidth = targetElem.offsetWidth;
-        var targetHeight = targetElem.offsetHeight;
-        var panelHeight = panelElem.offsetHeight;
-        var panelWidth = panelElem.offsetWidth;
-        var targetRect = targetElem.getBoundingClientRect();
-        var visibleHeight = documentElement.clientHeight || bodyElem.clientHeight;
-        var visibleWidth = documentElement.clientWidth || bodyElem.clientWidth;
-        var marginSize = 6;
-        left = targetRect.left;
-        top = targetRect.top + targetHeight;
-        if (tipPos && (tipPos.oLeft || tipPos.oTop)) {
-          if (isArrow) {
-            left = left + Math.max(8, Math.min(targetWidth - 8, tipPos.oLeft)) - panelWidth / 2;
-          } else {
-            left = tipPos.x + 1;
-            top = tipPos.y + 1;
-          }
-        } else {
-          left = targetRect.left + (targetWidth - panelWidth) / 2;
-        }
-        if (placement === 'top') {
-          panelPlacement = 'top';
-          top = targetRect.top - panelHeight;
-        } else if (!placement) {
-          if (defaultPlacement === 'top') {
-            panelPlacement = 'top';
-            top = targetRect.top - panelHeight;
-            // 如果上面不够放，则向下
-            if (top < marginSize) {
-              panelPlacement = 'bottom';
-              top = targetRect.top + targetHeight;
-            }
-            // 如果下面不够放，则向上（优先）
-            if (top + panelHeight + marginSize > visibleHeight) {
-              panelPlacement = 'top';
-              top = targetRect.top - panelHeight;
-            }
-          } else {
-            // 如果下面不够放，则向上
-            if (top + panelHeight + marginSize > visibleHeight) {
-              panelPlacement = 'top';
-              top = targetRect.top - panelHeight;
-            }
-            // 如果上面不够放，则向下（优先）
-            if (top < marginSize) {
-              panelPlacement = 'bottom';
-              top = targetRect.top + targetHeight;
-            }
-          }
-        }
-        // 如果溢出右边
-        if (left + panelWidth + marginSize > visibleWidth) {
-          left -= left + panelWidth + marginSize - visibleWidth;
-        }
-        // 如果溢出左边
-        if (left < marginSize) {
-          left = marginSize;
-        }
-        // 箭头
-        if (left === targetRect.left) {
-          if (targetWidth <= panelWidth) {
-            arrowLeft = targetWidth / 2;
-          }
-        } else if (left < targetRect.left) {
-          if (left + panelWidth > targetRect.left + targetWidth) {
-            arrowLeft = targetRect.left - left + targetWidth / 2;
-          } else {
-            arrowLeft = targetRect.left - left + (panelWidth - (targetRect.left - left)) / 2;
-          }
-        }
-        tipStore.placement = panelPlacement;
-        tipStore.style.top = "".concat(top, "px");
-        tipStore.style.left = "".concat(left, "px");
-        tipStore.arrowStyle.left = "".concat(arrowLeft, "px");
-      }
-    },
     updateValue: function updateValue(value) {
       var $xeTooltip = this;
       var reactData = $xeTooltip.reactData;
@@ -16520,10 +16496,14 @@ function createInternalData() {
         $xeTooltip.emitModel(value);
       }
     },
-    updateZindex: function updateZindex() {
+    updateZIndex: function updateZIndex() {
       var $xeTooltip = this;
+      var props = $xeTooltip;
       var reactData = $xeTooltip.reactData;
-      if (reactData.tipZindex < getLastZIndex()) {
+      var zIndex = props.zIndex;
+      if (zIndex) {
+        reactData.tipZindex = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toNumber(zIndex);
+      } else if (reactData.tipZindex < getLastZIndex()) {
         reactData.tipZindex = nextZIndex();
       }
     },
@@ -16586,16 +16566,17 @@ function createInternalData() {
       var $xeTooltip = this;
       var props = $xeTooltip;
       var reactData = $xeTooltip.reactData;
+      var appendTo = props.appendTo;
       var tipStore = reactData.tipStore;
-      var el = $xeTooltip.$refs.refElem;
-      if (el) {
-        var parentNode = el.parentNode;
+      var panelElem = $xeTooltip.$refs.refElem;
+      if (panelElem) {
+        var parentNode = panelElem.parentNode;
         if (!parentNode) {
-          document.body.appendChild(el);
+          getPopupAppendElement(appendTo).appendChild(panelElem);
         }
       }
       $xeTooltip.updateValue(true);
-      $xeTooltip.updateZindex();
+      $xeTooltip.updateZIndex();
       tipStore.placement = 'top';
       tipStore.style = {
         width: 'auto',
@@ -16781,21 +16762,21 @@ function createInternalData() {
     $xeTooltip.$nextTick(function () {
       var trigger = props.trigger,
         content = props.content;
-      var wrapperElem = $xeTooltip.$refs.refElem;
-      if (wrapperElem) {
-        var parentNode = wrapperElem.parentNode;
+      var panelElem = $xeTooltip.$refs.refElem;
+      if (panelElem) {
+        var parentNode = panelElem.parentNode;
         if (parentNode) {
           reactData.tipContent = content;
           reactData.tipZindex = nextZIndex();
-          external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().arrayEach(wrapperElem.children, function (elem, index) {
+          external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().arrayEach(panelElem.children, function (elem, index) {
             if (index) {
-              parentNode.insertBefore(elem, wrapperElem);
+              parentNode.insertBefore(elem, panelElem);
               if (!reactData.target) {
                 reactData.target = elem;
               }
             }
           });
-          parentNode.removeChild(wrapperElem);
+          parentNode.removeChild(panelElem);
           var target = reactData.target;
           if (target) {
             if (trigger === 'hover') {
@@ -16816,7 +16797,7 @@ function createInternalData() {
     var $xeTooltip = this;
     var reactData = $xeTooltip.reactData;
     var target = reactData.target;
-    var wrapperElem = $xeTooltip.$refs.refElem;
+    var panelElem = $xeTooltip.$refs.refElem;
     if (target) {
       target.onmouseenter = null;
       target.onmouseleave = null;
@@ -16826,10 +16807,10 @@ function createInternalData() {
     if (contentWrapperfEl) {
       contentWrapperfEl.removeEventListener('wheel', $xeTooltip.wheelEvent);
     }
-    if (wrapperElem) {
-      var parentNode = wrapperElem.parentNode;
+    if (panelElem) {
+      var parentNode = panelElem.parentNode;
       if (parentNode) {
-        parentNode.removeChild(wrapperElem);
+        parentNode.removeChild(panelElem);
       }
     }
   },
@@ -17191,7 +17172,7 @@ var _createComponentLog = createComponentLog('button'),
           reactData.initialized = true;
           if (btnTransfer) {
             var appendTo = popupOpts.appendTo;
-            getPopupContainer(appendTo).appendChild(panelElem);
+            getPopupAppendElement(appendTo).appendChild(panelElem);
           }
         }
         internalData.showTime = setTimeout(function () {
@@ -32665,6 +32646,12 @@ var typeList = [{
         return getConfig().colorPicker.clickToCopy;
       }
     },
+    defaultColor: {
+      type: String,
+      default: function _default() {
+        return getConfig().colorPicker.defaultColor;
+      }
+    },
     placement: String,
     transfer: {
       type: Boolean,
@@ -32853,13 +32840,16 @@ var typeList = [{
     },
     updateModelColor: function updateModelColor() {
       var $xeColorPicker = this;
+      var props = $xeColorPicker;
       var reactData = $xeColorPicker.reactData;
+      var modelValue = props.value,
+        defaultColor = props.defaultColor;
       var selectColor = reactData.selectColor,
         isAniVisible = reactData.isAniVisible;
       var isRgb = $xeColorPicker.computeIsRgb;
       var hueSliderEl = $xeColorPicker.$refs.refHueSliderElem;
       var alphaSliderEl = $xeColorPicker.$refs.refAlphaSliderElem;
-      var colorRest = parseValColor(selectColor);
+      var colorRest = parseValColor(modelValue ? selectColor : defaultColor);
       reactData.hexValue = '';
       reactData.rValue = 0;
       reactData.gValue = 0;
@@ -32902,7 +32892,7 @@ var typeList = [{
             $xeColorPicker.handlePanelColor(offsetLeft, offsetTop);
           }
           if (hueSliderEl) {
-            $xeColorPicker.handleHueColor(external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().ceil((1 - hsvRest.h / 360) * hueSliderEl.clientWidth));
+            $xeColorPicker.handleHueColor(external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().ceil((1 - hsvRest.h / 360) * hueSliderEl.clientWidth) - 1);
           }
         }
         if (alphaSliderEl) {
@@ -32961,7 +32951,7 @@ var typeList = [{
           if (btnTransfer) {
             if (panelElem) {
               var appendTo = popupOpts.appendTo;
-              getPopupContainer(appendTo).appendChild(panelElem);
+              getPopupAppendElement(appendTo).appendChild(panelElem);
             }
           }
         }
@@ -33644,7 +33634,7 @@ var typeList = [{
       var className = props.className,
         popupClassName = props.popupClassName,
         clearable = props.clearable,
-        value = props.value;
+        modelValue = props.value;
       var initialized = reactData.initialized,
         isActivated = reactData.isActivated,
         isAniVisible = reactData.isAniVisible,
@@ -33660,7 +33650,7 @@ var typeList = [{
         }, [h('div', {
           class: 'vxe-color-picker--readonly-color',
           style: {
-            backgroundColor: value
+            backgroundColor: modelValue
           }
         })]);
       }
@@ -33668,7 +33658,7 @@ var typeList = [{
         ref: 'refElem',
         class: ['vxe-color-picker', className ? external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isFunction(className) ? className({
           $colorPicker: $xeColorPicker
-        }) : className : '', _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "size--".concat(vSize), vSize), 'is--selected', !!value), 'is--visible', visiblePanel), 'is--disabled', isDisabled), 'is--active', isActivated)]
+        }) : className : '', _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "size--".concat(vSize), vSize), 'is--selected', !!modelValue), 'is--visible', visiblePanel), 'is--disabled', isDisabled), 'is--active', isActivated)]
       }, [h('input', {
         ref: 'refInputTarget',
         class: 'vxe-color-picker--input',
@@ -33684,7 +33674,7 @@ var typeList = [{
       }, [h('div', {
         class: 'vxe-color-picker--inner-color',
         style: {
-          backgroundColor: value
+          backgroundColor: modelValue
         }
       })]), h('div', {
         ref: 'refOptionPanel',
@@ -38632,7 +38622,7 @@ function date_picker_createInternalData() {
           reactData.initialized = true;
           if (btnTransfer && panelElem) {
             var appendTo = popupOpts.appendTo;
-            getPopupContainer(appendTo).appendChild(panelElem);
+            getPopupAppendElement(appendTo).appendChild(panelElem);
           }
         }
         if (internalData.hpTimeout) {
@@ -40338,7 +40328,7 @@ function date_range_picker_createInternalData() {
           reactData.initialized = true;
           if (btnTransfer && panelElem) {
             var appendTo = popupOpts.appendTo;
-            getPopupContainer(appendTo).appendChild(panelElem);
+            getPopupAppendElement(appendTo).appendChild(panelElem);
           }
         }
         if (internalData.hpTimeout) {
@@ -41287,7 +41277,7 @@ var allActiveDrawers = [];
         reactData.initialized = true;
         if (btnTransfer) {
           var panelElem = $xeDrawer.$refs.refElem;
-          getPopupContainer(appendTo).appendChild(panelElem);
+          getPopupAppendElement(appendTo).appendChild(panelElem);
         }
       }
       if (!visible) {
@@ -45200,7 +45190,7 @@ function icon_picker_createInternalData() {
           if (btnTransfer) {
             if (panelElem) {
               var appendTo = popupOpts.appendTo;
-              getPopupContainer(appendTo).appendChild(panelElem);
+              getPopupAppendElement(appendTo).appendChild(panelElem);
             }
           }
         }
@@ -48004,7 +47994,7 @@ var nemuUniqueKey = 100000000;
             $xeMenu.$nextTick(function () {
               var collapseEl = $xeMenu.$refs.refCollapseElem;
               if (collapseEl) {
-                getPopupContainer(appendTo).appendChild(collapseEl);
+                getPopupAppendElement(appendTo).appendChild(collapseEl);
               }
             });
           }
@@ -49454,7 +49444,7 @@ var lockScrollCssWidthKey = '--vxe-ui-modal-lock-scroll-view-width';
         reactData.initialized = true;
         if (btnTransfer) {
           var panelElem = $xeModal.$refs.refElem;
-          getPopupContainer(appendTo).appendChild(panelElem);
+          getPopupAppendElement(appendTo).appendChild(panelElem);
         }
       }
       if (!visible) {
@@ -51707,7 +51697,7 @@ function select_createInternalData() {
           var panelElem = $xeSelect.$refs.refOptionPanel;
           if (btnTransfer && panelElem) {
             var appendTo = popupOpts.appendTo;
-            getPopupContainer(appendTo).appendChild(panelElem);
+            getPopupAppendElement(appendTo).appendChild(panelElem);
           }
         }
         reactData.isActivated = true;
@@ -59817,7 +59807,7 @@ function table_select_createInternalData() {
           if (btnTransfer) {
             if (panelElem) {
               var appendTo = popupOpts.appendTo;
-              getPopupContainer(appendTo).appendChild(panelElem);
+              getPopupAppendElement(appendTo).appendChild(panelElem);
             }
           }
         }
@@ -66505,12 +66495,13 @@ function tree_createReactData() {
       var props = $xeTree;
       var slots = $xeTree.$scopedSlots;
       var internalData = $xeTree.internalData;
-      var transform = props.transform,
+      var loading = props.loading,
+        transform = props.transform,
         emptyText = props.emptyText;
       var treeExpandedMaps = internalData.treeExpandedMaps;
       var childrenField = $xeTree.computeChildrenField;
       var emptySlot = slots.empty;
-      if (!treeList.length) {
+      if (!loading && !treeList.length) {
         return [h('div', {
           class: 'vxe-tree--empty-placeholder'
         }, emptySlot ? emptySlot({}) : [h('div', {
@@ -67431,7 +67422,7 @@ function tree_select_createInternalData() {
           if (btnTransfer) {
             if (panelElem) {
               var appendTo = popupOpts.appendTo;
-              getPopupContainer(appendTo).appendChild(panelElem);
+              getPopupAppendElement(appendTo).appendChild(panelElem);
             }
           }
         }