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

package/dist/DataPreviewTable/components/DragBar.js

@@ -0,0 +1,2 @@
+export * from './DragBar/index.js';
+export { default } from './DragBar/index.js';

package/dist/DataPreviewTable/components/Header/index.d.ts

@@ -1,4 +1,5 @@
-import { IColumnLayout, PreviewColumn } from '../../interface';
+import { default as React } from 'react';
+import { IColumnLayout, PreviewColumn } from '../../interface.js';
 interface IHeader {
     tableId: string;
     contentWidth: number;
@@ -8,5 +9,5 @@ interface IHeader {
     columnRange: [number, number];
     headerHeight: number;
 }
-export default function Header(props: IHeader): import("react/jsx-runtime").JSX.Element;
+export default function Header(props: IHeader): React.JSX.Element;
 export {};

package/dist/DataPreviewTable/components/Header/index.js

@@ -1,18 +1,29 @@
 import { cn } from "../../../lib/utils.js";
 import DragBar_default from "../DragBar/index.js";
+import { c } from "react-compiler-runtime";
 import "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/DataPreviewTable/components/Header/index.tsx
 function Header(props) {
-	const { tableId, contentWidth, columns, columnLayout, setWidth, columnRange: [startIndex, endIndex], headerHeight } = props;
-	return /* @__PURE__ */ jsx("div", {
-		role: "rowgroup",
-		className: "ald-data-preview-header tw-z-[2] tw-w-full",
-		style: { width: contentWidth },
-		children: /* @__PURE__ */ jsx("div", {
-			role: "row",
-			style: { display: "contents" },
-			children: columns.slice(startIndex, endIndex + 1).map((column) => {
+	const $ = c(21);
+	const { tableId, contentWidth, columns, columnLayout, setWidth, columnRange: t0, headerHeight } = props;
+	const [startIndex, endIndex] = t0;
+	let t1;
+	if ($[0] !== contentWidth) {
+		t1 = { width: contentWidth };
+		$[0] = contentWidth;
+		$[1] = t1;
+	} else t1 = $[1];
+	let t2;
+	if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
+		t2 = { display: "contents" };
+		$[2] = t2;
+	} else t2 = $[2];
+	let t3;
+	if ($[3] !== columnLayout || $[4] !== columns || $[5] !== endIndex || $[6] !== headerHeight || $[7] !== setWidth || $[8] !== startIndex || $[9] !== tableId) {
+		let t4;
+		if ($[11] !== columnLayout || $[12] !== headerHeight || $[13] !== setWidth || $[14] !== tableId) {
+			t4 = (column) => {
 				const innerCell = column.renderHeader?.(column);
 				const style = {
 					height: headerHeight,
@@ -43,9 +54,46 @@ function Header(props) {
 						headerHeight
 					})]
 				}, column.id);
-			})
-		})
-	});
+			};
+			$[11] = columnLayout;
+			$[12] = headerHeight;
+			$[13] = setWidth;
+			$[14] = tableId;
+			$[15] = t4;
+		} else t4 = $[15];
+		t3 = columns.slice(startIndex, endIndex + 1).map(t4);
+		$[3] = columnLayout;
+		$[4] = columns;
+		$[5] = endIndex;
+		$[6] = headerHeight;
+		$[7] = setWidth;
+		$[8] = startIndex;
+		$[9] = tableId;
+		$[10] = t3;
+	} else t3 = $[10];
+	let t4;
+	if ($[16] !== t3) {
+		t4 = /* @__PURE__ */ jsx("div", {
+			role: "row",
+			style: t2,
+			children: t3
+		});
+		$[16] = t3;
+		$[17] = t4;
+	} else t4 = $[17];
+	let t5;
+	if ($[18] !== t1 || $[19] !== t4) {
+		t5 = /* @__PURE__ */ jsx("div", {
+			role: "rowgroup",
+			className: "ald-data-preview-header tw-z-[2] tw-w-full",
+			style: t1,
+			children: t4
+		});
+		$[18] = t1;
+		$[19] = t4;
+		$[20] = t5;
+	} else t5 = $[20];
+	return t5;
 }
 //#endregion
 export { Header as default };

