@king-design/vue 3.5.1-beta.0 → 3.5.2

package/components/breadcrumb/index.vdt.js

@@ -6,7 +6,8 @@ import { BreadcrumbItem } from './item';
 import { makeStyles } from './styles';
 import { Icon } from '../icon';
 var _$tmp0 = {
-  'className': 'k-icon-right'
+  'className': 'k-icon-right',
+  'size': 'small'
 };
 export default function ($props, $blocks, $__proto__) {
   var _classNameObj;

package/components/breadcrumb/styles.js

@@ -4,7 +4,7 @@ import { theme, setDefault } from '../../styles/theme';
 import '../../styles/global';
 import { cache } from '../utils';
 var defaults = {
-  fontSize: '14px',
+  fontSize: '12px',
   get color() {
     return theme.color.lightBlack;
   },
@@ -13,7 +13,9 @@ var defaults = {
   },
   gap: '6px',
   activeFontWeight: 'normal',
-  activeColor: "#262626"
+  get activeColor() {
+    return theme.color.title;
+  }
 };
 var breadcrumb;
 setDefault(function () {
@@ -23,5 +25,5 @@ setDefault(function () {
   makeStyles == null || makeStyles.clearCache();
 });
 export var makeStyles = cache(function makeStyles(k) {
-  return /*#__PURE__*/css("font-size:", breadcrumb.fontSize, ";display:flex;align-items:center;.", k, "-breadcrumb-item{&:last-of-type .", k, "-breadcrumb-link{font-weight:", breadcrumb.activeFontWeight, ";color:", breadcrumb.activeColor, ";}}.", k, "-breadcrumb-link,.", k, "-breadcrumb-link a{color:", breadcrumb.color, ";}a.", k, "-breadcrumb-link,.", k, "-breadcrumb-link a{cursor:pointer;&:hover{color:", breadcrumb.hoverColor, ";}}.", k, "-breadcrumb-separator{margin:0 ", breadcrumb.gap, ";}");
+  return /*#__PURE__*/css("font-size:", breadcrumb.fontSize, ";line-height:12px;display:flex;align-items:center;.", k, "-breadcrumb-item{&:last-of-type .", k, "-breadcrumb-link{font-weight:", breadcrumb.activeFontWeight, ";color:", breadcrumb.activeColor, ";}}.", k, "-breadcrumb-link,.", k, "-breadcrumb-link a{color:", breadcrumb.color, ";}a.", k, "-breadcrumb-link,.", k, "-breadcrumb-link a{cursor:pointer;&:hover{color:", breadcrumb.hoverColor, ";}}.", k, "-breadcrumb-separator{margin:0 ", breadcrumb.gap, ";}");
 });

package/components/select/index.spec.js

@@ -1,6 +1,7 @@
 import _inheritsLoose from "@babel/runtime-corejs3/helpers/inheritsLoose";
 import _asyncToGenerator from "@babel/runtime-corejs3/helpers/asyncToGenerator";
 import _concatInstanceProperty from "@babel/runtime-corejs3/core-js/instance/concat";
+import _Array$from from "@babel/runtime-corejs3/core-js/array/from";
 import _regeneratorRuntime from "@babel/runtime-corejs3/regenerator";
 import BasicDemo from '~/components/select/demos/basic';
 import DisabledDemo from '~/components/select/demos/disabled';
@@ -508,6 +509,59 @@ describe('Select', function () {
       }
     }, _callee11);
   })));
