feat: resizable.minWidth -> column.minWidth

Author: linxianxi

README.md

@@ -129,10 +129,11 @@ React.render(<Table columns={columns} data={data} />, mountNode);
 | title | React Node |  | title of this column |
 | dataIndex | String |  | display field of the data record |
 | width | String \| Number |  | width of the specific proportion calculation according to the width of the columns |
+| minWidth | Number |  | min width of the specific proportion calculation according to the width of the columns |
 | fixed | String \| Boolean |  | this column will be fixed when table scroll horizontally: true or 'left' or 'right' |
 | align | String |  | specify how cell content is aligned |
 | ellipsis | Boolean |  | specify whether cell content be ellipsized |
-| resizable | Boolean \| { minWidth?: number } |  | column resize config |
+| resizable | Boolean |  | column resize |
 | rowScope | 'row' \| 'rowgroup' |  | Set scope attribute for all cells in this column |
 | onCell | Function(record, index) |  | Set custom props per each cell. |
 | onHeaderCell | Function(record) |  | Set custom props per each header cell. |

src/Header/HeaderCell.tsx

@@ -7,12 +7,14 @@ import TableContext from '../context/TableContext';
 
 interface HeaderCellProps<RecordType> extends CellProps<RecordType> {
   columnKey?: React.Key;
-  resizable?: boolean | { minWidth?: number };
+  resizable?: boolean;
+  minWidth?: number;
 }
 
 function HeaderCell<RecordType>({
   columnKey,
   resizable,
+  minWidth,
   ...cellProps
 }: HeaderCellProps<RecordType>) {
   const { supportSticky } = useContext(TableContext, ['supportSticky']);
@@ -21,7 +23,7 @@ function HeaderCell<RecordType>({
   const isFixRight = typeof fixRight === 'number' && supportSticky;
   const cellPrefixCls = `${prefixCls}-cell`;
 
-  const resizeHandleNode = useCellResize(columnKey, isFixRight, cellPrefixCls, resizable);
+  const resizeHandleNode = useCellResize(columnKey, isFixRight, cellPrefixCls, resizable, minWidth);
 
   return <Cell {...cellProps} appendNode={resizeHandleNode} />;
 }

src/Header/HeaderRow.tsx

@@ -73,7 +73,8 @@ const HeaderRow = <RecordType extends any>(props: RowProps<RecordType>) => {
             additionalProps={additionalProps}
             rowType="header"
             columnKey={columnsKey[cellIndex]}
-            resizable={column.resizable}
+            resizable={(column as ColumnType<RecordType>).resizable}
+            minWidth={(column as ColumnType<RecordType>).minWidth}
           />
         );
       })}

src/Header/useCellResize.tsx

@@ -8,7 +8,8 @@ export default function useCelResize(
   columnKey: React.Key,
   isFixRight: boolean,
   cellPrefixCls: string,
-  resizable?: boolean | { minWidth?: number },
+  resizable?: boolean,
+  minWidth: number = 0,
 ) {
   const {
     colsWidths,
@@ -47,7 +48,6 @@ export default function useCelResize(
     const oldWidth = colsWidths.get(columnKey);
     let newWidth = startRealWidth.current + (isFixRight ? -offset : offset);
 
-    const minWidth = typeof resizable === 'object' ? resizable.minWidth || 0 : 0;
     if (newWidth < minWidth) {
       newWidth = minWidth;
     }

src/interface.ts

@@ -94,7 +94,6 @@ interface ColumnSharedType<RecordType> {
   ellipsis?: CellEllipsisType;
   align?: AlignType;
   rowScope?: RowScopeType;
-  resizable?: boolean | { minWidth?: number };
 }
 
 export interface ColumnGroupType<RecordType> extends ColumnSharedType<RecordType> {
@@ -114,6 +113,8 @@ export interface ColumnType<RecordType> extends ColumnSharedType<RecordType> {
   shouldCellUpdate?: (record: RecordType, prevRecord: RecordType) => boolean;
   rowSpan?: number;
   width?: number | string;
+  minWidth?: number;
+  resizable?: boolean;
   onCell?: GetComponentProps<RecordType>;
   /** @deprecated Please use `onCell` instead */
   onCellClick?: (record: RecordType, e: React.MouseEvent<HTMLElement>) => void;