@king-design/intact 3.5.0-beta.0 → 3.5.0

package/es/components/select/select.vdt.js

@@ -14,7 +14,8 @@ export default function ($props, $blocks, $__proto__) {
     autoDisableArrow = _this$get.autoDisableArrow,
     disabled = _this$get.disabled,
     multiple = _this$get.multiple,
-    value = _this$get.value;
+    value = _this$get.value,
+    virtual = _this$get.virtual;
   var _this$filterable = this.filterable,
     getCreatedVNode = _this$filterable.getCreatedVNode,
     filter = _filterInstanceProperty(_this$filterable);

package/es/components/select/useFilterable.js

@@ -1,6 +1,6 @@
 import _extends from "@babel/runtime-corejs3/helpers/extends";
-import _findInstanceProperty from "@babel/runtime-corejs3/core-js/instance/find";
 import _trimInstanceProperty from "@babel/runtime-corejs3/core-js/instance/trim";
+import _findInstanceProperty from "@babel/runtime-corejs3/core-js/instance/find";
 import _filterInstanceProperty from "@babel/runtime-corejs3/core-js/instance/filter";
 import { useInstance, createVNode as h, directClone } from 'intact';
 import { Option } from './option';
@@ -10,18 +10,19 @@ import { getTextByChildren, mapChildren, isComponentVNode } from '../utils';
 export function useFilterable(keywords) {
   var component = useInstance();
   function getCreatedVNode(children) {
+    var _context;
     var _component$get = component.get(),
       creatable = _component$get.creatable,
       filterable = _component$get.filterable;
-    var _keywords = keywords.value;
+    var _keywords = _trimInstanceProperty(_context = keywords.value).call(_context);
     if (creatable && filterable && _keywords) {
       if (!_findInstanceProperty(children).call(children, function (vNode) {
         // TODO: create Option for OptionGroup
         if (vNode.tag === Option) {
-          var _context;
+          var _context2;
           var props = vNode.props;
           if (isNullOrUndefined(props)) return false;
-          if (props.value === _keywords || _trimInstanceProperty(_context = props.label).call(_context) === _keywords) {
+          if (props.value === _keywords || _trimInstanceProperty(_context2 = props.label).call(_context2) === _keywords) {
             return true;
           }
         }
@@ -47,6 +48,7 @@ export function useFilterable(keywords) {
       var _children = [];
       mapChildren(children, function (vNode) {
         if (isComponentVNode(vNode, Option)) {
+          var _context3;
           var props = vNode.props;
           if (isNullOrUndefined(props)) return;
           vNode = directClone(vNode);
@@ -59,7 +61,7 @@ export function useFilterable(keywords) {
           if (isStringOrNumber(value)) {
             vNode.key = value;
           }
-          if (filter(keywords.value, vNode.props)) {
+          if (filter(_trimInstanceProperty(_context3 = keywords.value).call(_context3), vNode.props)) {
             _children.push(vNode);
           }
         } else if (isComponentVNode(vNode, OptionGroup)) {

package/es/components/select/useInput.js

@@ -1,4 +1,3 @@
-import _trimInstanceProperty from "@babel/runtime-corejs3/core-js/instance/trim";
 import { useInstance, nextTick, createRef } from 'intact';
 import { useState } from '../../hooks/useState';
 export function useInput(resetKeywords) {
@@ -6,7 +5,12 @@ export function useInput(resetKeywords) {
   var keywords = useState('');
   var inputRef = createRef();
   function onInput(value) {
-    keywords.set(_trimInstanceProperty(value).call(value));
+    /**
+     * can not trim the keywords, otherwise we can not input spaces
+     * https://github.com/ksc-fe/kpc/issues/1047
+     */
+    // keywords.set(value.trim());
+    keywords.set(value);
     var dropdown = component.dropdownRef.value;
     // the position may be flip, and the select input height may change height too,
     // so we should reset the position

package/es/components/table/index.spec.js

@@ -777,27 +777,28 @@ describe('Table', function () {
       while (1) switch (_context21.prev = _context21.next) {
         case 0:
           _mount19 = mount(TreeDemo), instance = _mount19[0], element = _mount19[1];
-          table = instance.$lastInput.children; // check all
+          table = instance.$lastInput.children[0].children; // check all
           checkbox = element.querySelector('.k-checkbox');
           checkbox.click();
           _context21.next = 6;
           return wait();
         case 6:
           expect(element.innerHTML).to.matchSnapshot();
+          debugger;
           expect(table.getCheckedData()).to.have.lengthOf(8);
           arrow = element.querySelector('.k-table-arrow');
           arrow.click();
-          _context21.next = 12;
+          _context21.next = 13;
           return wait();
-        case 12:
+        case 13:
           expect(element.innerHTML).to.matchSnapshot();
           arrow.click();
-          _context21.next = 16;
+          _context21.next = 17;
           return wait();
-        case 16:
+        case 17:
           expect(element.innerHTML).to.matchSnapshot();
           expect(table.getCheckedData()).to.have.lengthOf(8);
-        case 18:
+        case 19:
         case "end":
           return _context21.stop();
       }

package/es/components/table/styles.js

@@ -93,7 +93,7 @@ export { table };
 export var makeStyles = cache(function makeStyles(k) {
   return /*#__PURE__*/css("font-size:", table.fontSize, ";color:", table.color, ";position:relative;z-index:0;.", k, "-table-wrapper{border-bottom:", table.border, ";overflow:auto;border-radius:", table.borderRadius, ";}table{width:100%;border-collapse:separate;border-spacing:0;table-layout:fixed;}thead{text-align:", table.thead.textAlign, ";font-size:", table.thead.fontSize, ";font-weight:", table.thead.fontWeight, ";z-index:2;tr{height:", table.thead.height, ";&:not(:last-of-type) th{border-bottom:", table.border, ";}}}tfoot{z-index:2;tr{td{border-top:", table.border, ";border-bottom-color:transparent;}}}th{padding:", table.thead.padding, ";position:relative;background:", table.thead.bgColor, ";line-height:normal;&:before{content:'';height:", table.thead.delimiterHeight, ";position:absolute;background-color:", table.thead.delimiterColor, ";width:1px;left:1px;top:50%;transform:translateY(-50%);}&.", k, "-fixed-right:before{left:-2px;}&:first-of-type:before{display:none;}}.", k, "-table-title{display:inline-flex;align-items:center;max-width:100%;color:", table.thead.color, ";}.", k, "-table-title-text{flex:1;display:inline-flex;line-height:1.4;}tbody{tr{&:hover td{background:", table.tbody.hoverBgcolor, ";}&:last-of-type td{border-bottom-color:transparent;}}}td{padding:", table.tbody.padding, ";border-bottom:", table.border, ";background:", table.bgColor, ";word-wrap:break-word;}.", k, "-fixed-left,.", k, "-fixed-right{position:sticky;z-index:1;&:after{content:'';display:block;transition:box-shadow ", table.transition, ";position:absolute;top:0;bottom:0px;width:10px;pointer-events:none;}}.", k, "-fixed-left:after{right:-11px;}.", k, "-fixed-right:after{left:-11px;}&.", k, "-scroll-left .", k, "-fixed-right:after{box-shadow:", table.fixRightShadow, ";}&.", k, "-scroll-right .", k, "-fixed-left:after{box-shadow:", table.fixLeftShadow, ";}&.", k, "-scroll-middle{.", k, "-fixed-left:after{box-shadow:", table.fixLeftShadow, ";}.", k, "-fixed-right:after{box-shadow:", table.fixRightShadow, ";}}.", k, "-fixed-right+.", k, "-fixed-right:after{display:none;}.", k, "-table-affix-header{position:sticky;top:0;left:0;.", k, "-affix-wrapper{overflow:hidden;}&.", k, "-fixed{position:relative;}}&.", k, "-border,&.", k, "-grid{.", k, "-table-wrapper{border-top:", table.border, ";border-left:", table.border, ";border-right:", table.border, ";}}&.", k, "-grid{td:not(:last-of-type),th:not(:last-of-type){border-right:", table.border, ";}th:before{display:none;}}&.", k, "-stripe{tr:nth-child(even):not(:hover) td{background:", table.stripeBgColor, ";}}.", k, "-table-group{margin-left:", table.group.gap, ";}.", k, "-table-check{.", k, "-checkbox,.", k, "-radio{position:relative;top:-1px;}}.", k, "-column-sortable{cursor:pointer;}.", k, "-column-sort{.", k, "-icon{display:block;height:", _sortInstanceProperty(table).iconHeight, ";line-height:", _sortInstanceProperty(table).iconHeight, ";margin:0 0 1px ", _sortInstanceProperty(table).gap, ";}&.", k, "-desc .", k, "-icon.", k, "-desc,&.", k, "-asc .", k, "-icon.", k, "-asc{color:", _sortInstanceProperty(table).enabledColor, ";}}.", k, "-table-spin.", k, "-overlay{z-index:2;}.", k, "-table-empty{text-align:center;}tr.", k, "-expand{td{padding:0;background:#fdfcff;}}&.", k, "-with-expand{tr:not(.", k, "-expand){td{border-bottom:none;}}}.", k, "-table-expand{border-top:", table.border, ";box-sizing:content-box;}tbody tr.", k, "-selected td{background:", table.selectedBgColor, ";}.", k, "-hidden{display:none;}.", k, "-table-arrow{width:", table.arrow.width, "!important;margin-right:", table.arrow.gap, ";transition:transform ", table.transition, ";position:relative;top:-1px;}tr.", k, "-spreaded{.", k, "-table-arrow{transform:rotate(90deg);}}.", k, "-table-resize{height:100%;width:", table.resizeWidth, ";position:absolute;top:0;left:-1px;cursor:ew-resize;}tr.", k, "-dragging{opacity:", table.draggingOpacity, ";}.", k, "-table-scrollbar{overflow-x:auto;overflow-y:hidden;}.", k, "-table-scrollbar-inner{height:1px;}", _mapInstanceProperty(aligns).call(aligns, function (type) {
     return /*#__PURE__*/css(".", k, "-align-", type, "{text-align:", type, ";}");
-  }), ">.", k, "-pagination{margin:16px 0;}&.", k, "-fix-header{min-height:0;.", k, "-table-wrapper{height:100%;}thead{position:sticky;top:0;}}&.", k, "-fix-footer{min-height:0;.", k, "-table-wrapper{height:100%;}tfoot{position:sticky;bottom:0;}}");
+  }), ">.", k, "-pagination{margin:16px 0;}&.", k, "-fix-header{min-height:0;.", k, "-table-wrapper{height:100%;}thead{position:sticky;top:0;}}&.", k, "-fix-footer{min-height:0;.", k, "-table-wrapper{height:100%;}tfoot{position:sticky;bottom:0;}}.", k, "-table-phantom{position:static;}");
 });
 export var makeGroupMenuStyles = cache(function makeGroupMenuStyles(k) {
   return /*#__PURE__*/css("min-width:", table.group.menuMinWidth, "!important;.", k, "-dropdown-item.", k, "-active{color:", table.group.activeColor, ";}.", k, "-table-group-header{padding:", table.group.headerPadding, ";border-bottom:", table.group.headerBorder, ";}.", k, "-table-group-body{max-height:", table.group.menuMaxHeight, ";overflow:auto;}.", k, "-table-group-footer{text-align:right;border-top:", table.group.headerBorder, ";padding:8px;.", k, "-btn{margin-left:8px;}}");

package/es/components/table/table.d.ts

@@ -39,6 +39,7 @@ export interface TableProps<T = any, K extends TableRowKey = TableRowKey, C exte
     hideHeader?: boolean;
     pagination?: boolean | PaginationProps;
     fixFooter?: boolean;
+    virtual?: boolean;
     spreadArrowIndex?: number;
     load?: (value: T) => Promise<void> | void;
 }

package/es/components/table/table.js

@@ -63,6 +63,7 @@ var typeDefs = {
   hideHeader: Boolean,
   pagination: [Boolean, Object],
   fixFooter: Boolean,
+  virtual: Boolean,
   spreadArrowIndex: Number,
   load: Function
 };
@@ -146,9 +147,9 @@ export var Table = /*#__PURE__*/function (_Component) {
       // we can not use scrollIntoView with smooth, because it can only operate one element
       // at the same time
       // elem.scrollIntoView({behavior: 'smooth'});
-      var headerHeight = scrollElement.querySelector('thead').offsetHeight;
+      // const headerHeight = (scrollElement.querySelector('thead') as HTMLElement).offsetHeight;
       var scrollTop = scrollElement.scrollTop;
-      var offsetTop = tr.offsetTop - headerHeight;
+      var offsetTop = tr.offsetTop;
       var top = offsetTop - scrollTop;
       var topOneFrame = top / 60 / (100 / 1000);
       var step = function step() {

package/es/components/table/table.vdt.js

@@ -20,6 +20,7 @@ import { AllCheckedStatus } from './useChecked';
 import { context as ResizableContext } from './useResizable';
 import { context as FixedColumnsContext } from './useFixedColumns';
 import { Pagination } from '../pagination';
+import { VirtualListContainer, VirtualListWrapper, VirtualListRows, VirtualListPhantom } from '../virtualList';
 var _$tmp0 = {
   'width': '40'
 };
@@ -56,6 +57,7 @@ export default function ($props, $blocks, $__proto__) {
     hideHeader = _this$get.hideHeader,
     pagination = _this$get.pagination,
     fixFooter = _this$get.fixFooter,
+    virtual = _this$get.virtual,
     spreadArrowIndex = _this$get.spreadArrowIndex;
   var animation = !Array.isArray(_animation) ? [_animation, _animation] : _animation;
   var _this$columns$getData = this.columns.getData(),
@@ -168,114 +170,119 @@ export default function ($props, $blocks, $__proto__) {
     onRowDragOver = _this$draggable.onRowDragOver,
     onRowDragEnd = _this$draggable.onRowDragEnd,
     draggingKey = _this$draggable.draggingKey;
-  var tbody = _$ce(2, 'tbody', !hasData ? _$ce(2, 'tr', _$ce(2, 'td', (_$blocks['empty'] = function ($super) {
-    return _$('暂无数据');
-  }, __$blocks['empty'] = function ($super, data) {
-    var block = $blocks['empty'];
-    var callBlock = function callBlock() {
-      return _$blocks['empty'].call($this, $super, data);
-    };
-    return block ? block.call($this, callBlock, data) : callBlock();
-  }, __$blocks['empty'](_$no)), 0, _$cn(k + "-table-empty"), {
-    'colspan': colCount
-  }), 2, null, null, 'table-empty') : function () {
-    var rows = [];
-    loopData(function (value, index, level, hidden) {
-      // don't render if row is hidden
-      if (hidden) return hidden;
-      var status = allStatus[index];
-      var key = allKeys[index];
-      var spreaded = isSpreaded(key);
-      var hasChildren = !!childrenKey && Array.isArray(value[childrenKey]);
-      var indentSize = indent ? indent * level : 0;
-      var row = _$cc(TableRow, {
-        'key': key,
-        'cols': cols,
-        'data': value,
-        'loaded': value.loaded,
-        'checkType': checkType,
-        'hasFixedLeft': hasFixedLeft,
-        'onClick': _this.clickRow,
-        'checked': status.checked,
-        'indeterminate': status.indeterminate,
-        'index': index,
-        'disabled': status.disabled,
-        'allDisabled': status.allDisabled,
-        'className': _$cn(rowClassName && rowClassName(value, index, key)),
-        'merge': merge,
-        'grid': getGrid(),
-        'onChangeChecked': onChangeChecked,
-        'selected': isSelected(key),
-        'spreaded': spreaded,
-        'hasChildren': hasChildren,
-        'indent': indentSize,
-        'onToggleSpreadRow': toggleSpreadRow,
-        'onBeforeUnmount': _this.resetRowStatus.onRowBeforeUnmount,
-        'offsetMap': offsetMap.value,
-        'animation': animation[1],
-        'spreadArrowIndex': spreadArrowIndex,
-        'draggable': draggable,
-        'draggingKey': draggingKey.value,
-        'onRowDragStart': onRowDragStart,
-        'onRowDragEnd': onRowDragEnd,
-        'onRowDragOver': onRowDragOver
-      }, key);
-      if ($blocks.tooltip) {
-        var content = (_$blocks['tooltip'] = function ($super) {
-          return null;
-        }, __$blocks['tooltip'] = function ($super, data) {
-          var block = $blocks['tooltip'];
-          var callBlock = function callBlock() {
-            return _$blocks['tooltip'].call($this, $super, data);
-          };
-          return block ? block.call($this, callBlock, data) : callBlock();
-        }, __$blocks['tooltip'](_$no, [value, index]));
-        row = _$cc(Tooltip, {
+  var tbody = _$cc(VirtualListWrapper, {
+    'tagName': 'tbody',
+    'children': !hasData ? _$ce(2, 'tr', _$ce(2, 'td', (_$blocks['empty'] = function ($super) {
+      return _$('暂无数据');
+    }, __$blocks['empty'] = function ($super, data) {
+      var block = $blocks['empty'];
+      var callBlock = function callBlock() {
+        return _$blocks['empty'].call($this, $super, data);
+      };
+      return block ? block.call($this, callBlock, data) : callBlock();
+    }, __$blocks['empty'](_$no)), 0, _$cn(k + "-table-empty"), {
+      'colspan': colCount
+    }), 2, null, null, 'table-empty') : function () {
+      var rows = [];
+      loopData(function (value, index, level, hidden) {
+        // don't render if row is hidden
+        if (hidden) return hidden;
+        var status = allStatus[index];
+        var key = allKeys[index];
+        var spreaded = isSpreaded(key);
+        var hasChildren = !!childrenKey && Array.isArray(value[childrenKey]);
+        var indentSize = indent ? indent * level : 0;
+        var row = _$cc(TableRow, {
           'key': key,
-          'position': tooltipPosition,
-          'container': tooltipContainer,
-          'children': row,
-          '$blocks': function ($blocks) {
-            var _$blocks = {},
-              __$blocks = _$ex({}, $blocks);
-            return (_$blocks['content'] = function ($super) {
-              return content;
-            }, __$blocks['content'] = function ($super, data) {
-              var block = $blocks['content'];
-              var callBlock = function callBlock() {
-                return _$blocks['content'].call($this, $super, data);
-              };
-              return block ? block.call($this, callBlock, data) : callBlock();
-            }), __$blocks;
-          }.call($this, _$em)
+          'cols': cols,
+          'data': value,
+          'loaded': value.loaded,
+          'checkType': checkType,
+          'hasFixedLeft': hasFixedLeft,
+          'onClick': _this.clickRow,
+          'checked': status.checked,
+          'indeterminate': status.indeterminate,
+          'index': index,
+          'disabled': status.disabled,
+          'allDisabled': status.allDisabled,
+          'className': _$cn(rowClassName && rowClassName(value, index, key)),
+          'merge': merge,
+          'grid': getGrid(),
+          'onChangeChecked': onChangeChecked,
+          'selected': isSelected(key),
+          'spreaded': spreaded,
+          'hasChildren': hasChildren,
+          'indent': indentSize,
+          'onToggleSpreadRow': toggleSpreadRow,
+          'onBeforeUnmount': _this.resetRowStatus.onRowBeforeUnmount,
+          'offsetMap': offsetMap.value,
+          'animation': animation[1],
+          'spreadArrowIndex': spreadArrowIndex,
+          'draggable': draggable,
+          'draggingKey': draggingKey.value,
+          'onRowDragStart': onRowDragStart,
+          'onRowDragEnd': onRowDragEnd,
+          'onRowDragOver': onRowDragOver
         }, key);
-      }
-      rows.push(row);
-      if ($blocks.expand) {
-        var _$cn3;
-        var expanded = isExpanded(key);
-        rows.push(_$ce(2, 'tr', _$ce(2, 'td', _$cc(Transition, _extends({}, expandAnimationCallbacks, {
-          'children': expanded ? _$ce(2, 'div', (_$blocks['expand'] = function ($super) {
+        if ($blocks.tooltip) {
+          var content = (_$blocks['tooltip'] = function ($super) {
             return null;
-          }, __$blocks['expand'] = function ($super, data) {
-            var block = $blocks['expand'];
+          }, __$blocks['tooltip'] = function ($super, data) {
+            var block = $blocks['tooltip'];
             var callBlock = function callBlock() {
-              return _$blocks['expand'].call($this, $super, data);
+              return _$blocks['tooltip'].call($this, $super, data);
             };
             return block ? block.call($this, callBlock, data) : callBlock();
-          }, __$blocks['expand'](_$no, [value, index])), 0, _$cn(k + "-table-expand")) : undefined
-        })), 2, null, {
-          'colspan': colCount
-        }), 2, _$cn((_$cn3 = {}, _$cn3[k + "-expand"] = true, _$cn3[k + "-expanded"] = expanded, _$cn3)), null, key + ".$expand"));
-      }
-      return hidden || !spreaded;
-    });
-    return animation[0] ? _$cc(TransitionGroup, {
-      'name': 'k-fade-in-left',
-      'move': !draggingKey.value,
-      'children': rows
-    }) : rows;
-  }(), 0);
+          }, __$blocks['tooltip'](_$no, [value, index]));
+          row = _$cc(Tooltip, {
+            'key': key,
+            'position': tooltipPosition,
+            'container': tooltipContainer,
+            'children': row,
+            '$blocks': function ($blocks) {
+              var _$blocks = {},
+                __$blocks = _$ex({}, $blocks);
+              return (_$blocks['content'] = function ($super) {
+                return content;
+              }, __$blocks['content'] = function ($super, data) {
+                var block = $blocks['content'];
+                var callBlock = function callBlock() {
+                  return _$blocks['content'].call($this, $super, data);
+                };
+                return block ? block.call($this, callBlock, data) : callBlock();
+              }), __$blocks;
+            }.call($this, _$em)
+          }, key);
+        }
+        rows.push(row);
+        if ($blocks.expand) {
+          var _$cn3;
+          var expanded = isExpanded(key);
+          rows.push(_$ce(2, 'tr', _$ce(2, 'td', _$cc(Transition, _extends({}, expandAnimationCallbacks, {
+            'children': expanded ? _$ce(2, 'div', (_$blocks['expand'] = function ($super) {
+              return null;
+            }, __$blocks['expand'] = function ($super, data) {
+              var block = $blocks['expand'];
+              var callBlock = function callBlock() {
+                return _$blocks['expand'].call($this, $super, data);
+              };
+              return block ? block.call($this, callBlock, data) : callBlock();
+            }, __$blocks['expand'](_$no, [value, index])), 0, _$cn(k + "-table-expand")) : undefined
+          })), 2, null, {
+            'colspan': colCount
+          }), 2, _$cn((_$cn3 = {}, _$cn3[k + "-expand"] = true, _$cn3[k + "-expanded"] = expanded, _$cn3)), null, key + ".$expand"));
+        }
+        return hidden || !spreaded;
+      });
+      return animation[0] && !virtual ? _$cc(TransitionGroup, {
+        'name': 'k-fade-in-left',
+        'move': !draggingKey.value,
+        'children': rows
+      }) : _$cc(VirtualListRows, {
+        'children': rows
+      });
+    }()
+  });
   var tfooter = null;
   if ($blocks.footer) {
     tfooter = _$ce(2, 'tfoot', _$ce(2, 'tr', _$ce(2, 'td', (_$blocks['footer'] = function ($super) {
@@ -303,21 +310,26 @@ export default function ($props, $blocks, $__proto__) {
     pageLimit = _this$pagination.limit,
     onPageChange = _this$pagination.onChange,
     paginationRef = _this$pagination.paginationRef;
-  return _$ce(2, 'div', [_$ce(2, 'div', [!isNull(stickHeader.value) ? _$cc(Affix, {
-    'top': stickHeader.value,
-    'exclude': excludeStickHeader,
-    'className': _$cn(k + "-table-affix-header"),
-    'children': _$ce(2, 'table', [colgroup, thead], 0, null, {
+  return _$ce(2, 'div', [_$cc(VirtualListContainer, {
+    'className': _$cn(k + "-table-wrapper"),
+    'disabled': !virtual,
+    'style': style,
+    'ref': scrollRef,
+    'children': [_$cc(VirtualListPhantom), !isNull(stickHeader.value) || fixHeader ? _$cc(Affix, {
+      'top': stickHeader.value,
+      'exclude': excludeStickHeader,
+      'className': _$cn(k + "-table-affix-header"),
+      'disabled': !!fixHeader,
+      'children': _$ce(2, 'table', [colgroup, thead], 0, null, {
+        'style': {
+          width: tableWidthPx
+        }
+      }, null, headRef)
+    }) : undefined, _$ce(2, 'table', [colgroup, isNull(stickHeader.value) && !fixHeader ? thead : undefined, tbody, $blocks.footer ? tfooter : undefined], 0, null, {
       'style': {
         width: tableWidthPx
       }
-    }, null, headRef)
-  }) : undefined, _$ce(2, 'table', [colgroup, isNull(stickHeader.value) ? thead : undefined, tbody, $blocks.footer ? tfooter : undefined], 0, null, {
-    'style': {
-      width: tableWidthPx
-    }
-  }, null, tableRef)], 0, _$cn(k + "-table-wrapper"), {
-    'style': style
+    }, null, tableRef)]
   }, null, scrollRef), pagination ? _$cc(Pagination, _extends({
     'ref': paginationRef,
     'total': data ? data.length : 0,

package/es/components/treeSelect/index.js

@@ -2,6 +2,7 @@ import _inheritsLoose from "@babel/runtime-corejs3/helpers/inheritsLoose";
 import _extends from "@babel/runtime-corejs3/helpers/extends";
 import _concatInstanceProperty from "@babel/runtime-corejs3/core-js/instance/concat";
 import _findInstanceProperty from "@babel/runtime-corejs3/core-js/instance/find";
+import _trimInstanceProperty from "@babel/runtime-corejs3/core-js/instance/trim";
 import _filterInstanceProperty from "@babel/runtime-corejs3/core-js/instance/filter";
 import _includesInstanceProperty from "@babel/runtime-corejs3/core-js/instance/includes";
 import { __decorate } from "tslib";
@@ -98,14 +99,14 @@ export var TreeSelect = /*#__PURE__*/function (_BaseSelect) {
     return label;
   };
   _proto.filter = function filter(data) {
-    var _context2, _context3;
-    var keywords = this.input.keywords.value;
+    var _context2, _context3, _context4;
+    var keywords = _trimInstanceProperty(_context2 = this.input.keywords.value).call(_context2);
     if (!keywords) return true;
     var _this$get3 = this.get(),
       filter = _filterInstanceProperty(_this$get3);
     if (filter) return filter(keywords, data);
     keywords = keywords.toLowerCase();
-    return isStringOrNumber(data.label) && _includesInstanceProperty(_context2 = String(data.label).toLowerCase()).call(_context2, keywords) || _includesInstanceProperty(_context3 = String(data.key).toLowerCase()).call(_context3, keywords);
+    return isStringOrNumber(data.label) && _includesInstanceProperty(_context3 = String(data.label).toLowerCase()).call(_context3, keywords) || _includesInstanceProperty(_context4 = String(data.key).toLowerCase()).call(_context4, keywords);
   };
   return TreeSelect;
 }(BaseSelect);

package/es/components/virtualList/container.d.ts

@@ -0,0 +1,10 @@
+import { Component, TypeDefs } from 'intact';
+export interface VirtualListContainerProps {
+    disabled?: boolean;
+}
+export declare class VirtualListContainer extends Component<VirtualListContainerProps> {
+    static template: string | import("intact").Template<any>;
+    static typeDefs: Required<TypeDefs<VirtualListContainerProps>>;
+    private config;
+    private virtualRows;
+}

package/es/components/virtualList/container.js

@@ -0,0 +1,26 @@
+import _inheritsLoose from "@babel/runtime-corejs3/helpers/inheritsLoose";
+import _concatInstanceProperty from "@babel/runtime-corejs3/core-js/instance/concat";
+import { Component } from 'intact';
+import template from './container.vdt';
+import { useConfigContext } from '../config';
+import { useVirtualRows } from './useVirtualRows';
+var typeDefs = {
+  disabled: Boolean
+};
+export var VirtualListContainer = /*#__PURE__*/function (_Component) {
+  _inheritsLoose(VirtualListContainer, _Component);
+  function VirtualListContainer() {
+    var _context;
+    var _this;
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    _this = _Component.call.apply(_Component, _concatInstanceProperty(_context = [this]).call(_context, args)) || this;
+    _this.config = useConfigContext();
+    _this.virtualRows = useVirtualRows();
+    return _this;
+  }
+  return VirtualListContainer;
+}(Component);
+VirtualListContainer.template = template;
+VirtualListContainer.typeDefs = typeDefs;

package/es/components/virtualList/container.vdt.js

@@ -0,0 +1,39 @@
+import _extends from "@babel/runtime-corejs3/helpers/extends";
+import { createUnknownComponentVNode as _$cc, createVNode as _$cv, className as _$cn } from 'intact';
+import { addStyle, getRestProps } from '../utils';
+import { makeContainerStyles } from './styles';
+import { context as VirtualRowsContext } from './useVirtualRows';
+export default function ($props, $blocks, $__proto__) {
+  var _classNameObj;
+  $blocks || ($blocks = {});
+  $props || ($props = {});
+  var $this = this;
+  var _this$get = this.get(),
+    children = _this$get.children,
+    className = _this$get.className,
+    disabled = _this$get.disabled,
+    ref = _this$get.ref;
+  var k = this.config.k;
+  var _this$virtualRows = this.virtualRows,
+    notifyRows = _this$virtualRows.notifyRows,
+    startIndex = _this$virtualRows.startIndex,
+    length = _this$virtualRows.length,
+    getTotalHeight = _this$virtualRows.getTotalHeight,
+    translateY = _this$virtualRows.translateY;
+  var classNameObj = (_classNameObj = {}, _classNameObj[k + "-virtual"] = !disabled, _classNameObj[k + "-virtual-container"] = !disabled, _classNameObj[makeContainerStyles(k)] = !disabled, _classNameObj[className] = className, _classNameObj);
+  return _$cc(VirtualRowsContext.Provider, {
+    'value': {
+      disabled: disabled,
+      notifyRows: notifyRows,
+      getTotalHeight: getTotalHeight,
+      startIndex: startIndex.value,
+      length: length.value,
+      translateY: translateY.value
+    },
+    'children': _$cv('div', _extends({}, getRestProps(this), {
+      'className': _$cn(classNameObj),
+      'ref': ref
+    }), children)
+  });
+}
+;

package/es/components/virtualList/index.d.ts

@@ -0,0 +1,5 @@
+export * from './container';
+export * from './wrapper';
+export * from './rows';
+export * from './virtual';
+export * from './phantom';

package/es/components/virtualList/index.js

@@ -0,0 +1,5 @@
+export * from './container';
+export * from './wrapper';
+export * from './rows';
+export * from './virtual';
+export * from './phantom';

package/es/components/virtualList/index.spec.d.ts

@@ -0,0 +1 @@
+export {};