This commit is contained in:
2026-05-25 17:08:18 +08:00
parent df501f6151
commit f1259b71b5
9178 changed files with 1626125 additions and 0 deletions
@@ -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;
@@ -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;
@@ -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];
@@ -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]);
}
@@ -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>
];
@@ -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];
}
@@ -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[];
@@ -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));
}
@@ -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>[];
@@ -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;
}
@@ -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
View File
@@ -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];
}
@@ -0,0 +1,2 @@
export type OnHover = (start: number, end: number) => void;
export default function useHover(): [startRow: number, endRow: number, onHover: OnHover];
+18
View File
@@ -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];
}
@@ -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>;
@@ -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';
}
@@ -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>;
};
@@ -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
}
};
}
@@ -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;
};
@@ -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]);
}
@@ -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;
@@ -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;