@king-design/intact 3.1.1 → 3.1.2

package/es/components/switch/styles.js

@@ -3,6 +3,7 @@ import { css } from '@emotion/css';
 import { theme, setDefault } from '../../styles/theme';
 import { deepDefaults, sizes, palette } from '../../styles/utils';
 import '../../styles/global';
+import { cache } from '../utils';
 var defaults = {
   get transition() {
     return theme.transition.middle;
@@ -71,8 +72,9 @@ setDefault(function () {
   kswitch = deepDefaults(theme, {
     switch: defaults
   }).switch;
+  makeStyles == null ? void 0 : makeStyles.clearCache();
 });
-export function makeStyles(k) {
+export var makeStyles = cache(function makeStyles(k) {
   return /*#__PURE__*/css("display:inline-block;vertical-align:middle;background:", kswitch.bgColor, ";position:relative;cursor:pointer;user-select:none;overflow:hidden;box-sizing:content-box;transition:background ", kswitch.transition, ";input{opacity:0;position:absolute;}.", k, "-switch-bar,.", k, "-switch-off{box-sizing:border-box;}.", k, "-switch-bar{position:absolute;text-align:right;overflow:hidden;}.", k, "-switch-wrapper{display:inline-block;position:relative;z-index:1;border-radius:", kswitch.handleBorderRadius, ";}.", k, "-switch-bar,.", k, "-switch-wrapper{height:100%;background:", kswitch.bgColor, ";transition:all ", kswitch.transition, ";}&:hover{&,.", k, "-switch-bar,.", k, "-switch-wrapper{background:", kswitch.hoverBgColor, ";}}.", k, "-switch-handle{border-radius:", kswitch.handleBorderRadius, ";background:", kswitch.handleBgColor, ";height:100%;cursor:pointer;transition:left ", kswitch.transition, ";display:inline-block;img{height:100%;visibility:hidden;}}.", k, "-switch-on,.", k, "-switch-off{position:absolute;font-size:", kswitch.fontSize, ";color:", kswitch.color, ";text-align:center;}&.", k, "-dragging{.", k, "-switch-bar,.", k, "-switch-wrapper{background:", kswitch.checked.bgColor, ";transition:background ", kswitch.transition, ";}}&:focus{outline:none;}", _mapInstanceProperty(sizes).call(sizes, function (size) {
     var _kswitch$size = kswitch[size],
         width = _kswitch$size.width,
@@ -80,4 +82,4 @@ export function makeStyles(k) {
         padding = _kswitch$size.padding;
     return /*#__PURE__*/css("&.", k, "-", size, ",&.", k, "-", size, " .", k, "-switch-on,&.", k, "-", size, " .", k, "-switch-off{width:", width, ";height:", height, ";}&.", k, "-", size, "{border-radius:", height, ";.", k, "-switch-bar{width:", height, ";border-radius:", height, ";}.", k, "-switch-wrapper{padding:", padding, ";}.", k, "-switch-on,.", k, "-switch-off{line-height:", height, ";left:0;}.", k, "-switch-on{padding:0 ", height, " 0 calc(", height, " / 3);}.", k, "-switch-off{padding:0 calc(", height, " / 3) 0 ", height, ";}}");
   }), "&.", k, "-checked{.", k, "-switch-bar,.", k, "-switch-wrapper{background:", kswitch.checked.bgColor, ";}.", k, "-switch-bar{width:100%;}&:hover{.", k, "-switch-bar,.", k, "-switch-wrapper{background:", kswitch.checked.hoverBgColor, ";}}}&.", k, "-disabled{&,.", k, "-switch-handle{cursor:not-allowed;}&,.", k, "-switch-bar,.", k, "-switch-wrapper{background:", kswitch.disabledBgColor, ";}&.", k, "-checked{&,.", k, "-switch-bar,.", k, "-switch-wrapper{background:", kswitch.checked.disabledBgColor, ";}}}");
-}
+});

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

@@ -15,6 +15,7 @@ export interface TableColumnProps {
     cols?: number;
     rows?: number;
     prevVNode?: VNodeComponentClass<TableColumn> | null;
+    nextVNode?: VNodeComponentClass<TableColumn> | null;
 }
 export interface TableColumnEvents {
 }

package/es/components/table/column.js

@@ -23,7 +23,8 @@ var typeDefs = {
   // offset: null,
   cols: null,
   rows: null,
-  prevVNode: null
+  prevVNode: null,
+  nextVNode: null
 };
 export var TableColumn = /*#__PURE__*/function (_Component) {
   _inheritsLoose(TableColumn, _Component);

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

@@ -45,7 +45,8 @@ export default function ($props, $blocks, $__proto__) {
       confirm = _this$group.confirm,
       dropdownRef = _this$group.dropdownRef,
       localGroupValue = _this$group.localGroupValue,
-      isEmptyValue = _this$group.isEmptyValue;
+      isEmptyValue = _this$group.isEmptyValue,
+      checkAll = _this$group.checkAll;
   var k = this.config.k;
   return _$cc(TableContext.Consumer, {
     'children': function children(checkType) {
@@ -150,20 +151,25 @@ export default function ($props, $blocks, $__proto__) {
                               }) : _$ce(2, 'span', $value.label, 0)
                             });
                           }, $this), 4, _$cn(k + "-table-group-body")), multiple ? _$ce(2, 'div', [_$cc(Button, {
+                            'size': 'mini',
+                            'type': 'link',
+                            'ev-click': checkAll,
+                            'children': _$('全选')
+                          }), _$cc(Button, {
                             'size': 'small',
                             'disabled': isEmptyValue(localGroupValue.value),
                             'type': 'secondary',
                             'ev-click': function evClick() {
                               return reset(onChange);
                             },
-                            'children': '重置'
+                            'children': _$('重置')
                           }), _$cc(Button, {
                             'type': 'primary',
                             'size': 'small',
                             'ev-click': function evClick() {
                               return confirm(onChange);
                             },
-                            'children': '确定'
+                            'children': _$('确定')
                           })], 4, _$cn(k + "-table-group-footer")) : undefined]
                         })]
                       }, 'dropdown', dropdownRef) : undefined, sortable ? _$ce(2, 'div', [_$cc(Icon, {

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

@@ -366,7 +366,7 @@ describe('Table', function () {
     }, _callee6);
   })));
   it('group', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee7() {
-    var _mount7, instance, element, _instance$refs4, __test1, __test2, _element$querySelecto8, table1, table2, icon, dropdown, item, icon2, dropdown2, _dropdown2$querySelec, item1, item2, _dropdown2$querySelec2, reset, confirm, newDropdown;
+    var _mount7, instance, element, _instance$refs4, __test1, __test2, _element$querySelecto8, table1, table2, icon, dropdown, item, icon2, dropdown2, _dropdown2$querySelec, item1, item2, _dropdown2$querySelec2, checkAll, reset, confirm, newDropdown;
 
     return _regeneratorRuntime.wrap(function _callee7$(_context7) {
       while (1) {
@@ -420,7 +420,7 @@ describe('Table', function () {
               status: []
             }); // click confirm
 
-            _dropdown2$querySelec2 = dropdown2.querySelectorAll('.k-table-group-footer .k-btn'), reset = _dropdown2$querySelec2[0], confirm = _dropdown2$querySelec2[1];
+            _dropdown2$querySelec2 = dropdown2.querySelectorAll('.k-table-group-footer .k-btn'), checkAll = _dropdown2$querySelec2[0], reset = _dropdown2$querySelec2[1], confirm = _dropdown2$querySelec2[2];
             confirm.click();
             _context7.next = 35;
             return wait();
@@ -443,28 +443,35 @@ describe('Table', function () {
 
           case 44:
             expect(dropdown2.innerHTML).to.matchSnapshot();
-            confirm.click();
-            _context7.next = 48;
-            return wait();
-
-          case 48:
             expect(instance.get('multipleGroup')).to.eql({
               status: []
-            }); // update group
+            }); // click checkAll
+
+            dispatchEvent(icon2, 'click');
+            _context7.next = 49;
+            return wait();
+
+          case 49:
+            checkAll.click();
+            _context7.next = 52;
+            return wait();
+
+          case 52:
+            expect(dropdown2.querySelectorAll('.k-checkbox.k-checked')).to.length(2); // update group
 
             instance.set('statusGroup', [{
               label: 'label',
               value: 'value'
             }]);
             dispatchEvent(icon, 'click');
-            _context7.next = 53;
+            _context7.next = 57;
             return wait(500);
 
-          case 53:
+          case 57:
             newDropdown = getElement('.k-table-group-dropdown');
             expect(newDropdown.innerHTML).to.matchSnapshot();
 
-          case 55:
+          case 59:
           case "end":
             return _context7.stop();
         }

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

@@ -1,3 +1,9 @@
 import '../../styles/global';
-export declare function makeStyles(k: string): string;
-export declare function makeGroupMenuStyles(k: string): string;
+export declare const makeStyles: {
+    (k: string): string;
+    clearCache(): {};
+};
+export declare const makeGroupMenuStyles: {
+    (k: string): string;
+    clearCache(): {};
+};

package/es/components/table/styles.js

@@ -4,6 +4,7 @@ import { css } from '@emotion/css';
 import { theme, setDefault } from '../../styles/theme';
 import { deepDefaults, palette } from '../../styles/utils';
 import '../../styles/global';
+import { cache } from '../utils';
 var defaults = {
   get transition() {
     return theme.transition.large;
@@ -101,12 +102,14 @@ setDefault(function () {
   table = deepDefaults(theme, {
     table: defaults
   }).table;
+  makeStyles == null ? void 0 : makeStyles.clearCache();
+  makeGroupMenuStyles == null ? void 0 : makeGroupMenuStyles.clearCache();
 });
-export 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-spacing:0;table-layout:fixed;td,th{transition:all ", table.transition, ";}}thead{text-align:", table.thead.textAlign, ";font-size:", table.thead.fontSize, ";font-weight:", table.thead.fontWeight, ";position:sticky;top:0;z-index:2;tr{height:", table.thead.height, ";&:not(:last-of-type) th{border-bottom:", table.border, ";}}}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%);}&: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, "-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) {
+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-spacing:0;table-layout:fixed;}thead{text-align:", table.thead.textAlign, ";font-size:", table.thead.fontSize, ";font-weight:", table.thead.fontWeight, ";position:sticky;top:0;z-index:2;tr{height:", table.thead.height, ";&:not(:last-of-type) th{border-bottom:", table.border, ";}}}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%);}&: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, "-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%;}}");
-}
-export function makeGroupMenuStyles(k) {
+});
+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.vdt.js

