vxe-pc-ui 3.17.20 → 3.17.21

package/lib/index.umd.js

@@ -13265,7 +13265,7 @@ var es_array_join = __webpack_require__(8598);
 
 
 var log_log = VxeUI.log;
-var uiVersion = "ui v".concat("3.17.20");
+var uiVersion = "ui v".concat("3.17.21");
 function createComponentLog(name) {
   var tableVersion = VxeUI.tableVersion ? "table v".concat(VxeUI.tableVersion) : '';
   var ganttVersion = VxeUI.ganttVersion ? "gantt v".concat(VxeUI.ganttVersion) : '';
@@ -13285,7 +13285,7 @@ var errLog = log_log.create('error', uiVersion);
 
 
 
-var ui_version = "3.17.20";
+var ui_version = "3.17.21";
 VxeUI.uiVersion = ui_version;
 VxeUI.dynamicApp = dynamicApp;
 function config(options) {
@@ -58501,17 +58501,21 @@ var SplitPane = VxeSplitPane;
 
 
 
+
+
+
+
 function slider_createInternalData() {
   return {
-    // _isUp: false
-  };
-}
-function slider_createReactData() {
-  return {
+    // _isUp: false,
+    currValue: 0,
     startValue: 0,
     endValue: 0
   };
 }
+function slider_createReactData() {
+  return {};
+}
 /* harmony default export */ var slider = (/* define-vxe-component start */defineVxeComponent({
   name: 'VxeSlider',
   model: {
@@ -58520,6 +58524,8 @@ function slider_createReactData() {
   },
   props: {
     value: [String, Number, Array],
+    startValue: [String, Number],
+    endValue: [String, Number],
     vertical: Boolean,
     max: {
       type: [String, Number],
@@ -58619,6 +58625,14 @@ function slider_createReactData() {
       var $xeSlider = this;
       var props = $xeSlider;
       return external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toNumber(props.min || 0);
+    },
+    computeMVal: function computeMVal() {
+      var $xeSlider = this;
+      var props = $xeSlider;
+      var range = props.range,
+        startValue = props.startValue,
+        endValue = props.endValue;
+      return range ? "".concat(startValue || '').concat(endValue || '') : '';
     }
   }),
   methods: {
@@ -58642,78 +58656,159 @@ function slider_createReactData() {
         $xeSlider.$emit('model-value', value);
       }
     },
-    getStartPercent: function getStartPercent(startValue) {
+    getBarPercent: function getBarPercent(currValue) {
       var $xeSlider = this;
-      var props = $xeSlider;
-      var range = props.range;
       var maxNum = $xeSlider.computeMaxNum;
       var minNum = $xeSlider.computeMinNum;
-      return range ? external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().floor((startValue - minNum) / external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toNumber(maxNum - minNum) * 100) : 0;
+      if (maxNum === minNum) {
+        return 0;
+      }
+      if (currValue < minNum) {
+        currValue = minNum;
+      }
+      if (currValue > maxNum) {
+        currValue = maxNum;
+      }
+      return (currValue - minNum) / (maxNum - minNum) * 100;
     },
-    getEndPercent: function getEndPercent(startValue, endValue) {
+    parseFields: function parseFields(startValue, endValue) {
       var $xeSlider = this;
-      var props = $xeSlider;
-      var range = props.range;
-      var maxNum = $xeSlider.computeMaxNum;
-      var minNum = $xeSlider.computeMinNum;
-      return external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().floor((endValue - (range ? startValue : 0) - minNum) / external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toNumber(maxNum - minNum) * 100);
+      var internalData = $xeSlider.internalData;
+      var _XEUtils$orderBy = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().orderBy([external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toNumber(startValue), external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toNumber(endValue)]),
+        _XEUtils$orderBy2 = _slicedToArray(_XEUtils$orderBy, 2),
+        sVal = _XEUtils$orderBy2[0],
+        eVal = _XEUtils$orderBy2[1];
+      var currValue = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().floor(external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toNumber(sVal || 0));
+      internalData.currValue = currValue;
+      internalData.startValue = currValue;
+      internalData.endValue = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().floor(external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toNumber(eVal || 0));
+    },
+    parseArrs: function parseArrs(arrVals) {
+      var $xeSlider = this;
+      var internalData = $xeSlider.internalData;
+      var _XEUtils$orderBy3 = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().orderBy(arrVals),
+        _XEUtils$orderBy4 = _slicedToArray(_XEUtils$orderBy3, 2),
+        sVal = _XEUtils$orderBy4[0],
+        eVal = _XEUtils$orderBy4[1];
+      var currValue = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().floor(external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toNumber(sVal || 0));
+      internalData.currValue = currValue;
+      internalData.startValue = currValue;
+      internalData.endValue = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().floor(external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toNumber(eVal || 0));
+    },
+    parseNum: function parseNum(val) {
+      var $xeSlider = this;
+      var internalData = $xeSlider.internalData;
+      var currValue = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().floor(external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toNumber(val || 0));
+      internalData.currValue = currValue;
+      internalData.startValue = 0;
+      internalData.endValue = currValue;
     },
-    updateModel: function updateModel() {
+    updateModelValue: function updateModelValue(umType) {
       var $xeSlider = this;
       var props = $xeSlider;
-      var reactData = $xeSlider.reactData;
-      var value = props.value;
-      if (external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isArray(value)) {
-        var _XEUtils$clone$sort = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().clone(value, true).sort(),
-          _XEUtils$clone$sort2 = _slicedToArray(_XEUtils$clone$sort, 2),
-          sVal = _XEUtils$clone$sort2[0],
-          eVal = _XEUtils$clone$sort2[1];
-        reactData.startValue = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().floor(external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toNumber(sVal || 0));
-        reactData.endValue = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().floor(external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toNumber(eVal || 0));
+      var range = props.range,
+        modelValue = props.value,
+        startValue = props.startValue,
+        endValue = props.endValue;
+      if (!umType) {
+        if (range) {
+          if (external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().eqNull(modelValue)) {
+            if (startValue || endValue) {
+              $xeSlider.parseFields(startValue, endValue);
+            }
+          } else {
+            if (external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isArray(modelValue)) {
+              $xeSlider.parseArrs(modelValue.map(function (num) {
+                return external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toNumber(num);
+              }));
+            } else {
+              $xeSlider.parseNum(modelValue);
+            }
+          }
+        } else {
+          $xeSlider.parseNum(modelValue);
+        }
+      } else if (range && umType === 2) {
+        $xeSlider.parseFields(startValue, endValue);
       } else {
-        reactData.startValue = 0;
-        reactData.endValue = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().floor(external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toNumber(value || 0));
+        if (external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isArray(modelValue)) {
+          $xeSlider.parseArrs(modelValue.map(function (num) {
+            return external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toNumber(num);
+          }));
+        } else {
+          $xeSlider.parseNum(modelValue);
+        }
       }
+      $xeSlider.updateBarStyle();
+      $xeSlider.updateTrackStyle();
     },
     updateBarStyle: function updateBarStyle() {
       var $xeSlider = this;
-      var reactData = $xeSlider.reactData;
-      var startValue = reactData.startValue,
-        endValue = reactData.endValue;
-      var trackElem = $xeSlider.$refs.refTrackElem;
+      var props = $xeSlider;
+      var internalData = $xeSlider.internalData;
+      var range = props.range;
+      var currValue = internalData.currValue,
+        startValue = internalData.startValue,
+        endValue = internalData.endValue;
       var startBtnElem = $xeSlider.$refs.refStartBtnElem;
       var endBtnElem = $xeSlider.$refs.refEndBtnElem;
-      var startPercent = 0;
-      var endPercent = 0;
-      if (startValue > endValue) {
-        startPercent = $xeSlider.getStartPercent(endValue);
-        endPercent = $xeSlider.getEndPercent(endValue, startValue);
+      if (range) {
+        var _XEUtils$orderBy5 = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().orderBy([startValue, endValue]),
+          _XEUtils$orderBy6 = _slicedToArray(_XEUtils$orderBy5, 2),
+          sVal = _XEUtils$orderBy6[0],
+          eVal = _XEUtils$orderBy6[1];
+        if (startBtnElem) {
+          startBtnElem.style.left = $xeSlider.getBarPercent(sVal) + '%';
+        }
+        if (endBtnElem) {
+          endBtnElem.style.left = $xeSlider.getBarPercent(eVal) + '%';
+        }
       } else {
-        startPercent = $xeSlider.getStartPercent(startValue);
-        endPercent = $xeSlider.getEndPercent(startValue, endValue);
+        if (endBtnElem) {
+          endBtnElem.style.left = $xeSlider.getBarPercent(currValue) + '%';
+        }
       }
+    },
+    updateTrackStyle: function updateTrackStyle() {
+      var $xeSlider = this;
+      var props = $xeSlider;
+      var internalData = $xeSlider.internalData;
+      var range = props.range;
+      var currValue = internalData.currValue,
+        startValue = internalData.startValue,
+        endValue = internalData.endValue;
+      var trackElem = $xeSlider.$refs.refTrackElem;
       if (trackElem) {
-        trackElem.style.left = "".concat(startPercent, "%");
-        trackElem.style.width = "".concat(endPercent, "%");
-      }
-      if (startBtnElem) {
-        startBtnElem.style.left = "".concat(startPercent, "%");
-      }
-      if (endBtnElem) {
-        endBtnElem.style.left = "".concat(external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().floor(startPercent + endPercent), "%");
+        if (range) {
+          var _XEUtils$orderBy7 = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().orderBy([startValue, endValue]),
+            _XEUtils$orderBy8 = _slicedToArray(_XEUtils$orderBy7, 2),
+            sVal = _XEUtils$orderBy8[0],
+            eVal = _XEUtils$orderBy8[1];
+          trackElem.style.left = $xeSlider.getBarPercent(sVal) + '%';
+          trackElem.style.width = $xeSlider.getBarPercent(eVal - sVal) + '%';
+        } else {
+          trackElem.style.left = '0';
+          trackElem.style.width = $xeSlider.getBarPercent(currValue) + '%';
+        }
       }
     },
     changeEvent: function changeEvent(evnt) {
       var $xeSlider = this;
       var props = $xeSlider;
-      var reactData = $xeSlider.reactData;
+      var internalData = $xeSlider.internalData;
       var $xeForm = $xeSlider.$xeForm;
       var formItemInfo = $xeSlider.formItemInfo;
       var range = props.range;
-      var startValue = reactData.startValue,
-        endValue = reactData.endValue;
-      var value = range ? [startValue, endValue].sort() : endValue;
+      var currValue = internalData.currValue,
+        startValue = internalData.startValue,
+        endValue = internalData.endValue;
+      var vals = range ? external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().orderBy([startValue, endValue]) : [];
+      var value = range ? vals : currValue;
       $xeSlider.emitModel(value);
+      if (range) {
+        $xeSlider.$emit('update:startValue', vals[0] || 0);
+        $xeSlider.$emit('update:endValue', vals[1] || 0);
+      }
       $xeSlider.dispatchEvent('change', {
         value: value
       }, evnt);
@@ -58722,66 +58817,77 @@ function slider_createReactData() {
         $xeForm.triggerItemEvent(evnt, formItemInfo.itemConfig.field, value);
       }
     },
-    handleMousedownEvent: function handleMousedownEvent(evnt, isEnd) {
+    getValueByLeft: function getValueByLeft(offsetLeft, barWidth) {
+      var $xeSlider = this;
+      var maxNum = $xeSlider.computeMaxNum;
+      var minNum = $xeSlider.computeMinNum;
+      if (barWidth === 0) {
+        return minNum;
+      }
+      var clamped = Math.max(0, Math.min(barWidth, offsetLeft));
+      var ratio = clamped / barWidth;
+      var raw = minNum + ratio * (maxNum - minNum);
+      return Math.floor(raw);
+    },
+    handleBtnMousedownEvent: function handleBtnMousedownEvent(evnt) {
       var $xeSlider = this;
       var props = $xeSlider;
-      var reactData = $xeSlider.reactData;
-      var immediate = props.immediate;
+      var internalData = $xeSlider.internalData;
+      var range = props.range,
+        immediate = props.immediate;
+      var btnElem = evnt.currentTarget;
       var formReadonly = $xeSlider.computeFormReadonly;
       var isDisabled = $xeSlider.computeIsDisabled;
-      var maxNum = $xeSlider.computeMaxNum;
-      var minNum = $xeSlider.computeMinNum;
       if (!(formReadonly || isDisabled)) {
         evnt.preventDefault();
         document.onmousemove = function (evnt) {
           evnt.preventDefault();
+          var el = $xeSlider.$refs.refElem;
           var barElem = $xeSlider.$refs.refBarElem;
-          if (barElem) {
+          if (el && barElem) {
+            var btnType = btnElem.getAttribute('data-type');
             var barRect = barElem.getBoundingClientRect();
-            var trackWidth = (evnt.clientX - barRect.left) / barRect.width;
-            if (isEnd) {
-              reactData.endValue = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().floor(Math.max(minNum, Math.min(maxNum, trackWidth * (maxNum - minNum) + minNum)));
-            } else {
-              reactData.startValue = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().floor(Math.max(minNum, Math.min(maxNum, trackWidth * (maxNum - minNum))));
+            var barWidth = barRect.width;
+            var offsetLeft = Math.min(barWidth, Math.max(0, evnt.clientX - barRect.left));
+            var currValue = $xeSlider.getValueByLeft(offsetLeft, barWidth);
+            if (range) {
+              if (btnType === '1') {
+                internalData.startValue = currValue;
+              } else {
+                internalData.endValue = currValue;
+              }
             }
+            internalData.currValue = currValue;
+            btnElem.style.left = $xeSlider.getBarPercent(currValue) + '%';
             $xeSlider.dispatchEvent('track-dragover', {
-              startValue: reactData.startValue,
-              endValue: reactData.endValue
+              currentValue: internalData.currValue,
+              startValue: internalData.startValue,
+              endValue: internalData.endValue
             }, evnt);
           }
           if (immediate) {
             $xeSlider.changeEvent(evnt);
           }
-          $xeSlider.updateBarStyle();
+          $xeSlider.updateTrackStyle();
         };
         document.onmouseup = function (evnt) {
           document.onmousemove = null;
           document.onmouseup = null;
           $xeSlider.dispatchEvent('track-dragend', {
-            startValue: reactData.startValue,
-            endValue: reactData.endValue
+            currentValue: internalData.currValue,
+            startValue: internalData.startValue,
+            endValue: internalData.endValue
           }, evnt);
           $xeSlider.changeEvent(evnt);
-          $xeSlider.updateBarStyle();
+          $xeSlider.updateTrackStyle();
         };
         $xeSlider.dispatchEvent('track-dragstart', {
-          startValue: reactData.startValue,
-          endValue: reactData.endValue
+          currentValue: internalData.currValue,
+          startValue: internalData.startValue,
+          endValue: internalData.endValue
         }, evnt);
       }
     },
-    handleStartMousedownEvent: function handleStartMousedownEvent(evnt) {
-      var $xeSlider = this;
-      var endBtnElem = $xeSlider.$refs.refEndBtnElem;
-      var startBtnElem = evnt.currentTarget;
-      $xeSlider.handleMousedownEvent(evnt, endBtnElem ? endBtnElem.offsetLeft < startBtnElem.offsetLeft : false);
-    },
-    handleEndMousedownEvent: function handleEndMousedownEvent(evnt) {
-      var $xeSlider = this;
-      var startBtnElem = $xeSlider.$refs.refStartBtnElem;
-      var endBtnElem = evnt.currentTarget;
-      $xeSlider.handleMousedownEvent(evnt, startBtnElem ? endBtnElem.offsetLeft > startBtnElem.offsetLeft : true);
-    },
     //
     // Render
     //
@@ -58806,15 +58912,21 @@ function slider_createReactData() {
         class: 'vxe-slider--bar-track'
       }), formReadonly || !range ? renderEmptyElement($xeSlider) : h('div', {
         ref: 'refStartBtnElem',
-        class: 'vxe-slider--bar-btn vxe-slider--start-btn',
+        class: 'vxe-slider--bar-btn',
+        attrs: {
+          'data-type': '1'
+        },
         on: {
-          mousedown: $xeSlider.handleStartMousedownEvent
+          mousedown: $xeSlider.handleBtnMousedownEvent
         }
       }), formReadonly ? renderEmptyElement($xeSlider) : h('div', {
         ref: 'refEndBtnElem',
-        class: 'vxe-slider--bar-btn vxe-slider--end-btn',
+        class: 'vxe-slider--bar-btn',
+        attrs: {
+          'data-type': '2'
+        },
         on: {
-          mousedown: $xeSlider.handleEndMousedownEvent
+          mousedown: $xeSlider.handleBtnMousedownEvent
         }
       })])]);
     }
@@ -58824,7 +58936,15 @@ function slider_createReactData() {
       var $xeSlider = this;
       var internalData = $xeSlider.internalData;
       if (!internalData._isUp) {
-        $xeSlider.updateModel();
+        $xeSlider.updateModelValue(1);
+      }
+      internalData._isUp = false;
+    },
+    computeMVal: function computeMVal() {
+      var $xeSlider = this;
+      var internalData = $xeSlider.internalData;
+      if (!internalData._isUp) {
+        $xeSlider.updateModelValue(2);
       }
       internalData._isUp = false;
     }
@@ -58832,11 +58952,12 @@ function slider_createReactData() {
   created: function created() {
     var $xeSlider = this;
     $xeSlider.internalData = slider_createInternalData();
-    $xeSlider.updateModel();
+    $xeSlider.updateModelValue();
   },
   mounted: function mounted() {
     var $xeSlider = this;
     $xeSlider.updateBarStyle();
+    $xeSlider.updateTrackStyle();
   },
   beforeDestroy: function beforeDestroy() {
     var $xeSlider = this;
@@ -58874,9 +58995,6 @@ var Slider = VxeSlider;
 
 
 
-
-
-
 /* harmony default export */ var space = (/* define-vxe-component start */defineVxeComponent({
   name: 'VxeSpace',
   mixins: [globalMixins.sizeMixin, globalMixins.permissionMixin],
@@ -58922,6 +59040,12 @@ var Slider = VxeSlider;
       default: function _default() {
         return getConfig().space.separator;
       }
+    },
+    align: {
+      type: String,
+      default: function _default() {
+        return getConfig().space.align;
+      }
     }
   },
   data: function data() {
@@ -58938,7 +59062,8 @@ var Slider = VxeSlider;
     computeWrapperStyle: function computeWrapperStyle() {
       var $xeSpace = this;
       var props = $xeSpace;
-      var gap = props.gap;
+      var align = props.align,
+        gap = props.gap;
       var stys = {};
       var rowGap = '';
       var columGap = '';
@@ -58954,6 +59079,9 @@ var Slider = VxeSlider;
           columGap = gap.columGap || '';
         }
       }
+      if (align) {
+        stys['align-items'] = align;
+      }
       if (!eqEmptyValue(rowGap)) {
         stys['--vxe-ui-space-current-row-gap'] = toCssUnit(rowGap);
       }
@@ -58976,29 +59104,46 @@ var Slider = VxeSlider;
     //
     // Render
     //
-    renderVN: function renderVN(h) {
+    renderItems: function renderItems(h) {
       var $xeSpace = this;
       var props = $xeSpace;
       var slots = $xeSpace.$scopedSlots;
+      var separator = props.separator,
+        itemClassName = props.itemClassName;
+      var itemVNs = [];
+      var defaultSlot = slots.default;
+      var separatorSlot = slots.separator;
+      if (defaultSlot) {
+        external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().each(defaultSlot({}), function (itemVN, index, items) {
+          itemVNs.push(h('div', {
+            key: 'i' + index,
+            class: ['vxe-space--item', getPropClass(itemClassName, {
+              index: index
+            })]
+          }, [itemVN]));
+          if ((separator || separatorSlot) && index < items.length - 1) {
+            itemVNs.push(h('div', {
+              key: 's' + index,
+              class: 'vxe-space--separator'
+            }, separatorSlot ? separatorSlot({}) : '' + separator));
+          }
+        });
+      }
+      return itemVNs;
+    },
+    renderVN: function renderVN(h) {
+      var $xeSpace = this;
+      var props = $xeSpace;
       var vertical = props.vertical,
         wrap = props.wrap,
-        className = props.className,
-        itemClassName = props.itemClassName;
+        className = props.className;
       var wrapperStyle = $xeSpace.computeWrapperStyle;
       var vSize = $xeSpace.computeSize;
-      var defaultSlot = slots.default;
       return h('div', {
         ref: 'refElem',
         class: ['vxe-space', getPropClass(className, {}), _defineProperty(_defineProperty(_defineProperty({}, "size--".concat(vSize), vSize), 'is--wrap', wrap), 'is--vertical', vertical)],
         style: wrapperStyle
-      }, defaultSlot ? (defaultSlot({}) || []).map(function (itemVN, index) {
-        return h('div', {
-          key: index,
-          class: ['vxe-space--item', getPropClass(itemClassName, {
-            index: index
-          })]
-        }, [itemVN]);
-      }) : []);
+      }, $xeSpace.renderItems(h));
     }
   },
   render: function render(h) {