@douyinfe/semi-ui 2.1.0-alpha.1 → 2.1.0-alpha.2

package/lib/es/table/ResizableTable.js

@@ -1,7 +1,3 @@
-import _noop from "lodash/noop";
-import _find from "lodash/find";
-import _get from "lodash/get";
-import _merge from "lodash/merge";
 import _indexOfInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/index-of";
 import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols";
 import _Array$isArray from "@babel/runtime-corejs3/core-js-stable/array/is-array";
@@ -30,6 +26,7 @@ var __rest = this && this.__rest || function (s, e) {
 
 
 import React, { useState, useEffect, useMemo } from 'react';
+import { merge, get, find, noop } from 'lodash-es';
 import { addClass, removeClass } from '@douyinfe/semi-foundation/lib/es/utils/classnames';
 import { strings, numbers } from '@douyinfe/semi-foundation/lib/es/table/constants';
 import { mergeColumns, assignColumnKeys, findColumn, withResizeWidth } from '@douyinfe/semi-foundation/lib/es/table/utils';
@@ -38,10 +35,7 @@ import { cloneDeep } from './utils';
 import getColumns from './getColumns';
 import ResizableHeaderCell from './ResizableHeaderCell';
 
-const ResizableTable = function () {
-  let props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-  let ref = arguments.length > 1 ? arguments[1] : undefined;
-
+const ResizableTable = (props = {}, ref) => {
   const {
     components: propComponents,
     columns: propColumns,
@@ -50,12 +44,9 @@ const ResizableTable = function () {
         restProps = __rest(props, ["components", "columns", "resizable"]);
 
   const childrenColumnName = 'children';
-
-  const onResize = _get(resizable, 'onResize', _noop);
-
-  const onResizeStart = _get(resizable, 'onResizeStart', _noop);
-
-  const onResizeStop = _get(resizable, 'onResizeStop', _noop);
+  const onResize = get(resizable, 'onResize', noop);
+  const onResizeStart = get(resizable, 'onResizeStart', noop);
+  const onResizeStop = get(resizable, 'onResizeStop', noop);
   /**
    * 此处关于 columns 有三个存储
    *
@@ -74,21 +65,20 @@ const ResizableTable = function () {
     * 3. columns is the state stored in the current component, which is generally equal to newColumns, but it will save the current stretched width of the column
     */
 
-
   const parsedColumns = _Array$isArray(propColumns) && propColumns.length ? propColumns : getColumns(props.children);
   const rawColumns = assignColumnKeys(cloneDeep(parsedColumns), childrenColumnName);
   const newColumns = assignColumnKeys(cloneDeep(parsedColumns), childrenColumnName);
 
-  if (typeof props.expandedRowRender === 'function' && !props.hideExpandedColumn && !_find(rawColumns, item => item.key === strings.DEFAULT_KEY_COLUMN_EXPAND)) {
+  if (typeof props.expandedRowRender === 'function' && !props.hideExpandedColumn && !find(rawColumns, item => item.key === strings.DEFAULT_KEY_COLUMN_EXPAND)) {
     newColumns.unshift({
       key: strings.DEFAULT_KEY_COLUMN_EXPAND,
       width: numbers.DEFAULT_WIDTH_COLUMN_EXPAND
     });
   }
 
-  if (props.rowSelection && !_find(rawColumns, item => item.key === strings.DEFAULT_KEY_COLUMN_SELECTION)) {
+  if (props.rowSelection && !find(rawColumns, item => item.key === strings.DEFAULT_KEY_COLUMN_SELECTION)) {
     newColumns.unshift({
-      width: _get(props, 'rowSelection.width', numbers.DEFAULT_WIDTH_COLUMN_SELECTION),
+      width: get(props, 'rowSelection.width', numbers.DEFAULT_WIDTH_COLUMN_SELECTION),
       key: strings.DEFAULT_KEY_COLUMN_SELECTION
     });
   }
@@ -100,18 +90,16 @@ const ResizableTable = function () {
 
     setColumns(mergeColumns(columns, _newColumns));
   }, [propColumns, props.expandedRowRender, props.hideExpandedColumn, props.rowSelection]);
-  const components = useMemo(() => _merge({
+  const components = useMemo(() => merge({
     header: {
       cell: ResizableHeaderCell
     }
   }, propComponents), [propComponents]);
+  const handlerClassName = get(resizable, 'handlerClassName', 'resizing');
 
-  const handlerClassName = _get(resizable, 'handlerClassName', 'resizing');
-
-  const handleResize = column => (e, _ref) => {
-    let {
-      size
-    } = _ref;
+  const handleResize = column => (e, {
+    size
+  }) => {
     const nextColumns = cloneDeep(columns);
     const curColumn = findColumn(nextColumns, column, childrenColumnName);
 
@@ -159,33 +147,26 @@ const ResizableTable = function () {
     setColumns(nextColumns);
   };
 
-  const resizableRender = function (col, index) {
-    let level = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
-    return _Object$assign(_Object$assign({}, col), {
-      onHeaderCell: column => ({
-        width: column.width,
-        onResize: handleResize(column),
-        onResizeStart: handleResizeStart(column),
-        onResizeStop: handleResizeStop(column)
-      })
-    });
-  };
+  const resizableRender = (col, index, level = 0) => _Object$assign(_Object$assign({}, col), {
+    onHeaderCell: column => ({
+      width: column.width,
+      onResize: handleResize(column),
+      onResizeStart: handleResizeStart(column),
+      onResizeStop: handleResizeStop(column)
+    })
+  });
 
-  const assignResizableRender = function () {
-    let columns = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
-    let level = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
-    return _Array$isArray(columns) && columns.length ? _mapInstanceProperty(columns).call(columns, (col, index) => {
-      _Object$assign(col, resizableRender(col, index, level));
+  const assignResizableRender = (columns = [], level = 0) => _Array$isArray(columns) && columns.length ? _mapInstanceProperty(columns).call(columns, (col, index) => {
+    _Object$assign(col, resizableRender(col, index, level));
 
-      const children = col[childrenColumnName];
+    const children = col[childrenColumnName];
 
-      if (_Array$isArray(children) && children.length) {
-        col[childrenColumnName] = assignResizableRender(children, level + 1);
-      }
+    if (_Array$isArray(children) && children.length) {
+      col[childrenColumnName] = assignResizableRender(children, level + 1);
+    }
 
-      return col;
-    }) : [];
-  };
+    return col;
+  }) : [];
 
   const finalColumns = useMemo(() => assignResizableRender(columns), [columns]);
   return /*#__PURE__*/React.createElement(Table, _Object$assign({}, restProps, {

package/lib/es/table/Table.d.ts

@@ -52,7 +52,7 @@ declare class Table<RecordType extends Record<string, any>> extends BaseComponen
         bordered: PropTypes.Requireable<boolean>;
         loading: PropTypes.Requireable<boolean>;
         size: PropTypes.Requireable<"default" | "small" | "middle">;
-        tableLayout: PropTypes.Requireable<"" | "auto" | "fixed">;
+        tableLayout: PropTypes.Requireable<"" | "fixed" | "auto">;
         columns: PropTypes.Requireable<PropTypes.InferProps<{
             align: PropTypes.Requireable<"left" | "right" | "center">;
             className: PropTypes.Requireable<string>;