1
This commit is contained in:
+31
@@ -0,0 +1,31 @@
|
||||
import * as React from 'react';
|
||||
import type { ColumnsType, ColumnType, Direction, FixedType, GetRowKey, Key, RenderExpandIcon, TriggerEventHandler } from '../../interface';
|
||||
export declare function convertChildrenToColumns<RecordType>(children: React.ReactNode): ColumnsType<RecordType>;
|
||||
/**
|
||||
* Parse `columns` & `children` into `columns`.
|
||||
*/
|
||||
declare function useColumns<RecordType>({ prefixCls, columns, children, expandable, expandedKeys, columnTitle, getRowKey, onTriggerExpand, expandIcon, rowExpandable, expandIconColumnIndex, expandedRowOffset, direction, expandRowByClick, columnWidth, fixed, scrollWidth, clientWidth, }: {
|
||||
prefixCls?: string;
|
||||
columns?: ColumnsType<RecordType>;
|
||||
children?: React.ReactNode;
|
||||
expandable: boolean;
|
||||
expandedKeys: Set<Key>;
|
||||
columnTitle?: React.ReactNode;
|
||||
getRowKey: GetRowKey<RecordType>;
|
||||
onTriggerExpand: TriggerEventHandler<RecordType>;
|
||||
expandIcon?: RenderExpandIcon<RecordType>;
|
||||
rowExpandable?: (record: RecordType) => boolean;
|
||||
expandIconColumnIndex?: number;
|
||||
direction?: Direction;
|
||||
expandRowByClick?: boolean;
|
||||
columnWidth?: number | string;
|
||||
clientWidth: number;
|
||||
fixed?: FixedType;
|
||||
scrollWidth?: number;
|
||||
expandedRowOffset?: number;
|
||||
}, transformColumns: (columns: ColumnsType<RecordType>) => ColumnsType<RecordType>): [
|
||||
columns: ColumnsType<RecordType>,
|
||||
flattenColumns: readonly ColumnType<RecordType>[],
|
||||
realScrollWidth: undefined | number
|
||||
];
|
||||
export default useColumns;
|
||||
+207
@@ -0,0 +1,207 @@
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.convertChildrenToColumns = convertChildrenToColumns;
|
||||
exports.default = void 0;
|
||||
var _toArray = _interopRequireDefault(require("@rc-component/util/lib/Children/toArray"));
|
||||
var _warning = _interopRequireDefault(require("@rc-component/util/lib/warning"));
|
||||
var React = _interopRequireWildcard(require("react"));
|
||||
var _constant = require("../../constant");
|
||||
var _legacyUtil = require("../../utils/legacyUtil");
|
||||
var _useWidthColumns = _interopRequireDefault(require("./useWidthColumns"));
|
||||
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
||||
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
||||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
||||
function convertChildrenToColumns(children) {
|
||||
return (0, _toArray.default)(children).filter(node => /*#__PURE__*/React.isValidElement(node)).map(node => {
|
||||
const {
|
||||
key,
|
||||
props
|
||||
} = node;
|
||||
const {
|
||||
children: nodeChildren,
|
||||
...restProps
|
||||
} = props;
|
||||
const column = {
|
||||
key,
|
||||
...restProps
|
||||
};
|
||||
if (nodeChildren) {
|
||||
column.children = convertChildrenToColumns(nodeChildren);
|
||||
}
|
||||
return column;
|
||||
});
|
||||
}
|
||||
function filterHiddenColumns(columns) {
|
||||
return columns.filter(column => column && typeof column === 'object' && !column.hidden).map(column => {
|
||||
const subColumns = column.children;
|
||||
if (subColumns && subColumns.length > 0) {
|
||||
return {
|
||||
...column,
|
||||
children: filterHiddenColumns(subColumns)
|
||||
};
|
||||
}
|
||||
return column;
|
||||
});
|
||||
}
|
||||
function flatColumns(columns, parentKey = 'key') {
|
||||
return columns.filter(column => column && typeof column === 'object').reduce((list, column, index) => {
|
||||
const {
|
||||
fixed
|
||||
} = column;
|
||||
const parsedFixed = fixed === true || fixed === 'left' ? 'start' : fixed === 'right' ? 'end' : fixed;
|
||||
const mergedKey = `${parentKey}-${index}`;
|
||||
const subColumns = column.children;
|
||||
if (subColumns && subColumns.length > 0) {
|
||||
return [...list, ...flatColumns(subColumns, mergedKey).map(subColum => ({
|
||||
...subColum,
|
||||
fixed: subColum.fixed ?? parsedFixed
|
||||
}))];
|
||||
}
|
||||
return [...list, {
|
||||
key: mergedKey,
|
||||
...column,
|
||||
fixed: parsedFixed
|
||||
}];
|
||||
}, []);
|
||||
}
|
||||
|
||||
/**
|
||||
* Parse `columns` & `children` into `columns`.
|
||||
*/
|
||||
function useColumns({
|
||||
prefixCls,
|
||||
columns,
|
||||
children,
|
||||
expandable,
|
||||
expandedKeys,
|
||||
columnTitle,
|
||||
getRowKey,
|
||||
onTriggerExpand,
|
||||
expandIcon,
|
||||
rowExpandable,
|
||||
expandIconColumnIndex,
|
||||
expandedRowOffset = 0,
|
||||
direction,
|
||||
expandRowByClick,
|
||||
columnWidth,
|
||||
fixed,
|
||||
scrollWidth,
|
||||
clientWidth
|
||||
}, transformColumns) {
|
||||
const baseColumns = React.useMemo(() => {
|
||||
const newColumns = columns || convertChildrenToColumns(children) || [];
|
||||
return filterHiddenColumns(newColumns.slice());
|
||||
}, [columns, children]);
|
||||
|
||||
// ========================== Expand ==========================
|
||||
const withExpandColumns = React.useMemo(() => {
|
||||
if (expandable) {
|
||||
let cloneColumns = baseColumns.slice();
|
||||
|
||||
// >>> Warning if use `expandIconColumnIndex`
|
||||
if (process.env.NODE_ENV !== 'production' && expandIconColumnIndex >= 0) {
|
||||
(0, _warning.default)(false, '`expandIconColumnIndex` is deprecated. Please use `Table.EXPAND_COLUMN` in `columns` instead.');
|
||||
}
|
||||
|
||||
// >>> Insert expand column if not exist
|
||||
if (!cloneColumns.includes(_constant.EXPAND_COLUMN)) {
|
||||
const expandColIndex = expandIconColumnIndex || 0;
|
||||
const insertIndex = expandColIndex === 0 && (fixed === 'right' || fixed === 'end') ? baseColumns.length : expandColIndex;
|
||||
if (insertIndex >= 0) {
|
||||
cloneColumns.splice(insertIndex, 0, _constant.EXPAND_COLUMN);
|
||||
}
|
||||
}
|
||||
|
||||
// >>> Deduplicate additional expand column
|
||||
if (process.env.NODE_ENV !== 'production' && cloneColumns.filter(c => c === _constant.EXPAND_COLUMN).length > 1) {
|
||||
(0, _warning.default)(false, 'There exist more than one `EXPAND_COLUMN` in `columns`.');
|
||||
}
|
||||
const expandColumnIndex = cloneColumns.indexOf(_constant.EXPAND_COLUMN);
|
||||
cloneColumns = cloneColumns.filter((column, index) => column !== _constant.EXPAND_COLUMN || index === expandColumnIndex);
|
||||
|
||||
// >>> Check if expand column need to fixed
|
||||
const prevColumn = baseColumns[expandColumnIndex];
|
||||
let fixedColumn;
|
||||
if (fixed) {
|
||||
fixedColumn = fixed;
|
||||
} else {
|
||||
fixedColumn = prevColumn ? prevColumn.fixed : null;
|
||||
}
|
||||
|
||||
// >>> Create expandable column
|
||||
const expandColumn = {
|
||||
[_legacyUtil.INTERNAL_COL_DEFINE]: {
|
||||
className: `${prefixCls}-expand-icon-col`,
|
||||
columnType: 'EXPAND_COLUMN'
|
||||
},
|
||||
title: columnTitle,
|
||||
fixed: fixedColumn,
|
||||
className: `${prefixCls}-row-expand-icon-cell`,
|
||||
width: columnWidth,
|
||||
render: (_, record, index) => {
|
||||
const rowKey = getRowKey(record, index);
|
||||
const expanded = expandedKeys.has(rowKey);
|
||||
const recordExpandable = rowExpandable ? rowExpandable(record) : true;
|
||||
const icon = expandIcon({
|
||||
prefixCls,
|
||||
expanded,
|
||||
expandable: recordExpandable,
|
||||
record,
|
||||
onExpand: onTriggerExpand
|
||||
});
|
||||
if (expandRowByClick) {
|
||||
return /*#__PURE__*/React.createElement("span", {
|
||||
onClick: e => e.stopPropagation()
|
||||
}, icon);
|
||||
}
|
||||
return icon;
|
||||
}
|
||||
};
|
||||
return cloneColumns.map((col, index) => {
|
||||
const column = col === _constant.EXPAND_COLUMN ? expandColumn : col;
|
||||
if (index < expandedRowOffset) {
|
||||
return {
|
||||
...column,
|
||||
fixed: column.fixed || 'start'
|
||||
};
|
||||
}
|
||||
return column;
|
||||
});
|
||||
}
|
||||
if (process.env.NODE_ENV !== 'production' && baseColumns.includes(_constant.EXPAND_COLUMN)) {
|
||||
(0, _warning.default)(false, '`expandable` is not config but there exist `EXPAND_COLUMN` in `columns`.');
|
||||
}
|
||||
return baseColumns.filter(col => col !== _constant.EXPAND_COLUMN);
|
||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
}, [expandable, baseColumns, getRowKey, expandedKeys, expandIcon, direction, expandedRowOffset]);
|
||||
|
||||
// ========================= Transform ========================
|
||||
const mergedColumns = React.useMemo(() => {
|
||||
let finalColumns = withExpandColumns;
|
||||
if (transformColumns) {
|
||||
finalColumns = transformColumns(finalColumns);
|
||||
}
|
||||
|
||||
// Always provides at least one column for table display
|
||||
if (!finalColumns.length) {
|
||||
finalColumns = [{
|
||||
render: () => null
|
||||
}];
|
||||
}
|
||||
return finalColumns;
|
||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
}, [transformColumns, withExpandColumns, direction]);
|
||||
|
||||
// ========================== Flatten =========================
|
||||
const flattenColumns = React.useMemo(() => flatColumns(mergedColumns),
|
||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
[mergedColumns, direction, scrollWidth]);
|
||||
|
||||
// ========================= FillWidth ========================
|
||||
const [filledColumns, realScrollWidth] = (0, _useWidthColumns.default)(flattenColumns, scrollWidth, clientWidth);
|
||||
return [mergedColumns, filledColumns, realScrollWidth];
|
||||
}
|
||||
var _default = exports.default = useColumns;
|
||||
Generated
Vendored
+5
@@ -0,0 +1,5 @@
|
||||
import type { ColumnsType } from '../../interface';
|
||||
/**
|
||||
* Fill all column with width
|
||||
*/
|
||||
export default function useWidthColumns(flattenColumns: ColumnsType<any>, scrollWidth: number, clientWidth: number): [columns: ColumnsType<any>, realScrollWidth: number];
|
||||
Generated
Vendored
+78
@@ -0,0 +1,78 @@
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = useWidthColumns;
|
||||
var React = _interopRequireWildcard(require("react"));
|
||||
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
||||
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
||||
function parseColWidth(totalWidth, width = '') {
|
||||
if (typeof width === 'number') {
|
||||
return width;
|
||||
}
|
||||
if (width.endsWith('%')) {
|
||||
return totalWidth * parseFloat(width) / 100;
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
/**
|
||||
* Fill all column with width
|
||||
*/
|
||||
function useWidthColumns(flattenColumns, scrollWidth, clientWidth) {
|
||||
return React.useMemo(() => {
|
||||
// Fill width if needed
|
||||
if (scrollWidth && scrollWidth > 0) {
|
||||
let totalWidth = 0;
|
||||
let missWidthCount = 0;
|
||||
|
||||
// collect not given width column
|
||||
flattenColumns.forEach(col => {
|
||||
const colWidth = parseColWidth(scrollWidth, col.width);
|
||||
if (colWidth) {
|
||||
totalWidth += colWidth;
|
||||
} else {
|
||||
missWidthCount += 1;
|
||||
}
|
||||
});
|
||||
|
||||
// Fill width
|
||||
const maxFitWidth = Math.max(scrollWidth, clientWidth);
|
||||
let restWidth = Math.max(maxFitWidth - totalWidth, missWidthCount);
|
||||
let restCount = missWidthCount;
|
||||
const avgWidth = restWidth / missWidthCount;
|
||||
let realTotal = 0;
|
||||
const filledColumns = flattenColumns.map(col => {
|
||||
const clone = {
|
||||
...col
|
||||
};
|
||||
const colWidth = parseColWidth(scrollWidth, clone.width);
|
||||
if (colWidth) {
|
||||
clone.width = colWidth;
|
||||
} else {
|
||||
const colAvgWidth = Math.floor(avgWidth);
|
||||
clone.width = restCount === 1 ? restWidth : colAvgWidth;
|
||||
restWidth -= colAvgWidth;
|
||||
restCount -= 1;
|
||||
}
|
||||
realTotal += clone.width;
|
||||
return clone;
|
||||
});
|
||||
|
||||
// If realTotal is less than clientWidth,
|
||||
// We need extend column width
|
||||
if (realTotal < maxFitWidth) {
|
||||
const scale = maxFitWidth / realTotal;
|
||||
restWidth = maxFitWidth;
|
||||
filledColumns.forEach((col, index) => {
|
||||
const colWidth = Math.floor(col.width * scale);
|
||||
col.width = index === filledColumns.length - 1 ? restWidth : colWidth;
|
||||
restWidth -= colWidth;
|
||||
});
|
||||
}
|
||||
return [filledColumns, Math.max(realTotal, maxFitWidth)];
|
||||
}
|
||||
return [flattenColumns, scrollWidth];
|
||||
}, [flattenColumns, scrollWidth, clientWidth]);
|
||||
}
|
||||
+10
@@ -0,0 +1,10 @@
|
||||
import type { ExpandableConfig, ExpandableType, GetRowKey, Key, RenderExpandIcon, TriggerEventHandler } from '../interface';
|
||||
import type { TableProps } from '../Table';
|
||||
export default function useExpand<RecordType>(props: TableProps<RecordType>, mergedData: readonly RecordType[], getRowKey: GetRowKey<RecordType>): [
|
||||
expandableConfig: ExpandableConfig<RecordType>,
|
||||
expandableType: ExpandableType,
|
||||
expandedKeys: Set<Key>,
|
||||
expandIcon: RenderExpandIcon<RecordType>,
|
||||
childrenColumnName: string,
|
||||
onTriggerExpand: TriggerEventHandler<RecordType>
|
||||
];
|
||||
+84
@@ -0,0 +1,84 @@
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = useExpand;
|
||||
var _warning = _interopRequireDefault(require("@rc-component/util/lib/warning"));
|
||||
var React = _interopRequireWildcard(require("react"));
|
||||
var _constant = require("../constant");
|
||||
var _expandUtil = require("../utils/expandUtil");
|
||||
var _legacyUtil = require("../utils/legacyUtil");
|
||||
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
||||
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
||||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
||||
function useExpand(props, mergedData, getRowKey) {
|
||||
const expandableConfig = (0, _legacyUtil.getExpandableProps)(props);
|
||||
const {
|
||||
expandIcon,
|
||||
expandedRowKeys,
|
||||
defaultExpandedRowKeys,
|
||||
defaultExpandAllRows,
|
||||
expandedRowRender,
|
||||
onExpand,
|
||||
onExpandedRowsChange,
|
||||
childrenColumnName
|
||||
} = expandableConfig;
|
||||
const mergedExpandIcon = expandIcon || _expandUtil.renderExpandIcon;
|
||||
const mergedChildrenColumnName = childrenColumnName || 'children';
|
||||
const expandableType = React.useMemo(() => {
|
||||
if (expandedRowRender) {
|
||||
return 'row';
|
||||
}
|
||||
/* eslint-disable no-underscore-dangle */
|
||||
/**
|
||||
* Fix https://github.com/ant-design/ant-design/issues/21154
|
||||
* This is a workaround to not to break current behavior.
|
||||
* We can remove follow code after final release.
|
||||
*
|
||||
* To other developer:
|
||||
* Do not use `__PARENT_RENDER_ICON__` in prod since we will remove this when refactor
|
||||
*/
|
||||
if (props.expandable && props.internalHooks === _constant.INTERNAL_HOOKS && props.expandable.__PARENT_RENDER_ICON__ || mergedData.some(record => record && typeof record === 'object' && record[mergedChildrenColumnName])) {
|
||||
return 'nest';
|
||||
}
|
||||
/* eslint-enable */
|
||||
return false;
|
||||
}, [!!expandedRowRender, mergedData]);
|
||||
const [innerExpandedKeys, setInnerExpandedKeys] = React.useState(() => {
|
||||
if (defaultExpandedRowKeys) {
|
||||
return defaultExpandedRowKeys;
|
||||
}
|
||||
if (defaultExpandAllRows) {
|
||||
return (0, _expandUtil.findAllChildrenKeys)(mergedData, getRowKey, mergedChildrenColumnName);
|
||||
}
|
||||
return [];
|
||||
});
|
||||
const mergedExpandedKeys = React.useMemo(() => new Set(expandedRowKeys || innerExpandedKeys || []), [expandedRowKeys, innerExpandedKeys]);
|
||||
const onTriggerExpand = React.useCallback(record => {
|
||||
const key = getRowKey(record, mergedData.indexOf(record));
|
||||
let newExpandedKeys;
|
||||
const hasKey = mergedExpandedKeys.has(key);
|
||||
if (hasKey) {
|
||||
mergedExpandedKeys.delete(key);
|
||||
newExpandedKeys = [...mergedExpandedKeys];
|
||||
} else {
|
||||
newExpandedKeys = [...mergedExpandedKeys, key];
|
||||
}
|
||||
setInnerExpandedKeys(newExpandedKeys);
|
||||
if (onExpand) {
|
||||
onExpand(!hasKey, record);
|
||||
}
|
||||
if (onExpandedRowsChange) {
|
||||
onExpandedRowsChange(newExpandedKeys);
|
||||
}
|
||||
}, [getRowKey, mergedExpandedKeys, mergedData, onExpand, onExpandedRowsChange]);
|
||||
|
||||
// Warning if use `expandedRowRender` and nest children in the same time
|
||||
if (process.env.NODE_ENV !== 'production' && expandedRowRender && mergedData.some(record => {
|
||||
return Array.isArray(record?.[mergedChildrenColumnName]);
|
||||
})) {
|
||||
(0, _warning.default)(false, '`expandedRowRender` should not use with nested Table');
|
||||
}
|
||||
return [expandableConfig, expandableType, mergedExpandedKeys, mergedExpandIcon, mergedChildrenColumnName, onTriggerExpand];
|
||||
}
|
||||
+2
@@ -0,0 +1,2 @@
|
||||
import type { ColumnType, StickyOffsets } from '../interface';
|
||||
export default function useFixedInfo<RecordType>(flattenColumns: readonly ColumnType<RecordType>[], stickyOffsets: StickyOffsets): import("../utils/fixUtil").FixedInfo[];
|
||||
+17
@@ -0,0 +1,17 @@
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = useFixedInfo;
|
||||
var _useMemo = _interopRequireDefault(require("@rc-component/util/lib/hooks/useMemo"));
|
||||
var _isEqual = _interopRequireDefault(require("@rc-component/util/lib/isEqual"));
|
||||
var _fixUtil = require("../utils/fixUtil");
|
||||
var React = _interopRequireWildcard(require("react"));
|
||||
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
||||
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
||||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
||||
function useFixedInfo(flattenColumns, stickyOffsets) {
|
||||
const fixedInfoList = React.useMemo(() => flattenColumns.map((_, colIndex) => (0, _fixUtil.getCellFixedInfo)(colIndex, colIndex, flattenColumns, stickyOffsets)), [flattenColumns, stickyOffsets]);
|
||||
return (0, _useMemo.default)(() => fixedInfoList, [fixedInfoList], (prev, next) => !(0, _isEqual.default)(prev, next));
|
||||
}
|
||||
Generated
Vendored
+19
@@ -0,0 +1,19 @@
|
||||
import type { GetRowKey, Key } from '../interface';
|
||||
export interface FlattenData<RecordType> {
|
||||
record: RecordType;
|
||||
indent: number;
|
||||
index: number;
|
||||
rowKey: Key;
|
||||
}
|
||||
/**
|
||||
* flat tree data on expanded state
|
||||
*
|
||||
* @export
|
||||
* @template T
|
||||
* @param {*} data : table data
|
||||
* @param {string} childrenColumnName : 指定树形结构的列名
|
||||
* @param {Set<Key>} expandedKeys : 展开的行对应的keys
|
||||
* @param {GetRowKey<T>} getRowKey : 获取当前rowKey的方法
|
||||
* @returns flattened data
|
||||
*/
|
||||
export default function useFlattenRecords<T>(data: T[] | readonly T[], childrenColumnName: string, expandedKeys: Set<Key>, getRowKey: GetRowKey<T>): FlattenData<T>[];
|
||||
+62
@@ -0,0 +1,62 @@
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = useFlattenRecords;
|
||||
var React = _interopRequireWildcard(require("react"));
|
||||
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
||||
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
||||
// recursion (flat tree structure)
|
||||
function fillRecords(list, record, indent, childrenColumnName, expandedKeys, getRowKey, index) {
|
||||
const key = getRowKey(record, index);
|
||||
list.push({
|
||||
record,
|
||||
indent,
|
||||
index,
|
||||
rowKey: key
|
||||
});
|
||||
const expanded = expandedKeys?.has(key);
|
||||
if (record && Array.isArray(record[childrenColumnName]) && expanded) {
|
||||
// expanded state, flat record
|
||||
for (let i = 0; i < record[childrenColumnName].length; i += 1) {
|
||||
fillRecords(list, record[childrenColumnName][i], indent + 1, childrenColumnName, expandedKeys, getRowKey, i);
|
||||
}
|
||||
}
|
||||
}
|
||||
/**
|
||||
* flat tree data on expanded state
|
||||
*
|
||||
* @export
|
||||
* @template T
|
||||
* @param {*} data : table data
|
||||
* @param {string} childrenColumnName : 指定树形结构的列名
|
||||
* @param {Set<Key>} expandedKeys : 展开的行对应的keys
|
||||
* @param {GetRowKey<T>} getRowKey : 获取当前rowKey的方法
|
||||
* @returns flattened data
|
||||
*/
|
||||
function useFlattenRecords(data, childrenColumnName, expandedKeys, getRowKey) {
|
||||
const arr = React.useMemo(() => {
|
||||
if (expandedKeys?.size) {
|
||||
const list = [];
|
||||
|
||||
// collect flattened record
|
||||
for (let i = 0; i < data?.length; i += 1) {
|
||||
const record = data[i];
|
||||
|
||||
// using array.push or spread operator may cause "Maximum call stack size exceeded" exception if array size is big enough.
|
||||
fillRecords(list, record, 0, childrenColumnName, expandedKeys, getRowKey, i);
|
||||
}
|
||||
return list;
|
||||
}
|
||||
return data?.map((item, index) => {
|
||||
return {
|
||||
record: item,
|
||||
indent: 0,
|
||||
index,
|
||||
rowKey: getRowKey(item, index)
|
||||
};
|
||||
});
|
||||
}, [data, childrenColumnName, expandedKeys, getRowKey]);
|
||||
return arr;
|
||||
}
|
||||
+7
@@ -0,0 +1,7 @@
|
||||
export type Updater<State> = (prev: State) => State;
|
||||
/**
|
||||
* Execute code before next frame but async
|
||||
*/
|
||||
export declare function useLayoutState<State>(defaultState: State): [State, (updater: Updater<State>) => void];
|
||||
/** Lock frame, when frame pass reset the lock. */
|
||||
export declare function useTimeoutLock<State>(defaultState?: State): [(state: State) => void, () => State | null];
|
||||
+62
@@ -0,0 +1,62 @@
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.useLayoutState = useLayoutState;
|
||||
exports.useTimeoutLock = useTimeoutLock;
|
||||
var _react = require("react");
|
||||
/**
|
||||
* Execute code before next frame but async
|
||||
*/
|
||||
function useLayoutState(defaultState) {
|
||||
const stateRef = (0, _react.useRef)(defaultState);
|
||||
const [, forceUpdate] = (0, _react.useState)({});
|
||||
const lastPromiseRef = (0, _react.useRef)(null);
|
||||
const updateBatchRef = (0, _react.useRef)([]);
|
||||
function setFrameState(updater) {
|
||||
updateBatchRef.current.push(updater);
|
||||
const promise = Promise.resolve();
|
||||
lastPromiseRef.current = promise;
|
||||
promise.then(() => {
|
||||
if (lastPromiseRef.current === promise) {
|
||||
const prevBatch = updateBatchRef.current;
|
||||
const prevState = stateRef.current;
|
||||
updateBatchRef.current = [];
|
||||
prevBatch.forEach(batchUpdater => {
|
||||
stateRef.current = batchUpdater(stateRef.current);
|
||||
});
|
||||
lastPromiseRef.current = null;
|
||||
if (prevState !== stateRef.current) {
|
||||
forceUpdate({});
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
(0, _react.useEffect)(() => () => {
|
||||
lastPromiseRef.current = null;
|
||||
}, []);
|
||||
return [stateRef.current, setFrameState];
|
||||
}
|
||||
|
||||
/** Lock frame, when frame pass reset the lock. */
|
||||
function useTimeoutLock(defaultState) {
|
||||
const frameRef = (0, _react.useRef)(defaultState || null);
|
||||
const timeoutRef = (0, _react.useRef)(null);
|
||||
function cleanUp() {
|
||||
clearTimeout(timeoutRef.current);
|
||||
}
|
||||
function setState(newState) {
|
||||
frameRef.current = newState;
|
||||
cleanUp();
|
||||
timeoutRef.current = setTimeout(() => {
|
||||
frameRef.current = null;
|
||||
timeoutRef.current = undefined;
|
||||
}, 100);
|
||||
}
|
||||
function getState() {
|
||||
return frameRef.current;
|
||||
}
|
||||
(0, _react.useEffect)(() => cleanUp, []);
|
||||
return [setState, getState];
|
||||
}
|
||||
+2
@@ -0,0 +1,2 @@
|
||||
export type OnHover = (start: number, end: number) => void;
|
||||
export default function useHover(): [startRow: number, endRow: number, onHover: OnHover];
|
||||
+18
@@ -0,0 +1,18 @@
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = useHover;
|
||||
var React = _interopRequireWildcard(require("react"));
|
||||
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
||||
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
||||
function useHover() {
|
||||
const [startRow, setStartRow] = React.useState(-1);
|
||||
const [endRow, setEndRow] = React.useState(-1);
|
||||
const onHover = React.useCallback((start, end) => {
|
||||
setStartRow(start);
|
||||
setEndRow(end);
|
||||
}, []);
|
||||
return [startRow, endRow, onHover];
|
||||
}
|
||||
+5
@@ -0,0 +1,5 @@
|
||||
import * as React from 'react';
|
||||
declare function useRenderTimes<T extends object>(props?: T, debug?: string): number;
|
||||
declare const _default: typeof useRenderTimes | (() => void);
|
||||
export default _default;
|
||||
export declare const RenderBlock: React.MemoExoticComponent<() => React.JSX.Element>;
|
||||
+46
@@ -0,0 +1,46 @@
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = exports.RenderBlock = void 0;
|
||||
var React = _interopRequireWildcard(require("react"));
|
||||
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
||||
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
||||
/* istanbul ignore file */
|
||||
|
||||
function useRenderTimes(props, debug) {
|
||||
// Render times
|
||||
const timesRef = React.useRef(0);
|
||||
timesRef.current += 1;
|
||||
|
||||
// Props changed
|
||||
const propsRef = React.useRef(props);
|
||||
const keys = [];
|
||||
Object.keys(props || {}).map(key => {
|
||||
if (props?.[key] !== propsRef.current?.[key]) {
|
||||
keys.push(key);
|
||||
}
|
||||
});
|
||||
propsRef.current = props;
|
||||
|
||||
// Cache keys since React rerender may cause it lost
|
||||
const keysRef = React.useRef([]);
|
||||
if (keys.length) {
|
||||
keysRef.current = keys;
|
||||
}
|
||||
React.useDebugValue(timesRef.current);
|
||||
React.useDebugValue(keysRef.current.join(', '));
|
||||
if (debug) {
|
||||
console.log(`${debug}:`, timesRef.current, keysRef.current);
|
||||
}
|
||||
return timesRef.current;
|
||||
}
|
||||
var _default = exports.default = process.env.NODE_ENV !== 'production' ? useRenderTimes : () => {};
|
||||
const RenderBlock = exports.RenderBlock = /*#__PURE__*/React.memo(() => {
|
||||
const times = useRenderTimes();
|
||||
return /*#__PURE__*/React.createElement("h1", null, "Render Times: ", times);
|
||||
});
|
||||
if (process.env.NODE_ENV !== 'production') {
|
||||
RenderBlock.displayName = 'RenderBlock';
|
||||
}
|
||||
+12
@@ -0,0 +1,12 @@
|
||||
/// <reference types="react" />
|
||||
import type { TableContextProps } from '../context/TableContext';
|
||||
export default function useRowInfo<RecordType>(record: RecordType, rowKey: React.Key, recordIndex: number, indent: number): Pick<TableContextProps, 'prefixCls' | 'fixedInfoList' | 'flattenColumns' | 'expandableType' | 'expandRowByClick' | 'onTriggerExpand' | 'rowClassName' | 'expandedRowClassName' | 'indentSize' | 'expandIcon' | 'expandedRowRender' | 'expandIconColumnIndex' | 'expandedKeys' | 'childrenColumnName' | 'onRow'> & {
|
||||
columnsKey: React.Key[];
|
||||
nestExpandable: boolean;
|
||||
expanded: boolean;
|
||||
hasNestChildren: boolean;
|
||||
record: RecordType;
|
||||
rowSupportExpand: boolean;
|
||||
expandable: boolean;
|
||||
rowProps: React.HTMLAttributes<any> & React.TdHTMLAttributes<any>;
|
||||
};
|
||||
+72
@@ -0,0 +1,72 @@
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = useRowInfo;
|
||||
var _context = require("@rc-component/context");
|
||||
var _TableContext = _interopRequireDefault(require("../context/TableContext"));
|
||||
var _valueUtil = require("../utils/valueUtil");
|
||||
var _util = require("@rc-component/util");
|
||||
var _clsx = require("clsx");
|
||||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
||||
function useRowInfo(record, rowKey, recordIndex, indent) {
|
||||
const context = (0, _context.useContext)(_TableContext.default, ['prefixCls', 'fixedInfoList', 'flattenColumns', 'expandableType', 'expandRowByClick', 'onTriggerExpand', 'rowClassName', 'expandedRowClassName', 'indentSize', 'expandIcon', 'expandedRowRender', 'expandIconColumnIndex', 'expandedKeys', 'childrenColumnName', 'rowExpandable', 'onRow']);
|
||||
const {
|
||||
flattenColumns,
|
||||
expandableType,
|
||||
expandedKeys,
|
||||
childrenColumnName,
|
||||
onTriggerExpand,
|
||||
rowExpandable,
|
||||
onRow,
|
||||
expandRowByClick,
|
||||
rowClassName
|
||||
} = context;
|
||||
|
||||
// ======================= Expandable =======================
|
||||
// Only when row is not expandable and `children` exist in record
|
||||
const nestExpandable = expandableType === 'nest';
|
||||
const rowSupportExpand = expandableType === 'row' && (!rowExpandable || rowExpandable(record));
|
||||
const mergedExpandable = rowSupportExpand || nestExpandable;
|
||||
const expanded = expandedKeys && expandedKeys.has(rowKey);
|
||||
const hasNestChildren = childrenColumnName && record && record[childrenColumnName];
|
||||
const onInternalTriggerExpand = (0, _util.useEvent)(onTriggerExpand);
|
||||
|
||||
// ========================= onRow ==========================
|
||||
const rowProps = onRow?.(record, recordIndex);
|
||||
const onRowClick = rowProps?.onClick;
|
||||
const onClick = (event, ...args) => {
|
||||
if (expandRowByClick && mergedExpandable) {
|
||||
onTriggerExpand(record, event);
|
||||
}
|
||||
onRowClick?.(event, ...args);
|
||||
};
|
||||
|
||||
// ====================== RowClassName ======================
|
||||
let computeRowClassName;
|
||||
if (typeof rowClassName === 'string') {
|
||||
computeRowClassName = rowClassName;
|
||||
} else if (typeof rowClassName === 'function') {
|
||||
computeRowClassName = rowClassName(record, recordIndex, indent);
|
||||
}
|
||||
|
||||
// ========================= Column =========================
|
||||
const columnsKey = (0, _valueUtil.getColumnsKey)(flattenColumns);
|
||||
return {
|
||||
...context,
|
||||
columnsKey,
|
||||
nestExpandable,
|
||||
expanded,
|
||||
hasNestChildren,
|
||||
record,
|
||||
onTriggerExpand: onInternalTriggerExpand,
|
||||
rowSupportExpand,
|
||||
expandable: mergedExpandable,
|
||||
rowProps: {
|
||||
...rowProps,
|
||||
className: (0, _clsx.clsx)(computeRowClassName, rowProps?.className),
|
||||
onClick
|
||||
}
|
||||
};
|
||||
}
|
||||
+10
@@ -0,0 +1,10 @@
|
||||
import type { TableSticky } from '../interface';
|
||||
/** Sticky header hooks */
|
||||
export default function useSticky(sticky: boolean | TableSticky, prefixCls: string): {
|
||||
isSticky: boolean;
|
||||
offsetHeader: number;
|
||||
offsetSummary: number;
|
||||
offsetScroll: number;
|
||||
stickyClassName: string;
|
||||
container: Window | HTMLElement;
|
||||
};
|
||||
+35
@@ -0,0 +1,35 @@
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = useSticky;
|
||||
var React = _interopRequireWildcard(require("react"));
|
||||
var _canUseDom = _interopRequireDefault(require("@rc-component/util/lib/Dom/canUseDom"));
|
||||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
||||
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
||||
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
||||
// fix ssr render
|
||||
const defaultContainer = (0, _canUseDom.default)() ? window : null;
|
||||
|
||||
/** Sticky header hooks */
|
||||
function useSticky(sticky, prefixCls) {
|
||||
const {
|
||||
offsetHeader = 0,
|
||||
offsetSummary = 0,
|
||||
offsetScroll = 0,
|
||||
getContainer = () => defaultContainer
|
||||
} = typeof sticky === 'object' ? sticky : {};
|
||||
const container = getContainer() || defaultContainer;
|
||||
const isSticky = !!sticky;
|
||||
return React.useMemo(() => {
|
||||
return {
|
||||
isSticky,
|
||||
stickyClassName: isSticky ? `${prefixCls}-sticky-holder` : '',
|
||||
offsetHeader,
|
||||
offsetSummary,
|
||||
offsetScroll,
|
||||
container
|
||||
};
|
||||
}, [isSticky, offsetScroll, offsetHeader, offsetSummary, prefixCls, container]);
|
||||
}
|
||||
+6
@@ -0,0 +1,6 @@
|
||||
import type { ColumnType, StickyOffsets } from '../interface';
|
||||
/**
|
||||
* Get sticky column offset width
|
||||
*/
|
||||
declare function useStickyOffsets<RecordType>(colWidths: number[], flattenColumns: readonly ColumnType<RecordType>[]): StickyOffsets;
|
||||
export default useStickyOffsets;
|
||||
+35
@@ -0,0 +1,35 @@
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = void 0;
|
||||
var _react = require("react");
|
||||
/**
|
||||
* Get sticky column offset width
|
||||
*/
|
||||
function useStickyOffsets(colWidths, flattenColumns) {
|
||||
const stickyOffsets = (0, _react.useMemo)(() => {
|
||||
const columnCount = flattenColumns.length;
|
||||
const getOffsets = (startIndex, endIndex, offset) => {
|
||||
const offsets = [];
|
||||
let total = 0;
|
||||
for (let i = startIndex; i !== endIndex; i += offset) {
|
||||
offsets.push(total);
|
||||
if (flattenColumns[i].fixed) {
|
||||
total += colWidths[i] || 0;
|
||||
}
|
||||
}
|
||||
return offsets;
|
||||
};
|
||||
const startOffsets = getOffsets(0, columnCount, 1);
|
||||
const endOffsets = getOffsets(columnCount - 1, -1, -1).reverse();
|
||||
return {
|
||||
start: startOffsets,
|
||||
end: endOffsets,
|
||||
widths: colWidths
|
||||
};
|
||||
}, [colWidths, flattenColumns]);
|
||||
return stickyOffsets;
|
||||
}
|
||||
var _default = exports.default = useStickyOffsets;
|
||||
Reference in New Issue
Block a user