package/dist/DataPreviewTable/components/Header/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../../src/DataPreviewTable/components/Header/index.tsx"],"sourcesContent":["import React from 'react';\nimport { cn } from '../../../lib/utils';\nimport { IColumnLayout, PreviewColumn } from '../../interface';\nimport DragBar from '../DragBar';\ninterface IHeader {\n  tableId: string;\n  contentWidth: number;\n  columns: PreviewColumn[];\n  columnLayout: IColumnLayout;\n  setWidth: (columnId: string, width: number) => void;\n  columnRange: [number, number];\n  headerHeight: number;\n}\nexport default function Header(props: IHeader) {\n  const {\n    tableId,\n    contentWidth,\n    columns,\n    columnLayout,\n    setWidth,\n    columnRange: [startIndex, endIndex],\n    headerHeight,\n  } = props;\n  return (\n    <div\n      role=\"rowgroup\"\n      className=\"ald-data-preview-header tw-z-[2] tw-w-full\"\n      style={{ width: contentWidth }}\n    >\n      <div role=\"row\" style={{ display: 'contents' }}>\n        {columns.slice(startIndex, endIndex + 1).map((column) => {\n          const innerCell = column.renderHeader?.(column);\n          const style: React.CSSProperties = {\n            height: headerHeight,\n            width: columnLayout[column.id].width,\n            top: 0,\n            left: columnLayout[column.id].left,\n            position: 'absolute',\n          };\n\n          return (\n            <div\n              id={`${tableId}-column-${encodeURIComponent(column.id)}`}\n              role=\"columnheader\"\n              aria-label={column.name}\n              className={cn(\n                'ald-data-preview-header-cell',\n                'tw-flex tw-items-center tw-border tw-border-l-0 tw-border-t-0 tw-border-solid tw-border-[var(--border-default)]',\n                'tw-bg-[var(--background-neutral-surface)] tw-font-medium tw-text-[var(--content-primary)]',\n              )}\n              key={column.id}\n              style={style}\n            >\n              {innerCell ? (\n                innerCell\n              ) : (\n                <div className=\"ald-data-preview-header-default tw-flex tw-size-full tw-items-center tw-bg-[var(--background-neutral-surface)] tw-p-1 tw-leading-6\">\n                  <div className=\"ald-data-preview-header-left tw-mr-1 tw-flex tw-h-full tw-items-center tw-justify-center tw-text-xs tw-text-[var(--content-secondary)]\">\n                    {column.icon !== undefined ? column.icon : <span></span>}\n                  </div>\n                  <div className=\"ald-data-preview-header-name tw-m-auto tw-truncate tw-text-left\">\n                    {column.name}\n                  </div>\n                </div>\n              )}\n              <DragBar\n                columnId={column.id}\n                wrapWidth={columnLayout[column.id].width}\n                onChange={setWidth}\n                headerHeight={headerHeight}\n              ></DragBar>\n            </div>\n          );\n        })}\n      </div>\n    </div>\n  );\n}\n"],"mappings":";;;;;AAaA,SAAwB,OAAO,OAAgB;CAC7C,MAAM,EACJ,SACA,cACA,SACA,cACA,UACA,aAAa,CAAC,YAAY,WAC1B,iBACE;AACJ,QACE,oBAAC,OAAD;EACE,MAAK;EACL,WAAU;EACV,OAAO,EAAE,OAAO,cAAc;YAE9B,oBAAC,OAAD;GAAK,MAAK;GAAM,OAAO,EAAE,SAAS,YAAY;aAC3C,QAAQ,MAAM,YAAY,WAAW,EAAE,CAAC,KAAK,WAAW;IACvD,MAAM,YAAY,OAAO,eAAe,OAAO;IAC/C,MAAM,QAA6B;KACjC,QAAQ;KACR,OAAO,aAAa,OAAO,IAAI;KAC/B,KAAK;KACL,MAAM,aAAa,OAAO,IAAI;KAC9B,UAAU;KACX;AAED,WACE,qBAAC,OAAD;KACE,IAAI,GAAG,QAAQ,UAAU,mBAAmB,OAAO,GAAG;KACtD,MAAK;KACL,cAAY,OAAO;KACnB,WAAW,GACT,gCACA,mHACA,4FACD;KAEM;eAVT,CAYG,YACC,YAEA,qBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,oBAAC,OAAD;OAAK,WAAU;iBACZ,OAAO,SAAS,SAAY,OAAO,OAAO,oBAAC,QAAD,EAAa,CAAA;OACpD,CAAA,EACN,oBAAC,OAAD;OAAK,WAAU;iBACZ,OAAO;OACJ,CAAA,CACF;SAER,oBAAC,iBAAD;MACE,UAAU,OAAO;MACjB,WAAW,aAAa,OAAO,IAAI;MACnC,UAAU;MACI;MACL,CAAA,CACP;OArBC,OAAO,GAqBR;KAER;GACE,CAAA;EACF,CAAA"}
+{"version":3,"file":"index.js","names":["React","cn","IColumnLayout","PreviewColumn","DragBar","IHeader","tableId","contentWidth","columns","columnLayout","setWidth","columnId","width","columnRange","headerHeight","Header","props","$","_c","t0","startIndex","endIndex","t1","t2","Symbol","for","display","t3","t4","column","innerCell","renderHeader","style","height","id","top","left","position","encodeURIComponent","name","icon","undefined","slice","map","t5"],"sources":["../../../../src/DataPreviewTable/components/Header/index.tsx"],"sourcesContent":["import React from 'react';\nimport { cn } from '../../../lib/utils';\nimport { IColumnLayout, PreviewColumn } from '../../interface';\nimport DragBar from '../DragBar';\ninterface IHeader {\n  tableId: string;\n  contentWidth: number;\n  columns: PreviewColumn[];\n  columnLayout: IColumnLayout;\n  setWidth: (columnId: string, width: number) => void;\n  columnRange: [number, number];\n  headerHeight: number;\n}\nexport default function Header(props: IHeader) {\n  const {\n    tableId,\n    contentWidth,\n    columns,\n    columnLayout,\n    setWidth,\n    columnRange: [startIndex, endIndex],\n    headerHeight,\n  } = props;\n  return (\n    <div\n      role=\"rowgroup\"\n      className=\"ald-data-preview-header tw-z-[2] tw-w-full\"\n      style={{ width: contentWidth }}\n    >\n      <div role=\"row\" style={{ display: 'contents' }}>\n        {columns.slice(startIndex, endIndex + 1).map((column) => {\n          const innerCell = column.renderHeader?.(column);\n          const style: React.CSSProperties = {\n            height: headerHeight,\n            width: columnLayout[column.id].width,\n            top: 0,\n            left: columnLayout[column.id].left,\n            position: 'absolute',\n          };\n\n          return (\n            <div\n              id={`${tableId}-column-${encodeURIComponent(column.id)}`}\n              role=\"columnheader\"\n              aria-label={column.name}\n              className={cn(\n                'ald-data-preview-header-cell',\n                'tw-flex tw-items-center tw-border tw-border-l-0 tw-border-t-0 tw-border-solid tw-border-[var(--border-default)]',\n                'tw-bg-[var(--background-neutral-surface)] tw-font-medium tw-text-[var(--content-primary)]',\n              )}\n              key={column.id}\n              style={style}\n            >\n              {innerCell ? (\n                innerCell\n              ) : (\n                <div className=\"ald-data-preview-header-default tw-flex tw-size-full tw-items-center tw-bg-[var(--background-neutral-surface)] tw-p-1 tw-leading-6\">\n                  <div className=\"ald-data-preview-header-left tw-mr-1 tw-flex tw-h-full tw-items-center tw-justify-center tw-text-xs tw-text-[var(--content-secondary)]\">\n                    {column.icon !== undefined ? column.icon : <span></span>}\n                  </div>\n                  <div className=\"ald-data-preview-header-name tw-m-auto tw-truncate tw-text-left\">\n                    {column.name}\n                  </div>\n                </div>\n              )}\n              <DragBar\n                columnId={column.id}\n                wrapWidth={columnLayout[column.id].width}\n                onChange={setWidth}\n                headerHeight={headerHeight}\n              ></DragBar>\n            </div>\n          );\n        })}\n      </div>\n    </div>\n  );\n}\n"],"mappings":";;;;;;AAaA,SAAee,OAAAC,OAAA;CAAA,MAAAC,IAAAC,EAAA,GAAA;CACb,MAAA,EAAAZ,SAAAC,cAAAC,SAAAC,cAAAC,UAAAG,aAAAM,IAAAL,iBAQIE;CAFW,MAAA,CAAAI,YAAAC,YAAAF;CAAsB,IAAAG;AAAA,KAAAL,EAAA,OAAAV,cAAA;AAO1Be,OAAA,EAAAV,OAASL,cAAc;AAAAU,IAAA,KAAAV;AAAAU,IAAA,KAAAK;OAAAA,MAAAL,EAAA;CAAA,IAAAM;AAAA,KAAAN,EAAA,OAAAO,OAAAC,IAAA,4BAAA,EAAA;AAEPF,OAAA,EAAAG,SAAW,YAAY;AAAAT,IAAA,KAAAM;OAAAA,MAAAN,EAAA;CAAA,IAAAU;AAAA,KAAAV,EAAA,OAAAR,gBAAAQ,EAAA,OAAAT,WAAAS,EAAA,OAAAI,YAAAJ,EAAA,OAAAH,gBAAAG,EAAA,OAAAP,YAAAO,EAAA,OAAAG,cAAAH,EAAA,OAAAX,SAAA;EAAA,IAAAsB;AAAA,MAAAX,EAAA,QAAAR,gBAAAQ,EAAA,QAAAH,gBAAAG,EAAA,QAAAP,YAAAO,EAAA,QAAAX,SAAA;AACCsB,SAAAC,WAAA;IAC3C,MAAAC,YAAkBD,OAAME,eAAgBF,OAAO;IAC/C,MAAAG,QAAmC;KAAAC,QACzBnB;KAAYF,OACbH,aAAaoB,OAAMK,IAAItB;KAAMuB,KAC/B;KAACC,MACA3B,aAAaoB,OAAMK,IAAIE;KAAKC,UACxB;KACX;AAAC,WAGA,qBAAA,OAAA;KACM,IAAA,GAAG/B,QAAO,UAAWgC,mBAAmBT,OAAMK,GAAI;KACjD,MAAA;KACO,cAAAL,OAAMU;KACP,WAAAtC,GACT,gCACA,mHACA,4FACF;KAEO+B;eAVT,CAYGF,YAAAA,YAGC,qBAAA,OAAA;MAAe,WAAA;gBAAf,CACE,oBAAA,OAAA;OAAe,WAAA;iBACZD,OAAMW,SAAUC,SAAYZ,OAAMW,OAAQ,oBAAA,QAAA,EAAY,CAAA;OAEzD,CAAA,EAAA,oBAAA,OAAA;OAAe,WAAA;iBACZX,OAAMU;OAEX,CAAA,CACF;SACA,oBAAC,iBAAD;MACY,UAAAV,OAAMK;MACL,WAAAzB,aAAaoB,OAAMK,IAAItB;MACxBF,UAAAA;MACII;MAElB,CAAA,CAAM;OArBCe,OAAMK,GAqBP;;AAETjB,KAAA,MAAAR;AAAAQ,KAAA,MAAAH;AAAAG,KAAA,MAAAP;AAAAO,KAAA,MAAAX;AAAAW,KAAA,MAAAW;QAAAA,MAAAX,EAAA;AA3CAU,OAAAnB,QAAOkC,MAAOtB,YAAYC,WAAW,EAAE,CAAAsB,IAAKf,GA2C3C;AAAAX,IAAA,KAAAR;AAAAQ,IAAA,KAAAT;AAAAS,IAAA,KAAAI;AAAAJ,IAAA,KAAAH;AAAAG,IAAA,KAAAP;AAAAO,IAAA,KAAAG;AAAAH,IAAA,KAAAX;AAAAW,IAAA,MAAAU;OAAAA,MAAAV,EAAA;CAAA,IAAAW;AAAA,KAAAX,EAAA,QAAAU,IAAA;AA5CJC,OAAA,oBAAA,OAAA;GAAU,MAAA;GAAa,OAAAL;aACpBI;GA4CG,CAAA;AAAAV,IAAA,MAAAU;AAAAV,IAAA,MAAAW;OAAAA,MAAAX,EAAA;CAAA,IAAA2B;AAAA,KAAA3B,EAAA,QAAAK,MAAAL,EAAA,QAAAW,IAAA;AAlDRgB,OAAA,oBAAA,OAAA;GACO,MAAA;GACK,WAAA;GACH,OAAAtB;aAEPM;GA8CI,CAAA;AAAAX,IAAA,MAAAK;AAAAL,IAAA,MAAAW;AAAAX,IAAA,MAAA2B;OAAAA,MAAA3B,EAAA;AAAA,QAnDN2B"}

