1
This commit is contained in:
+5
@@ -0,0 +1,5 @@
|
||||
import type { TransferProps } from '..';
|
||||
import type { AnyObject } from '../../_util/type';
|
||||
import type { TransferKey } from '../interface';
|
||||
declare const useData: <RecordType extends AnyObject>(dataSource?: RecordType[], rowKey?: TransferProps<RecordType>["rowKey"], targetKeys?: TransferKey[]) => RecordType[][];
|
||||
export default useData;
|
||||
+40
@@ -0,0 +1,40 @@
|
||||
"use strict";
|
||||
|
||||
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = void 0;
|
||||
var React = _interopRequireWildcard(require("react"));
|
||||
var _transKeys = require("../../_util/transKeys");
|
||||
const useData = (dataSource, rowKey, targetKeys) => {
|
||||
const mergedDataSource = React.useMemo(() => (dataSource || []).map(record => {
|
||||
if (rowKey) {
|
||||
return {
|
||||
...record,
|
||||
key: rowKey(record)
|
||||
};
|
||||
}
|
||||
return record;
|
||||
}), [dataSource, rowKey]);
|
||||
const [leftDataSource, rightDataSource] = React.useMemo(() => {
|
||||
const leftData = [];
|
||||
const rightData = Array.from({
|
||||
length: targetKeys?.length ?? 0
|
||||
});
|
||||
const targetKeysMap = (0, _transKeys.groupKeysMap)(targetKeys || []);
|
||||
mergedDataSource.forEach(record => {
|
||||
// rightData should be ordered by targetKeys
|
||||
// leftData should be ordered by dataSource
|
||||
if (targetKeysMap.has(record.key)) {
|
||||
const idx = targetKeysMap.get(record.key);
|
||||
rightData[idx] = record;
|
||||
} else {
|
||||
leftData.push(record);
|
||||
}
|
||||
});
|
||||
return [leftData, rightData];
|
||||
}, [mergedDataSource, targetKeys]);
|
||||
return [mergedDataSource, leftDataSource.filter(Boolean), rightDataSource.filter(Boolean)];
|
||||
};
|
||||
var _default = exports.default = useData;
|
||||
+10
@@ -0,0 +1,10 @@
|
||||
import type { TransferKey } from '../interface';
|
||||
declare function useSelection<T extends {
|
||||
key: TransferKey;
|
||||
}>(leftDataSource: T[], rightDataSource: T[], selectedKeys?: TransferKey[]): [
|
||||
sourceSelectedKeys: TransferKey[],
|
||||
targetSelectedKeys: TransferKey[],
|
||||
setSourceSelectedKeys: (srcKeys: TransferKey[]) => void,
|
||||
setTargetSelectedKeys: (srcKeys: TransferKey[]) => void
|
||||
];
|
||||
export default useSelection;
|
||||
+44
@@ -0,0 +1,44 @@
|
||||
"use strict";
|
||||
|
||||
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
|
||||
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = void 0;
|
||||
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
|
||||
var React = _interopRequireWildcard(require("react"));
|
||||
var _util = require("@rc-component/util");
|
||||
const EMPTY_KEYS = [];
|
||||
function filterKeys(keys, dataKeys) {
|
||||
const filteredKeys = keys.filter(key => dataKeys.has(key));
|
||||
return keys.length === filteredKeys.length ? keys : filteredKeys;
|
||||
}
|
||||
function flattenKeys(keys) {
|
||||
return Array.from(keys).join(';');
|
||||
}
|
||||
function useSelection(leftDataSource, rightDataSource, selectedKeys) {
|
||||
// Prepare `dataSource` keys
|
||||
const [leftKeys, rightKeys] = React.useMemo(() => [new Set(leftDataSource.map(src => src?.key)), new Set(rightDataSource.map(src => src?.key))], [leftDataSource, rightDataSource]);
|
||||
// Selected Keys
|
||||
const [mergedSelectedKeys, setMergedSelectedKeys] = (0, _util.useControlledState)(EMPTY_KEYS, selectedKeys);
|
||||
const sourceSelectedKeys = React.useMemo(() => filterKeys(mergedSelectedKeys, leftKeys), [mergedSelectedKeys, leftKeys]);
|
||||
const targetSelectedKeys = React.useMemo(() => filterKeys(mergedSelectedKeys, rightKeys), [mergedSelectedKeys, rightKeys]);
|
||||
// // Reset when data changed
|
||||
React.useEffect(() => {
|
||||
setMergedSelectedKeys([].concat((0, _toConsumableArray2.default)(filterKeys(mergedSelectedKeys, leftKeys)), (0, _toConsumableArray2.default)(filterKeys(mergedSelectedKeys, rightKeys))));
|
||||
}, [flattenKeys(leftKeys), flattenKeys(rightKeys)]);
|
||||
// Update keys
|
||||
const setSourceSelectedKeys = (0, _util.useEvent)(nextSrcKeys => {
|
||||
setMergedSelectedKeys([].concat((0, _toConsumableArray2.default)(nextSrcKeys), (0, _toConsumableArray2.default)(targetSelectedKeys)));
|
||||
});
|
||||
const setTargetSelectedKeys = (0, _util.useEvent)(nextTargetKeys => {
|
||||
setMergedSelectedKeys([].concat((0, _toConsumableArray2.default)(sourceSelectedKeys), (0, _toConsumableArray2.default)(nextTargetKeys)));
|
||||
});
|
||||
return [
|
||||
// Keys
|
||||
sourceSelectedKeys, targetSelectedKeys,
|
||||
// Updater
|
||||
setSourceSelectedKeys, setTargetSelectedKeys];
|
||||
}
|
||||
var _default = exports.default = useSelection;
|
||||
Reference in New Issue
Block a user