+  it('should handle async data correctly', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee12() {
+    var Demo, _mount13, instance, element, wrapper, phantom;
+    return _regeneratorRuntime.wrap(function _callee12$(_context15) {
+      while (1) switch (_context15.prev = _context15.next) {
+        case 0:
+          Demo = /*#__PURE__*/function (_Component3) {
+            _inheritsLoose(Demo, _Component3);
+            function Demo() {
+              var _context14;
+              var _this3;
+              for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
+                args[_key3] = arguments[_key3];
+              }
+              _this3 = _Component3.call.apply(_Component3, _concatInstanceProperty(_context14 = [this]).call(_context14, args)) || this;
+              _this3.Select = Select;
+              _this3.Option = Option;
+              return _this3;
+            }
+            Demo.defaults = function defaults() {
+              return {
+                list: []
+              };
+            };
+            return Demo;
+          }(Component);
+          Demo.template = "\n                const {Select, Option} = this;\n                <Select v-model=\"day\" virtual>\n                    <Option v-for={this.get('list')} value={$value}>\n                        {$value}\n                    </Option>\n                </Select>\n            ";
+          _mount13 = mount(Demo), instance = _mount13[0], element = _mount13[1];
+          _context15.next = 5;
+          return wait();
+        case 5:
+          // simulate async data loading
+          instance.set('list', _Array$from({
+            length: 100
+          }, function (_, i) {
+            return i;
+          }));
+          _context15.next = 8;
+          return wait(100);
+        case 8:
+          element.click();
+          _context15.next = 11;
+          return wait();
+        case 11:
+          wrapper = getElement('.k-virtual-wrapper');
+          phantom = getElement('.k-virtual-phantom');
+          expect(wrapper.children.length).to.be.equal(10);
+          expect(phantom.style.height).to.be.equal('3000px');
+        case 15:
+        case "end":
+          return _context15.stop();
+      }
+    }, _callee12);
+  })));
   // it('should trigger change event correctly', async () => {
   // const spy = sinon.spy();
   // class Demo extends Component {

package/components/table/table.vdt.js