package/dist/DataPreviewTable/components/Header.js

@@ -0,0 +1,2 @@
+export * from './Header/index.js';
+export { default } from './Header/index.js';

package/dist/DataPreviewTable/constant.js.map

@@ -1 +1 @@
-{"version":3,"file":"constant.js","names":[],"sources":["../../src/DataPreviewTable/constant.ts"],"sourcesContent":["export const CELL_HEIGHT = 20;\nexport const DEFAULT_HEADER_HEIGHT = 32;\nexport const DEFAULT_COLUMN_WIDTH = 100;\nexport const PRE_RENDER_RANGE = 100; //预渲染范围\n\nexport const UNDEFINED_INDEX = -1;\n\nexport const COLUMN_MIN_WIDTH = 50;\n"],"mappings":""}
+{"version":3,"file":"constant.js","names":["CELL_HEIGHT","DEFAULT_HEADER_HEIGHT","DEFAULT_COLUMN_WIDTH","PRE_RENDER_RANGE","UNDEFINED_INDEX","COLUMN_MIN_WIDTH"],"sources":["../../src/DataPreviewTable/constant.ts"],"sourcesContent":["export const CELL_HEIGHT = 20;\nexport const DEFAULT_HEADER_HEIGHT = 32;\nexport const DEFAULT_COLUMN_WIDTH = 100;\nexport const PRE_RENDER_RANGE = 100; //预渲染范围\n\nexport const UNDEFINED_INDEX = -1;\n\nexport const COLUMN_MIN_WIDTH = 50;\n"],"mappings":""}

package/dist/DataPreviewTable/hooks/useDirection.d.ts

@@ -1,6 +1,6 @@
 import { RefObject } from 'react';
