fix: refine scrollIntoView with offset handling

- Simplify scrollY demo buttons
- Update README to note virtual table doesn't support center align
- Refactor offset logic: call scrollIntoView first, then apply offset via scrollTo

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

Author: 刘欢

README.md

@@ -136,7 +136,7 @@ tblRef.current?.scrollTo({ key: 'rowKey', align: 'start' });
 | top | number | - | Scroll to specific top position (in px) |
 | key | string | - | Scroll to row by row key |
 | offset | number | - | Additional offset from target position |
-| align | `start` \| `center` \| `end` \| `nearest` | `nearest` | Alignment of the target element within the scroll container. `start` aligns to top, `center` to middle, `end` to bottom, `nearest` automatically chooses the closest alignment |
+| align | `start` \| `center` \| `end` \| `nearest` | `nearest` | Alignment of the target element within the scroll container. `start` aligns to top, `center` to middle, `end` to bottom, `nearest` automatically chooses the closest alignment. Note: Virtual table does not support `center`. |
 
 ## Column Props
 

docs/examples/scrollY.tsx

@@ -41,103 +41,35 @@ const Test = () => {
   return (
     <div>
       <h2>scroll body table</h2>
-      <button
-        onClick={() => {
-          tblRef.current?.scrollTo({
-            top: 9999,
-          });
-        }}
-      >
-        Scroll To End
+      <button onClick={() => tblRef.current?.scrollTo({ top: 0 })}>Top</button>
+      <button onClick={() => tblRef.current?.scrollTo({ top: 9999 })}>End</button>
+      <button onClick={() => tblRef.current?.scrollTo({ key: 9 })}>Key 9</button>
+      <button onClick={() => tblRef.current?.scrollTo({ key: 9, align: 'start' })}>
+        Key 9 align: start
       </button>
-      <button
-        onClick={() => {
-          tblRef.current?.scrollTo({
-            key: 9,
-          });
-        }}
-      >
-        Scroll To key 9
+      <button onClick={() => tblRef.current?.scrollTo({ key: 9, align: 'center' })}>
+        Key 9 align: center
       </button>
-      <button
-        onClick={() => {
-          tblRef.current?.scrollTo({
-            top: 0,
-          });
-        }}
-      >
-        Scroll To top
+      <button onClick={() => tblRef.current?.scrollTo({ key: 9, align: 'end' })}>
+        Key 9 align: end
       </button>
-      <button
-        onClick={() => {
-          tblRef.current?.scrollTo({
-            index: 5,
-            offset: -10,
-          });
-        }}
-      >
-        Scroll To Index 5 + Offset -10
+      <button onClick={() => tblRef.current?.scrollTo({ key: 9, align: 'nearest' })}>
+        Key 9 align: nearest
       </button>
-      <button
-        onClick={() => {
-          tblRef.current?.scrollTo({
-            key: 6,
-            offset: -10,
-          });
-        }}
-      >
-        Scroll To Key 6 + Offset -10
+      <button onClick={() => tblRef.current?.scrollTo({ key: 9, align: 'start', offset: 20 })}>
+        Key 9 start offset20
       </button>
-      <button
-        onClick={() => {
-          tblRef.current?.scrollTo({
-            key: 9,
-            align: 'start',
-          });
-        }}
-      >
-        Scroll To key 9 (align: start)
+      <button onClick={() => tblRef.current?.scrollTo({ key: 9, align: 'center', offset: 20 })}>
+        Key 9 center offset20
       </button>
-      <button
-        onClick={() => {
-          tblRef.current?.scrollTo({
-            key: 9,
-            align: 'center',
-          });
-        }}
-      >
-        Scroll To key 9 (align: center)
+      <button onClick={() => tblRef.current?.scrollTo({ key: 9, align: 'end', offset: 20 })}>
+        Key 9 end offset20
       </button>
-      <button
-        onClick={() => {
-          tblRef.current?.scrollTo({
-            key: 9,
-            align: 'end',
-          });
-        }}
-      >
-        Scroll To key 9 (align: end)
+      <button onClick={() => tblRef.current?.scrollTo({ key: 9, align: 'nearest', offset: 20 })}>
+        Key 9 nearest offset20
       </button>
-      <button
-        onClick={() => {
-          tblRef.current?.scrollTo({
-            key: 9,
-            align: 'nearest',
-          });
-        }}
-      >
-        Scroll To key 9 (align: nearest)
-      </button>
-      <button
-        onClick={() => {
-          tblRef.current?.scrollTo({
-            index: 9,
-            offset: 50,
-            align: 'nearest',
-          });
-        }}
-      >
-        Scroll To index 9 + offset 50 (align: nearest)
+      <button onClick={() => tblRef.current?.scrollTo({ index: 5, offset: 50 })}>
+        Index 5 + Offset 50
       </button>
       <Table
         ref={tblRef}

src/Table.tsx

@@ -351,7 +351,7 @@ const Table = <RecordType extends DefaultRecordType>(
       scrollTo: config => {
         if (scrollBodyRef.current instanceof HTMLElement) {
           // Native scroll
-          const { index, top, key, offset, align } = config;
+          const { index, top, key, offset, align = 'nearest' } = config;
 
           if (validNumberValue(top)) {
             // In top mode, offset is ignored
@@ -362,16 +362,14 @@ const Table = <RecordType extends DefaultRecordType>(
               `[data-row-key="${mergedKey}"]`,
             );
             if (targetElement) {
-              if (!offset) {
-                targetElement.scrollIntoView({ block: align ?? 'nearest' });
-              } else {
+              targetElement.scrollIntoView({ block: align });
+              if (offset) {
                 const container = scrollBodyRef.current;
                 const elementTop = (targetElement as HTMLElement).offsetTop;
                 const elementHeight = (targetElement as HTMLElement).offsetHeight;
                 const containerHeight = container.clientHeight;
                 const elementBottom = elementTop + elementHeight;
                 let targetTop: number;
-
                 switch (align) {
                   case 'nearest': {
                     const currentTop = container.scrollTop;

tests/refs.spec.tsx

@@ -169,7 +169,6 @@ describe('Table.Ref', () => {
 
     // align start + offset 20 = 0 + 20 = 20
     ref.current.scrollTo({ index: 0, align: 'start', offset: 20 });
-    expect(scrollIntoViewElement).toBeNull();
     expect(scrollParam.top).toEqual(20);
 
     // align center + offset 30 = 0 + 30 = 30