@aloudata/aloudata-design 3.1.6 → 3.2.0-beta.0

package/dist/Table/hooks/useExpandable.js

@@ -1,73 +1,187 @@
 import { getRowKey } from "../helper.js";
-import { useCallback, useEffect, useMemo, useState } from "react";
+import { c } from "react-compiler-runtime";
+import { useEffect, useState } from "react";
 import _ from "lodash";
 //#region src/Table/hooks/useExpandable.ts
 function useExpandable(props) {
+	const $ = c(55);
 	const { expandable: propsExpandable, data, rowKey } = props;
-	const expandable = getExpandableConfig(propsExpandable);
-	if (!!propsExpandable && !rowKey) throw new Error("rowKey is necessary when expandable is enabled, but is missing");
-	const { expandedRowKeys, onExpand: propsOnExpand, defaultExpandAllRows = true, defaultExpandedRowKeys, childrenColumnName, expandedRowRender } = expandable;
-	const columnName = getChildrenColumnName(childrenColumnName);
-	const flattenList = useMemo(() => flattenChildren(data, columnName), [columnName, data]);
+	let childrenColumnName;
+	let defaultExpandAllRows;
+	let defaultExpandedRowKeys;
+	let expandedRowKeys;
+	let expandedRowRender;
+	let propsOnExpand;
+	let t0;
+	if ($[0] !== propsExpandable || $[1] !== rowKey) {
+		const expandable = getExpandableConfig(propsExpandable);
+		if (!!propsExpandable && !rowKey) throw new Error("rowKey is necessary when expandable is enabled, but is missing");
+		const { expandedRowKeys: t1, onExpand: t2, defaultExpandAllRows: t3, defaultExpandedRowKeys: t4, childrenColumnName: t5, expandedRowRender: t6 } = expandable;
+		expandedRowKeys = t1;
+		propsOnExpand = t2;
+		defaultExpandedRowKeys = t4;
+		childrenColumnName = t5;
+		expandedRowRender = t6;
+		defaultExpandAllRows = t3 === void 0 ? true : t3;
+		t0 = getChildrenColumnName(childrenColumnName);
+		$[0] = propsExpandable;
+		$[1] = rowKey;
+		$[2] = childrenColumnName;
+		$[3] = defaultExpandAllRows;
+		$[4] = defaultExpandedRowKeys;
+		$[5] = expandedRowKeys;
+		$[6] = expandedRowRender;
+		$[7] = propsOnExpand;
+		$[8] = t0;
+	} else {
+		childrenColumnName = $[2];
+		defaultExpandAllRows = $[3];
+		defaultExpandedRowKeys = $[4];
+		expandedRowKeys = $[5];
+		expandedRowRender = $[6];
+		propsOnExpand = $[7];
+		t0 = $[8];
+	}
+	const columnName = t0;
+	let t1;
+	if ($[9] !== columnName || $[10] !== data) {
+		t1 = flattenChildren(data, columnName);
+		$[9] = columnName;
+		$[10] = data;
+		$[11] = t1;
+	} else t1 = $[11];
+	const flattenList = t1;
 	const isRenderCustomExpandRow = !!expandedRowRender;
-	const allCategoryRowKeys = useMemo(() => {
-		return getAllExpandRowKeys(flattenList, columnName, isRenderCustomExpandRow, defaultExpandAllRows, rowKey);
-	}, [
-		columnName,
-		flattenList,
-		defaultExpandAllRows,
-		rowKey,
-		isRenderCustomExpandRow
-	]);
-	const [expandedKeys, setExpandedKeys] = useState(expandedRowKeys || defaultExpandedRowKeys || allCategoryRowKeys || []);
-	const expandItemMap = useMemo(() => {
-		const listData = data.map((dataItem) => getListItemsByTree(dataItem, expandedKeys, !!expandedRowRender, rowKey, childrenColumnName)).flat();
-		return _.keyBy(listData, (dataItem) => dataItem.rowKey);
-	}, [
-		childrenColumnName,
-		data,
-		expandedKeys,
-		rowKey,
-		expandedRowRender
-	]);
-	useEffect(() => {
-		if (expandedRowKeys) setExpandedKeys(expandedRowKeys);
-	}, [expandedRowKeys]);
-	const onExpand = useCallback((dataItem, isExpanded) => {
-		const key = getRowKey(dataItem, rowKey);
-		if (!expandedRowKeys) setExpandedKeys((prev) => {
-			if (isExpanded) return [...prev, key];
-			else return prev.filter((expandedKey) => expandedKey !== key);
-		});
-		propsOnExpand?.(dataItem, isExpanded);
-	}, [
-		propsOnExpand,
-		rowKey,
-		expandedRowKeys
-	]);
-	const visibleList = useMemo(() => {
-		return flattenList.filter((dataItem) => {
-			return !!expandItemMap[getRowKey(dataItem, rowKey)];
-		});
-	}, [
-		expandItemMap,
-		flattenList,
-		rowKey
-	]);
-	if (!propsExpandable) return {
-		expandItemMap: {},
-		onExpand: () => {},
-		isExpandable: false,
-		data,
-		flattenData: void 0
-	};
-	return {
-		expandItemMap,
-		onExpand,
-		isExpandable: true,
-		data: visibleList,
-		flattenData: flattenList
-	};
+	let t2;
+	if ($[12] !== columnName || $[13] !== defaultExpandAllRows || $[14] !== flattenList || $[15] !== isRenderCustomExpandRow || $[16] !== rowKey) {
+		t2 = getAllExpandRowKeys(flattenList, columnName, isRenderCustomExpandRow, defaultExpandAllRows, rowKey);
+		$[12] = columnName;
+		$[13] = defaultExpandAllRows;
+		$[14] = flattenList;
+		$[15] = isRenderCustomExpandRow;
+		$[16] = rowKey;
+		$[17] = t2;
+	} else t2 = $[17];
+	const allCategoryRowKeys = t2;
+	let t3;
+	if ($[18] !== allCategoryRowKeys || $[19] !== defaultExpandedRowKeys || $[20] !== expandedRowKeys) {
+		t3 = expandedRowKeys || defaultExpandedRowKeys || allCategoryRowKeys || [];
+		$[18] = allCategoryRowKeys;
+		$[19] = defaultExpandedRowKeys;
+		$[20] = expandedRowKeys;
+		$[21] = t3;
+	} else t3 = $[21];
+	const [expandedKeys, setExpandedKeys] = useState(t3);
+	let t4;
+	if ($[22] !== childrenColumnName || $[23] !== data || $[24] !== expandedKeys || $[25] !== expandedRowRender || $[26] !== rowKey) {
+		let t5;
+		if ($[28] !== childrenColumnName || $[29] !== expandedKeys || $[30] !== expandedRowRender || $[31] !== rowKey) {
+			t5 = (dataItem) => getListItemsByTree(dataItem, expandedKeys, !!expandedRowRender, rowKey, childrenColumnName);
+			$[28] = childrenColumnName;
+			$[29] = expandedKeys;
+			$[30] = expandedRowRender;
+			$[31] = rowKey;
+			$[32] = t5;
+		} else t5 = $[32];
+		const listData = data.map(t5).flat();
+		t4 = _.keyBy(listData, _temp);
+		$[22] = childrenColumnName;
+		$[23] = data;
+		$[24] = expandedKeys;
+		$[25] = expandedRowRender;
+		$[26] = rowKey;
+		$[27] = t4;
+	} else t4 = $[27];
+	const expandItemMap = t4;
+	let t5;
+	let t6;
+	if ($[33] !== expandedRowKeys) {
+		t5 = () => {
+			if (expandedRowKeys) setExpandedKeys(expandedRowKeys);
+		};
+		t6 = [expandedRowKeys];
+		$[33] = expandedRowKeys;
+		$[34] = t5;
+		$[35] = t6;
+	} else {
+		t5 = $[34];
+		t6 = $[35];
+	}
+	useEffect(t5, t6);
+	let t7;
+	if ($[36] !== expandedRowKeys || $[37] !== propsOnExpand || $[38] !== rowKey) {
+		t7 = (dataItem_1, isExpanded) => {
+			const key = getRowKey(dataItem_1, rowKey);
+			if (!expandedRowKeys) setExpandedKeys((prev) => {
+				if (isExpanded) return [...prev, key];
+				else return prev.filter((expandedKey) => expandedKey !== key);
+			});
+			propsOnExpand?.(dataItem_1, isExpanded);
+		};
+		$[36] = expandedRowKeys;
+		$[37] = propsOnExpand;
+		$[38] = rowKey;
+		$[39] = t7;
+	} else t7 = $[39];
+	const onExpand = t7;
+	let t8;
+	if ($[40] !== expandItemMap || $[41] !== flattenList || $[42] !== rowKey) {
+		let t9;
+		if ($[44] !== expandItemMap || $[45] !== rowKey) {
+			t9 = (dataItem_2) => {
+				return !!expandItemMap[getRowKey(dataItem_2, rowKey)];
+			};
+			$[44] = expandItemMap;
+			$[45] = rowKey;
+			$[46] = t9;
+		} else t9 = $[46];
+		t8 = flattenList.filter(t9);
+		$[40] = expandItemMap;
+		$[41] = flattenList;
+		$[42] = rowKey;
+		$[43] = t8;
+	} else t8 = $[43];
+	const visibleList = t8;
+	if (!propsExpandable) {
+		let t9;
+		if ($[47] === Symbol.for("react.memo_cache_sentinel")) {
+			t9 = {};
+			$[47] = t9;
+		} else t9 = $[47];
+		let t10;
+		if ($[48] !== data) {
+			t10 = {
+				expandItemMap: t9,
+				onExpand: _temp2,
+				isExpandable: false,
+				data,
+				flattenData: void 0
+			};
+			$[48] = data;
+			$[49] = t10;
+		} else t10 = $[49];
+		return t10;
+	}
+	let t9;
+	if ($[50] !== expandItemMap || $[51] !== flattenList || $[52] !== onExpand || $[53] !== visibleList) {
+		t9 = {
+			expandItemMap,
+			onExpand,
+			isExpandable: true,
+			data: visibleList,
+			flattenData: flattenList
+		};
+		$[50] = expandItemMap;
+		$[51] = flattenList;
+		$[52] = onExpand;
+		$[53] = visibleList;
+		$[54] = t9;
+	} else t9 = $[54];
+	return t9;
+}
+function _temp2() {}
+function _temp(dataItem_0) {
+	return dataItem_0.rowKey;
 }
 function getListItemsByTree(currNode, expandedKeys, isRenderCustomExpandRow, getKey, childrenColumnName, level = 0) {
 	const subNodes = _.get(currNode, getChildrenColumnName(childrenColumnName));

package/dist/Table/hooks/useExpandable.js.map

@@ -1 +1 @@
-{"version":3,"file":"useExpandable.js","names":[],"sources":["../../../src/Table/hooks/useExpandable.ts"],"sourcesContent":["import _ from 'lodash';\nimport { useCallback, useEffect, useMemo, useState } from 'react';\nimport { getRowKey } from '../helper';\nimport { ITableProps } from '../types';\n\nexport default function useExpandable<TDataItem extends object>(\n  props: IProps<TDataItem>,\n): IExpandableInfo<TDataItem> {\n  const { expandable: propsExpandable, data, rowKey } = props;\n\n  const expandable = getExpandableConfig(propsExpandable);\n\n  if (!!propsExpandable && !rowKey) {\n    throw new Error(\n      'rowKey is necessary when expandable is enabled, but is missing',\n    );\n  }\n\n  const {\n    expandedRowKeys,\n    onExpand: propsOnExpand,\n    defaultExpandAllRows = true,\n    defaultExpandedRowKeys,\n    childrenColumnName,\n    expandedRowRender,\n  } = expandable;\n\n  const columnName = getChildrenColumnName(childrenColumnName);\n  const flattenList = useMemo(\n    () => flattenChildren(data, columnName),\n    [columnName, data],\n  );\n\n  const isRenderCustomExpandRow = !!expandedRowRender;\n\n  const allCategoryRowKeys = useMemo(() => {\n    return getAllExpandRowKeys<TDataItem>(\n      flattenList,\n      columnName,\n      isRenderCustomExpandRow,\n      defaultExpandAllRows,\n      rowKey,\n    );\n  }, [\n    columnName,\n    flattenList,\n    defaultExpandAllRows,\n    rowKey,\n    isRenderCustomExpandRow,\n  ]);\n\n  // 考虑 defaultExpandAllRows 的情况\n  const [expandedKeys, setExpandedKeys] = useState(\n    expandedRowKeys || defaultExpandedRowKeys || allCategoryRowKeys || [],\n  );\n\n  // 只有在 Map 中的存在 rowKey 的数据行才可见\n  const expandItemMap = useMemo(() => {\n    const listData = data\n      .map((dataItem) =>\n        getListItemsByTree<TDataItem>(\n          dataItem,\n          expandedKeys,\n          !!expandedRowRender,\n          rowKey,\n          childrenColumnName,\n        ),\n      )\n      .flat();\n    return _.keyBy(listData, (dataItem) => dataItem.rowKey);\n  }, [childrenColumnName, data, expandedKeys, rowKey, expandedRowRender]);\n\n  useEffect(() => {\n    if (expandedRowKeys) {\n      // 展开收起完全受控的情况\n      setExpandedKeys(expandedRowKeys);\n    }\n  }, [expandedRowKeys]);\n\n  const onExpand = useCallback(\n    (dataItem: TDataItem, isExpanded: boolean) => {\n      const key = getRowKey(dataItem, rowKey);\n      if (!expandedRowKeys) {\n        setExpandedKeys((prev) => {\n          if (isExpanded) {\n            // 展开\n            return [...prev, key];\n          } else {\n            // 折叠\n            return prev.filter((expandedKey) => expandedKey !== key);\n          }\n        });\n      }\n      propsOnExpand?.(dataItem, isExpanded);\n    },\n    [propsOnExpand, rowKey, expandedRowKeys],\n  );\n\n  const visibleList = useMemo(() => {\n    return flattenList.filter((dataItem) => {\n      const key = getRowKey(dataItem, rowKey);\n      // 不在 Map 中的行，即表示被折叠了\n      return !!expandItemMap[key];\n    });\n  }, [expandItemMap, flattenList, rowKey]);\n\n  if (!propsExpandable) {\n    return {\n      expandItemMap: {},\n      onExpand: () => {},\n      isExpandable: false,\n      data,\n      flattenData: undefined,\n    };\n  }\n\n  return {\n    expandItemMap,\n    onExpand,\n    isExpandable: true,\n    data: visibleList,\n    flattenData: flattenList,\n  };\n}\n\nfunction getListItemsByTree<TDataItem extends object>(\n  currNode: TDataItem,\n  expandedKeys: string[],\n  isRenderCustomExpandRow: boolean, // 是否渲染自定义展开行\n  getKey?: ITableProps<TDataItem>['rowKey'],\n  childrenColumnName?: string,\n  level: number = 0,\n): IExpandItem[] {\n  const subNodes = _.get(\n    currNode,\n    getChildrenColumnName(childrenColumnName),\n  ) as TDataItem[] | undefined;\n  const isLeaf = !subNodes;\n  const rowKey = getRowKey(currNode, getKey);\n  const isExpanded = expandedKeys.includes(rowKey);\n\n  if (isLeaf) {\n    const leafNode: IExpandItem = {\n      isLeaf: true,\n      level,\n      rowKey,\n    };\n    if (isRenderCustomExpandRow) {\n      leafNode.isLeaf = false;\n      const customExpandRowKey = getCustomExpandRowKey(rowKey);\n      leafNode.customExpandRowKey = customExpandRowKey;\n      leafNode.isExpanded = isExpanded;\n      return [leafNode];\n    }\n    return [leafNode];\n  }\n  // 是目录的情况\n  const curr: IExpandItem = {\n    isLeaf: false,\n    level,\n    rowKey,\n  };\n  if (!isExpanded) {\n    curr.isExpanded = false;\n    return [curr];\n  }\n  curr.isExpanded = true;\n  // 子目录是展开的情况\n  const subItems =\n    subNodes?.map((child) => {\n      return getListItemsByTree(\n        child,\n        expandedKeys,\n        isRenderCustomExpandRow,\n        getKey,\n        childrenColumnName,\n        level + 1,\n      );\n    }) || [];\n  return [curr, ..._.flatten(subItems)];\n}\n\n/**\n * 为自定义展开行生成唯一的 key\n * @param rowKey\n * @returns\n */\nfunction getCustomExpandRowKey(rowKey: string) {\n  return `${rowKey}-expand`;\n}\n\nexport function getExpandableConfig<TDataItem extends object>(\n  expandable: ITableProps<TDataItem>['expandable'],\n) {\n  if (typeof expandable === 'boolean') {\n    return {};\n  }\n  return expandable || {};\n}\n\nfunction getAllExpandRowKeys<TDataItem extends object>(\n  list: TDataItem[],\n  childrenColumnName: string,\n  isRenderCustomExpandRow: boolean,\n  defaultExpandAllRows?: boolean,\n  rowKey?: ITableProps<TDataItem>['rowKey'],\n) {\n  if (!defaultExpandAllRows) {\n    return undefined;\n  }\n  if (isRenderCustomExpandRow) {\n    // 自定义展开行的情况，即使是叶子节点也可以展开\n    return list.map((item) => getRowKey(item, rowKey));\n  }\n  const itemsWithChildrenProp = list.filter(\n    (item) => !!_.get(item, childrenColumnName),\n  );\n  return itemsWithChildrenProp.map((item) => getRowKey(item, rowKey));\n}\n\ninterface TreeNode<T> {\n  [key: string]: any;\n  children?: T[];\n}\n\nfunction flattenChildren<T extends TreeNode<T>>(\n  nodes: T[],\n  childKey: string,\n): T[] {\n  return _.flatMapDeep(nodes, (node: T): T[] => {\n    const children: T[] = node[childKey] as T[];\n    if (children && children.length > 0) {\n      return [node, ...flattenChildren(children, childKey)];\n    }\n    return [node];\n  });\n}\n\nfunction getChildrenColumnName(childrenColumnName?: string) {\n  return childrenColumnName || 'children';\n}\n\nexport interface IExpandableInfo<TDataItem extends object> {\n  expandItemMap: IExpandItemMap;\n  onExpand: (record: TDataItem, isExpanded: boolean) => void;\n  isExpandable: boolean;\n  data: TDataItem[];\n  flattenData?: TDataItem[];\n}\n\nexport interface IExpandItem {\n  isLeaf: boolean; // 是否叶子节点\n  isExpanded?: boolean; // 是否展开\n  level: number; // 缩进层级\n  rowKey: string; // 行的唯一标识\n  customExpandRowKey?: string; // 本节点下面自定义展开行的 rowKey\n}\n\ninterface IExpandItemMap {\n  [key: string]: IExpandItem;\n}\n\ninterface IProps<TDataItem extends object> {\n  expandable: ITableProps<TDataItem>['expandable'];\n  data: ITableProps<TDataItem>['data'];\n  rowKey: ITableProps<TDataItem>['rowKey'];\n}\n"],"mappings":"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"}
+{"version":3,"file":"useExpandable.js","names":["_","useCallback","useEffect","useMemo","useState","getRowKey","ITableProps","useExpandable","props","$","_c","expandable","propsExpandable","data","rowKey","childrenColumnName","defaultExpandAllRows","defaultExpandedRowKeys","expandedRowKeys","expandedRowRender","propsOnExpand","t0","getExpandableConfig","Error","t1","onExpand","t2","t3","t4","t5","t6","undefined","getChildrenColumnName","columnName","flattenChildren","flattenList","isRenderCustomExpandRow","getAllExpandRowKeys","allCategoryRowKeys","expandedKeys","setExpandedKeys","dataItem","getListItemsByTree","listData","map","flat","keyBy","_temp","expandItemMap","t7","dataItem_1","isExpanded","key","prev","filter","expandedKey","t8","t9","dataItem_2","key_0","visibleList","Symbol","for","t10","_temp2","isExpandable","flattenData","dataItem_0","currNode","TDataItem","getKey","level","IExpandItem","subNodes","get","isLeaf","includes","leafNode","customExpandRowKey","getCustomExpandRowKey","curr","subItems","child","flatten","list","item","itemsWithChildrenProp","TreeNode","children","T","nodes","childKey","flatMapDeep","node","length","IExpandableInfo","IExpandItemMap","record","IProps"],"sources":["../../../src/Table/hooks/useExpandable.ts"],"sourcesContent":["import _ from 'lodash';\nimport { useCallback, useEffect, useMemo, useState } from 'react';\nimport { getRowKey } from '../helper';\nimport { ITableProps } from '../types';\n\nexport default function useExpandable<TDataItem extends object>(\n  props: IProps<TDataItem>,\n): IExpandableInfo<TDataItem> {\n  const { expandable: propsExpandable, data, rowKey } = props;\n\n  const expandable = getExpandableConfig(propsExpandable);\n\n  if (!!propsExpandable && !rowKey) {\n    throw new Error(\n      'rowKey is necessary when expandable is enabled, but is missing',\n    );\n  }\n\n  const {\n    expandedRowKeys,\n    onExpand: propsOnExpand,\n    defaultExpandAllRows = true,\n    defaultExpandedRowKeys,\n    childrenColumnName,\n    expandedRowRender,\n  } = expandable;\n\n  const columnName = getChildrenColumnName(childrenColumnName);\n  const flattenList = useMemo(\n    () => flattenChildren(data, columnName),\n    [columnName, data],\n  );\n\n  const isRenderCustomExpandRow = !!expandedRowRender;\n\n  const allCategoryRowKeys = useMemo(() => {\n    return getAllExpandRowKeys<TDataItem>(\n      flattenList,\n      columnName,\n      isRenderCustomExpandRow,\n      defaultExpandAllRows,\n      rowKey,\n    );\n  }, [\n    columnName,\n    flattenList,\n    defaultExpandAllRows,\n    rowKey,\n    isRenderCustomExpandRow,\n  ]);\n\n  // 考虑 defaultExpandAllRows 的情况\n  const [expandedKeys, setExpandedKeys] = useState(\n    expandedRowKeys || defaultExpandedRowKeys || allCategoryRowKeys || [],\n  );\n\n  // 只有在 Map 中的存在 rowKey 的数据行才可见\n  const expandItemMap = useMemo(() => {\n    const listData = data\n      .map((dataItem) =>\n        getListItemsByTree<TDataItem>(\n          dataItem,\n          expandedKeys,\n          !!expandedRowRender,\n          rowKey,\n          childrenColumnName,\n        ),\n      )\n      .flat();\n    return _.keyBy(listData, (dataItem) => dataItem.rowKey);\n  }, [childrenColumnName, data, expandedKeys, rowKey, expandedRowRender]);\n\n  useEffect(() => {\n    if (expandedRowKeys) {\n      // 展开收起完全受控的情况\n      setExpandedKeys(expandedRowKeys);\n    }\n  }, [expandedRowKeys]);\n\n  const onExpand = useCallback(\n    (dataItem: TDataItem, isExpanded: boolean) => {\n      const key = getRowKey(dataItem, rowKey);\n      if (!expandedRowKeys) {\n        setExpandedKeys((prev) => {\n          if (isExpanded) {\n            // 展开\n            return [...prev, key];\n          } else {\n            // 折叠\n            return prev.filter((expandedKey) => expandedKey !== key);\n          }\n        });\n      }\n      propsOnExpand?.(dataItem, isExpanded);\n    },\n    [propsOnExpand, rowKey, expandedRowKeys],\n  );\n\n  const visibleList = useMemo(() => {\n    return flattenList.filter((dataItem) => {\n      const key = getRowKey(dataItem, rowKey);\n      // 不在 Map 中的行，即表示被折叠了\n      return !!expandItemMap[key];\n    });\n  }, [expandItemMap, flattenList, rowKey]);\n\n  if (!propsExpandable) {\n    return {\n      expandItemMap: {},\n      onExpand: () => {},\n      isExpandable: false,\n      data,\n      flattenData: undefined,\n    };\n  }\n\n  return {\n    expandItemMap,\n    onExpand,\n    isExpandable: true,\n    data: visibleList,\n    flattenData: flattenList,\n  };\n}\n\nfunction getListItemsByTree<TDataItem extends object>(\n  currNode: TDataItem,\n  expandedKeys: string[],\n  isRenderCustomExpandRow: boolean, // 是否渲染自定义展开行\n  getKey?: ITableProps<TDataItem>['rowKey'],\n  childrenColumnName?: string,\n  level: number = 0,\n): IExpandItem[] {\n  const subNodes = _.get(\n    currNode,\n    getChildrenColumnName(childrenColumnName),\n  ) as TDataItem[] | undefined;\n  const isLeaf = !subNodes;\n  const rowKey = getRowKey(currNode, getKey);\n  const isExpanded = expandedKeys.includes(rowKey);\n\n  if (isLeaf) {\n    const leafNode: IExpandItem = {\n      isLeaf: true,\n      level,\n      rowKey,\n    };\n    if (isRenderCustomExpandRow) {\n      leafNode.isLeaf = false;\n      const customExpandRowKey = getCustomExpandRowKey(rowKey);\n      leafNode.customExpandRowKey = customExpandRowKey;\n      leafNode.isExpanded = isExpanded;\n      return [leafNode];\n    }\n    return [leafNode];\n  }\n  // 是目录的情况\n  const curr: IExpandItem = {\n    isLeaf: false,\n    level,\n    rowKey,\n  };\n  if (!isExpanded) {\n    curr.isExpanded = false;\n    return [curr];\n  }\n  curr.isExpanded = true;\n  // 子目录是展开的情况\n  const subItems =\n    subNodes?.map((child) => {\n      return getListItemsByTree(\n        child,\n        expandedKeys,\n        isRenderCustomExpandRow,\n        getKey,\n        childrenColumnName,\n        level + 1,\n      );\n    }) || [];\n  return [curr, ..._.flatten(subItems)];\n}\n\n/**\n * 为自定义展开行生成唯一的 key\n * @param rowKey\n * @returns\n */\nfunction getCustomExpandRowKey(rowKey: string) {\n  return `${rowKey}-expand`;\n}\n\nexport function getExpandableConfig<TDataItem extends object>(\n  expandable: ITableProps<TDataItem>['expandable'],\n) {\n  if (typeof expandable === 'boolean') {\n    return {};\n  }\n  return expandable || {};\n}\n\nfunction getAllExpandRowKeys<TDataItem extends object>(\n  list: TDataItem[],\n  childrenColumnName: string,\n  isRenderCustomExpandRow: boolean,\n  defaultExpandAllRows?: boolean,\n  rowKey?: ITableProps<TDataItem>['rowKey'],\n) {\n  if (!defaultExpandAllRows) {\n    return undefined;\n  }\n  if (isRenderCustomExpandRow) {\n    // 自定义展开行的情况，即使是叶子节点也可以展开\n    return list.map((item) => getRowKey(item, rowKey));\n  }\n  const itemsWithChildrenProp = list.filter(\n    (item) => !!_.get(item, childrenColumnName),\n  );\n  return itemsWithChildrenProp.map((item) => getRowKey(item, rowKey));\n}\n\ninterface TreeNode<T> {\n  [key: string]: any;\n  children?: T[];\n}\n\nfunction flattenChildren<T extends TreeNode<T>>(\n  nodes: T[],\n  childKey: string,\n): T[] {\n  return _.flatMapDeep(nodes, (node: T): T[] => {\n    const children: T[] = node[childKey] as T[];\n    if (children && children.length > 0) {\n      return [node, ...flattenChildren(children, childKey)];\n    }\n    return [node];\n  });\n}\n\nfunction getChildrenColumnName(childrenColumnName?: string) {\n  return childrenColumnName || 'children';\n}\n\nexport interface IExpandableInfo<TDataItem extends object> {\n  expandItemMap: IExpandItemMap;\n  onExpand: (record: TDataItem, isExpanded: boolean) => void;\n  isExpandable: boolean;\n  data: TDataItem[];\n  flattenData?: TDataItem[];\n}\n\nexport interface IExpandItem {\n  isLeaf: boolean; // 是否叶子节点\n  isExpanded?: boolean; // 是否展开\n  level: number; // 缩进层级\n  rowKey: string; // 行的唯一标识\n  customExpandRowKey?: string; // 本节点下面自定义展开行的 rowKey\n}\n\ninterface IExpandItemMap {\n  [key: string]: IExpandItem;\n}\n\ninterface IProps<TDataItem extends object> {\n  expandable: ITableProps<TDataItem>['expandable'];\n  data: ITableProps<TDataItem>['data'];\n  rowKey: ITableProps<TDataItem>['rowKey'];\n}\n"],"mappings":";;;;;AAKA,SAAeO,cAAAC,OAAA;CAAA,MAAAC,IAAAC,EAAA,GAAA;CAGb,MAAA,EAAAC,YAAAC,iBAAAC,MAAAC,WAAsDN;CAAM,IAAAO;CAAA,IAAAC;CAAA,IAAAC;CAAA,IAAAC;CAAA,IAAAC;CAAA,IAAAC;CAAA,IAAAC;AAAA,KAAAZ,EAAA,OAAAG,mBAAAH,EAAA,OAAAK,QAAA;EAE5D,MAAAH,aAAmBW,oBAAoBV,gBAAgB;AAEvD,MAAI,CAAC,CAACA,mBAAF,CAAsBE,OACxB,OAAM,IAAIS,MACR,iEACD;EAGH,MAAA,EAAAL,iBAAAM,IAAAC,UAAAC,IAAAV,sBAAAW,IAAAV,wBAAAW,IAAAb,oBAAAc,IAAAV,mBAAAW,OAOInB;AAPJO,oBAAAM;AAAAJ,kBAAAM;AAAAT,2BAAAW;AAAAb,uBAAAc;AAAAV,sBAAAW;AAGEd,yBAAAW,OAAAI,SAAA,OAAAJ;AAMiBN,OAAAW,sBAAsBjB,mBAAmB;AAAAN,IAAA,KAAAG;AAAAH,IAAA,KAAAK;AAAAL,IAAA,KAAAM;AAAAN,IAAA,KAAAO;AAAAP,IAAA,KAAAQ;AAAAR,IAAA,KAAAS;AAAAT,IAAA,KAAAU;AAAAV,IAAA,KAAAW;AAAAX,IAAA,KAAAY;QAAA;AAAAN,uBAAAN,EAAA;AAAAO,yBAAAP,EAAA;AAAAQ,2BAAAR,EAAA;AAAAS,oBAAAT,EAAA;AAAAU,sBAAAV,EAAA;AAAAW,kBAAAX,EAAA;AAAAY,OAAAZ,EAAA;;CAA5D,MAAAwB,aAAmBZ;CAA0C,IAAAG;AAAA,KAAAf,EAAA,OAAAwB,cAAAxB,EAAA,QAAAI,MAAA;AAErDW,OAAAU,gBAAgBrB,MAAMoB,WAAW;AAAAxB,IAAA,KAAAwB;AAAAxB,IAAA,MAAAI;AAAAJ,IAAA,MAAAe;OAAAA,MAAAf,EAAA;CADzC,MAAA0B,cACQX;CAIR,MAAAY,0BAAgC,CAAC,CAACjB;CAAkB,IAAAO;AAAA,KAAAjB,EAAA,QAAAwB,cAAAxB,EAAA,QAAAO,wBAAAP,EAAA,QAAA0B,eAAA1B,EAAA,QAAA2B,2BAAA3B,EAAA,QAAAK,QAAA;AAG3CY,OAAAW,oBACLF,aACAF,YACAG,yBACApB,sBACAF,OACD;AAAAL,IAAA,MAAAwB;AAAAxB,IAAA,MAAAO;AAAAP,IAAA,MAAA0B;AAAA1B,IAAA,MAAA2B;AAAA3B,IAAA,MAAAK;AAAAL,IAAA,MAAAiB;OAAAA,MAAAjB,EAAA;CAPH,MAAA6B,qBACEZ;CAaC,IAAAC;AAAA,KAAAlB,EAAA,QAAA6B,sBAAA7B,EAAA,QAAAQ,0BAAAR,EAAA,QAAAS,iBAAA;AAIDS,OAAAT,mBAAAD,0BAAAqB,sBAAA,EAAqE;AAAA7B,IAAA,MAAA6B;AAAA7B,IAAA,MAAAQ;AAAAR,IAAA,MAAAS;AAAAT,IAAA,MAAAkB;OAAAA,MAAAlB,EAAA;CADvE,MAAA,CAAA8B,cAAAC,mBAAwCpC,SACtCuB,GACD;CAAC,IAAAC;AAAA,KAAAnB,EAAA,QAAAM,sBAAAN,EAAA,QAAAI,QAAAJ,EAAA,QAAA8B,gBAAA9B,EAAA,QAAAU,qBAAAV,EAAA,QAAAK,QAAA;EAAA,IAAAe;AAAA,MAAApB,EAAA,QAAAM,sBAAAN,EAAA,QAAA8B,gBAAA9B,EAAA,QAAAU,qBAAAV,EAAA,QAAAK,QAAA;AAKOe,SAAAY,aACHC,mBACED,UACAF,cACA,CAAC,CAACpB,mBACFL,QACAC,mBACD;AAAAN,KAAA,MAAAM;AAAAN,KAAA,MAAA8B;AAAA9B,KAAA,MAAAU;AAAAV,KAAA,MAAAK;AAAAL,KAAA,MAAAoB;QAAAA,MAAApB,EAAA;EARL,MAAAkC,WAAiB9B,KAAI+B,IACdf,GAQJ,CAAAgB,MACM;AACFjB,OAAA5B,EAAC8C,MAAOH,UAAUI,MAA8B;AAAAtC,IAAA,MAAAM;AAAAN,IAAA,MAAAI;AAAAJ,IAAA,MAAA8B;AAAA9B,IAAA,MAAAU;AAAAV,IAAA,MAAAK;AAAAL,IAAA,MAAAmB;OAAAA,MAAAnB,EAAA;CAZzD,MAAAuC,gBAYEpB;CACsE,IAAAC;CAAA,IAAAC;AAAA,KAAArB,EAAA,QAAAS,iBAAA;AAE9DW,aAAA;AACR,OAAIX,gBAEFsB,iBAAgBtB,gBAAgB;;AAEjCY,OAAA,CAACZ,gBAAgB;AAAAT,IAAA,MAAAS;AAAAT,IAAA,MAAAoB;AAAApB,IAAA,MAAAqB;QAAA;AAAAD,OAAApB,EAAA;AAAAqB,OAAArB,EAAA;;AALpBP,WAAU2B,IAKPC,GAAkB;CAAA,IAAAmB;AAAA,KAAAxC,EAAA,QAAAS,mBAAAT,EAAA,QAAAW,iBAAAX,EAAA,QAAAK,QAAA;AAGnBmC,QAAAC,YAAAC,eAAA;GACE,MAAAC,MAAY/C,UAAUoC,YAAU3B,OAAO;AACvC,OAAI,CAACI,gBACHsB,kBAAgBa,SAAA;AACd,QAAIF,WAAU,QAEL,CAAA,GAAIE,MAAMD,IAAI;QAAA,QAGdC,KAAIC,QAAQC,gBAAiBA,gBAAgBH,IAAI;KAE1D;AAEJhC,mBAAgBqB,YAAUU,WAAW;;AACtC1C,IAAA,MAAAS;AAAAT,IAAA,MAAAW;AAAAX,IAAA,MAAAK;AAAAL,IAAA,MAAAwC;OAAAA,MAAAxC,EAAA;CAfH,MAAAgB,WAAiBwB;CAiBf,IAAAO;AAAA,KAAA/C,EAAA,QAAAuC,iBAAAvC,EAAA,QAAA0B,eAAA1B,EAAA,QAAAK,QAAA;EAAA,IAAA2C;AAAA,MAAAhD,EAAA,QAAAuC,iBAAAvC,EAAA,QAAAK,QAAA;AAG0B2C,SAAAC,eAAA;AACgB,WAEjC,CAAC,CAACV,cAFG3C,UAAUoC,YAAU3B,OAAO;;AAGxCL,KAAA,MAAAuC;AAAAvC,KAAA,MAAAK;AAAAL,KAAA,MAAAgD;QAAAA,MAAAhD,EAAA;AAJM+C,OAAArB,YAAWmB,OAAQG,GAIxB;AAAAhD,IAAA,MAAAuC;AAAAvC,IAAA,MAAA0B;AAAA1B,IAAA,MAAAK;AAAAL,IAAA,MAAA+C;OAAAA,MAAA/C,EAAA;CALJ,MAAAmD,cACEJ;AAOF,KAAI,CAAC5C,iBAAe;EAAA,IAAA6C;AAAA,MAAAhD,EAAA,QAAAoD,OAAAC,IAAA,4BAAA,EAAA;AAEDL,QAAA,EAAE;AAAAhD,KAAA,MAAAgD;QAAAA,MAAAhD,EAAA;EAAA,IAAAsD;AAAA,MAAAtD,EAAA,QAAAI,MAAA;AADZkD,SAAA;IAAAf,eACUS;IAAEhC,UACPuC;IAAQC,cACJ;IAAKpD;IAAAqD,aAENnC;IACd;AAAAtB,KAAA,MAAAI;AAAAJ,KAAA,MAAAsD;QAAAA,OAAAtD,EAAA;AAAA,SANMsD;;CAOR,IAAAN;AAAA,KAAAhD,EAAA,QAAAuC,iBAAAvC,EAAA,QAAA0B,eAAA1B,EAAA,QAAAgB,YAAAhB,EAAA,QAAAmD,aAAA;AAEMH,OAAA;GAAAT;GAAAvB;GAAAwC,cAGS;GAAIpD,MACZ+C;GAAWM,aACJ/B;GACd;AAAA1B,IAAA,MAAAuC;AAAAvC,IAAA,MAAA0B;AAAA1B,IAAA,MAAAgB;AAAAhB,IAAA,MAAAmD;AAAAnD,IAAA,MAAAgD;OAAAA,MAAAhD,EAAA;AAAA,QANMgD;;AA/GM,SAAAO,SAAA;AAAA,SAAAjB,MAAAoB,YAAA;AAAA,QAgE4B1B,WAAQ3B;;AAwDnD,SAAS4B,mBACP0B,UACA7B,cACAH,yBACAkC,QACAvD,oBACAwD,QAAgB,GACD;CACf,MAAME,WAAWzE,EAAE0E,IACjBN,UACApC,sBAAsBjB,mBACxB,CAAC;CACD,MAAM4D,SAAS,CAACF;CAChB,MAAM3D,SAAST,UAAU+D,UAAUE,OAAO;CAC1C,MAAMnB,aAAaZ,aAAaqC,SAAS9D,OAAO;AAEhD,KAAI6D,QAAQ;EACV,MAAME,WAAwB;GAC5BF,QAAQ;GACRJ;GACAzD;GACD;AACD,MAAIsB,yBAAyB;AAC3ByC,YAASF,SAAS;AAElBE,YAASC,qBADkBC,sBAAsBjE,OAAO;AAExD+D,YAAS1B,aAAaA;AACtB,UAAO,CAAC0B,SAAS;;AAEnB,SAAO,CAACA,SAAS;;CAGnB,MAAMG,OAAoB;EACxBL,QAAQ;EACRJ;EACAzD;EACD;AACD,KAAI,CAACqC,YAAY;AACf6B,OAAK7B,aAAa;AAClB,SAAO,CAAC6B,KAAK;;AAEfA,MAAK7B,aAAa;CAElB,MAAM8B,WACJR,UAAU7B,KAAKsC,UAAU;AACvB,SAAOxC,mBACLwC,OACA3C,cACAH,yBACAkC,QACAvD,oBACAwD,QAAQ,EACT;GACD,IAAI,EAAE;AACV,QAAO,CAACS,MAAM,GAAGhF,EAAEmF,QAAQF,SAAS,CAAC;;;;;;;AAQvC,SAASF,sBAAsBjE,QAAgB;AAC7C,QAAO,GAAGA,OAAM;;AAGlB,SAAgBQ,oBACdX,YACA;AACA,KAAI,OAAOA,eAAe,UACxB,QAAO,EAAE;AAEX,QAAOA,cAAc,EAAE;;AAGzB,SAAS0B,oBACP+C,MACArE,oBACAqB,yBACApB,sBACAF,QACA;AACA,KAAI,CAACE,qBACH;AAEF,KAAIoB,wBAEF,QAAOgD,KAAKxC,KAAKyC,SAAShF,UAAUgF,MAAMvE,OAAO,CAAC;AAKpD,QAH8BsE,KAAK9B,QAChC+B,SAAS,CAAC,CAACrF,EAAE0E,IAAIW,MAAMtE,mBAC1B,CAAC,CAC4B6B,KAAKyC,SAAShF,UAAUgF,MAAMvE,OAAO,CAAC;;AAQrE,SAASoB,gBACPwD,OACAC,UACK;AACL,QAAO3F,EAAE4F,YAAYF,QAAQG,SAAiB;EAC5C,MAAML,WAAgBK,KAAKF;AAC3B,MAAIH,YAAYA,SAASM,SAAS,EAChC,QAAO,CAACD,MAAM,GAAG3D,gBAAgBsD,UAAUG,SAAS,CAAC;AAEvD,SAAO,CAACE,KAAK;GACb;;AAGJ,SAAS7D,sBAAsBjB,oBAA6B;AAC1D,QAAOA,sBAAsB"}

package/dist/Table/hooks/useFixed.js.map

@@ -1 +1 @@
-{"version":3,"file":"useFixed.js","names":[],"sources":["../../../src/Table/hooks/useFixed.ts"],"sourcesContent":["import { ColumnDef } from '@tanstack/react-table';\nimport { cn } from '../../lib/utils';\nimport { useCallback } from 'react';\nimport { prefixCls } from '../helper';\nimport { IInnerTableColumn } from '../types';\n\nexport default function useFixed<TDataItem>({\n  columnWidths,\n  tableColumns,\n  y,\n  scrollbarWidth,\n}: {\n  columnWidths: number[];\n  tableColumns: Array<ColumnDef<TDataItem, unknown>>;\n  y?: string | number;\n  scrollbarWidth: number;\n}) {\n  return useCallback(\n    (index: number, isHeader: boolean = false) => {\n      const column = tableColumns[index];\n      const { fixed } = column.meta as IInnerTableColumn;\n      const previousFixed = (\n        tableColumns[index - 1]?.meta as IInnerTableColumn | undefined\n      )?.fixed;\n      const nextFixed = (\n        tableColumns[index + 1]?.meta as IInnerTableColumn | undefined\n      )?.fixed;\n\n      const style: React.CSSProperties = {};\n      if (fixed === 'left') {\n        style.left = getFixedColumnOffset(columnWidths, index, true);\n      } else if (fixed === 'right') {\n        style.right =\n          getFixedColumnOffset(columnWidths, index, false) +\n          (isHeader && y !== undefined ? scrollbarWidth : 0);\n      }\n\n      return {\n        className: cn({\n          [prefixCls('fixed-left')]: fixed === 'left',\n          [prefixCls('fixed-left-last')]:\n            fixed === 'left' && nextFixed !== 'left',\n          [prefixCls('fixed-right')]: fixed === 'right',\n          [prefixCls('fixed-right-first')]:\n            fixed === 'right' && previousFixed !== 'right',\n        }),\n        style: style,\n        fixed,\n      };\n    },\n    [tableColumns, y, scrollbarWidth, columnWidths],\n  );\n}\n\n/**\n * 获取固定列相对边缘的偏移量\n * @param columns 所有列\n * @param index 当前列的索引\n */\nfunction getFixedColumnOffset(\n  columnWidths: number[],\n  index: number,\n  isLeft: boolean,\n) {\n  let offset = 0;\n  let relativeIndex = index;\n  const list = [...columnWidths];\n  if (!isLeft) {\n    list.reverse();\n    relativeIndex = list.length - index - 1;\n  }\n  for (let i = 0; i < relativeIndex; i++) {\n    const colWidth = columnWidths[i];\n    offset += colWidth;\n  }\n  return offset;\n}\n"],"mappings":";;;;AAMA,SAAwB,SAAoB,EAC1C,cACA,cACA,GACA,kBAMC;AACD,QAAO,aACJ,OAAe,WAAoB,UAAU;EAE5C,MAAM,EAAE,UADO,aAAa,OACH;EACzB,MAAM,iBACJ,aAAa,QAAQ,IAAI,OACxB;EACH,MAAM,aACJ,aAAa,QAAQ,IAAI,OACxB;EAEH,MAAM,QAA6B,EAAE;AACrC,MAAI,UAAU,OACZ,OAAM,OAAO,qBAAqB,cAAc,OAAO,KAAK;WACnD,UAAU,QACnB,OAAM,QACJ,qBAAqB,cAAc,OAAO,MAAM,IAC/C,YAAY,MAAM,SAAY,iBAAiB;AAGpD,SAAO;GACL,WAAW,GAAG;KACX,UAAU,aAAa,GAAG,UAAU;KACpC,UAAU,kBAAkB,GAC3B,UAAU,UAAU,cAAc;KACnC,UAAU,cAAc,GAAG,UAAU;KACrC,UAAU,oBAAoB,GAC7B,UAAU,WAAW,kBAAkB;IAC1C,CAAC;GACK;GACP;GACD;IAEH;EAAC;EAAc;EAAG;EAAgB;EAAa,CAChD;;;;;;;AAQH,SAAS,qBACP,cACA,OACA,QACA;CACA,IAAI,SAAS;CACb,IAAI,gBAAgB;CACpB,MAAM,OAAO,CAAC,GAAG,aAAa;AAC9B,KAAI,CAAC,QAAQ;AACX,OAAK,SAAS;AACd,kBAAgB,KAAK,SAAS,QAAQ;;AAExC,MAAK,IAAI,IAAI,GAAG,IAAI,eAAe,KAAK;EACtC,MAAM,WAAW,aAAa;AAC9B,YAAU;;AAEZ,QAAO"}
+{"version":3,"file":"useFixed.js","names":["ColumnDef","cn","useCallback","prefixCls","IInnerTableColumn","useFixed","columnWidths","tableColumns","y","scrollbarWidth","Array","TDataItem","index","isHeader","column","fixed","meta","previousFixed","nextFixed","style","React","CSSProperties","left","getFixedColumnOffset","right","undefined","className","isLeft","offset","relativeIndex","list","reverse","length","i","colWidth"],"sources":["../../../src/Table/hooks/useFixed.ts"],"sourcesContent":["import { ColumnDef } from '@tanstack/react-table';\nimport { cn } from '../../lib/utils';\nimport { useCallback } from 'react';\nimport { prefixCls } from '../helper';\nimport { IInnerTableColumn } from '../types';\n\nexport default function useFixed<TDataItem>({\n  columnWidths,\n  tableColumns,\n  y,\n  scrollbarWidth,\n}: {\n  columnWidths: number[];\n  tableColumns: Array<ColumnDef<TDataItem, unknown>>;\n  y?: string | number;\n  scrollbarWidth: number;\n}) {\n  return useCallback(\n    (index: number, isHeader: boolean = false) => {\n      const column = tableColumns[index];\n      const { fixed } = column.meta as IInnerTableColumn;\n      const previousFixed = (\n        tableColumns[index - 1]?.meta as IInnerTableColumn | undefined\n      )?.fixed;\n      const nextFixed = (\n        tableColumns[index + 1]?.meta as IInnerTableColumn | undefined\n      )?.fixed;\n\n      const style: React.CSSProperties = {};\n      if (fixed === 'left') {\n        style.left = getFixedColumnOffset(columnWidths, index, true);\n      } else if (fixed === 'right') {\n        style.right =\n          getFixedColumnOffset(columnWidths, index, false) +\n          (isHeader && y !== undefined ? scrollbarWidth : 0);\n      }\n\n      return {\n        className: cn({\n          [prefixCls('fixed-left')]: fixed === 'left',\n          [prefixCls('fixed-left-last')]:\n            fixed === 'left' && nextFixed !== 'left',\n          [prefixCls('fixed-right')]: fixed === 'right',\n          [prefixCls('fixed-right-first')]:\n            fixed === 'right' && previousFixed !== 'right',\n        }),\n        style: style,\n        fixed,\n      };\n    },\n    [tableColumns, y, scrollbarWidth, columnWidths],\n  );\n}\n\n/**\n * 获取固定列相对边缘的偏移量\n * @param columns 所有列\n * @param index 当前列的索引\n */\nfunction getFixedColumnOffset(\n  columnWidths: number[],\n  index: number,\n  isLeft: boolean,\n) {\n  let offset = 0;\n  let relativeIndex = index;\n  const list = [...columnWidths];\n  if (!isLeft) {\n    list.reverse();\n    relativeIndex = list.length - index - 1;\n  }\n  for (let i = 0; i < relativeIndex; i++) {\n    const colWidth = columnWidths[i];\n    offset += colWidth;\n  }\n  return offset;\n}\n"],"mappings":";;;;AAMA,SAAwBK,SAAoB,EAC1CC,cACAC,cACAC,GACAC,kBAMC;AACD,QAAOP,aACJU,OAAeC,WAAoB,UAAU;EAE5C,MAAM,EAAEE,UADOR,aAAaK,OACHI;EACzB,MAAMC,iBACJV,aAAaK,QAAQ,IAAII,OACxBD;EACH,MAAMG,aACJX,aAAaK,QAAQ,IAAII,OACxBD;EAEH,MAAMI,QAA6B,EAAE;AACrC,MAAIJ,UAAU,OACZI,OAAMG,OAAOC,qBAAqBjB,cAAcM,OAAO,KAAK;WACnDG,UAAU,QACnBI,OAAMK,QACJD,qBAAqBjB,cAAcM,OAAO,MAAM,IAC/CC,YAAYL,MAAMiB,SAAYhB,iBAAiB;AAGpD,SAAO;GACLiB,WAAWzB,GAAG;KACXE,UAAU,aAAa,GAAGY,UAAU;KACpCZ,UAAU,kBAAkB,GAC3BY,UAAU,UAAUG,cAAc;KACnCf,UAAU,cAAc,GAAGY,UAAU;KACrCZ,UAAU,oBAAoB,GAC7BY,UAAU,WAAWE,kBAAkB;IAC1C,CAAC;GACKE;GACPJ;GACD;IAEH;EAACR;EAAcC;EAAGC;EAAgBH;EACpC,CAAC;;;;;;;AAQH,SAASiB,qBACPjB,cACAM,OACAe,QACA;CACA,IAAIC,SAAS;CACb,IAAIC,gBAAgBjB;CACpB,MAAMkB,OAAO,CAAC,GAAGxB,aAAa;AAC9B,KAAI,CAACqB,QAAQ;AACXG,OAAKC,SAAS;AACdF,kBAAgBC,KAAKE,SAASpB,QAAQ;;AAExC,MAAK,IAAIqB,IAAI,GAAGA,IAAIJ,eAAeI,KAAK;EACtC,MAAMC,WAAW5B,aAAa2B;AAC9BL,YAAUM;;AAEZ,QAAON"}

package/dist/Table/hooks/useRowDnd.d.ts

@@ -1,5 +1,5 @@
 import { default as React } from 'react';
-import { ITableProps } from '../types';
+import { ITableProps } from '../types.js';
 export default function useRowDnd<TDataItem extends object>(props: ITableProps<TDataItem>): IRowDndInfo<TDataItem>;
 interface IRowDndInfo<TDataItem extends object> {
     columns: ITableProps<TDataItem>['columns'];

package/dist/Table/hooks/useRowDnd.js

@@ -30,7 +30,7 @@ var DragHandle = ({ index, id, onDragging, rowRef, onDragStart, onDragComplete }
 	});
 	const [, drop] = useDrop({
 		accept: ROW_DND_TYPE,
-		hover(item, monitor) {
+		hover(item, monitor_0) {
 			const dropRef = rowRef?.current;
 			if (!dropRef) return;
 			const dragIndex = item.index;
@@ -38,7 +38,7 @@ var DragHandle = ({ index, id, onDragging, rowRef, onDragStart, onDragComplete }
 			if (dragIndex === hoverIndex) return;
 			const hoverBoundingRect = dropRef.getBoundingClientRect();
 			const hoverMiddleY = (hoverBoundingRect.bottom - hoverBoundingRect.top) / 2;
-			const clientOffset = monitor.getClientOffset();
+			const clientOffset = monitor_0.getClientOffset();
 			if (!clientOffset) return;
 			const hoverClientY = clientOffset.y - hoverBoundingRect.top;
 			if (dragIndex < hoverIndex && hoverClientY < hoverMiddleY) return;
@@ -128,14 +128,14 @@ function useRowDnd(props) {
 			dataIndex: "",
 			title: "",
 			width: 48,
-			render: (text, record, rowIndex) => {
+			render: (text, record_0, rowIndex) => {
 				return /* @__PURE__ */ jsx(DragHandle, {
 					index: rowIndex,
-					id: getRowKey(record, rowKey),
+					id: getRowKey(record_0, rowKey),
 					onDragging: handleDragging,
 					onDragStart: handleDragStart,
 					onDragComplete: handleDragComplete,
-					rowRef: getRowRef(record)
+					rowRef: getRowRef(record_0)
 				});
 			},
 			fixed: fixed ? "left" : void 0

package/dist/Table/hooks/useRowDnd.js.map

@@ -1 +1 @@
-{"version":3,"file":"useRowDnd.js","names":[],"sources":["../../../src/Table/hooks/useRowDnd.tsx"],"sourcesContent":["import DragLightLineSvg from '../../Icon/components/DragLightLine';\nimport React, { useCallback, useMemo, useRef, useState } from 'react';\nimport { useDrag, useDrop, DragSourceMonitor } from 'react-dnd';\nimport { getEmptyImage } from 'react-dnd-html5-backend';\nimport { getRowKey, hasFixedLeftColumn, prefixCls } from '../helper';\nimport { ITableColumn, ITableProps } from '../types';\nimport _ from 'lodash';\n\n// 定义拖拽项类型\nconst ROW_DND_TYPE = 'ALD_TABLE_ROW_DND_TYPE';\n\ninterface DragItem {\n  index: number;\n  id: string;\n}\n\n// 拖拽手柄组件\nconst DragHandle = ({\n  index,\n  id,\n  onDragging,\n  rowRef,\n  onDragStart,\n  onDragComplete,\n}: {\n  index: number;\n  id: string;\n  onDragging: (dragIndex: number, hoverIndex: number) => void;\n  rowRef?: React.RefObject<HTMLDivElement>;\n  onDragStart: (id: string) => void;\n  onDragComplete: () => void;\n}) => {\n  const ref = useRef<HTMLDivElement>(null);\n\n  // 使用 ref 来跟踪是否已经通知拖动开始\n  const dragStartedRef = useRef(false);\n\n  const [{ isDragging }, drag, preview] = useDrag({\n    type: ROW_DND_TYPE,\n    item: () => {\n      // 只在拖拽真正开始且尚未通知时触发一次\n      if (!dragStartedRef.current) {\n        // 通知开始拖动，传递行的ID\n        onDragStart(id);\n        dragStartedRef.current = true;\n      }\n\n      return { index, id };\n    },\n    collect: (monitor: DragSourceMonitor) => ({\n      isDragging: monitor.isDragging(),\n    }),\n    end: () => {\n      // 拖拽结束时清除拖动状态和重置标志\n      onDragComplete();\n      dragStartedRef.current = false;\n    },\n  });\n\n  const [, drop] = useDrop({\n    accept: ROW_DND_TYPE,\n    // @ts-ignore - react-dnd类型定义有时与实际用法不一致\n    hover(item: DragItem, monitor) {\n      // 如果有行引用并且行引用有值，使用行引用来判断位置\n      const dropRef = rowRef?.current;\n\n      if (!dropRef) {\n        return;\n      }\n\n      const dragIndex = item.index;\n      const hoverIndex = index;\n\n      // 如果拖动的是自己，不做任何事\n      if (dragIndex === hoverIndex) {\n        return;\n      }\n\n      // 确定鼠标位置\n      const hoverBoundingRect = dropRef.getBoundingClientRect();\n      const hoverMiddleY =\n        (hoverBoundingRect.bottom - hoverBoundingRect.top) / 2;\n      const clientOffset = monitor.getClientOffset();\n\n      if (!clientOffset) {\n        return;\n      }\n\n      const hoverClientY = clientOffset.y - hoverBoundingRect.top;\n\n      // 向下拖动，但鼠标还没过半\n      if (dragIndex < hoverIndex && hoverClientY < hoverMiddleY) {\n        return;\n      }\n\n      // 向上拖动，但鼠标还没过半\n      if (dragIndex > hoverIndex && hoverClientY > hoverMiddleY) {\n        return;\n      }\n\n      // 执行排序\n      onDragging(dragIndex, hoverIndex);\n\n      // 更新拖拽项的索引，react-dnd 官方示例推荐这样做以提高性能并避免奇怪行为\n      item.index = hoverIndex;\n    },\n  });\n\n  // 将 drag 连接到手柄 ref 上\n  drag(ref);\n\n  // 设置放置目标\n  if (rowRef?.current) {\n    drop(rowRef.current);\n  }\n\n  preview(getEmptyImage());\n\n  return (\n    <div\n      ref={ref}\n      className={prefixCls('row-dnd-item')}\n      style={{ cursor: 'move', opacity: isDragging ? 0.5 : 1 }}\n    >\n      <DragLightLineSvg />\n    </div>\n  );\n};\n\nexport default function useRowDnd<TDataItem extends object>(\n  props: ITableProps<TDataItem>,\n): IRowDndInfo<TDataItem> {\n  const { columns, rowDnd, data, rowKey } = props;\n  // 跟踪当前正在拖动的行的ID\n  const [draggingRowId, setDraggingRowId] = useState<string | null>(null);\n\n  // 为每一行创建一个 ref，使用 useMemo 缓存 Map 实例\n  const rowRefs = useMemo(\n    () => new Map<string, React.RefObject<HTMLDivElement>>(),\n    [],\n  );\n\n  // 当拖拽过程中，临时存储数据\n  const [draggingTempData, setDraggingTempData] = useState<TDataItem[]>([]);\n\n  const tableData = useMemo(() => {\n    // 拖拽过程中，使用临时数据，这样外部调用方可以不用关心拖拽过程中的数据变化\n    if (draggingRowId) {\n      return draggingTempData;\n    }\n    return data;\n  }, [data, draggingRowId, draggingTempData]);\n\n  // 获取行的 ref，用于设置拖拽预览\n  const getRowRef = useCallback(\n    (record: TDataItem) => {\n      const key = getRowKey(record, rowKey);\n      if (!rowRefs.has(key)) {\n        rowRefs.set(\n          key,\n          React.createRef<HTMLDivElement>() as React.MutableRefObject<HTMLDivElement>,\n        );\n      }\n      return rowRefs.get(key) as React.MutableRefObject<HTMLDivElement>;\n    },\n    [rowKey, rowRefs],\n  );\n\n  const defaultInfo = useMemo(() => {\n    return {\n      columns,\n      getRowRef: () => undefined,\n      draggingRowId: null,\n      tableData: data,\n    };\n  }, [columns, data]);\n\n  if (!rowDnd) {\n    return defaultInfo;\n  }\n  if (props.expandable) {\n    console.error('rowDnd and expandable mode cannot be used together');\n    return defaultInfo;\n  }\n  if (!props.rowKey) {\n    // 如果rowKey没有设置，则无法进行拖拽，因为必须知道每行的唯一标识\n    console.error('rowKey is required in rowDnd mode');\n    return defaultInfo;\n  }\n  const { fixed: rowDndFixed, onChange } = rowDnd;\n\n  const fixed = rowDndFixed || hasFixedLeftColumn(columns);\n\n  const handleDragging = (dragIndex: number, hoverIndex: number) => {\n    // 使用函数式更新，确保基于最新的状态进行操作\n    setDraggingTempData((currentData) => {\n      const newData = [...currentData];\n\n      if (dragIndex < 0 || dragIndex >= newData.length) {\n        return currentData;\n      }\n\n      const draggedRow = newData.splice(dragIndex, 1)[0];\n\n      if (draggedRow === undefined) {\n        return currentData;\n      }\n\n      // 插入到新位置\n      newData.splice(hoverIndex, 0, draggedRow);\n\n      return newData;\n    });\n  };\n\n  // 记录拖动开始\n  const handleDragStart = (id: string) => {\n    setDraggingRowId(id);\n    setDraggingTempData(_.cloneDeep(data));\n  };\n\n  // 记录拖动结束\n  const handleDragComplete = () => {\n    // 必须在清空 draggingRowId 之前先找到 draggingRow\n    // 因为 tableData 依赖 draggingRowId，清空后 tableData 会切换回原始 data\n    const draggingRow = tableData.find(\n      (item) => getRowKey(item, rowKey) === draggingRowId,\n    );\n    if (!draggingRow) {\n      // 不应该出现这种情况\n      console.error('draggingRow is not found');\n      setDraggingRowId(null);\n      return;\n    }\n    // 保存当前的 tableData，因为清空 draggingRowId 后 tableData 会变化\n    const finalData = tableData;\n    setDraggingRowId(null);\n    setDraggingTempData([]);\n    onChange(finalData, draggingRow);\n  };\n\n  const dndColumn: ITableColumn<TDataItem> = {\n    dataIndex: '',\n    title: '',\n    width: 48,\n    render: (text: unknown, record: TDataItem, rowIndex: number) => {\n      const key = getRowKey(record, rowKey);\n      const rowRef = getRowRef(record);\n      return (\n        <DragHandle\n          index={rowIndex}\n          id={key}\n          onDragging={handleDragging}\n          onDragStart={handleDragStart}\n          onDragComplete={handleDragComplete}\n          rowRef={rowRef}\n        />\n      );\n    },\n    fixed: fixed ? 'left' : undefined,\n  };\n\n  return {\n    columns: [dndColumn, ...columns],\n    getRowRef,\n    draggingRowId,\n    tableData,\n  };\n}\n\ninterface IRowDndInfo<TDataItem extends object> {\n  columns: ITableProps<TDataItem>['columns'];\n  getRowRef: (\n    record: TDataItem,\n    rowIndex: number,\n  ) => React.MutableRefObject<HTMLDivElement> | undefined;\n  draggingRowId: string | null;\n  tableData: TDataItem[];\n}\n"],"mappings":"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"}
+{"version":3,"file":"useRowDnd.js","names":["DragLightLineSvg","React","useCallback","useMemo","useRef","useState","useDrag","useDrop","DragSourceMonitor","getEmptyImage","getRowKey","hasFixedLeftColumn","prefixCls","ITableColumn","ITableProps","_","ROW_DND_TYPE","DragItem","index","id","DragHandle","onDragging","rowRef","onDragStart","onDragComplete","dragIndex","hoverIndex","RefObject","HTMLDivElement","ref","dragStartedRef","isDragging","drag","preview","type","item","current","collect","monitor","end","drop","accept","hover","dropRef","hoverBoundingRect","getBoundingClientRect","hoverMiddleY","bottom","top","clientOffset","getClientOffset","hoverClientY","y","cursor","opacity","useRowDnd","props","TDataItem","IRowDndInfo","columns","rowDnd","data","rowKey","draggingRowId","setDraggingRowId","rowRefs","Map","draggingTempData","setDraggingTempData","tableData","getRowRef","record","key","has","set","createRef","MutableRefObject","get","defaultInfo","undefined","expandable","console","error","fixed","rowDndFixed","onChange","handleDragging","currentData","newData","length","draggedRow","splice","handleDragStart","cloneDeep","handleDragComplete","draggingRow","find","finalData","dndColumn","dataIndex","title","width","render","text","rowIndex"],"sources":["../../../src/Table/hooks/useRowDnd.tsx"],"sourcesContent":["import DragLightLineSvg from '../../Icon/components/DragLightLine';\nimport React, { useCallback, useMemo, useRef, useState } from 'react';\nimport { useDrag, useDrop, DragSourceMonitor } from 'react-dnd';\nimport { getEmptyImage } from 'react-dnd-html5-backend';\nimport { getRowKey, hasFixedLeftColumn, prefixCls } from '../helper';\nimport { ITableColumn, ITableProps } from '../types';\nimport _ from 'lodash';\n\n// 定义拖拽项类型\nconst ROW_DND_TYPE = 'ALD_TABLE_ROW_DND_TYPE';\n\ninterface DragItem {\n  index: number;\n  id: string;\n}\n\n// 拖拽手柄组件\nconst DragHandle = ({\n  index,\n  id,\n  onDragging,\n  rowRef,\n  onDragStart,\n  onDragComplete,\n}: {\n  index: number;\n  id: string;\n  onDragging: (dragIndex: number, hoverIndex: number) => void;\n  rowRef?: React.RefObject<HTMLDivElement>;\n  onDragStart: (id: string) => void;\n  onDragComplete: () => void;\n}) => {\n  const ref = useRef<HTMLDivElement>(null);\n\n  // 使用 ref 来跟踪是否已经通知拖动开始\n  const dragStartedRef = useRef(false);\n\n  const [{ isDragging }, drag, preview] = useDrag({\n    type: ROW_DND_TYPE,\n    item: () => {\n      // 只在拖拽真正开始且尚未通知时触发一次\n      if (!dragStartedRef.current) {\n        // 通知开始拖动，传递行的ID\n        onDragStart(id);\n        dragStartedRef.current = true;\n      }\n\n      return { index, id };\n    },\n    collect: (monitor: DragSourceMonitor) => ({\n      isDragging: monitor.isDragging(),\n    }),\n    end: () => {\n      // 拖拽结束时清除拖动状态和重置标志\n      onDragComplete();\n      dragStartedRef.current = false;\n    },\n  });\n\n  const [, drop] = useDrop({\n    accept: ROW_DND_TYPE,\n    // @ts-ignore - react-dnd类型定义有时与实际用法不一致\n    hover(item: DragItem, monitor) {\n      // 如果有行引用并且行引用有值，使用行引用来判断位置\n      const dropRef = rowRef?.current;\n\n      if (!dropRef) {\n        return;\n      }\n\n      const dragIndex = item.index;\n      const hoverIndex = index;\n\n      // 如果拖动的是自己，不做任何事\n      if (dragIndex === hoverIndex) {\n        return;\n      }\n\n      // 确定鼠标位置\n      const hoverBoundingRect = dropRef.getBoundingClientRect();\n      const hoverMiddleY =\n        (hoverBoundingRect.bottom - hoverBoundingRect.top) / 2;\n      const clientOffset = monitor.getClientOffset();\n\n      if (!clientOffset) {\n        return;\n      }\n\n      const hoverClientY = clientOffset.y - hoverBoundingRect.top;\n\n      // 向下拖动，但鼠标还没过半\n      if (dragIndex < hoverIndex && hoverClientY < hoverMiddleY) {\n        return;\n      }\n\n      // 向上拖动，但鼠标还没过半\n      if (dragIndex > hoverIndex && hoverClientY > hoverMiddleY) {\n        return;\n      }\n\n      // 执行排序\n      onDragging(dragIndex, hoverIndex);\n\n      // 更新拖拽项的索引，react-dnd 官方示例推荐这样做以提高性能并避免奇怪行为\n      item.index = hoverIndex;\n    },\n  });\n\n  // 将 drag 连接到手柄 ref 上\n  drag(ref);\n\n  // 设置放置目标\n  if (rowRef?.current) {\n    drop(rowRef.current);\n  }\n\n  preview(getEmptyImage());\n\n  return (\n    <div\n      ref={ref}\n      className={prefixCls('row-dnd-item')}\n      style={{ cursor: 'move', opacity: isDragging ? 0.5 : 1 }}\n    >\n      <DragLightLineSvg />\n    </div>\n  );\n};\n\nexport default function useRowDnd<TDataItem extends object>(\n  props: ITableProps<TDataItem>,\n): IRowDndInfo<TDataItem> {\n  const { columns, rowDnd, data, rowKey } = props;\n  // 跟踪当前正在拖动的行的ID\n  const [draggingRowId, setDraggingRowId] = useState<string | null>(null);\n\n  // 为每一行创建一个 ref，使用 useMemo 缓存 Map 实例\n  const rowRefs = useMemo(\n    () => new Map<string, React.RefObject<HTMLDivElement>>(),\n    [],\n  );\n\n  // 当拖拽过程中，临时存储数据\n  const [draggingTempData, setDraggingTempData] = useState<TDataItem[]>([]);\n\n  const tableData = useMemo(() => {\n    // 拖拽过程中，使用临时数据，这样外部调用方可以不用关心拖拽过程中的数据变化\n    if (draggingRowId) {\n      return draggingTempData;\n    }\n    return data;\n  }, [data, draggingRowId, draggingTempData]);\n\n  // 获取行的 ref，用于设置拖拽预览\n  const getRowRef = useCallback(\n    (record: TDataItem) => {\n      const key = getRowKey(record, rowKey);\n      if (!rowRefs.has(key)) {\n        rowRefs.set(\n          key,\n          React.createRef<HTMLDivElement>() as React.MutableRefObject<HTMLDivElement>,\n        );\n      }\n      return rowRefs.get(key) as React.MutableRefObject<HTMLDivElement>;\n    },\n    [rowKey, rowRefs],\n  );\n\n  const defaultInfo = useMemo(() => {\n    return {\n      columns,\n      getRowRef: () => undefined,\n      draggingRowId: null,\n      tableData: data,\n    };\n  }, [columns, data]);\n\n  if (!rowDnd) {\n    return defaultInfo;\n  }\n  if (props.expandable) {\n    console.error('rowDnd and expandable mode cannot be used together');\n    return defaultInfo;\n  }\n  if (!props.rowKey) {\n    // 如果rowKey没有设置，则无法进行拖拽，因为必须知道每行的唯一标识\n    console.error('rowKey is required in rowDnd mode');\n    return defaultInfo;\n  }\n  const { fixed: rowDndFixed, onChange } = rowDnd;\n\n  const fixed = rowDndFixed || hasFixedLeftColumn(columns);\n\n  const handleDragging = (dragIndex: number, hoverIndex: number) => {\n    // 使用函数式更新，确保基于最新的状态进行操作\n    setDraggingTempData((currentData) => {\n      const newData = [...currentData];\n\n      if (dragIndex < 0 || dragIndex >= newData.length) {\n        return currentData;\n      }\n\n      const draggedRow = newData.splice(dragIndex, 1)[0];\n\n      if (draggedRow === undefined) {\n        return currentData;\n      }\n\n      // 插入到新位置\n      newData.splice(hoverIndex, 0, draggedRow);\n\n      return newData;\n    });\n  };\n\n  // 记录拖动开始\n  const handleDragStart = (id: string) => {\n    setDraggingRowId(id);\n    setDraggingTempData(_.cloneDeep(data));\n  };\n\n  // 记录拖动结束\n  const handleDragComplete = () => {\n    // 必须在清空 draggingRowId 之前先找到 draggingRow\n    // 因为 tableData 依赖 draggingRowId，清空后 tableData 会切换回原始 data\n    const draggingRow = tableData.find(\n      (item) => getRowKey(item, rowKey) === draggingRowId,\n    );\n    if (!draggingRow) {\n      // 不应该出现这种情况\n      console.error('draggingRow is not found');\n      setDraggingRowId(null);\n      return;\n    }\n    // 保存当前的 tableData，因为清空 draggingRowId 后 tableData 会变化\n    const finalData = tableData;\n    setDraggingRowId(null);\n    setDraggingTempData([]);\n    onChange(finalData, draggingRow);\n  };\n\n  const dndColumn: ITableColumn<TDataItem> = {\n    dataIndex: '',\n    title: '',\n    width: 48,\n    render: (text: unknown, record: TDataItem, rowIndex: number) => {\n      const key = getRowKey(record, rowKey);\n      const rowRef = getRowRef(record);\n      return (\n        <DragHandle\n          index={rowIndex}\n          id={key}\n          onDragging={handleDragging}\n          onDragStart={handleDragStart}\n          onDragComplete={handleDragComplete}\n          rowRef={rowRef}\n        />\n      );\n    },\n    fixed: fixed ? 'left' : undefined,\n  };\n\n  return {\n    columns: [dndColumn, ...columns],\n    getRowRef,\n    draggingRowId,\n    tableData,\n  };\n}\n\ninterface IRowDndInfo<TDataItem extends object> {\n  columns: ITableProps<TDataItem>['columns'];\n  getRowRef: (\n    record: TDataItem,\n    rowIndex: number,\n  ) => React.MutableRefObject<HTMLDivElement> | undefined;\n  draggingRowId: string | null;\n  tableData: TDataItem[];\n}\n"],"mappings":"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"}

package/dist/Table/hooks/useRowSelection.d.ts

@@ -1,5 +1,5 @@
 import { default as React } from 'react';
-import { ITableProps } from '../types';
+import { ITableProps } from '../types.js';
 export default function useRowSelection<TDataItem extends object>(props: ITableProps<TDataItem> & {
     isExpandable?: boolean;
     flattenData?: TDataItem[];