-import { IColumnLayout, PreviewColumn } from '../interface';
-export default function useDirection(columns: PreviewColumn[], wrapRef: RefObject<HTMLDivElement>): {
+import { IColumnLayout, PreviewColumn } from '../interface.js';
+export default function useDirection(columns: PreviewColumn[], wrapRef: RefObject<HTMLDivElement | null>): {
     columnRange: [number, number];
     rowRange: [number, number];
     setColumnsWidth: (columnId: string, width: number) => void;

package/dist/DataPreviewTable/hooks/useDirection.js

@@ -3,161 +3,266 @@ import getColumnOffsetsFromWidths_default from "../utils/getColumnOffsetsFromWid
 import getColumnRange_default from "../utils/getColumnRange.js";
 import getRowRange_default from "../utils/getRowRange.js";
 import getTableLayout_default from "../utils/getTableLayout.js";
-import { useCallback, useEffect, useRef, useState } from "react";
+import { c } from "react-compiler-runtime";
+import { useEffect, useRef, useState } from "react";
 //#region src/DataPreviewTable/hooks/useDirection.ts
 function useDirection(columns, wrapRef) {
-	const prevScrollData = useRef({
-		scrollTop: 0,
-		scrollLeft: 0,
-		direction: {
-			vertical: EScrollVerticalDirection.SCROLL_TO_BOTTOM,
-			horizontal: EScrollHorizontalDirection.SCROLL_TO_RIGHT,
-			current: "init"
-		}
-	});
-	const [columnRange, setColumnRange] = useState([0, 0]);
-	const [rowRange, setRowRange] = useState([0, 0]);
-	const [tableColumns, setTableColumns] = useState([]);
-	const [contentWidth, setContentWidth] = useState(0);
-	const columnWidthRef = useRef({});
-	const getScrollDirection = useCallback((currentScrollTop, currentScrollLeft) => {
-		const { scrollTop: preScrollTop, scrollLeft: preScrollLeft } = prevScrollData.current;
-		if (currentScrollLeft > preScrollLeft) {
-			const direction = {
-				vertical: EScrollVerticalDirection.SCROLL_TO_BOTTOM,
-				horizontal: EScrollHorizontalDirection.SCROLL_TO_RIGHT,
-				current: EScrollHorizontalDirection.SCROLL_TO_RIGHT
-			};
-			prevScrollData.current = {
-				scrollTop: currentScrollTop,
-				scrollLeft: currentScrollLeft,
-				direction
-			};
-			return direction;
-		} else if (currentScrollLeft < preScrollLeft) {
-			const direction = {
-				vertical: EScrollVerticalDirection.SCROLL_TO_BOTTOM,
-				horizontal: EScrollHorizontalDirection.SCROLL_TO_LEFT,
-				current: EScrollHorizontalDirection.SCROLL_TO_LEFT
-			};
-			prevScrollData.current = {
-				scrollTop: currentScrollTop,
-				scrollLeft: currentScrollLeft,
-				direction
-			};
-			return direction;
-		} else if (currentScrollTop > preScrollTop) {
-			const direction = {
+	const $ = c(33);
+	let t0;
+	if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+		t0 = {
+			scrollTop: 0,
+			scrollLeft: 0,
+			direction: {
 				vertical: EScrollVerticalDirection.SCROLL_TO_BOTTOM,
 				horizontal: EScrollHorizontalDirection.SCROLL_TO_RIGHT,
-				current: EScrollVerticalDirection.SCROLL_TO_BOTTOM
-			};
-			prevScrollData.current = {
-				scrollTop: currentScrollTop,
-				scrollLeft: currentScrollLeft,
-				direction
-			};
-			return direction;
-		} else if (currentScrollTop < preScrollTop) {
-			const direction = {
-				vertical: EScrollVerticalDirection.SCROLL_TO_TOP,
-				horizontal: EScrollHorizontalDirection.SCROLL_TO_RIGHT,
-				current: EScrollVerticalDirection.SCROLL_TO_TOP
-			};
-			prevScrollData.current = {
-				scrollTop: currentScrollTop,
-				scrollLeft: currentScrollLeft,
-				direction
+				current: "init"
+			}
+		};
+		$[0] = t0;
+	} else t0 = $[0];
+	const prevScrollData = useRef(t0);
+	let t1;
+	if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
+		t1 = [0, 0];
+		$[1] = t1;
+	} else t1 = $[1];
+	const [columnRange, setColumnRange] = useState(t1);
+	let t2;
+	if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
+		t2 = [0, 0];
+		$[2] = t2;
+	} else t2 = $[2];
+	const [rowRange, setRowRange] = useState(t2);
+	let t3;
+	if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
+		t3 = [];
+		$[3] = t3;
+	} else t3 = $[3];
+	const [tableColumns, setTableColumns] = useState(t3);
+	const [contentWidth, setContentWidth] = useState(0);
+	let t4;
+	if ($[4] === Symbol.for("react.memo_cache_sentinel")) {
+		t4 = {};
+		$[4] = t4;
+	} else t4 = $[4];
+	const columnWidthRef = useRef(t4);
+	let t5;
+	if ($[5] === Symbol.for("react.memo_cache_sentinel")) {
+		t5 = (currentScrollTop, currentScrollLeft) => {
+			const { scrollTop: preScrollTop, scrollLeft: preScrollLeft } = prevScrollData.current;
+			if (currentScrollLeft > preScrollLeft) {
+				const direction = {
+					vertical: EScrollVerticalDirection.SCROLL_TO_BOTTOM,
+					horizontal: EScrollHorizontalDirection.SCROLL_TO_RIGHT,
+					current: EScrollHorizontalDirection.SCROLL_TO_RIGHT
+				};
+				prevScrollData.current = {
+					scrollTop: currentScrollTop,
+					scrollLeft: currentScrollLeft,
+					direction
+				};
+				return direction;
+			} else if (currentScrollLeft < preScrollLeft) {
+				const direction_0 = {
+					vertical: EScrollVerticalDirection.SCROLL_TO_BOTTOM,
+					horizontal: EScrollHorizontalDirection.SCROLL_TO_LEFT,
+					current: EScrollHorizontalDirection.SCROLL_TO_LEFT
+				};
+				prevScrollData.current = {
+					scrollTop: currentScrollTop,
+					scrollLeft: currentScrollLeft,
+					direction: direction_0
+				};
+				return direction_0;
+			} else if (currentScrollTop > preScrollTop) {
+				const direction_1 = {
+					vertical: EScrollVerticalDirection.SCROLL_TO_BOTTOM,
+					horizontal: EScrollHorizontalDirection.SCROLL_TO_RIGHT,
+					current: EScrollVerticalDirection.SCROLL_TO_BOTTOM
+				};
+				prevScrollData.current = {
+					scrollTop: currentScrollTop,
+					scrollLeft: currentScrollLeft,
+					direction: direction_1
+				};
+				return direction_1;
+			} else if (currentScrollTop < preScrollTop) {
+				const direction_2 = {
+					vertical: EScrollVerticalDirection.SCROLL_TO_TOP,
+					horizontal: EScrollHorizontalDirection.SCROLL_TO_RIGHT,
+					current: EScrollVerticalDirection.SCROLL_TO_TOP
+				};
+				prevScrollData.current = {
+					scrollTop: currentScrollTop,
+					scrollLeft: currentScrollLeft,
+					direction: direction_2
+				};
+				return direction_2;
+			} else return prevScrollData.current.direction;
+		};
+		$[5] = t5;
+	} else t5 = $[5];
+	const getScrollDirection = t5;
+	let t6;
+	if ($[6] === Symbol.for("react.memo_cache_sentinel")) {
+		t6 = [];
+		$[6] = t6;
+	} else t6 = $[6];
+	const [columnsOffsets, setColumnsOffsets] = useState(t6);
+	let t7;
+	if ($[7] !== wrapRef) {
+		t7 = (columnsOffsets_0) => {
+			const scrollTop = wrapRef.current?.scrollTop || 0;
+			const scrollLeft = wrapRef.current?.scrollLeft || 0;
+			const direction_3 = getScrollDirection(scrollTop, scrollLeft);
+			const columnRange_0 = getColumnRange_default({
+				direction: direction_3.horizontal,
+				wrapWidth: wrapRef.current?.clientWidth || 0,
+				scrollLeft,
+				columnsOffsets: columnsOffsets_0
+			});
+			if (columnRange_0) setColumnRange(columnRange_0);
+			const rowRange_0 = getRowRange_default({
+				direction: direction_3.vertical,
+				wrapHeight: wrapRef.current?.clientHeight || 0,
+				scrollTop
+			});
+			if (rowRange_0) setRowRange(rowRange_0);
+		};
+		$[7] = wrapRef;
+		$[8] = t7;
+	} else t7 = $[8];
+	const setRange = t7;
+	let t8;
+	if ($[9] === Symbol.for("react.memo_cache_sentinel")) {
+		t8 = {};
+		$[9] = t8;
+	} else t8 = $[9];
+	const [columnLayout, setColumnLayout] = useState(t8);
+	let t9;
+	if ($[10] !== columnsOffsets || $[11] !== setRange) {
+		t9 = () => {
+			setRange(columnsOffsets);
+		};
+		$[10] = columnsOffsets;
+		$[11] = setRange;
+		$[12] = t9;
+	} else t9 = $[12];
+	const onScroll = t9;
+	let t10;
+	let t11;
+	if ($[13] !== columns || $[14] !== setRange) {
+		t10 = () => {
+			if (columns.length > 0) {
+				const columnWidths = columns.map((t12) => {
+					const { defaultWidth, id } = t12;
+					const width = columnWidthRef.current[id] || defaultWidth || 100;
+					columnWidthRef.current[id] = width;
+					return width;
+				});
+				const contentWidth_0 = columnWidths.reduce(_temp, 0);
+				const offsets = getColumnOffsetsFromWidths_default(columnWidths);
+				const columnLayout_0 = getTableLayout_default(columns, columnWidths);
+				setContentWidth(contentWidth_0);
+				setColumnsOffsets(offsets);
+				setColumnLayout(columnLayout_0);
+				setRange(offsets);
+				setTableColumns(columns);
+			} else {
+				setContentWidth(0);
+				setColumnsOffsets([]);
+				setColumnLayout({});
+				setTableColumns([]);
+			}
+		};
+		t11 = [columns, setRange];
+		$[13] = columns;
+		$[14] = setRange;
+		$[15] = t10;
+		$[16] = t11;
+	} else {
+		t10 = $[15];
+		t11 = $[16];
+	}
+	useEffect(t10, t11);
+	let t12;
+	if ($[17] !== columns || $[18] !== setRange) {
+		t12 = (columnId, width_1) => {
+			columnWidthRef.current[columnId] = width_1;
+			const columnWidths_0 = columns.map((t13) => {
+				const { id: id_0 } = t13;
+				return columnWidthRef.current[id_0];
+			});
+			const offsets_0 = getColumnOffsetsFromWidths_default(columnWidths_0);
+			const columnLayout_1 = getTableLayout_default(columns, columnWidths_0);
+			setContentWidth(columnWidths_0.reduce(_temp2, 0));
+			setColumnsOffsets(offsets_0);
+			setColumnLayout(columnLayout_1);
+			setRange(offsets_0);
+		};
+		$[17] = columns;
+		$[18] = setRange;
+		$[19] = t12;
+	} else t12 = $[19];
+	const setColumnsWidth = t12;
+	let t13;
+	let t14;
+	if ($[20] !== columnsOffsets || $[21] !== setRange || $[22] !== wrapRef) {
+		t13 = () => {
+			const wrap = wrapRef.current;
+			const resizeObserver = new ResizeObserver((entries) => {
+				for (const entry of entries) if (entry.contentRect) setRange(columnsOffsets);
+				else if (entry.contentBoxSize) setRange(columnsOffsets);
+			});
+			resizeObserver.observe(wrap);
+			return () => {
+				resizeObserver.unobserve(wrap);
+				resizeObserver.disconnect();
 			};
-			return direction;
-		} else return prevScrollData.current.direction;
-	}, []);
-	const [columnsOffsets, setColumnsOffsets] = useState([]);
-	const setRange = useCallback((columnsOffsets) => {
-		const scrollTop = wrapRef.current?.scrollTop || 0;
-		const scrollLeft = wrapRef.current?.scrollLeft || 0;
-		const direction = getScrollDirection(scrollTop, scrollLeft);
-		const columnRange = getColumnRange_default({
-			direction: direction.horizontal,
-			wrapWidth: wrapRef.current?.clientWidth || 0,
-			scrollLeft,
+		};
+		t14 = [
+			wrapRef,
+			setRange,
 			columnsOffsets
-		});
-		if (columnRange) setColumnRange(columnRange);
-		const rowRange = getRowRange_default({
-			direction: direction.vertical,
-			wrapHeight: wrapRef.current?.clientHeight || 0,
-			scrollTop
-		});
-		if (rowRange) setRowRange(rowRange);
-	}, [getScrollDirection, wrapRef]);
-	const [columnLayout, setColumnLayout] = useState({});
-	const onScroll = () => {
-		setRange(columnsOffsets);
-	};
-	useEffect(() => {
-		if (columns.length > 0) {
-			const columnWidths = columns.map(({ defaultWidth, id }) => {
-				const width = columnWidthRef.current[id] || defaultWidth || 100;
-				columnWidthRef.current[id] = width;
-				return width;
-			});
-			const contentWidth = columnWidths.reduce((sum, width) => {
-				return sum + width;
-			}, 0);
-			const offsets = getColumnOffsetsFromWidths_default(columnWidths);
-			const columnLayout = getTableLayout_default(columns, columnWidths);
-			setContentWidth(contentWidth);
-			setColumnsOffsets(offsets);
-			setColumnLayout(columnLayout);
-			setRange(offsets);
-			setTableColumns(columns);
-		} else {
-			setContentWidth(0);
-			setColumnsOffsets([]);
-			setColumnLayout({});
-			setTableColumns([]);
-		}
-	}, [columns, setRange]);
-	const setColumnsWidth = useCallback((columnId, width) => {
-		columnWidthRef.current[columnId] = width;
-		const columnWidths = columns.map(({ id }) => {
-			return columnWidthRef.current[id];
-		});
-		const offsets = getColumnOffsetsFromWidths_default(columnWidths);
-		const columnLayout = getTableLayout_default(columns, columnWidths);
-		setContentWidth(columnWidths.reduce((sum, width) => {
-			return sum + width;
-		}, 0));
-		setColumnsOffsets(offsets);
-		setColumnLayout(columnLayout);
-		setRange(offsets);
-	}, [columns, setRange]);
-	useEffect(() => {
-		const wrap = wrapRef.current;
-		const resizeObserver = new ResizeObserver((entries) => {
-			for (const entry of entries) if (entry.contentRect) setRange(columnsOffsets);
-			else if (entry.contentBoxSize) setRange(columnsOffsets);
-		});
-		resizeObserver.observe(wrap);
-		return () => {
-			resizeObserver.unobserve(wrap);
-			resizeObserver.disconnect();
+		];
+		$[20] = columnsOffsets;
+		$[21] = setRange;
+		$[22] = wrapRef;
+		$[23] = t13;
+		$[24] = t14;
+	} else {
+		t13 = $[23];
+		t14 = $[24];
+	}
+	useEffect(t13, t14);
+	let t15;
+	if ($[25] !== columnLayout || $[26] !== columnRange || $[27] !== contentWidth || $[28] !== onScroll || $[29] !== rowRange || $[30] !== setColumnsWidth || $[31] !== tableColumns) {
+		t15 = {
+			columnRange,
+			rowRange,
+			setColumnsWidth,
+			columnLayout,
+			contentWidth,
+			tableColumns,
+			onScroll
 		};
-	}, [
-		wrapRef,
-		setRange,
-		columnsOffsets
-	]);
-	return {
-		columnRange,
-		rowRange,
-		setColumnsWidth,
-		columnLayout,
-		contentWidth,
-		tableColumns,
-		onScroll
-	};
+		$[25] = columnLayout;
+		$[26] = columnRange;
+		$[27] = contentWidth;
+		$[28] = onScroll;
+		$[29] = rowRange;
+		$[30] = setColumnsWidth;
+		$[31] = tableColumns;
+		$[32] = t15;
+	} else t15 = $[32];
+	return t15;
+}
+function _temp2(sum_0, width_2) {
+	return sum_0 + width_2;
+}
+function _temp(sum, width_0) {
+	return sum + width_0;
 }
 //#endregion
 export { useDirection as default };