@@ -106,6 +106,7 @@ export default function ($props, $blocks, $__proto__) {
     getAllStatus = _this$checked.getAllStatus,
     onChangeChecked = _this$checked.onChangeChecked;
   var allCheckedStatus = getAllCheckedStatus();
+  var allStatus = getAllStatus();
   var thead = hideHeader ? null : _$cc(TableContext.Provider, {
     'value': {
       checkType: checkType,
@@ -140,7 +141,9 @@ export default function ($props, $blocks, $__proto__) {
                   'value': allCheckedStatus === AllCheckedStatus.All,
                   'indeterminate': showIndeterminate && allCheckedStatus == AllCheckedStatus.Indeterminate,
                   'ev-$change:value': toggleCheckedAll,
-                  'disabled': !hasData
+                  'disabled': !hasData || allStatus.every(function (_it) {
+                    return _it.disabled;
+                  })
                 }) : undefined) : undefined, $value];
                 return animation[1] ? _$cc(TransitionGroup, {
                   'name': 'k-fade-expand',
@@ -156,7 +159,6 @@ export default function ($props, $blocks, $__proto__) {
   });
   var getAllKeys = this.disableRow.getAllKeys;
   var getGrid = this.merge.getGrid;
-  var allStatus = getAllStatus();
   var allKeys = getAllKeys();
   var colCount = maxCols + (checkType !== 'none' ? 1 : 0);
   var isExpanded = this.expandable.isExpanded;

package/components/tree/useChecked.js

@@ -2,6 +2,7 @@ import _Set from "@babel/runtime-corejs3/core-js/set";
 import _Array$from from "@babel/runtime-corejs3/core-js/array/from";
 import { useInstance } from 'intact-vue-next';
 import { useReceive } from '../../hooks/useReceive';
+import { isEqualArray } from '../utils';
 export function useChecked(getNodes) {
   var instance = useInstance();
   var checkedKeys = new _Set();
@@ -32,9 +33,7 @@ export function useChecked(getNodes) {
           }
         }
         node.checked = checked;
-        if (checked) {
-          node.indeterminate = false;
-        }
+        node.indeterminate = false;
         if (shouldUpdateCheckedKeys) {
           updateCheckedKeys(node);
         }
@@ -47,6 +46,13 @@ export function useChecked(getNodes) {
     needRecheckNodes.forEach(function (node) {
       updateUpward(node);
     });
+    if (instance.get('checkbox')) {
+      var oldCheckedKeys = instance.get('checkedKeys');
+      var newCheckedKeys = _Array$from(checkedKeys);
+      if (!isEqualArray(oldCheckedKeys, newCheckedKeys)) {
+        instance.set('checkedKeys', newCheckedKeys);
+      }
+    }
   }
   function updateCheckedKeys(node) {
     if (node.checked) {
@@ -56,7 +62,7 @@ export function useChecked(getNodes) {
     }
   }
   function toggle(node) {
-    var uncorrelated = instance.get('uncorrelated');
+    // const uncorrelated = instance.get('uncorrelated');
     updateDownward(node, !node.checked);
     updateUpward(node.parent);
     instance.set('checkedKeys', _Array$from(checkedKeys));

package/components/treeSelect/index.spec.js

@@ -15,7 +15,7 @@ describe('TreeSelect', function () {
     return unmount();
   });
   it('should select value correctly', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
-    var _mount, instance, element, dropdown;
+    var _mount, instance, element, dropdown, texts, text1, text111;
     return _regeneratorRuntime.wrap(function _callee$(_context) {
       while (1) switch (_context.prev = _context.next) {
         case 0:
@@ -26,13 +26,28 @@ describe('TreeSelect', function () {
         case 4:
           dropdown = getElement('.k-tree-select-menu');
           expect(dropdown.innerHTML).to.matchSnapshot();
-          dropdown.querySelector('.k-tree-text').click();
+          texts = dropdown.querySelectorAll('.k-tree-text');
+          text1 = texts[0];
+          text111 = texts[2];
+          text1.click();
+          _context.next = 12;
+          return wait();
+        case 12:
           expect(instance.get('value')).to.eql('1');
-          _context.next = 10;
+          _context.next = 15;
           return wait(500);
-        case 10:
+        case 15:
+          element.click();
+          text111.click();
+          _context.next = 19;
+          return wait();
+        case 19:
+          expect(instance.get('value')).to.eql('1.1.1');
+          _context.next = 22;
+          return wait(500);
+        case 22:
           expect(getElement('.k-tree-select-menu')).to.be.undefined;
-        case 11:
+        case 23:
         case "end":
           return _context.stop();
       }
@@ -168,4 +183,66 @@ describe('TreeSelect', function () {
       }
     }, _callee5);
   })));
+  it('should handle parent node correctly when all children are checked initially', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee6() {
+    var _mount6, instance, element, dropdown, parentCheckboxes;
+    return _regeneratorRuntime.wrap(function _callee6$(_context7) {
+      while (1) switch (_context7.prev = _context7.next) {
+        case 0:
+          _mount6 = mount(CheckboxDemo), instance = _mount6[0], element = _mount6[1]; // init values
+          instance.set('values', ['2.1.1', '2.1.2']);
+          _context7.next = 4;
+          return wait();
+        case 4:
+          // because 2.2 is disabled, so it will select the outermost parent node 2
+          expect(instance.get('values')).to.eql(['2']);
+          element.click();
+          _context7.next = 8;
+          return wait();
+        case 8:
+          dropdown = getElement('.k-tree-select-menu'); // verify parent node is selected
+          parentCheckboxes = dropdown.querySelectorAll('.k-checkbox');
+          expect(parentCheckboxes[3].classList.contains('k-checked')).to.be.true; // First floor-2
+          expect(parentCheckboxes[4].classList.contains('k-checked')).to.be.true; // Second floor-2.1
+        case 12:
+        case "end":
+          return _context7.stop();
+      }
+    }, _callee6);
+  })));
+  it('should clear parent node state when setting values to empty array', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee7() {
+    var _mount7, instance, element, dropdown, checkboxes;
+    return _regeneratorRuntime.wrap(function _callee7$(_context8) {
+      while (1) switch (_context8.prev = _context8.next) {
+        case 0:
+          _mount7 = mount(CheckboxDemo), instance = _mount7[0], element = _mount7[1]; // select a parent node first
+          instance.set('values', ['2.1.1']);
+          _context8.next = 4;
+          return wait();
+        case 4:
+          element.click();
+          _context8.next = 7;
+          return wait();
+        case 7:
+          dropdown = getElement('.k-tree-select-menu'); // verify related nodes are selected
+          checkboxes = dropdown.querySelectorAll('.k-checkbox');
+          expect(checkboxes[3].classList.contains('k-indeterminate')).to.be.true; // First floor-2
+          expect(checkboxes[4].classList.contains('k-indeterminate')).to.be.true; // Second floor-2.1
+          expect(checkboxes[5].classList.contains('k-checkbox')).to.be.true; // Third floor-2.1.1
+          // expect(checkboxes[6].classList.contains('k-checked')).to.be.true; // Third floor-2.1.2
+          // set to empty array
+          instance.set('values', []);
+          _context8.next = 15;
+          return wait();
+        case 15:
+          // verify all nodes are cleared selected state
+          checkboxes.forEach(function (checkbox) {
+            expect(checkbox.classList.contains('k-checked')).to.be.false;
+            expect(checkbox.classList.contains('k-indeterminate')).to.be.false;
+          });
+        case 16:
+        case "end":
+          return _context8.stop();
+      }
+    }, _callee7);
+  })));
 });

