@king-design/react 3.1.4-beta.2 → 3.1.4

package/components/table/useDraggable.js

@@ -7,7 +7,6 @@ export function useDraggable(data) {
   var originIndex;
   var originData;
   var draggingIndex;
-
   function onRowDragStart(e, tableRow) {
     draggingIndex = originIndex = tableRow.get('index');
     var key = tableRow.get('key');
@@ -18,22 +17,20 @@ export function useDraggable(data) {
       from: draggingIndex
     });
   }
-
   function onRowDragOver(e, tableRow) {
     e.preventDefault();
     e.stopPropagation();
     if (draggingKey.value === null) return;
     var newIndex = tableRow.get('index');
-    if (newIndex === draggingIndex) return; // swap data
-
+    if (newIndex === draggingIndex) return;
+    // swap data
     var newData = swap(data.value, draggingIndex, newIndex);
     draggingIndex = newIndex;
     data.set(newData);
   }
-
   function onRowDragEnd(e, tableRow) {
-    e.preventDefault(); // revert to origin data, then set to new data to trigger animation
-
+    e.preventDefault();
+    // revert to origin data, then set to new data to trigger animation
     var newData = data.value;
     data.set(originData);
     nextTick(function () {
@@ -46,7 +43,6 @@ export function useDraggable(data) {
       });
     });
   }