package/dist/DataPreviewTable/hooks/useDirection.js.map

@@ -1 +1 @@
-{"version":3,"file":"useDirection.js","names":[],"sources":["../../../src/DataPreviewTable/hooks/useDirection.ts"],"sourcesContent":["import { RefObject, useCallback, useEffect, useRef, useState } from 'react';\nimport { DEFAULT_COLUMN_WIDTH } from '../constant';\nimport {\n  EScrollHorizontalDirection,\n  EScrollVerticalDirection,\n  IColumnLayout,\n  IScrollData,\n  PreviewColumn,\n} from '../interface';\nimport getColumnOffsetsFromWidths from '../utils/getColumnOffsetsFromWidths';\nimport getColumnRange from '../utils/getColumnRange';\nimport getRowRange from '../utils/getRowRange';\nimport getTableLayout from '../utils/getTableLayout';\nexport default function useDirection(\n  columns: PreviewColumn[],\n  wrapRef: RefObject<HTMLDivElement>,\n) {\n  const prevScrollData = useRef<IScrollData>({\n    scrollTop: 0,\n    scrollLeft: 0,\n    direction: {\n      vertical: EScrollVerticalDirection.SCROLL_TO_BOTTOM,\n      horizontal: EScrollHorizontalDirection.SCROLL_TO_RIGHT,\n      current: 'init',\n    },\n  });\n\n  const [columnRange, setColumnRange] = useState<[number, number]>([0, 0]);\n  const [rowRange, setRowRange] = useState<[number, number]>([0, 0]);\n  const [tableColumns, setTableColumns] = useState<PreviewColumn[]>([]);\n  const [contentWidth, setContentWidth] = useState<number>(0);\n  const columnWidthRef = useRef<{\n    [id: string]: number;\n  }>({});\n  const getScrollDirection = useCallback(\n    (currentScrollTop: number, currentScrollLeft: number) => {\n      const { scrollTop: preScrollTop, scrollLeft: preScrollLeft } =\n        prevScrollData.current;\n\n      if (currentScrollLeft > preScrollLeft) {\n        const direction = {\n          vertical: EScrollVerticalDirection.SCROLL_TO_BOTTOM,\n          horizontal: EScrollHorizontalDirection.SCROLL_TO_RIGHT,\n          current: EScrollHorizontalDirection.SCROLL_TO_RIGHT,\n        };\n        prevScrollData.current = {\n          scrollTop: currentScrollTop,\n          scrollLeft: currentScrollLeft,\n          direction,\n        };\n        return direction;\n      } else if (currentScrollLeft < preScrollLeft) {\n        const direction = {\n          vertical: EScrollVerticalDirection.SCROLL_TO_BOTTOM,\n          horizontal: EScrollHorizontalDirection.SCROLL_TO_LEFT,\n          current: EScrollHorizontalDirection.SCROLL_TO_LEFT,\n        };\n        prevScrollData.current = {\n          scrollTop: currentScrollTop,\n          scrollLeft: currentScrollLeft,\n          direction,\n        };\n        return direction;\n      } else if (currentScrollTop > preScrollTop) {\n        const direction = {\n          vertical: EScrollVerticalDirection.SCROLL_TO_BOTTOM,\n          horizontal: EScrollHorizontalDirection.SCROLL_TO_RIGHT,\n          current: EScrollVerticalDirection.SCROLL_TO_BOTTOM,\n        };\n        prevScrollData.current = {\n          scrollTop: currentScrollTop,\n          scrollLeft: currentScrollLeft,\n          direction,\n        };\n        return direction;\n      } else if (currentScrollTop < preScrollTop) {\n        const direction = {\n          vertical: EScrollVerticalDirection.SCROLL_TO_TOP,\n          horizontal: EScrollHorizontalDirection.SCROLL_TO_RIGHT,\n          current: EScrollVerticalDirection.SCROLL_TO_TOP,\n        };\n        prevScrollData.current = {\n          scrollTop: currentScrollTop,\n          scrollLeft: currentScrollLeft,\n          direction,\n        };\n        return direction;\n      } else {\n        return prevScrollData.current.direction;\n      }\n    },\n    [],\n  );\n  const [columnsOffsets, setColumnsOffsets] = useState<number[]>([]);\n\n  const setRange = useCallback(\n    (columnsOffsets: number[]) => {\n      const scrollTop: number = wrapRef.current?.scrollTop || 0;\n      const scrollLeft: number = wrapRef.current?.scrollLeft || 0;\n      const direction = getScrollDirection(scrollTop, scrollLeft);\n\n      const columnRange = getColumnRange({\n        direction: direction.horizontal,\n        wrapWidth: wrapRef.current?.clientWidth || 0,\n        scrollLeft,\n        columnsOffsets,\n      });\n\n      if (columnRange) {\n        setColumnRange(columnRange);\n      }\n      const rowRange = getRowRange({\n        direction: direction.vertical,\n        wrapHeight: wrapRef.current?.clientHeight || 0,\n        scrollTop,\n      });\n      if (rowRange) {\n        setRowRange(rowRange);\n      }\n    },\n    [getScrollDirection, wrapRef],\n  );\n  const [columnLayout, setColumnLayout] = useState<IColumnLayout>({});\n  const onScroll = () => {\n    setRange(columnsOffsets);\n  };\n  useEffect(() => {\n    if (columns.length > 0) {\n      // 存在有效的列\n      // 计算列宽\n      const columnWidths = columns.map(({ defaultWidth, id }) => {\n        const width =\n          columnWidthRef.current[id] || defaultWidth || DEFAULT_COLUMN_WIDTH;\n        columnWidthRef.current[id] = width;\n        return width;\n      });\n\n      // 计算contentWidth\n      const contentWidth = columnWidths.reduce((sum, width) => {\n        return sum + width;\n      }, 0);\n      // 计算columnsOffsets\n      const offsets = getColumnOffsetsFromWidths(columnWidths);\n      // 计算columnLayout\n      const columnLayout = getTableLayout(columns, columnWidths);\n\n      setContentWidth(contentWidth);\n      setColumnsOffsets(offsets);\n      setColumnLayout(columnLayout);\n      setRange(offsets);\n      setTableColumns(columns);\n    } else {\n      // 没有有效的列\n      setContentWidth(0);\n      setColumnsOffsets([]);\n      setColumnLayout({});\n      // setRange();\n      setTableColumns([]);\n    }\n  }, [columns, setRange]);\n  const setColumnsWidth = useCallback(\n    (columnId: string, width: number) => {\n      columnWidthRef.current[columnId] = width;\n      const columnWidths = columns.map(({ id }) => {\n        return columnWidthRef.current[id];\n      });\n      const offsets = getColumnOffsetsFromWidths(columnWidths);\n      const columnLayout = getTableLayout(columns, columnWidths);\n      setContentWidth(\n        columnWidths.reduce((sum, width) => {\n          return sum + width;\n        }, 0),\n      );\n      setColumnsOffsets(offsets);\n      setColumnLayout(columnLayout);\n      setRange(offsets);\n    },\n    [columns, setRange],\n  );\n\n  useEffect(() => {\n    const wrap = wrapRef.current;\n    const resizeObserver = new ResizeObserver((entries) => {\n      for (const entry of entries) {\n        if (entry.contentRect) {\n          setRange(columnsOffsets);\n        } else if (entry.contentBoxSize) {\n          setRange(columnsOffsets);\n        }\n      }\n    });\n    resizeObserver.observe(wrap as Element);\n    return () => {\n      resizeObserver.unobserve(wrap as Element);\n      resizeObserver.disconnect();\n    };\n  }, [wrapRef, setRange, columnsOffsets]);\n\n  return {\n    columnRange,\n    rowRange,\n    setColumnsWidth,\n    columnLayout,\n    contentWidth,\n    tableColumns,\n    onScroll,\n  };\n}\n"],"mappings":"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"}
+{"version":3,"file":"useDirection.js","names":["RefObject","useCallback","useEffect","useRef","useState","DEFAULT_COLUMN_WIDTH","EScrollHorizontalDirection","EScrollVerticalDirection","IColumnLayout","IScrollData","PreviewColumn","getColumnOffsetsFromWidths","getColumnRange","getRowRange","getTableLayout","useDirection","columns","wrapRef","$","_c","t0","Symbol","for","scrollTop","scrollLeft","direction","vertical","SCROLL_TO_BOTTOM","horizontal","SCROLL_TO_RIGHT","current","prevScrollData","t1","columnRange","setColumnRange","t2","rowRange","setRowRange","t3","tableColumns","setTableColumns","contentWidth","setContentWidth","t4","columnWidthRef","t5","currentScrollTop","currentScrollLeft","preScrollTop","preScrollLeft","direction_0","SCROLL_TO_LEFT","direction_1","direction_2","SCROLL_TO_TOP","getScrollDirection","t6","columnsOffsets","setColumnsOffsets","t7","columnsOffsets_0","direction_3","columnRange_0","wrapWidth","clientWidth","rowRange_0","wrapHeight","clientHeight","setRange","t8","columnLayout","setColumnLayout","t9","onScroll","t10","t11","length","columnWidths","map","t12","defaultWidth","id","width","contentWidth_0","reduce","_temp","offsets","columnLayout_0","columnId","width_1","columnWidths_0","t13","id_0","offsets_0","columnLayout_1","_temp2","setColumnsWidth","t14","wrap","resizeObserver","ResizeObserver","entries","entry","contentRect","contentBoxSize","observe","Element","unobserve","disconnect","t15","sum_0","width_2","sum","width_0"],"sources":["../../../src/DataPreviewTable/hooks/useDirection.ts"],"sourcesContent":["import { RefObject, useCallback, useEffect, useRef, useState } from 'react';\nimport { DEFAULT_COLUMN_WIDTH } from '../constant';\nimport {\n  EScrollHorizontalDirection,\n  EScrollVerticalDirection,\n  IColumnLayout,\n  IScrollData,\n  PreviewColumn,\n} from '../interface';\nimport getColumnOffsetsFromWidths from '../utils/getColumnOffsetsFromWidths';\nimport getColumnRange from '../utils/getColumnRange';\nimport getRowRange from '../utils/getRowRange';\nimport getTableLayout from '../utils/getTableLayout';\nexport default function useDirection(\n  columns: PreviewColumn[],\n  wrapRef: RefObject<HTMLDivElement | null>,\n) {\n  const prevScrollData = useRef<IScrollData>({\n    scrollTop: 0,\n    scrollLeft: 0,\n    direction: {\n      vertical: EScrollVerticalDirection.SCROLL_TO_BOTTOM,\n      horizontal: EScrollHorizontalDirection.SCROLL_TO_RIGHT,\n      current: 'init',\n    },\n  });\n\n  const [columnRange, setColumnRange] = useState<[number, number]>([0, 0]);\n  const [rowRange, setRowRange] = useState<[number, number]>([0, 0]);\n  const [tableColumns, setTableColumns] = useState<PreviewColumn[]>([]);\n  const [contentWidth, setContentWidth] = useState<number>(0);\n  const columnWidthRef = useRef<{\n    [id: string]: number;\n  }>({});\n  const getScrollDirection = useCallback(\n    (currentScrollTop: number, currentScrollLeft: number) => {\n      const { scrollTop: preScrollTop, scrollLeft: preScrollLeft } =\n        prevScrollData.current;\n\n      if (currentScrollLeft > preScrollLeft) {\n        const direction = {\n          vertical: EScrollVerticalDirection.SCROLL_TO_BOTTOM,\n          horizontal: EScrollHorizontalDirection.SCROLL_TO_RIGHT,\n          current: EScrollHorizontalDirection.SCROLL_TO_RIGHT,\n        };\n        prevScrollData.current = {\n          scrollTop: currentScrollTop,\n          scrollLeft: currentScrollLeft,\n          direction,\n        };\n        return direction;\n      } else if (currentScrollLeft < preScrollLeft) {\n        const direction = {\n          vertical: EScrollVerticalDirection.SCROLL_TO_BOTTOM,\n          horizontal: EScrollHorizontalDirection.SCROLL_TO_LEFT,\n          current: EScrollHorizontalDirection.SCROLL_TO_LEFT,\n        };\n        prevScrollData.current = {\n          scrollTop: currentScrollTop,\n          scrollLeft: currentScrollLeft,\n          direction,\n        };\n        return direction;\n      } else if (currentScrollTop > preScrollTop) {\n        const direction = {\n          vertical: EScrollVerticalDirection.SCROLL_TO_BOTTOM,\n          horizontal: EScrollHorizontalDirection.SCROLL_TO_RIGHT,\n          current: EScrollVerticalDirection.SCROLL_TO_BOTTOM,\n        };\n        prevScrollData.current = {\n          scrollTop: currentScrollTop,\n          scrollLeft: currentScrollLeft,\n          direction,\n        };\n        return direction;\n      } else if (currentScrollTop < preScrollTop) {\n        const direction = {\n          vertical: EScrollVerticalDirection.SCROLL_TO_TOP,\n          horizontal: EScrollHorizontalDirection.SCROLL_TO_RIGHT,\n          current: EScrollVerticalDirection.SCROLL_TO_TOP,\n        };\n        prevScrollData.current = {\n          scrollTop: currentScrollTop,\n          scrollLeft: currentScrollLeft,\n          direction,\n        };\n        return direction;\n      } else {\n        return prevScrollData.current.direction;\n      }\n    },\n    [],\n  );\n  const [columnsOffsets, setColumnsOffsets] = useState<number[]>([]);\n\n  const setRange = useCallback(\n    (columnsOffsets: number[]) => {\n      const scrollTop: number = wrapRef.current?.scrollTop || 0;\n      const scrollLeft: number = wrapRef.current?.scrollLeft || 0;\n      const direction = getScrollDirection(scrollTop, scrollLeft);\n\n      const columnRange = getColumnRange({\n        direction: direction.horizontal,\n        wrapWidth: wrapRef.current?.clientWidth || 0,\n        scrollLeft,\n        columnsOffsets,\n      });\n\n      if (columnRange) {\n        setColumnRange(columnRange);\n      }\n      const rowRange = getRowRange({\n        direction: direction.vertical,\n        wrapHeight: wrapRef.current?.clientHeight || 0,\n        scrollTop,\n      });\n      if (rowRange) {\n        setRowRange(rowRange);\n      }\n    },\n    [getScrollDirection, wrapRef],\n  );\n  const [columnLayout, setColumnLayout] = useState<IColumnLayout>({});\n  const onScroll = () => {\n    setRange(columnsOffsets);\n  };\n  useEffect(() => {\n    if (columns.length > 0) {\n      // 存在有效的列\n      // 计算列宽\n      const columnWidths = columns.map(({ defaultWidth, id }) => {\n        const width =\n          columnWidthRef.current[id] || defaultWidth || DEFAULT_COLUMN_WIDTH;\n        columnWidthRef.current[id] = width;\n        return width;\n      });\n\n      // 计算contentWidth\n      const contentWidth = columnWidths.reduce((sum, width) => {\n        return sum + width;\n      }, 0);\n      // 计算columnsOffsets\n      const offsets = getColumnOffsetsFromWidths(columnWidths);\n      // 计算columnLayout\n      const columnLayout = getTableLayout(columns, columnWidths);\n\n      setContentWidth(contentWidth);\n      setColumnsOffsets(offsets);\n      setColumnLayout(columnLayout);\n      setRange(offsets);\n      setTableColumns(columns);\n    } else {\n      // 没有有效的列\n      setContentWidth(0);\n      setColumnsOffsets([]);\n      setColumnLayout({});\n      // setRange();\n      setTableColumns([]);\n    }\n  }, [columns, setRange]);\n  const setColumnsWidth = useCallback(\n    (columnId: string, width: number) => {\n      columnWidthRef.current[columnId] = width;\n      const columnWidths = columns.map(({ id }) => {\n        return columnWidthRef.current[id];\n      });\n      const offsets = getColumnOffsetsFromWidths(columnWidths);\n      const columnLayout = getTableLayout(columns, columnWidths);\n      setContentWidth(\n        columnWidths.reduce((sum, width) => {\n          return sum + width;\n        }, 0),\n      );\n      setColumnsOffsets(offsets);\n      setColumnLayout(columnLayout);\n      setRange(offsets);\n    },\n    [columns, setRange],\n  );\n\n  useEffect(() => {\n    const wrap = wrapRef.current;\n    const resizeObserver = new ResizeObserver((entries) => {\n      for (const entry of entries) {\n        if (entry.contentRect) {\n          setRange(columnsOffsets);\n        } else if (entry.contentBoxSize) {\n          setRange(columnsOffsets);\n        }\n      }\n    });\n    resizeObserver.observe(wrap as Element);\n    return () => {\n      resizeObserver.unobserve(wrap as Element);\n      resizeObserver.disconnect();\n    };\n  }, [wrapRef, setRange, columnsOffsets]);\n\n  return {\n    columnRange,\n    rowRange,\n    setColumnsWidth,\n    columnLayout,\n    contentWidth,\n    tableColumns,\n    onScroll,\n  };\n}\n"],"mappings":"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"}

