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

package/dist/Table/hooks/useScroll.js

@@ -1,5 +1,6 @@
 import { getNumberFromPercentageStr } from "../helper.js";
-import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { c } from "react-compiler-runtime";
+import { useEffect, useRef, useState } from "react";
 import { scrollbarWidth } from "@xobotyi/scrollbar-width";
 //#region src/Table/hooks/useScroll.ts
 var scrollbarWidth$1 = (() => {
@@ -13,6 +14,7 @@ var scrollbarWidth$1 = (() => {
 * @returns
 */
 function useScroll(props) {
+	const $ = c(15);
 	const { scroll, totalSize } = props;
 	const headerRef = useRef(null);
 	const bodyRef = useRef(null);
@@ -20,55 +22,100 @@ function useScroll(props) {
 	const [isPingLeft, setIsPingLeft] = useState(false);
 	const [isPingRight, setIsPingRight] = useState(false);
 	const { x, y } = scroll;
-	const containerWidth = useMemo(() => {
-		if (!totalSize) return;
+	let t0;
+	bb0: {
+		if (!totalSize) {
+			t0 = void 0;
+			break bb0;
+		}
 		const width = getContainerWidth(x, totalSize.width);
-		if (y !== void 0) return Math.max(width - scrollbarWidth$1, 0);
-		return width;
-	}, [
-		x,
-		y,
-		totalSize
-	]);
-	const changeIsPing = useCallback((totalColumnsWidth) => {
-		const elem = bodyRef.current;
-		if (!elem) return;
-		const needsHorizontalScroll = elem.scrollWidth > elem.clientWidth + 2;
-		const needsHorizontalScrollFallback = !needsHorizontalScroll && elem.scrollWidth === 0 && elem.clientWidth === 0 && !!totalColumnsWidth && totalColumnsWidth > 0;
-		if (!needsHorizontalScroll && !needsHorizontalScrollFallback) {
-			setIsPingLeft(false);
-			setIsPingRight(false);
-			return;
+		if (y !== void 0) {
+			t0 = Math.max(width - scrollbarWidth$1, 0);
+			break bb0;
 		}
-		if (elem.scrollLeft <= 0) setIsPingLeft(false);
-		else setIsPingLeft(true);
-		if (needsHorizontalScrollFallback) setIsPingRight(true);
-		else if (isScrolledToRight(elem, y !== void 0 ? scrollbarWidth$1 : 0)) setIsPingRight(false);
-		else setIsPingRight(true);
-	}, [y]);
-	useEffect(() => {
-		if (containerWidth && bodyRef.current) changeIsPing();
-	}, [containerWidth, changeIsPing]);
-	const requestAnimationFrame = useCallback((callback) => {
-		if (animationFrameId.current !== null) window.cancelAnimationFrame(animationFrameId.current);
-		animationFrameId.current = window.requestAnimationFrame(callback);
-	}, []);
-	return {
-		containerWidth,
-		headerRef,
-		bodyRef,
-		onBodyScroll: useCallback((e) => {
-			const scrollLeft = e.target.scrollLeft;
+		t0 = width;
+	}
+	const containerWidth = t0;
+	let t1;
+	if ($[0] !== y) {
+		t1 = (totalColumnsWidth) => {
+			const elem = bodyRef.current;
+			if (!elem) return;
+			const needsHorizontalScroll = elem.scrollWidth > elem.clientWidth + 2;
+			const needsHorizontalScrollFallback = !needsHorizontalScroll && elem.scrollWidth === 0 && elem.clientWidth === 0 && !!totalColumnsWidth && totalColumnsWidth > 0;
+			if (!needsHorizontalScroll && !needsHorizontalScrollFallback) {
+				setIsPingLeft(false);
+				setIsPingRight(false);
+				return;
+			}
+			if (elem.scrollLeft <= 0) setIsPingLeft(false);
+			else setIsPingLeft(true);
+			if (needsHorizontalScrollFallback) setIsPingRight(true);
+			else if (isScrolledToRight(elem, y !== void 0 ? scrollbarWidth$1 : 0)) setIsPingRight(false);
+			else setIsPingRight(true);
+		};
+		$[0] = y;
+		$[1] = t1;
+	} else t1 = $[1];
+	const changeIsPing = t1;
+	let t2;
+	let t3;
+	if ($[2] !== changeIsPing || $[3] !== containerWidth) {
+		t2 = () => {
+			if (containerWidth && bodyRef.current) changeIsPing();
+		};
+		t3 = [containerWidth, changeIsPing];
+		$[2] = changeIsPing;
+		$[3] = containerWidth;
+		$[4] = t2;
+		$[5] = t3;
+	} else {
+		t2 = $[4];
+		t3 = $[5];
+	}
+	useEffect(t2, t3);
+	let t4;
+	if ($[6] === Symbol.for("react.memo_cache_sentinel")) {
+		t4 = (callback) => {
+			if (animationFrameId.current !== null) window.cancelAnimationFrame(animationFrameId.current);
+			animationFrameId.current = window.requestAnimationFrame(callback);
+		};
+		$[6] = t4;
+	} else t4 = $[6];
+	const requestAnimationFrame = t4;
+	let t5;
+	if ($[7] !== changeIsPing) {
+		t5 = (e) => {
+			const scrollLeft_0 = e.target.scrollLeft;
 			requestAnimationFrame(() => {
-				headerRef.current?.scrollTo({ left: scrollLeft });
+				headerRef.current?.scrollTo({ left: scrollLeft_0 });
 				changeIsPing();
 			});
-		}, [requestAnimationFrame, changeIsPing]),
-		isPingLeft,
-		isPingRight,
-		scrollbarWidth: scrollbarWidth$1,
-		changeIsPing
-	};
+		};
+		$[7] = changeIsPing;
+		$[8] = t5;
+	} else t5 = $[8];
+	const onBodyScroll = t5;
+	let t6;
+	if ($[9] !== changeIsPing || $[10] !== containerWidth || $[11] !== isPingLeft || $[12] !== isPingRight || $[13] !== onBodyScroll) {
+		t6 = {
+			containerWidth,
+			headerRef,
+			bodyRef,
+			onBodyScroll,
+			isPingLeft,
+			isPingRight,
+			scrollbarWidth: scrollbarWidth$1,
+			changeIsPing
+		};
+		$[9] = changeIsPing;
+		$[10] = containerWidth;
+		$[11] = isPingLeft;
+		$[12] = isPingRight;
+		$[13] = onBodyScroll;
+		$[14] = t6;
+	} else t6 = $[14];
+	return t6;
 }
 function getMaxScrollLeft(element, offsetRight) {
 	return element.scrollWidth - element.clientWidth - offsetRight + 2;

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

@@ -1 +1 @@
-{"version":3,"file":"useScroll.js","names":[],"sources":["../../../src/Table/hooks/useScroll.ts"],"sourcesContent":["import { scrollbarWidth as getScrollbarWidth } from '@xobotyi/scrollbar-width';\nimport { useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { getNumberFromPercentageStr } from '../helper';\nimport { IScroll } from '../types';\n\nconst scrollbarWidth = (() => {\n  const barWidth = getScrollbarWidth();\n  if (typeof barWidth === 'undefined') {\n    return 0;\n  }\n  return barWidth;\n})();\n\n/**\n * 横向滚动条相关逻辑\n * @param props\n * @returns\n */\nexport default function useScroll(props: IProps) {\n  const { scroll, totalSize } = props;\n  const headerRef = useRef<HTMLDivElement>(null);\n  const bodyRef = useRef<HTMLDivElement>(null);\n  const animationFrameId = useRef<number | null>(null);\n  const [isPingLeft, setIsPingLeft] = useState(false);\n  const [isPingRight, setIsPingRight] = useState(false);\n\n  const { x, y } = scroll;\n\n  const containerWidth = useMemo(() => {\n    if (!totalSize) {\n      return;\n    }\n    const width = getContainerWidth(x, totalSize.width);\n    if (y !== undefined) {\n      return Math.max(width - scrollbarWidth, 0);\n    }\n    return width;\n  }, [x, y, totalSize]);\n\n  const changeIsPing = useCallback(\n    (totalColumnsWidth?: number) => {\n      const elem = bodyRef.current;\n      if (!elem) {\n        return;\n      }\n\n      // 先检查表格是否真的需要横向滚动\n      const DEVIATION = 2;\n      const needsHorizontalScroll =\n        elem.scrollWidth > elem.clientWidth + DEVIATION;\n\n      // Fallback for JSDOM or environments where scrollWidth/clientWidth are 0:\n      // if totalColumnsWidth is provided and positive, assume horizontal scroll is needed\n      const needsHorizontalScrollFallback =\n        !needsHorizontalScroll &&\n        elem.scrollWidth === 0 &&\n        elem.clientWidth === 0 &&\n        !!totalColumnsWidth &&\n        totalColumnsWidth > 0;\n\n      if (!needsHorizontalScroll && !needsHorizontalScrollFallback) {\n        // 表格宽度足够，不需要横向滚动，隐藏左右两侧阴影\n        setIsPingLeft(false);\n        setIsPingRight(false);\n        return;\n      }\n\n      // 表格需要横向滚动，根据滚动位置判断是否显示阴影\n      const scrollLeft = elem.scrollLeft;\n      if (scrollLeft <= 0) {\n        setIsPingLeft(false);\n      } else {\n        setIsPingLeft(true);\n      }\n\n      if (needsHorizontalScrollFallback) {\n        // In fallback mode (JSDOM), assume not scrolled to right\n        setIsPingRight(true);\n      } else if (\n        isScrolledToRight(elem, y !== undefined ? scrollbarWidth : 0)\n      ) {\n        setIsPingRight(false);\n      } else {\n        setIsPingRight(true);\n      }\n    },\n    [y],\n  );\n\n  useEffect(() => {\n    if (containerWidth && bodyRef.current) {\n      // 待表格渲染完成，宽度稳定后，初始化 ping 状态\n      changeIsPing();\n    }\n  }, [containerWidth, changeIsPing]);\n\n  const requestAnimationFrame = useCallback((callback: () => void) => {\n    // animationFrame 可以保证滚动时，header 和 body 不会出现不同步的情况\n    if (animationFrameId.current !== null) {\n      window.cancelAnimationFrame(animationFrameId.current);\n    }\n    animationFrameId.current = window.requestAnimationFrame(callback);\n  }, []);\n\n  const onBodyScroll = useCallback(\n    (e: React.UIEvent<HTMLDivElement>) => {\n      const target = e.target as HTMLDivElement;\n      const scrollLeft = target.scrollLeft;\n\n      requestAnimationFrame(() => {\n        headerRef.current?.scrollTo({\n          left: scrollLeft,\n        });\n        changeIsPing();\n      });\n    },\n    [requestAnimationFrame, changeIsPing],\n  );\n\n  return {\n    containerWidth,\n    headerRef,\n    bodyRef,\n    onBodyScroll,\n    isPingLeft,\n    isPingRight,\n    scrollbarWidth,\n    changeIsPing,\n  };\n}\n\ninterface IProps {\n  scroll: IScroll;\n  totalSize: {\n    width: number;\n    height: number;\n  } | null;\n}\n\n// 计算最大可滚动值\nfunction getMaxScrollLeft(element: HTMLDivElement, offsetRight: number) {\n  const maxScrollLeft = element.scrollWidth - element.clientWidth - offsetRight;\n  // 允许一些误差，避免因为浮点数计算导致的问题\n  const DEVIATION = 2;\n  return maxScrollLeft + DEVIATION;\n}\n\n// 判断是否滚动到最右侧\nfunction isScrolledToRight(element: HTMLDivElement, offsetRight: number) {\n  return element.scrollLeft >= getMaxScrollLeft(element, offsetRight);\n}\n\n/**\n * 获取可用实际宽度\n * @param scrollX 横向宽度值\n * @param width 容器的宽度\n */\nexport function getContainerWidth(scrollX: IScroll['x'], width: number) {\n  if (typeof scrollX === 'string') {\n    const percent = getNumberFromPercentageStr(scrollX);\n    if (isNaN(percent)) {\n      console.error('scroll.x is not percentage string');\n      return width;\n    }\n    return (percent * width) / 100;\n  }\n  if (typeof scrollX === 'number') {\n    return scrollX;\n  }\n  return width;\n}\n"],"mappings":";;;;AAKA,IAAM,0BAAwB;CAC5B,MAAM,WAAW,gBAAmB;AACpC,KAAI,OAAO,aAAa,YACtB,QAAO;AAET,QAAO;IACL;;;;;;AAOJ,SAAwB,UAAU,OAAe;CAC/C,MAAM,EAAE,QAAQ,cAAc;CAC9B,MAAM,YAAY,OAAuB,KAAK;CAC9C,MAAM,UAAU,OAAuB,KAAK;CAC5C,MAAM,mBAAmB,OAAsB,KAAK;CACpD,MAAM,CAAC,YAAY,iBAAiB,SAAS,MAAM;CACnD,MAAM,CAAC,aAAa,kBAAkB,SAAS,MAAM;CAErD,MAAM,EAAE,GAAG,MAAM;CAEjB,MAAM,iBAAiB,cAAc;AACnC,MAAI,CAAC,UACH;EAEF,MAAM,QAAQ,kBAAkB,GAAG,UAAU,MAAM;AACnD,MAAI,MAAM,OACR,QAAO,KAAK,IAAI,QAAQ,kBAAgB,EAAE;AAE5C,SAAO;IACN;EAAC;EAAG;EAAG;EAAU,CAAC;CAErB,MAAM,eAAe,aAClB,sBAA+B;EAC9B,MAAM,OAAO,QAAQ;AACrB,MAAI,CAAC,KACH;EAKF,MAAM,wBACJ,KAAK,cAAc,KAAK,cAFR;EAMlB,MAAM,gCACJ,CAAC,yBACD,KAAK,gBAAgB,KACrB,KAAK,gBAAgB,KACrB,CAAC,CAAC,qBACF,oBAAoB;AAEtB,MAAI,CAAC,yBAAyB,CAAC,+BAA+B;AAE5D,iBAAc,MAAM;AACpB,kBAAe,MAAM;AACrB;;AAKF,MADmB,KAAK,cACN,EAChB,eAAc,MAAM;MAEpB,eAAc,KAAK;AAGrB,MAAI,8BAEF,gBAAe,KAAK;WAEpB,kBAAkB,MAAM,MAAM,SAAY,mBAAiB,EAAE,CAE7D,gBAAe,MAAM;MAErB,gBAAe,KAAK;IAGxB,CAAC,EAAE,CACJ;AAED,iBAAgB;AACd,MAAI,kBAAkB,QAAQ,QAE5B,eAAc;IAEf,CAAC,gBAAgB,aAAa,CAAC;CAElC,MAAM,wBAAwB,aAAa,aAAyB;AAElE,MAAI,iBAAiB,YAAY,KAC/B,QAAO,qBAAqB,iBAAiB,QAAQ;AAEvD,mBAAiB,UAAU,OAAO,sBAAsB,SAAS;IAChE,EAAE,CAAC;AAiBN,QAAO;EACL;EACA;EACA;EACA,cAnBmB,aAClB,MAAqC;GAEpC,MAAM,aADS,EAAE,OACS;AAE1B,+BAA4B;AAC1B,cAAU,SAAS,SAAS,EAC1B,MAAM,YACP,CAAC;AACF,kBAAc;KACd;KAEJ,CAAC,uBAAuB,aAAa,CACtC;EAOC;EACA;EACA,gBAAA;EACA;EACD;;AAYH,SAAS,iBAAiB,SAAyB,aAAqB;AAItE,QAHsB,QAAQ,cAAc,QAAQ,cAAc,cAEhD;;AAKpB,SAAS,kBAAkB,SAAyB,aAAqB;AACvE,QAAO,QAAQ,cAAc,iBAAiB,SAAS,YAAY;;;;;;;AAQrE,SAAgB,kBAAkB,SAAuB,OAAe;AACtE,KAAI,OAAO,YAAY,UAAU;EAC/B,MAAM,UAAU,2BAA2B,QAAQ;AACnD,MAAI,MAAM,QAAQ,EAAE;AAClB,WAAQ,MAAM,oCAAoC;AAClD,UAAO;;AAET,SAAQ,UAAU,QAAS;;AAE7B,KAAI,OAAO,YAAY,SACrB,QAAO;AAET,QAAO"}
+{"version":3,"file":"useScroll.js","names":["scrollbarWidth","getScrollbarWidth","useCallback","useEffect","useMemo","useRef","useState","getNumberFromPercentageStr","IScroll","barWidth","useScroll","props","$","_c","scroll","totalSize","headerRef","bodyRef","animationFrameId","isPingLeft","setIsPingLeft","isPingRight","setIsPingRight","x","y","t0","bb0","undefined","width","getContainerWidth","Math","max","containerWidth","t1","totalColumnsWidth","elem","current","needsHorizontalScroll","scrollWidth","clientWidth","needsHorizontalScrollFallback","scrollLeft","isScrolledToRight","changeIsPing","t2","t3","t4","Symbol","for","callback","window","cancelAnimationFrame","requestAnimationFrame","t5","e","target","HTMLDivElement","scrollLeft_0","scrollTo","left","onBodyScroll","t6","IProps","height","getMaxScrollLeft","element","offsetRight","maxScrollLeft","DEVIATION","scrollX","percent","isNaN","console","error"],"sources":["../../../src/Table/hooks/useScroll.ts"],"sourcesContent":["import { scrollbarWidth as getScrollbarWidth } from '@xobotyi/scrollbar-width';\nimport { useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { getNumberFromPercentageStr } from '../helper';\nimport { IScroll } from '../types';\n\nconst scrollbarWidth = (() => {\n  const barWidth = getScrollbarWidth();\n  if (typeof barWidth === 'undefined') {\n    return 0;\n  }\n  return barWidth;\n})();\n\n/**\n * 横向滚动条相关逻辑\n * @param props\n * @returns\n */\nexport default function useScroll(props: IProps) {\n  const { scroll, totalSize } = props;\n  const headerRef = useRef<HTMLDivElement>(null);\n  const bodyRef = useRef<HTMLDivElement>(null);\n  const animationFrameId = useRef<number | null>(null);\n  const [isPingLeft, setIsPingLeft] = useState(false);\n  const [isPingRight, setIsPingRight] = useState(false);\n\n  const { x, y } = scroll;\n\n  const containerWidth = useMemo(() => {\n    if (!totalSize) {\n      return;\n    }\n    const width = getContainerWidth(x, totalSize.width);\n    if (y !== undefined) {\n      return Math.max(width - scrollbarWidth, 0);\n    }\n    return width;\n  }, [x, y, totalSize]);\n\n  const changeIsPing = useCallback(\n    (totalColumnsWidth?: number) => {\n      const elem = bodyRef.current;\n      if (!elem) {\n        return;\n      }\n\n      // 先检查表格是否真的需要横向滚动\n      const DEVIATION = 2;\n      const needsHorizontalScroll =\n        elem.scrollWidth > elem.clientWidth + DEVIATION;\n\n      // Fallback for JSDOM or environments where scrollWidth/clientWidth are 0:\n      // if totalColumnsWidth is provided and positive, assume horizontal scroll is needed\n      const needsHorizontalScrollFallback =\n        !needsHorizontalScroll &&\n        elem.scrollWidth === 0 &&\n        elem.clientWidth === 0 &&\n        !!totalColumnsWidth &&\n        totalColumnsWidth > 0;\n\n      if (!needsHorizontalScroll && !needsHorizontalScrollFallback) {\n        // 表格宽度足够，不需要横向滚动，隐藏左右两侧阴影\n        setIsPingLeft(false);\n        setIsPingRight(false);\n        return;\n      }\n\n      // 表格需要横向滚动，根据滚动位置判断是否显示阴影\n      const scrollLeft = elem.scrollLeft;\n      if (scrollLeft <= 0) {\n        setIsPingLeft(false);\n      } else {\n        setIsPingLeft(true);\n      }\n\n      if (needsHorizontalScrollFallback) {\n        // In fallback mode (JSDOM), assume not scrolled to right\n        setIsPingRight(true);\n      } else if (\n        isScrolledToRight(elem, y !== undefined ? scrollbarWidth : 0)\n      ) {\n        setIsPingRight(false);\n      } else {\n        setIsPingRight(true);\n      }\n    },\n    [y],\n  );\n\n  useEffect(() => {\n    if (containerWidth && bodyRef.current) {\n      // 待表格渲染完成，宽度稳定后，初始化 ping 状态\n      changeIsPing();\n    }\n  }, [containerWidth, changeIsPing]);\n\n  const requestAnimationFrame = useCallback((callback: () => void) => {\n    // animationFrame 可以保证滚动时，header 和 body 不会出现不同步的情况\n    if (animationFrameId.current !== null) {\n      window.cancelAnimationFrame(animationFrameId.current);\n    }\n    animationFrameId.current = window.requestAnimationFrame(callback);\n  }, []);\n\n  const onBodyScroll = useCallback(\n    (e: React.UIEvent<HTMLDivElement>) => {\n      const target = e.target as HTMLDivElement;\n      const scrollLeft = target.scrollLeft;\n\n      requestAnimationFrame(() => {\n        headerRef.current?.scrollTo({\n          left: scrollLeft,\n        });\n        changeIsPing();\n      });\n    },\n    [requestAnimationFrame, changeIsPing],\n  );\n\n  return {\n    containerWidth,\n    headerRef,\n    bodyRef,\n    onBodyScroll,\n    isPingLeft,\n    isPingRight,\n    scrollbarWidth,\n    changeIsPing,\n  };\n}\n\ninterface IProps {\n  scroll: IScroll;\n  totalSize: {\n    width: number;\n    height: number;\n  } | null;\n}\n\n// 计算最大可滚动值\nfunction getMaxScrollLeft(element: HTMLDivElement, offsetRight: number) {\n  const maxScrollLeft = element.scrollWidth - element.clientWidth - offsetRight;\n  // 允许一些误差，避免因为浮点数计算导致的问题\n  const DEVIATION = 2;\n  return maxScrollLeft + DEVIATION;\n}\n\n// 判断是否滚动到最右侧\nfunction isScrolledToRight(element: HTMLDivElement, offsetRight: number) {\n  return element.scrollLeft >= getMaxScrollLeft(element, offsetRight);\n}\n\n/**\n * 获取可用实际宽度\n * @param scrollX 横向宽度值\n * @param width 容器的宽度\n */\nexport function getContainerWidth(scrollX: IScroll['x'], width: number) {\n  if (typeof scrollX === 'string') {\n    const percent = getNumberFromPercentageStr(scrollX);\n    if (isNaN(percent)) {\n      console.error('scroll.x is not percentage string');\n      return width;\n    }\n    return (percent * width) / 100;\n  }\n  if (typeof scrollX === 'number') {\n    return scrollX;\n  }\n  return width;\n}\n"],"mappings":"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"}

package/dist/Table/index.d.ts

@@ -1,7 +1,7 @@
 import { default as React, ForwardedRef } from 'react';
 import { ITableProps, ITableRef } from './types.js';
-declare function Table<TDataItem extends object>(props: ITableProps<TDataItem>, ref: ForwardedRef<ITableRef>): import("react/jsx-runtime").JSX.Element;
+declare function Table<TDataItem extends object>(props: ITableProps<TDataItem>, ref: ForwardedRef<ITableRef>): React.JSX.Element;
 declare const _default: <TDataItem extends object>(props: ITableProps<TDataItem> & {
-    ref?: React.ForwardedRef<ITableRef> | undefined;
+    ref?: React.ForwardedRef<ITableRef>;
 }) => ReturnType<typeof Table>;
 export default _default;

package/dist/Table/index.js

@@ -114,24 +114,24 @@ function Table(props, ref) {
 	useEffect(() => {
 		changeIsPing(totalColumnsWidth);
 	}, [changeIsPing, totalColumnsWidth]);
-	const renderHeaderCell = useCallback((header, index) => {
-		const showResizer = columnSizing && !(!!rowSelectionInfo.isRowSelectionEnabled && index === 0);
-		const { className: fixedClassName, style: fixedStyle } = getColumnFixedInfo(index, true);
+	const renderHeaderCell = useCallback((header_0, index_0) => {
+		const showResizer = columnSizing && !(!!rowSelectionInfo.isRowSelectionEnabled && index_0 === 0);
+		const { className: fixedClassName, style: fixedStyle } = getColumnFixedInfo(index_0, true);
 		return /* @__PURE__ */ jsxs("div", {
 			role: "columnheader",
-			"aria-label": typeof header.column.columnDef.meta.title === "string" ? header.column.columnDef.meta.title : void 0,
-			"aria-sort": header.column.columnDef.meta.sortOrder === "ascend" ? "ascending" : header.column.columnDef.meta.sortOrder === "descend" ? "descending" : header.column.columnDef.meta.sortOrder !== void 0 ? "none" : void 0,
+			"aria-label": typeof header_0.column.columnDef.meta.title === "string" ? header_0.column.columnDef.meta.title : void 0,
+			"aria-sort": header_0.column.columnDef.meta.sortOrder === "ascend" ? "ascending" : header_0.column.columnDef.meta.sortOrder === "descend" ? "descending" : header_0.column.columnDef.meta.sortOrder !== void 0 ? "none" : void 0,
 			className: cn(prefixCls("th"), fixedClassName),
 			style: {
-				width: header.getSize(),
+				width: header_0.getSize(),
 				...fixedStyle
 			},
-			children: [flexRender(header.column.columnDef.header, header.getContext()), showResizer && /* @__PURE__ */ jsx("div", {
-				onMouseDown: header.getResizeHandler(),
-				onTouchStart: header.getResizeHandler(),
-				className: cn(prefixCls("resizer"), { [prefixCls("self-resizing")]: header.column.getIsResizing() })
+			children: [flexRender(header_0.column.columnDef.header, header_0.getContext()), showResizer && /* @__PURE__ */ jsx("div", {
+				onMouseDown: header_0.getResizeHandler(),
+				onTouchStart: header_0.getResizeHandler(),
+				className: cn(prefixCls("resizer"), { [prefixCls("self-resizing")]: header_0.column.getIsResizing() })
 			})]
-		}, header.id);
+		}, header_0.id);
 	}, [
 		columnSizing,
 		rowSelectionInfo,
@@ -140,7 +140,7 @@ function Table(props, ref) {
 	const visibleColumns = tableInstance.getVisibleLeafColumns();
 	const columnVirtualizer = useVirtualizer({
 		count: tableColumns.length,
-		estimateSize: (index) => visibleColumns[index].getSize(),
+		estimateSize: (index_1) => visibleColumns[index_1].getSize(),
 		getScrollElement: () => bodyRef.current,
 		horizontal: true,
 		overscan: 5
@@ -163,49 +163,49 @@ function Table(props, ref) {
 		style: headerStyle,
 		children: _.map(headerGroups, (headerGroup) => {
 			const allHeaderCells = headerGroup.headers;
-			const virtualColumns = columnVirtualizer.getVirtualItems();
+			const virtualColumns_0 = columnVirtualizer.getVirtualItems();
 			const middleVirtualColumns = [];
 			const leftFixedColumns = [];
 			const rightFixedColumns = [];
 			let content = null;
 			if (virtual) {
-				_.forEach(allHeaderCells, (header, index) => {
-					const fixedInfo = getColumnFixedInfo(index);
+				_.forEach(allHeaderCells, (header_1, index_2) => {
+					const fixedInfo = getColumnFixedInfo(index_2);
 					if (fixedInfo.fixed === "left") leftFixedColumns.push({
-						header,
-						index
+						header: header_1,
+						index: index_2
 					});
 					if (fixedInfo.fixed === "right") rightFixedColumns.push({
-						header,
-						index
+						header: header_1,
+						index: index_2
 					});
 				});
-				_.forEach(virtualColumns, (virtualColumn) => {
+				_.forEach(virtualColumns_0, (virtualColumn) => {
 					const colIndex = virtualColumn.index;
-					const fixedInfo = getColumnFixedInfo(colIndex);
-					if (fixedInfo.fixed !== "left" && fixedInfo.fixed !== "right") middleVirtualColumns.push(virtualColumn);
+					const fixedInfo_0 = getColumnFixedInfo(colIndex);
+					if (fixedInfo_0.fixed !== "left" && fixedInfo_0.fixed !== "right") middleVirtualColumns.push(virtualColumn);
 				});
 				content = /* @__PURE__ */ jsxs(Fragment, { children: [
 					virtualPaddingLeft ? /* @__PURE__ */ jsx("div", {
 						className: prefixCls("virtual-padding-left"),
 						style: { width: virtualPaddingLeft }
 					}) : null,
-					leftFixedColumns.map(({ header, index }) => {
-						return renderHeaderCell(header, index);
+					leftFixedColumns.map(({ header: header_2, index: index_3 }) => {
+						return renderHeaderCell(header_2, index_3);
 					}),
-					_.map(middleVirtualColumns, (virtualColumn) => {
-						const header = allHeaderCells[virtualColumn.index];
-						return renderHeaderCell(header, virtualColumn.index);
+					_.map(middleVirtualColumns, (virtualColumn_0) => {
+						const header_3 = allHeaderCells[virtualColumn_0.index];
+						return renderHeaderCell(header_3, virtualColumn_0.index);
 					}),
-					rightFixedColumns.map(({ header, index }) => {
-						return renderHeaderCell(header, index);
+					rightFixedColumns.map(({ header: header_4, index: index_4 }) => {
+						return renderHeaderCell(header_4, index_4);
 					}),
 					virtualPaddingRight ? /* @__PURE__ */ jsx("div", {
 						className: prefixCls("virtual-padding-right"),
 						style: { width: virtualPaddingRight }
 					}) : null
 				] });
-			} else content = _.map(allHeaderCells, (header, index) => renderHeaderCell(header, index));
+			} else content = _.map(allHeaderCells, (header_5, index_5) => renderHeaderCell(header_5, index_5));
 			return /* @__PURE__ */ jsxs("div", {
 				className: prefixCls("tr"),
 				role: "row",
@@ -235,20 +235,20 @@ function Table(props, ref) {
 		overscan: 5
 	});
 	const tableRows = virtual ? rowVirtualizer.getVirtualItems() : rows;
-	const renderBodyCell = useCallback((row, cell, colIndex) => {
-		const { className: fixedClassName, style: fixedStyle } = getColumnFixedInfo(colIndex);
+	const renderBodyCell = useCallback((row_0, cell, colIndex_0) => {
+		const { className: fixedClassName_0, style: fixedStyle_0 } = getColumnFixedInfo(colIndex_0);
 		const tdContent = flexRender(cell.column.columnDef.cell, cell.getContext());
 		return /* @__PURE__ */ jsx("div", {
 			role: "cell",
-			className: cn(prefixCls("td"), fixedClassName),
+			className: cn(prefixCls("td"), fixedClassName_0),
 			style: {
 				width: cell.column.getSize(),
-				...fixedStyle
+				...fixedStyle_0
 			},
-			children: expandableInfo.isExpandable && colIndex === (rowSelectionInfo.isRowSelectionEnabled ? 1 : 0) ? /* @__PURE__ */ jsx(ExpandCell, {
+			children: expandableInfo.isExpandable && colIndex_0 === (rowSelectionInfo.isRowSelectionEnabled ? 1 : 0) ? /* @__PURE__ */ jsx(ExpandCell, {
 				expandableInfo,
 				expandable,
-				data: row.original,
+				data: row_0.original,
 				rowKey,
 				children: tdContent
 			}) : tdContent
@@ -297,84 +297,84 @@ function Table(props, ref) {
 					})
 				})
 			})]
-		}) : _.reduce(tableRows, (rowList, rowData, rowIndex) => {
-			const row = virtual ? rows[rowData.index] : rowData;
-			const allRowCells = row.getVisibleCells();
-			let content = null;
-			const leftFixedColumns = [];
-			const rightFixedColumns = [];
+		}) : _.reduce(tableRows, (rowList, rowData_0, rowIndex_0) => {
+			const row_1 = virtual ? rows[rowData_0.index] : rowData_0;
+			const allRowCells = row_1.getVisibleCells();
+			let content_0 = null;
+			const leftFixedColumns_0 = [];
+			const rightFixedColumns_0 = [];
 			if (virtual) {
-				const virtualColumns = columnVirtualizer.getVirtualItems();
-				const middleVirtualColumns = [];
-				_.forEach(allRowCells, (cell, index) => {
-					const fixedInfo = getColumnFixedInfo(index);
-					if (fixedInfo.fixed === "left") leftFixedColumns.push({
-						cell,
-						index
+				const virtualColumns_1 = columnVirtualizer.getVirtualItems();
+				const middleVirtualColumns_0 = [];
+				_.forEach(allRowCells, (cell_0, index_6) => {
+					const fixedInfo_1 = getColumnFixedInfo(index_6);
+					if (fixedInfo_1.fixed === "left") leftFixedColumns_0.push({
+						cell: cell_0,
+						index: index_6
 					});
-					if (fixedInfo.fixed === "right") rightFixedColumns.push({
-						cell,
-						index
+					if (fixedInfo_1.fixed === "right") rightFixedColumns_0.push({
+						cell: cell_0,
+						index: index_6
 					});
 				});
-				_.forEach(virtualColumns, (virtualColumn) => {
-					const colIndex = virtualColumn.index;
-					const fixedInfo = getColumnFixedInfo(colIndex);
-					if (fixedInfo.fixed !== "left" && fixedInfo.fixed !== "right") middleVirtualColumns.push(virtualColumn);
+				_.forEach(virtualColumns_1, (virtualColumn_1) => {
+					const colIndex_1 = virtualColumn_1.index;
+					const fixedInfo_2 = getColumnFixedInfo(colIndex_1);
+					if (fixedInfo_2.fixed !== "left" && fixedInfo_2.fixed !== "right") middleVirtualColumns_0.push(virtualColumn_1);
 				});
-				content = /* @__PURE__ */ jsxs(Fragment, { children: [
+				content_0 = /* @__PURE__ */ jsxs(Fragment, { children: [
 					virtualPaddingLeft ? /* @__PURE__ */ jsx("div", {
 						className: prefixCls("virtual-padding-left"),
 						style: { width: virtualPaddingLeft }
 					}) : null,
-					leftFixedColumns.map(({ cell, index }) => {
-						return renderBodyCell(row, cell, index);
+					leftFixedColumns_0.map(({ cell: cell_1, index: index_7 }) => {
+						return renderBodyCell(row_1, cell_1, index_7);
 					}),
-					middleVirtualColumns.map((virtualColumn) => {
-						const colIndex = virtualColumn.index;
-						const cell = allRowCells[colIndex];
-						return renderBodyCell(row, cell, colIndex);
+					middleVirtualColumns_0.map((virtualColumn_2) => {
+						const colIndex_2 = virtualColumn_2.index;
+						const cell_2 = allRowCells[colIndex_2];
+						return renderBodyCell(row_1, cell_2, colIndex_2);
 					}),
-					rightFixedColumns.map(({ cell, index }) => {
-						return renderBodyCell(row, cell, index);
+					rightFixedColumns_0.map(({ cell: cell_3, index: index_8 }) => {
+						return renderBodyCell(row_1, cell_3, index_8);
 					}),
 					virtualPaddingRight ? /* @__PURE__ */ jsx("div", {
 						className: prefixCls("virtual-padding-right"),
 						style: { width: virtualPaddingRight }
 					}) : null
 				] });
-			} else content = allRowCells.map((cell, index) => renderBodyCell(row, cell, index));
-			const rowId = row.id;
+			} else content_0 = allRowCells.map((cell_4, index_9) => renderBodyCell(row_1, cell_4, index_9));
+			const rowId = row_1.id;
 			const isRowSelected = rowSelectionInfo.isRowSelectionEnabled && rowSelectionInfo.selectedRowKeys.includes(rowId);
-			const isRowSelectionDisabled = rowSelectionInfo.isRowSelectionEnabled && !!rowSelection?.getCheckboxProps?.(row.original).disabled;
+			const isRowSelectionDisabled = rowSelectionInfo.isRowSelectionEnabled && !!rowSelection?.getCheckboxProps?.(row_1.original).disabled;
 			const rowNode = /* @__PURE__ */ jsx("div", {
 				role: "row",
-				"aria-rowindex": rowIndex + 2,
-				"data-index": virtual ? rowData.index : rowIndex,
+				"aria-rowindex": rowIndex_0 + 2,
+				"data-index": virtual ? rowData_0.index : rowIndex_0,
 				className: cn(prefixCls("tr"), {
 					[prefixCls("row-hover")]: rowDndInfo.draggingRowId ? void 0 : hoverRowId === rowId,
 					[prefixCls("row-dragging")]: rowDndInfo.draggingRowId === rowId,
 					[prefixCls("row-selected")]: isRowSelected,
 					[prefixCls("row-selection-disabled")]: isRowSelectionDisabled,
-					[prefixCls("no-border-tr")]: isShowPagination && rowIndex === rows.length - 1
-				}, rowClassName(row.original, rowIndex)),
+					[prefixCls("no-border-tr")]: isShowPagination && rowIndex_0 === rows.length - 1
+				}, rowClassName(row_1.original, rowIndex_0)),
 				ref: (node) => {
 					if (virtual) rowVirtualizer.measureElement(node);
 					if (rowDnd && node) {
-						const rowRef = rowDndInfo.getRowRef(row.original, rowIndex);
+						const rowRef = rowDndInfo.getRowRef(row_1.original, rowIndex_0);
 						if (rowRef) rowRef.current = node;
 					}
 				},
-				onClick: onClickRow(row.original, rowIndex),
+				onClick: onClickRow(row_1.original, rowIndex_0),
 				onMouseEnter: () => {
 					if (!isRowSelectionDisabled) setHoverRowId(rowId);
 				},
 				onMouseLeave: () => setHoverRowId(null),
 				style: virtual ? {
 					position: "absolute",
-					transform: `translateY(${rowData.start}px)`
+					transform: `translateY(${rowData_0.start}px)`
 				} : {},
-				children: content
+				children: content_0
 			}, rowId);
 			rowList.push(rowNode);
 			const expandItem = expandableInfo.expandItemMap[rowId];
@@ -389,8 +389,8 @@ function Table(props, ref) {
 				const customRow = /* @__PURE__ */ jsx("div", {
 					className: cn(prefixCls("tr")),
 					role: "row",
-					onClick: onClickRow(row.original, rowIndex),
-					children: expandedRowRender(row.original, expandItem.level + 1)
+					onClick: onClickRow(row_1.original, rowIndex_0),
+					children: expandedRowRender(row_1.original, expandItem.level + 1)
 				}, customExpandRowKey);
 				rowList.push(customRow);
 			}