-
   return {
     onRowDragStart: onRowDragStart,
     onRowDragOver: onRowDragOver,

package/components/table/useExpandable.js

@@ -3,17 +3,14 @@ import { inArray } from './useChecked';
 import { toggleArray } from '../utils';
 export function useExpandable() {
   var instance = useInstance();
-
   function isExpanded(key) {
     return inArray(instance.get('expandedKeys'), key);
   }
-
   instance.on('clickRow', function (data, index, key) {
     if (instance.get('rowExpandable')) {
       var _instance$get = instance.get(),
-          expandedKeys = _instance$get.expandedKeys,
-          $blocks = _instance$get.$blocks;
-
+        expandedKeys = _instance$get.expandedKeys,
+        $blocks = _instance$get.$blocks;
       if (!$blocks || !$blocks.expand) return;
       instance.set('expandedKeys', toggleArray(expandedKeys, key));
     }

package/components/table/useFixedColumns.d.ts

@@ -3,7 +3,7 @@ import { TableColumn, TableColumnProps } from './column';
 import type { TableProps, TableRowKey } from './table';
 import { State } from '../../hooks/useState';
 import type { useScroll } from './useScroll';
-declare type ScrollPosition = 'left' | 'middle' | 'right';
+type ScrollPosition = 'left' | 'middle' | 'right';
 export declare const context: {
     Provider: import('intact-react').ComponentConstructor<import('intact-react').Component<import("../context").ProviderProps<any>, {}, {}, {}>>;
     Consumer: import('intact-react').ComponentConstructor<import('intact-react').Component<import("../context").ConsumerProps<any>, {}, {}, {}>>;

package/components/table/useFixedColumns.js

@@ -8,7 +8,7 @@ import { isEqualObject } from '../utils';
 export var context = createContext();
 export function useFixedColumns(getColumns, _ref, widthMap) {
   var scrollRef = _ref.scrollRef,
-      callbacks = _ref.callbacks;
+    callbacks = _ref.callbacks;
   var instance = useInstance();
   var scrollPosition = useState(null);
   var hasFixed = useState(false);
@@ -23,12 +23,10 @@ export function useFixedColumns(getColumns, _ref, widthMap) {
     return nextTick(handleFixedColumnsAndUpdate);
   });
   useResizeObserver(scrollRef, handleFixedColumnsAndUpdate, true);
-
   function handleFixedColumnsAndUpdate() {
     handleFixedColumns();
     updateScrollPositionOnResize();
   }
-
   function handleFixedColumns() {
     var columns = getColumns();
     var _offsetMap = {};
@@ -39,37 +37,28 @@ export function useFixedColumns(getColumns, _ref, widthMap) {
         var props = vNode.props;
         var key = props.key;
         var fixed = props.fixed;
-
         if (fixed === 'left') {
           var value = 0;
           var prevVNode = props.prevVNode;
-
           while (prevVNode) {
             var _props = prevVNode.props;
-
             if (_props.fixed === 'left') {
               value += getWidth(prevVNode);
             }
-
             prevVNode = _props.prevVNode;
           }
-
           _offsetMap[key] = value;
           hasFixedLeft = true;
         } else if (fixed === 'right') {
           var _value = 0;
           var nextVNode = props.nextVNode;
-
           while (nextVNode) {
             var _props2 = nextVNode.props;
-
             if (_props2.fixed === 'right') {
               _value += getWidth(nextVNode);
             }
-
             nextVNode = _props2.nextVNode;
           }
-
           _offsetMap[key] = _value;
           hasFixedRight = true;
         }
@@ -78,24 +67,20 @@ export function useFixedColumns(getColumns, _ref, widthMap) {
     offsetMap.set(_offsetMap);
     hasFixed.set(hasFixedLeft || hasFixedRight);
   }
-
   function setScrollPosition(scrollLeft) {
     if (!hasFixed.value) return;
     var scrollDom = scrollRef.value;
     var maxScroll = scrollDom.scrollWidth - scrollDom.offsetWidth;
     scrollPosition.set(scrollLeft === 0 ? 'left' : scrollLeft >= maxScroll ? 'right' : 'middle');
   }
-
   function updateScrollPositionOnResize() {
     var scrollDom = scrollRef.value;
-
     if (!hasFixed.value || scrollDom.scrollWidth - scrollDom.offsetWidth <= 0) {
       scrollPosition.set(null);
     } else {
       setScrollPosition(scrollRef.value.scrollLeft);
     }
   }
-
   return {
     scrollPosition: scrollPosition,
     setScrollPosition: setScrollPosition,
@@ -108,17 +93,15 @@ export function useFixedColumns(getColumns, _ref, widthMap) {
 }
 export function getClassAndStyleForFixed(_ref2, offset, k, checkType) {
   var _cx, _ref3;
-
   var className = _ref2.className,
-      fixed = _ref2.fixed,
-      align = _ref2.align;
+    fixed = _ref2.fixed,
+    align = _ref2.align;
   var extraOffset = checkType && checkType !== 'none' && fixed === 'left' ? 40 : 0;
   return {
     className: cx((_cx = {}, _cx[className] = !!className, _cx[k + "-fixed-" + fixed] = !!fixed, _cx[k + "-align-" + align] = !!align, _cx)),
     style: fixed ? (_ref3 = {}, _ref3[fixed] = offset + extraOffset + "px", _ref3) : null
   };
 }
-
 function getWidth(vNode) {
   var dom = findDomFromVNode(vNode, true);
   return dom.offsetWidth;

package/components/table/useGroup.d.ts

@@ -1,6 +1,6 @@
 import type { TableColumnGroupItem } from './column';
 import type { Dropdown } from '../dropdown';
-declare type ContextValue = {
+type ContextValue = {
     groupValue: any;
     onChange: (key: string, groupValue: any) => void;
 };

package/components/table/useGroup.js

@@ -17,17 +17,14 @@ export function useGroup() {
   instance.on('$receive:group', function (group) {
     return filteredGroup.set(group);
   });
-
   function onShow(groupValue) {
     keywords.set('');
     localGroupValue.set(groupValue);
   }
-
   function onSelect(value, onChange) {
     var _instance$get = instance.get(),
-        multiple = _instance$get.multiple,
-        key = _instance$get.key;
-
+      multiple = _instance$get.multiple,
+      key = _instance$get.key;
     if (multiple) {
       // should click confirm button when it is multiple selection
       localGroupValue.set(toggleArray(localGroupValue.value, value));
@@ -36,63 +33,48 @@ export function useGroup() {
       onChange(key, value);
     }
   }
-
   function isChecked(value) {
     var _instance$get2 = instance.get(),
-        multiple = _instance$get2.multiple;
-
+      multiple = _instance$get2.multiple;
     var groupValue = localGroupValue.value;
-
     if (multiple) {
       return groupValue && _includesInstanceProperty(groupValue).call(groupValue, value);
     }
-
     return groupValue === value;
   }
-
   function confirm(onChange) {
     var _instance$get3 = instance.get(),
-        key = _instance$get3.key;
-
+      key = _instance$get3.key;
     onChange(key, localGroupValue.value);
     dropdownRef.value.hide(true);
   }
-
   function reset(onChange) {
     localGroupValue.set([]);
     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;
-
+      multiple = _instance$get4.multiple;
     return !groupValue || multiple && (!isArray(groupValue) || groupValue.every(function (value) {
       return !value;
     }));
   }
-
   watchState(keywords, function (v) {
     var _instance$get5 = instance.get(),
-        _instance$get5$group = _instance$get5.group,
-        group = _instance$get5$group === void 0 ? [] : _instance$get5$group;
-
+      _instance$get5$group = _instance$get5.group,
+      group = _instance$get5$group === void 0 ? [] : _instance$get5$group;
     v = _trimInstanceProperty(v).call(v);
-
     if (!v) {
       filteredGroup.set(group);
     } else {
       filteredGroup.set(_filterInstanceProperty(group).call(group, function (item) {
         var _context, _context2;
-
         return _includesInstanceProperty(_context = String(item.label)).call(_context, v) || _includesInstanceProperty(_context2 = String(item.value)).call(_context2, v);
       }));
     }

package/components/table/useMerge.d.ts

@@ -1,16 +1,16 @@
 import { Props } from 'intact-react';
 import type { TableColumnProps } from './column';
 import { State } from '../../hooks/useState';
-export declare type TableMerge<T = any, CheckType = 'checkbox'> = (row: T, column: CheckType extends 'none' ? Props<TableColumnProps> : Props<TableColumnProps> | null, rowIndex: number, columnIndex: number) => TableMergeConfig | undefined;
-export declare type TableMergeConfig = {
+export type TableMerge<T = any, CheckType = 'checkbox'> = (row: T, column: CheckType extends 'none' ? Props<TableColumnProps> : Props<TableColumnProps> | null, rowIndex: number, columnIndex: number) => TableMergeConfig | undefined;
+export type TableMergeConfig = {
     colspan?: number;
     rowspan?: number;
 };
-export declare type TableGridItem = {
+export type TableGridItem = {
     render: boolean;
     spans: TableMergeConfig | undefined;
 };
-export declare type TableGrid = TableGridItem[][];
+export type TableGrid = TableGridItem[][];
 export declare function useMerge(getCols: () => Props<TableColumnProps>[], data: State<unknown[] | undefined>): {
     getGrid: () => TableGrid;
 };

package/components/table/useMerge.js

@@ -3,36 +3,29 @@ import { watchState } from '../../hooks/useState';
 export function useMerge(getCols, data) {
   var instance = useInstance();
   var grid = [];
-
   function handleSpans() {
     grid = [];
-
     var _instance$get = instance.get(),
-        merge = _instance$get.merge,
-        checkType = _instance$get.checkType;
-
+      merge = _instance$get.merge,
+      checkType = _instance$get.checkType;
     if (!data.value || !data.value.length || !merge) return;
     var cols = getCols();
     data.value.forEach(function (data, rowIndex) {
       var currentRow = [];
       grid.push(currentRow);
       var columnIndexOffset = 0;
-
       if (checkType !== 'none') {
         handleGridItem(currentRow, merge, data, null, rowIndex, 0);
         columnIndexOffset = 1;
       }
-
       cols.forEach(function (props, columnIndex) {
         handleGridItem(currentRow, merge, data, props, rowIndex, columnIndex + columnIndexOffset);
       });
     });
   }
-
   function handleGridItem(currentRow, merge, data, column, rowIndex, columnIndex) {
     var prevCell = currentRow[columnIndex - 1];
     var tmp;
-
     if (prevCell && (tmp = prevCell.spans) && tmp.colspan > 1) {
       currentRow.push({
         render: false,
@@ -43,11 +36,9 @@ export function useMerge(getCols, data) {
       });
       return;
     }
-
     if (rowIndex > 0) {
       var prevRow = grid[rowIndex - 1];
       var aboveCell = prevRow[columnIndex];
-
       if (aboveCell && (tmp = aboveCell.spans) && tmp.rowspan > 1) {
         currentRow.push({
           render: false,
@@ -59,17 +50,14 @@ export function useMerge(getCols, data) {
         return;
       }
     }
-
     currentRow.push({
       render: true,
       spans: merge(data, column, rowIndex, columnIndex)
     });
   }
-
   function getGrid() {
     return grid;
   }
-
   instance.on('$receive:children', handleSpans);
   watchState(data, handleSpans);
   return {

package/components/table/usePagination.js

@@ -12,65 +12,51 @@ export function usePagination() {
   var value = useState(defaultPagination.value);
   var limit = useState(defaultPagination.limit);
   var paginationRef = createRef(); // for unit test
-
   useReceive(['data', 'pagination'], function () {
     handleData();
   });
-
   function handleData() {
     var _instance$get = instance.get(),
-        _data = _instance$get.data,
-        pagination = _instance$get.pagination;
-
+      _data = _instance$get.data,
+      pagination = _instance$get.pagination;
     if (!_data) {
       data.set(undefined);
       return;
     }
-
     if (!pagination) {
       data.set(_data);
       return;
     }
-
     if (isObject(pagination)) {
       if (pagination.value) {
         value.set(pagination.value);
       }
-
       if (pagination.limit) {
         limit.set(pagination.limit);
       }
     }
-
     updateDataByPage();
   }
-
   function updateDataByPage() {
     var _instance$get2 = instance.get(),
-        _data = _instance$get2.data;
-
+      _data = _instance$get2.data;
     var index = (value.value - 1) * limit.value;
     data.set(_sliceInstanceProperty(_data).call(_data, index, index + limit.value));
   }
-
   function onChange(data) {
     var _instance$get3 = instance.get(),
-        pagination = _instance$get3.pagination;
-
+      pagination = _instance$get3.pagination;
     value.set(data.value);
     limit.set(data.limit);
     updateDataByPage();
-
     if (isObject(pagination)) {
       instance.set('pagination', _extends({}, pagination, {
         value: value.value,
         limit: limit.value
       }));
     }
-
     instance.trigger('page', data);
   }
-
   return {
     data: data,
     value: value,

package/components/table/useResetRowStatus.js

@@ -6,15 +6,13 @@ export function useResetRowStatus(getAllKeys) {
   var instance = useInstance();
   var allUnmountedRows = [];
   var willUnmounted = false;
-
   function onRowBeforeUnmount(key) {
-    if (willUnmounted || instance.get('keepStatus')) return; // maybe the row is only removed by shrinking, i.e. tree table
-
+    if (willUnmounted || instance.get('keepStatus')) return;
+    // maybe the row is only removed by shrinking, i.e. tree table
     var allKeys = getAllKeys();
     if (_includesInstanceProperty(allKeys).call(allKeys, key)) return;
     allUnmountedRows.push(key);
   }
-
   function reset() {
     if (allUnmountedRows.length) {
       omit('checkedKeys', allUnmountedRows);
@@ -24,7 +22,6 @@ export function useResetRowStatus(getAllKeys) {
       allUnmountedRows = [];
     }
   }
-
   function omit(type, keys) {
     var originKeys = instance.get(type);
     if (!originKeys) return;
@@ -34,7 +31,6 @@ export function useResetRowStatus(getAllKeys) {
     });
     instance.set(type, originKeys);
   }
-
   onBeforeUnmount(function () {
     return willUnmounted = true;
   });

package/components/table/useResizable.js

@@ -14,46 +14,37 @@ export function useResizable(scrollRef, tableRef, tableWidth, widthMap, storeWid
   var currentTh;
   var currentMinWidth;
   var nextVNode;
-
   function onStart(e) {
     containerWidth = scrollRef.value.clientWidth;
-    x = e.clientX; // find the previous column but exclude the hidden columns, #467
-
+    x = e.clientX;
+    // find the previous column but exclude the hidden columns, #467
     prevVNode = nextVNode = currentVNode = e._vNode;
     prevTh;
-
     do {
       prevVNode = prevVNode.props.prevVNode;
       prevTh = findDomFromVNode(prevVNode, true);
     } while (window.getComputedStyle(prevTh).display === 'none');
-
     currentTh = findDomFromVNode(currentVNode, true);
     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) {
     var _map;
-
     var delX = e.clientX - x;
     if (delX === 0) return;
     var newPrevWidth = prevTh.offsetWidth + delX;
     var newCurrentWidth = currentTh.offsetWidth - delX;
     var newTableWidth = tableRef.value.offsetWidth + delX;
-    var isCurrentFixedRight = currentVNode.props.fixed === 'right'; // const isPrevFixedRight = prevVNode.props!.fixed === 'right';
-
+    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
@@ -62,32 +53,24 @@ export function useResizable(scrollRef, tableRef, tableWidth, widthMap, storeWid
         newTableWidth -= delX;
       }
     }
-
     var currentKey = currentVNode.props.key;
     var prevKey = prevVNode.props.key;
     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 {
       tableWidth.set(newTableWidth);
     }
-
     widthMap.set(_extends({}, widthMap.value, map));
   }
-
   return useDraggable({
     onStart: onStart,
     onMove: onMove,

package/components/table/useScroll.d.ts

@@ -1,5 +1,5 @@
 import { RefObject } from 'intact-react';
-export declare type ScrollCallback = (scrollLeft: number) => void;
+export type ScrollCallback = (scrollLeft: number) => void;
 export declare function useScroll(): {
     callbacks: ScrollCallback[];
     scrollRef: RefObject<HTMLElement>;

package/components/table/useScroll.js

@@ -3,10 +3,8 @@ export function useScroll() {
   var callbacks = [];
   var scrollRef = createRef();
   var scrollLeft = 0;
-
   function onScroll() {
     var newScrollLeft = scrollRef.value.scrollLeft;
-
     if (scrollLeft !== newScrollLeft) {
       scrollLeft = newScrollLeft;
       callbacks.forEach(function (fn) {
@@ -14,7 +12,6 @@ export function useScroll() {
       });
     }
   }
-
   onMounted(function () {
     scrollRef.value.addEventListener('scroll', onScroll, {
       passive: true

package/components/table/useSelected.js

@@ -3,16 +3,13 @@ import { inArray } from './useChecked';
 import { toggleArray } from '../utils';
 export function useSelected() {
   var instance = useInstance();
-
   function isSelected(key) {
     return inArray(instance.get('selectedKeys'), key);
   }
-
   instance.on('clickRow', function (data, index, key) {
     var _instance$get = instance.get(),
-        rowSelectable = _instance$get.rowSelectable,
-        selectedKeys = _instance$get.selectedKeys;
-
+      rowSelectable = _instance$get.rowSelectable,
+      selectedKeys = _instance$get.selectedKeys;
     if (rowSelectable === 'multiple') {
       instance.set('selectedKeys', toggleArray(selectedKeys, key));
     } else if (rowSelectable) {

package/components/table/useSortable.js

@@ -3,20 +3,16 @@ import { useInstance } from 'intact-react';
 import { createContext } from '../context';
 export var context = createContext();
 export function useSortable() {
-  var instance = useInstance(); // if the same column has been clicked three times consecutively,
+  var instance = useInstance();
+  // if the same column has been clicked three times consecutively,
   // then let the third click to reset the sort
-
   var count = 0;
-
   function onChange(key, event) {
     // ignore when click group dropdown menu
     if (event._ignoreSortable) return;
-
     var sort = _extends({}, instance.get('sort'));
-
     if (sort.key === key) {
       count++;
-
       if (count === 3) {
         sort = {};
       } else {
@@ -27,10 +23,8 @@ export function useSortable() {
       sort.key = key;
       if (!sort.type) sort.type = 'desc';
     }
-
     instance.set('sort', sort);
   }
-
   return {
     onChange: onChange
   };

package/components/table/useStickyHeader.js

@@ -6,20 +6,16 @@ export function useStickyHeader(callbacks) {
   var elementRef = createRef();
   var headRef = createRef();
   var stickHeader = useState(null);
-
   function excludeStickHeader(_ref) {
     var offsetTop = _ref.offsetTop;
-
     var _elementRef$value$get = elementRef.value.getBoundingClientRect(),
-        bottom = _elementRef$value$get.bottom;
-
+      bottom = _elementRef$value$get.bottom;
     return bottom <= offsetTop;
   }
-
   instance.on('$receive:stickHeader', function (v) {
     stickHeader.set(v === true ? 0 : isStringOrNumber(v) ? +v : null);
-  }); // when the scroll element scroll horizontally, scroll the sticky header too 
-
+  });
+  // when the scroll element scroll horizontally, scroll the sticky header too 
   callbacks.push(function (scrollLeft) {
     if (isNull(stickHeader.value)) return;
     var affixHeadWrapper = headRef.value.parentElement;