package/dist/DataPreviewTable/index.d.ts

@@ -1,4 +1,4 @@
 import { default as React } from 'react';
 import { DataPreviewTableRef, ITableProps } from './interface.js';
-declare const _default: React.MemoExoticComponent<React.ForwardRefExoticComponent<ITableProps & React.RefAttributes<DataPreviewTableRef>>>;
+declare const _default: React.NamedExoticComponent<ITableProps & React.RefAttributes<DataPreviewTableRef>>;
 export default _default;

package/dist/DataPreviewTable/index.js

@@ -29,14 +29,14 @@ var DataPreviewTable_default = memo(forwardRef(function(props, ref) {
 			const columnPos = columnLayout[columnId];
 			if (!columnPos) return;
 			const { scrollLeft } = wrapRef.current;
-			const { left, width } = columnPos;
+			const { left, width: width_0 } = columnPos;
 			const containerWidth = wrapRef.current?.clientWidth || 0;
 			if (left < scrollLeft) wrapRef.current?.scrollTo({
 				left,
 				behavior: "smooth"
 			});
-			else if (left + width > scrollLeft + containerWidth) wrapRef.current?.scrollTo({
-				left: left + width - containerWidth,
+			else if (left + width_0 > scrollLeft + containerWidth) wrapRef.current?.scrollTo({
+				left: left + width_0 - containerWidth,
 				behavior: "smooth"
 			});
 		},