package/components/treeSelect/useValue.d.ts

@@ -4,6 +4,6 @@ export declare function useValue(): {
     selectedKeys: import("../../hooks/useState").State<Key[]>;
     checkedKeys: import("../../hooks/useState").State<Key[]>;
     treeRef: import('intact-vue-next').RefObject<Tree<Key>>;
-    onChangeCheckedKeys: () => void;
+    onChangeCheckedKeys: (allKeys: Key[]) => void;
     onChangeSelectedKeys: (keys: Key[]) => void;
 };

package/components/treeSelect/useValue.js

@@ -1,6 +1,7 @@
 import { useInstance, createRef } from 'intact-vue-next';
 import { useState } from '../../hooks/useState';
 import { isNullOrUndefined } from 'intact-shared';
+import { isEqualArray } from '../utils';
 export function useValue() {
   var instance = useInstance();
   var selectedKeys = useState([]);
@@ -16,10 +17,12 @@ export function useValue() {
     selectedKeys.set(v);
     checkedKeys.set(v);
   }
-  function onChangeCheckedKeys() {
+  function onChangeCheckedKeys(allKeys) {
+    checkedKeys.set(allKeys);
     var keys = getAllCheckedKeys();
-    instance.set('value', keys);
-    checkedKeys.set(keys);
+    if (!isEqualArray(keys, instance.get('value'))) {
+      instance.set('value', keys);
+    }
   }
   function getAllCheckedKeys() {
     // if the parent has been checked, ignore the children

package/components/virtualList/index.spec.js

@@ -21,13 +21,16 @@ describe('VirtualList', function () {
         case 0:
           _mount = mount(BasicDemo), instance = _mount[0], element = _mount[1]; // check basic structure
           container = element.querySelector('.k-virtual-container');
+          _context.next = 4;
+          return wait();
+        case 4:
           expect(container.outerHTML).to.matchSnapshot();
           wrapper = element.querySelector('.k-virtual-wrapper');
           expect(wrapper).to.exist;
           // check render items is less than total
           items = wrapper.children;
           expect(items.length).to.be.lessThan(100);
-        case 7:
+        case 9:
         case "end":
           return _context.stop();
       }
@@ -369,4 +372,200 @@ describe('VirtualList', function () {
       }
     }, _callee8);
   })));
