diff --git a/components/transfer/__tests__/__snapshots__/demo.test.js.snap b/components/transfer/__tests__/__snapshots__/demo.test.js.snap index bd95e5f856..2e8779eb27 100644 --- a/components/transfer/__tests__/__snapshots__/demo.test.js.snap +++ b/components/transfer/__tests__/__snapshots__/demo.test.js.snap @@ -3089,6 +3089,21 @@ Array [
+ + - - - @@ -4507,25 +4518,6 @@ exports[`renders ./components/transfer/demo/tree-transfer.md correctly 1`] = `
- - - diff --git a/components/transfer/__tests__/dropdown.test.js b/components/transfer/__tests__/dropdown.test.js index 8806b54028..4f336fd6b0 100644 --- a/components/transfer/__tests__/dropdown.test.js +++ b/components/transfer/__tests__/dropdown.test.js @@ -72,6 +72,12 @@ describe('Transfer.Dropdown', () => { jest.useRealTimers(); }); + it('should hide checkbox and dropdown icon when showSelectAll={false}', () => { + const wrapper = mount(); + expect(wrapper.find('.ant-transfer-list-header-dropdown').length).toBe(0); + expect(wrapper.find('.ant-transfer-list-header .ant-transfer-list-checkbox').length).toBe(0); + }); + describe('select invert', () => { [ { name: 'with pagination', props: listProps, index: 2, keys: ['c', 'd'] }, diff --git a/components/transfer/demo/table-transfer.md b/components/transfer/demo/table-transfer.md index 91fba142b0..c701ee0edb 100644 --- a/components/transfer/demo/table-transfer.md +++ b/components/transfer/demo/table-transfer.md @@ -19,7 +19,7 @@ import difference from 'lodash/difference'; // Customize Table Transfer const TableTransfer = ({ leftColumns, rightColumns, ...restProps }) => ( - + {({ direction, filteredItems, diff --git a/components/transfer/list.tsx b/components/transfer/list.tsx index 1ed6990c15..3d9a0c1251 100644 --- a/components/transfer/list.tsx +++ b/components/transfer/list.tsx @@ -75,7 +75,7 @@ interface TransferListState { } export default class TransferList< - RecordType extends KeyWiseTransferItem + RecordType extends KeyWiseTransferItem, > extends React.PureComponent, TransferListState> { static defaultProps = { dataSource: [], @@ -234,16 +234,20 @@ export default class TransferList< ); } - getCheckBox( - filteredItems: RecordType[], - onItemSelectAll: (dataSource: string[], checkAll: boolean) => void, - showSelectAll?: boolean, - disabled?: boolean, - prefixCls?: string, - ): false | JSX.Element { + getCheckBox({ + filteredItems, + onItemSelectAll, + disabled, + prefixCls, + }: { + filteredItems: RecordType[]; + onItemSelectAll: (dataSource: string[], checkAll: boolean) => void; + disabled?: boolean; + prefixCls?: string; + }): false | JSX.Element { const checkStatus = this.getCheckStatus(filteredItems); const checkedAll = checkStatus === 'all'; - const checkAllCheckbox = showSelectAll !== false && ( + const checkAllCheckbox = ( {/* Header */}
- {checkAllCheckbox} - {dropdown} + {showSelectAll ? ( + <> + {checkAllCheckbox} + {dropdown} + + ) : null} {this.getSelectAllLabel(checkedKeys.length, filteredItems.length)} diff --git a/components/transfer/style/customize.less b/components/transfer/style/customize.less index 1e78a900f2..614df0855e 100644 --- a/components/transfer/style/customize.less +++ b/components/transfer/style/customize.less @@ -17,6 +17,11 @@ border: 0; border-radius: 0; + .@{table-prefix-cls}-selection-column { + width: 40px; + min-width: 40px; + } + > .@{table-prefix-cls}-content { // Header background color > .@{table-prefix-cls}-body > table > .@{table-prefix-cls}-thead > tr > th {