@@ -70,7 +70,7 @@ export default function ($props, $blocks, $__proto__) {
       scrollPosition = _this$fixedColumns.scrollPosition,
       hasFixed = _this$fixedColumns.hasFixed,
       getHasFixedLeft = _this$fixedColumns.getHasFixedLeft,
-      getOffsetMap = _this$fixedColumns.getOffsetMap;
+      offsetMap = _this$fixedColumns.offsetMap;
   var scrollRef = this.scroll.scrollRef;
   var _this$stickyHeader = this.stickyHeader,
       stickHeader = _this$stickyHeader.stickHeader,
@@ -107,7 +107,6 @@ export default function ($props, $blocks, $__proto__) {
       getAllStatus = _this$checked.getAllStatus,
       onChangeChecked = _this$checked.onChangeChecked;
   var allCheckedStatus = getAllCheckedStatus();
-  var offsetMap = getOffsetMap();
   var thead = hideHeader ? null : _$cc(TableContext.Provider, {
     'value': checkType,
     'children': _$cc(GroupContext.Provider, {
@@ -126,7 +125,7 @@ export default function ($props, $blocks, $__proto__) {
             onStart: onStart
           },
           'children': _$cc(FixedColumnsContext.Provider, {
-            'value': offsetMap,
+            'value': offsetMap.value,
             'children': _$ce(2, 'thead', _$ma(columns, function ($value, $key) {
               return _$ce(2, 'tr', function () {
                 var ths = [$key === 0 && checkType !== 'none' ? _$cv('th', _extends({}, getClassAndStyleForFixed({
@@ -214,7 +213,7 @@ export default function ($props, $blocks, $__proto__) {
         'indent': indentSize,
         'onToggleSpreadRow': toggleSpreadRow,
         'onBeforeUnmount': _this.resetRowStatus.onRowBeforeUnmount,
-        'offsetMap': offsetMap,
+        'offsetMap': offsetMap.value,
         'animation': animation[1],
         'draggable': draggable,
         'draggingKey': draggingKey.value,

package/es/components/table/useColumns.js

@@ -41,6 +41,7 @@ export function useColumns() {
 
         ret = true;
         var clonedVNode = directClone(vNode);
+        if (currentVNode) currentVNode.props.nextVNode = clonedVNode;
 
         var props = _extends({}, clonedVNode.props, {
           cols: 0,

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

@@ -1,4 +1,4 @@
-import { VNodeComponentClass, Props, RefObject, Key } from 'intact';
+import { VNodeComponentClass, Props, Key } from 'intact';
 import { TableColumn, TableColumnProps } from './column';
 import type { TableProps, TableRowKey } from './table';
 import { State } from '../../hooks/useState';
@@ -7,14 +7,14 @@ declare type ScrollPosition = 'left' | 'middle' | 'right';
 export declare const context: {
     Provider: import("intact").ComponentConstructor<import("intact").Component<import("../context").ProviderProps<any>, {}, {}, {}>>;
     Consumer: import("intact").ComponentConstructor<import("intact").Component<import("../context").ConsumerProps<any>, {}, {}, {}>>;
-    useContext: () => RefObject<any>;
+    useContext: () => import("intact").RefObject<any>;
 };
 export declare function useFixedColumns(getColumns: () => VNodeComponentClass<TableColumn>[][], { scrollRef, callbacks }: ReturnType<typeof useScroll>, widthMap: State<Record<TableRowKey, number>>): {
     scrollPosition: State<ScrollPosition | null>;
     setScrollPosition: (scrollLeft: number) => void;
     hasFixed: State<boolean>;
+    offsetMap: State<Record<Key, number>>;
     getHasFixedLeft: () => boolean;
-    getOffsetMap: () => Record<Key, number>;
 };
 export declare function getClassAndStyleForFixed({ className, fixed, align }: Props<TableColumnProps>, offset: number, k: string, checkType?: TableProps['checkType']): {
     className: string;

package/es/components/table/useFixedColumns.js

@@ -1,10 +1,10 @@
-import { useInstance, onMounted, onUnmounted } from 'intact';
+import { useInstance, findDomFromVNode, nextTick } from 'intact';
 import { useState } from '../../hooks/useState';
 import { cx } from '@emotion/css';
-import { isNullOrUndefined, isString, error } from 'intact-shared';
-import { throttle } from '../utils';
 import { watchState } from '../../hooks/useState';
 import { createContext } from '../context';
+import { useResizeObserver } from '../../hooks/useResizeObserver';
+import { isEqualObject } from '../utils';
 export var context = createContext();
 export function useFixedColumns(getColumns, _ref, widthMap) {
   var scrollRef = _ref.scrollRef,
@@ -12,38 +12,32 @@ export function useFixedColumns(getColumns, _ref, widthMap) {
   var instance = useInstance();
   var scrollPosition = useState(null);
   var hasFixed = useState(false);
+  var offsetMap = useState({}, isEqualObject);
   var hasFixedLeft = false;
   var hasFixedRight = false;
-  var offsetMap = {};
   callbacks.push(setScrollPosition);
-  instance.on('$receive:children', handleFixedColumns);
+  instance.watch('children', handleFixedColumnsAndUpdate, {
+    presented: true
+  });
   watchState(widthMap, function () {
-    handleFixedColumns();
-    updateScrollPositionOnResize();
+    return nextTick(handleFixedColumnsAndUpdate);
   });
-  var throttleUpdate = throttle(function () {
-    if (instance.$unmounted) return;
-    updateScrollPositionOnResize();
-  }, 100);
-  onMounted(function () {
+  useResizeObserver(scrollRef, handleFixedColumnsAndUpdate, true);
+
+  function handleFixedColumnsAndUpdate() {
+    handleFixedColumns();
     updateScrollPositionOnResize();
-    window.addEventListener('resize', throttleUpdate);
-  });
-  onUnmounted(function () {
-    window.removeEventListener('resize', throttleUpdate);
-  });
+  }
 
   function handleFixedColumns() {
     var columns = getColumns();
+    var _offsetMap = {};
     hasFixedLeft = false;
     hasFixedRight = false;
-    offsetMap = {};
     columns.forEach(function (columns, row) {
-      var offset = 0;
       columns.forEach(function (vNode, col) {
         var props = vNode.props;
         var key = props.key;
-        offsetMap[key] = 0;
         var fixed = props.fixed;
 
         if (fixed === 'left') {
@@ -54,41 +48,34 @@ export function useFixedColumns(getColumns, _ref, widthMap) {
             var _props = prevVNode.props;
 
             if (_props.fixed === 'left') {
-              if (process.env.NODE_ENV !== 'production') {
-                validateWidth(_props);
-              }
-
-              value += widthMap.value[_props.key] || parseInt(_props.width, 10) || 0;
+              value += getWidth(prevVNode);
             }
 
             prevVNode = _props.prevVNode;
           }
 
-          offsetMap[key] = value;
+          _offsetMap[key] = value;
           hasFixedLeft = true;
         } else if (fixed === 'right') {
           var _value = 0;
-          var lastVNode = columns[columns.length - 1];
+          var nextVNode = props.nextVNode;
 
-          while (vNode !== lastVNode) {
-            var _props2 = lastVNode.props;
+          while (nextVNode) {
+            var _props2 = nextVNode.props;
 
             if (_props2.fixed === 'right') {
-              if (process.env.NODE_ENV !== 'production') {
-                validateWidth(_props2);
-              }
-
-              _value += widthMap.value[_props2.key] || parseInt(_props2.width, 10) || 0;
+              _value += getWidth(nextVNode);
             }
 
-            lastVNode = _props2.prevVNode;
+            nextVNode = _props2.nextVNode;
           }
 
-          offsetMap[key] = _value;
+          _offsetMap[key] = _value;
           hasFixedRight = true;
         }
       });
     });
+    offsetMap.set(_offsetMap);
     hasFixed.set(hasFixedLeft || hasFixedRight);
   }
 
@@ -113,11 +100,9 @@ export function useFixedColumns(getColumns, _ref, widthMap) {
     scrollPosition: scrollPosition,
     setScrollPosition: setScrollPosition,
     hasFixed: hasFixed,
+    offsetMap: offsetMap,
     getHasFixedLeft: function getHasFixedLeft() {
       return hasFixedLeft;
-    },
-    getOffsetMap: function getOffsetMap() {
-      return offsetMap;
     }
   };
 }
@@ -134,11 +119,7 @@ export function getClassAndStyleForFixed(_ref2, offset, k, checkType) {
   };
 }
 
-function validateWidth(_ref4) {
-  var width = _ref4.width,
-      key = _ref4.key;
-
-  if (isNullOrUndefined(width) || isString(width) && !/\d+(px)?/.test(width)) {
-    error("The width must be specified with 'px' when the column has fixed. <TableColumn key=\"" + key + "\" />");
-  }
+function getWidth(vNode) {
+  var dom = findDomFromVNode(vNode, true);
+  return dom.offsetWidth;
 }

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

@@ -20,5 +20,6 @@ export declare function useGroup(): {
     dropdownRef: import("intact").RefObject<Dropdown>;
     localGroupValue: import("../../hooks/useState").State<any>;
     isEmptyValue: (groupValue: any) => boolean | undefined;
+    checkAll: () => void;
 };
 export {};

package/es/components/table/useGroup.js

@@ -1,4 +1,5 @@
 import _includesInstanceProperty from "@babel/runtime-corejs3/core-js/instance/includes";
+import _mapInstanceProperty from "@babel/runtime-corejs3/core-js/instance/map";
 import _trimInstanceProperty from "@babel/runtime-corejs3/core-js/instance/trim";
 import _filterInstanceProperty from "@babel/runtime-corejs3/core-js/instance/filter";
 import { useInstance, createRef } from 'intact';
@@ -62,6 +63,14 @@ export function useGroup() {
     confirm(onChange);
   }
 
+  function checkAll() {
+    var _filteredGroup$value;
+
+    localGroupValue.set((_filteredGroup$value = filteredGroup.value) == null ? void 0 : _mapInstanceProperty(_filteredGroup$value).call(_filteredGroup$value, function (item) {
+      return item.value;
+    }));
+  }
+
   function isEmptyValue(groupValue) {
     var _instance$get4 = instance.get(),
         multiple = _instance$get4.multiple;
@@ -98,6 +107,7 @@ export function useGroup() {
     confirm: confirm,
     dropdownRef: dropdownRef,
     localGroupValue: localGroupValue,
-    isEmptyValue: isEmptyValue
+    isEmptyValue: isEmptyValue,
+    checkAll: checkAll
   };
 }

package/es/components/table/useResizable.js

@@ -9,15 +9,17 @@ export function useResizable(scrollRef, tableRef, tableWidth, widthMap, storeWid
   var x;
   var prevVNode;
   var prevTh;
+  var prevMinWidth;
   var currentVNode;
   var currentTh;
-  var minWidth;
+  var currentMinWidth;
+  var nextVNode;
 
   function onStart(e) {
     containerWidth = scrollRef.value.clientWidth;
     x = e.clientX; // find the previous column but exclude the hidden columns, #467
 
-    prevVNode = currentVNode = e._vNode;
+    prevVNode = nextVNode = currentVNode = e._vNode;
     prevTh;
 
     do {
@@ -26,7 +28,20 @@ export function useResizable(scrollRef, tableRef, tableWidth, widthMap, storeWid
     } while (window.getComputedStyle(prevTh).display === 'none');
 
     currentTh = findDomFromVNode(currentVNode, true);
-    minWidth = prevVNode.props.minWidth || instance.get('minColWidth');
+    prevMinWidth = prevVNode.props.minWidth || instance.get('minColWidth');
+    currentMinWidth = currentVNode.props.minWidth || instance.get('minColWidth');
+
+    while (nextVNode = (_nextVNode = nextVNode) == null ? void 0 : _nextVNode.props.nextVNode) {
+      var _nextVNode;
+
+      var th = findDomFromVNode(nextVNode, true);
+
+      if (window.getComputedStyle(th).display === 'none') {
+        continue;
+      }
+
+      break;
+    }
   }
 
   function onMove(e) {
@@ -35,14 +50,35 @@ export function useResizable(scrollRef, tableRef, tableWidth, widthMap, storeWid
     var delX = e.clientX - x;
     if (delX === 0) return;
     var newPrevWidth = prevTh.offsetWidth + delX;
-    if (newPrevWidth < minWidth && delX < 0) return;
     var newCurrentWidth = currentTh.offsetWidth - delX;
     var newTableWidth = tableRef.value.offsetWidth + delX;
+    var isCurrentFixedRight = currentVNode.props.fixed === 'right'; // const isPrevFixedRight = prevVNode.props!.fixed === 'right';
+
+    if ((newPrevWidth < prevMinWidth || isCurrentFixedRight) && delX < 0) {
+      // if (nextVNode) return;
+      // the last column, we should expand its width
+      if (newPrevWidth < prevMinWidth) {
+        newPrevWidth -= delX;
+        newTableWidth -= delX;
+      }
+    }
+
     var currentKey = currentVNode.props.key;
     var prevKey = prevVNode.props.key;
-    x = e.clientX;
     var map = (_map = {}, _map[prevKey] = newPrevWidth, _map);
 
+    if (!nextVNode || isCurrentFixedRight) {
+      newTableWidth -= delX;
+
+      if (newCurrentWidth < currentMinWidth && delX > 0) {
+        newCurrentWidth = currentMinWidth;
+      }
+
+      map[currentKey] = newCurrentWidth;
+    }
+
+    x = e.clientX;
+
     if (containerWidth > newTableWidth) {
       map[currentKey] = newCurrentWidth;
     } else {

package/es/components/table/useWidth.js

@@ -1,3 +1,4 @@
+import _extends from "@babel/runtime-corejs3/helpers/extends";
 import _mapInstanceProperty from "@babel/runtime-corejs3/core-js/instance/map";
 import _JSON$stringify from "@babel/runtime-corejs3/core-js/json/stringify";
 import { useInstance, onMounted, createRef } from 'intact';
@@ -100,6 +101,8 @@ export function useWidth(scrollRef, getColumns) {
     });
 
     if (shouldUpdate) {
+      // let useFixedColumns to update scroll position
+      widthMap.set(_extends({}, widthMap.value));
       instance.forceUpdate(function () {
         // check again because it may affect other columns
         if (!isStop) {

package/es/components/tabs/styles.d.ts

@@ -1,2 +1,5 @@
 import '../../styles/global';
-export declare function makeStyles(k: string): string;
+export declare const makeStyles: {
+    (k: string): string;
+    clearCache(): {};
+};

package/es/components/tabs/styles.js

@@ -3,6 +3,7 @@ import { css } from '@emotion/css';
 import { theme, setDefault } from '../../styles/theme';
 import { deepDefaults, sizes } from '../../styles/utils';
 import '../../styles/global';
+import { cache } from '../utils';
 var closeFontSizeMap = {
   large: '24px',
   default: '20px',
@@ -107,10 +108,11 @@ setDefault(function () {
   tabs = deepDefaults(theme, {
     tabs: defaults
   }).tabs;
+  makeStyles == null ? void 0 : makeStyles.clearCache();
 });
-export function makeStyles(k) {
+export var makeStyles = cache(function makeStyles(k) {
   return /*#__PURE__*/css(makeCommonStyles(k), ";", makeScrollStyles(k), ";&.", k, "-type-default{", makeDefaultStyles(k), ";}&.", k, "-type-card{", makeCardStyles(k), ";}&.", k, "-type-flat-card{", makeFlatCardStyles(k), ";}");
-}
+});
 
 function makeCommonStyles(k) {
   var active = tabs.active;

package/es/components/tag/styles.d.ts

@@ -65,5 +65,11 @@ declare const defaults: {
 };
 declare let tag: typeof defaults;
 export { tag };
-export declare function makeStyles(k: string): string;
-export declare function makeTagsStyles(k: string): string;
+export declare const makeStyles: {
+    (k: string): string;
+    clearCache(): {};
+};
+export declare const makeTagsStyles: {
+    (k: string): string;
+    clearCache(): {};
+};

package/es/components/tag/styles.js

@@ -3,6 +3,7 @@ import { css } from '@emotion/css';
 import { deepDefaults, sizes, palette } from '../../styles/utils';
 import { theme, setDefault } from '../../styles/theme';
 import '../../styles/global';
+import { cache } from '../utils';
 var types = ['primary', 'warning', 'danger', 'success', 'disabled'];
 var defaults = deepDefaults({
   get border() {
@@ -112,9 +113,11 @@ setDefault(function () {
   tag = deepDefaults(theme, {
     tag: defaults
   }).tag;
+  makeStyles == null ? void 0 : makeStyles.clearCache();
+  makeTagsStyles == null ? void 0 : makeTagsStyles.clearCache();
 });
 export { tag };
-export function makeStyles(k) {
+export var makeStyles = cache(function makeStyles(k) {
   return /*#__PURE__*/css("display:inline-flex;align-items:center;padding:", tag.padding, ";border:", tag.border, ";border-radius:", tag.borderRadius, ";font-size:", tag.fontSize, ";height:", tag.height, ";.", k, "-tag-close{font-size:", tag.close.fontSize, ";margin-left:", tag.close.gap, ";width:", tag.close.width, ";}&.", k, "-none{border:none;background:", tag.none.bgColor, ";}", _mapInstanceProperty(types).call(types, function (t) {
     var styles = tag[t];
     return /*#__PURE__*/css("&.", k, "-", t, "{color:", styles.color, ";border-color:", styles.color, ";background:", styles.bgColor, ";}");
@@ -123,7 +126,7 @@ export function makeStyles(k) {
     var styles = tag[s];
     return /*#__PURE__*/css("&.", k, "-", s, "{padding:", styles.padding, ";height:", styles.height, ";font-size:", styles.fontSize, ";.", k, "-tag-close{font-size:", styles.close.fontSize, ";margin-left:", styles.close.gap, ";}}");
   }), "&.", k, "-dashed{border-style:dashed;}&.", k, "-dragging{opacity:0;}");
-}
-export function makeTagsStyles(k) {
+});
+export var makeTagsStyles = cache(function makeTagsStyles(k) {
   return /*#__PURE__*/css("display:flex;flex-wrap:wrap;gap:", defaults.tags.gap, ";position:relative;overflow:hidden;&.", k, "-nowrap{flex-wrap:nowrap;.", k, "-tag{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex-shrink:0;}}.", k, "-tags-more{cursor:default;font-family:monospace;}.", k, "-tag.", k, "-draggable{cursor:move;}");
-}
+});

package/es/components/timeline/styles.d.ts

@@ -2,6 +2,12 @@ import '../../styles/global';
 declare type ValueOf<T extends readonly any[]> = T[number];
 export declare type Types = ValueOf<typeof types>;
 export declare const types: readonly ["primary", "warning", "danger", "success"];
-export declare function makeStyles(k: string): string;
-export declare function makeItemStyles(k: string): string;
+export declare const makeStyles: {
+    (k: string): string;
+    clearCache(): {};
+};
+export declare const makeItemStyles: {
+    (k: string): string;
+    clearCache(): {};
+};
 export {};