+  it('should handle async data correctly', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee9() {
+    var AsyncDemo, _mount9, instance, container, wrapper, phantom;
+    return _regeneratorRuntime.wrap(function _callee9$(_context16) {
+      while (1) switch (_context16.prev = _context16.next) {
+        case 0:
+          AsyncDemo = /*#__PURE__*/function (_Component5) {
+            _inheritsLoose(AsyncDemo, _Component5);
+            function AsyncDemo() {
+              var _context15;
+              var _this5;
+              for (var _len5 = arguments.length, args = new Array(_len5), _key5 = 0; _key5 < _len5; _key5++) {
+                args[_key5] = arguments[_key5];
+              }
+              _this5 = _Component5.call.apply(_Component5, _concatInstanceProperty(_context15 = [this]).call(_context15, args)) || this;
+              _this5.VirtualList = VirtualList;
+              return _this5;
+            }
+            AsyncDemo.defaults = function defaults() {
+              return {
+                list: []
+              };
+            };
+            return AsyncDemo;
+          }(Component);
+          AsyncDemo.template = "\n                const VirtualList = this.VirtualList;\n                <VirtualList style=\"height: 300px\">\n                    <div v-for={this.get('list')} key={$value}>Item {$value}</div>\n                </VirtualList>\n            ";
+          _mount9 = mount(AsyncDemo), instance = _mount9[0];
+          _context16.next = 5;
+          return wait();
+        case 5:
+          container = getElement('.k-virtual-container');
+          wrapper = getElement('.k-virtual-wrapper');
+          phantom = getElement('.k-virtual-phantom'); // check initial state
+          expect(wrapper.children.length).to.equal(0);
+          expect(phantom.style.height).to.equal('0px');
+          // simulate async data loading
+          instance.set('list', _Array$from({
+            length: 100
+          }, function (_, i) {
+            return i;
+          }));
+          _context16.next = 13;
+          return wait(50);
+        case 13:
+          expect(wrapper.children.length).to.be.equal(23);
+          expect(phantom.style.height).to.be.equal('1800px');
+          // check render content
+          expect(wrapper.firstElementChild.textContent).to.equal('Item 0');
+        case 16:
+        case "end":
+          return _context16.stop();
+      }
+    }, _callee9);
+  })));
+  it('should handle empty data and re-adding data correctly', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee10() {
+    var EmptyDemo, _mount10, instance, container, wrapper, phantom, initialHeight, initialChildrenCount;
+    return _regeneratorRuntime.wrap(function _callee10$(_context18) {
+      while (1) switch (_context18.prev = _context18.next) {
+        case 0:
+          EmptyDemo = /*#__PURE__*/function (_Component6) {
+            _inheritsLoose(EmptyDemo, _Component6);
+            function EmptyDemo() {
+              var _context17;
+              var _this6;
+              for (var _len6 = arguments.length, args = new Array(_len6), _key6 = 0; _key6 < _len6; _key6++) {
+                args[_key6] = arguments[_key6];
+              }
+              _this6 = _Component6.call.apply(_Component6, _concatInstanceProperty(_context17 = [this]).call(_context17, args)) || this;
+              _this6.VirtualList = VirtualList;
+              return _this6;
+            }
+            EmptyDemo.defaults = function defaults() {
+              return {
+                list: _Array$from({
+                  length: 100
+                }, function (_, i) {
+                  return i;
+                })
+              };
+            };
+            return EmptyDemo;
+          }(Component);
+          EmptyDemo.template = "\n                const VirtualList = this.VirtualList;\n                <VirtualList style=\"height: 300px\">\n                    <div v-for={this.get('list')} key={$value}>Item {$value}</div>\n                </VirtualList>\n            ";
+          _mount10 = mount(EmptyDemo), instance = _mount10[0];
+          _context18.next = 5;
+          return wait();
+        case 5:
+          container = getElement('.k-virtual-container');
+          wrapper = getElement('.k-virtual-wrapper');
+          phantom = getElement('.k-virtual-phantom'); // record initial state
+          initialHeight = phantom.style.height;
+          initialChildrenCount = wrapper.children.length; // clear data
+          instance.set('list', []);
+          _context18.next = 13;
+          return wait(50);
+        case 13:
+          // check empty state
+          expect(wrapper.children.length).to.equal(0);
+          expect(phantom.style.height).to.equal('0px');
+          // re-add data
+          instance.set('list', _Array$from({
+            length: 50
+          }, function (_, i) {
+            return i;
+          }));
+          _context18.next = 18;
+          return wait(50);
+        case 18:
+          // check re-add data state
+          expect(wrapper.children.length).to.be.equal(23);
+          expect(parseInt(phantom.style.height)).to.be.equal(900);
+          expect(wrapper.firstElementChild.textContent).to.equal('Item 0');
+          // 滚动测试
+          // container.scrollTop = 100;
+          // await wait(50);
+          // // 检查滚动后的渲染是否正确
+          // expect(wrapper.firstElementChild!.textContent).to.not.equal('Item 0');
+        case 21:
+        case "end":
+          return _context18.stop();
+      }
+    }, _callee10);
+  })));
+  it('should handle extreme height differences correctly', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee11() {
+    var ExtremeHeightDemo, _mount11, instance, container, wrapper, phantom, initialItems, initialLength, firstItem, initialTotalHeight, initialAvgHeight, newItems, newLength, firstNewItem, firstVisibleIndex, finalItems, finalFirstItem;
+    return _regeneratorRuntime.wrap(function _callee11$(_context20) {
+      while (1) switch (_context20.prev = _context20.next) {
+        case 0:
+          ExtremeHeightDemo = /*#__PURE__*/function (_Component7) {
+            _inheritsLoose(ExtremeHeightDemo, _Component7);
+            function ExtremeHeightDemo() {
+              var _context19;
+              var _this7;
+              for (var _len7 = arguments.length, args = new Array(_len7), _key7 = 0; _key7 < _len7; _key7++) {
+                args[_key7] = arguments[_key7];
+              }
+              _this7 = _Component7.call.apply(_Component7, _concatInstanceProperty(_context19 = [this]).call(_context19, args)) || this;
+              _this7.VirtualList = VirtualList;
+              return _this7;
+            }
+            ExtremeHeightDemo.defaults = function defaults() {
+              return {
+                list: _Array$from({
+                  length: 100
+                }, function (_, i) {
+                  return i;
+                })
+              };
+            };
+            return ExtremeHeightDemo;
+          }(Component);
+          ExtremeHeightDemo.template = "\n                const VirtualList = this.VirtualList;\n                <VirtualList style=\"height: 300px\">\n                    <div v-for={this.get('list')} \n                        key={$value} \n                        style={$value < 5 ? 'height: 100px' : 'height: 30px'}\n                    >\n                        Item {$value}\n                    </div>\n                </VirtualList>\n            ";
+          _mount11 = mount(ExtremeHeightDemo), instance = _mount11[0];
+          _context20.next = 5;
+          return wait();
+        case 5:
+          container = getElement('.k-virtual-container');
+          wrapper = getElement('.k-virtual-wrapper');
+          phantom = getElement('.k-virtual-phantom');
+          initialItems = wrapper.children;
+          initialLength = initialItems.length; // check first 5 elements height
+          firstItem = initialItems[0];
+          expect(firstItem.offsetHeight).to.equal(100);
+          // record initial average height (calculate by total height and render count)
+          initialTotalHeight = parseInt(phantom.style.height);
+          initialAvgHeight = initialTotalHeight / 100;
+          expect(initialAvgHeight).to.be.greaterThan(30);
+          // scroll to small height area
+          container.scrollTop = 800;
+          _context20.next = 18;
+          return wait(50);
+        case 18:
+          // check new render elements
+          newItems = wrapper.children;
+          newLength = newItems.length;
+          firstNewItem = newItems[0]; // check
+          // new render elements should be 30px height
+          expect(firstNewItem.offsetHeight).to.equal(30);
+          // because average height is smaller, render elements count should be more
+          expect(newLength).to.be.greaterThan(initialLength);
+          // check scroll position is correct
+          firstVisibleIndex = parseInt(firstNewItem.textContent.replace('Item ', ''));
+          expect(firstVisibleIndex).to.be.greaterThan(5);
+          container.scrollTop = 1200;
+          _context20.next = 28;
+          return wait();
+        case 28:
+          finalItems = wrapper.children;
+          finalFirstItem = finalItems[0];
+          expect(finalFirstItem.offsetHeight).to.equal(30);
+          expect(finalItems.length).to.equal(newLength); // render count should be stable
+        case 32:
+        case "end":
+          return _context20.stop();
+      }
+    }, _callee11);
+  })));
 });

package/components/virtualList/rows.vdt.js

@@ -19,10 +19,11 @@ export default function ($props, $blocks, $__proto__) {
         disabled = _ref.disabled;
       if (!disabled) {
         var _context;
-        _children = _sliceInstanceProperty(_context = rows.value).call(_context, startIndex, startIndex + length);
         notifyRows(rows.value);
+        _children = _sliceInstanceProperty(_context = rows.value).call(_context, startIndex, startIndex + length);
       }
       if (isNullOrUndefined(tagName)) {
+        if (!_children.length) return;
         return createFragment(_children, 8 /* ChildrenTypes.HasKeyedChildren */);
       }
       return createVNode(tagName, null, _children);

package/components/virtualList/useRows.js

@@ -1,4 +1,4 @@
-import { useInstance, createRef, createFragment } from 'intact-vue-next';
+import { useInstance, createRef, createFragment, isText } from 'intact-vue-next';
 export function useRows() {
   var instance = useInstance();
   var rows = createRef([]);
@@ -8,11 +8,24 @@ export function useRows() {
     // convert to array if it has only one child
     var childrenType = vNode.childrenType;
     if (childrenType & 2 /* ChildrenTypes.HasVNodeChildren */) {
-      rows.value = [vNode.children];
+      var _children = vNode.children;
+      if (isText(_children)) {
+        // ignore void and text vnode
+        rows.value = [];
+      } else {
+        rows.value = [_children];
+      }
     } else if (childrenType & 1 /* ChildrenTypes.HasInvalidChildren */) {
       rows.value = [];
     } else {
       rows.value = vNode.children;
+      if (process.env.NODE_ENV !== 'production') {
+        rows.value.forEach(function (row) {
+          if (isText(row)) {
+            console.warn('VirtualList: Text node can not been used as children.');
+          }
+        });
+      }
     }
   });
   return rows;