feat: 更新滚动行为和添加wrapperRef支持

- 添加scrollIntoViewV2函数，改进滚动居中行为
- 为DataGrid组件添加wrapperRef支持
- 更新依赖版本和配置
- 调整路由文件结构

Author: royue

biome.json

@@ -1,6 +1,12 @@
 {
   "$schema": "./node_modules/@biomejs/biome/configuration_schema.json",
-  "assist": { "actions": { "source": { "organizeImports": "off" } } },
+  "assist": {
+    "actions": {
+      "source": {
+        "organizeImports": "off"
+      }
+    }
+  },
   "files": {
     "includes": [
       "**",
@@ -17,7 +23,15 @@
     ]
   },
   "formatter": {
-    "enabled": false
+    "enabled": false,
+    "includes": [
+      "**",
+      "!**/*.ts",
+      "!**/*.tsx",
+      "!package.json"
+    ],
+    "indentStyle": "space",
+    "lineWidth": 100
   },
   "json": {
     "parser": {
@@ -218,11 +232,15 @@
           "options": {
             "paths": {
               "react": {
-                "importNames": ["default"],
+                "importNames": [
+                  "default"
+                ],
                 "message": "Use named imports instead."
               },
               "react-dom": {
-                "importNames": ["default"],
+                "importNames": [
+                  "default"
+                ],
                 "message": "Use named imports instead."
               }
             }
@@ -351,7 +369,9 @@
   },
   "overrides": [
     {
-      "includes": ["**/*.test.*"],
+      "includes": [
+        "**/*.test.*"
+      ],
       "linter": {
         "rules": {
           "performance": {
@@ -361,7 +381,10 @@
       }
     },
     {
-      "includes": ["**/*.js", "**/rolldown.config.ts"],
+      "includes": [
+        "**/*.js",
+        "**/rolldown.config.ts"
+      ],
       "linter": {
         "rules": {
           "correctness": {
@@ -376,10 +399,14 @@
     {
       "assist": {
         "actions": {
-          "source": { "useSortedKeys": "on" }
+          "source": {
+            "useSortedKeys": "on"
+          }
         }
       },
-      "includes": ["./biome.json"]
+      "includes": [
+        "./biome.json"
+      ]
     }
   ]
-}
+}

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-data-grid",
-  "version": "7.0.11",
+  "version": "7.0.14",
   "license": "MIT",
   "description": "Feature-rich and customizable data grid React component",
   "keywords": [
@@ -52,8 +52,11 @@
     "postpublish": "git push --follow-tags origin HEAD"
   },
   "dependencies": {
+    "@dnd-kit/core": "^6.3.1",
+    "@dnd-kit/modifiers": "^9.0.0",
     "antd": "^5.27.0",
     "clsx": "^2.0.0",
+    "react-refresh": "^0.17.0",
     "react-window": "^1.8.11"
   },
   "dependencies": {
@@ -88,6 +91,14 @@
     "clsx": "^2.1.1",
     "ecij": "^0.3.0",
     "eslint": "^9.39.1",
+    "@linaria/babel-preset": "^5.0.4",
+    "@linaria/core": "^6.3.0",
+    "@linaria/react": "^6.3.0",
+    "@linaria/vite": "^5.0.4",
+    "@vitest/browser": "^3.2.4",
+    "@wyw-in-js/babel-preset": "^0.7.0",
+    "@wyw-in-js/rollup": "^0.7.0",
+    "@wyw-in-js/vite": "^0.7.0",
     "eslint-plugin-jest-dom": "^5.5.0",
     "eslint-plugin-react": "^7.37.5",
     "eslint-plugin-react-hooks": "^7.0.1",

src/DataGrid.tsx

@@ -127,6 +127,7 @@ type SharedDivProps = Pick<
 
 export interface DataGridProps<R, SR = unknown, K extends Key = Key> extends SharedDivProps {
   ref?: Maybe<React.Ref<DataGridHandle>>;
+  wrapperRef?: Maybe<React.Ref<DataGridHandle>>;
   /**
    * Grid and data Props
    */
@@ -249,6 +250,7 @@ export interface DataGridProps<R, SR = unknown, K extends Key = Key> extends Sha
 export function DataGrid<R, SR = unknown, K extends Key = Key>(props: DataGridProps<R, SR, K>) {
   const {
     ref,
+    wrapperRef,
     // Grid and data Props
     columns: rawColumns,
     rows,

src/ScrollToCell.tsx

@@ -1,6 +1,6 @@
 import { useLayoutEffect, useRef } from 'react';
 
-import { scrollIntoView } from './utils';
+import { scrollIntoView, scrollIntoViewV2 } from './utils';
 
 export interface PartialPosition {
   readonly idx?: number | undefined;
@@ -22,7 +22,7 @@ export default function ScrollToCell({
     // scroll until the cell is completely visible
     // this is needed if the grid has auto-sized columns
     // setting the behavior to auto so it can be overridden
-    scrollIntoView(ref.current, 'auto');
+    scrollIntoViewV2(ref.current, 'auto');
   });
 
   useLayoutEffect(() => {

src/utils/domUtils.ts

@@ -7,3 +7,7 @@ export function stopPropagation(event: React.SyntheticEvent) {
 export function scrollIntoView(element: Maybe<Element>, behavior: ScrollBehavior = 'instant') {
   element?.scrollIntoView({ inline: 'nearest', block: 'nearest', behavior });
 }
+
+export function scrollIntoViewV2(element: Maybe<Element>, behavior: ScrollBehavior = 'instant') {
+  element?.scrollIntoView({ inline: 'center', block: 'center', behavior });
+}

website/routeTree.gen.ts

@@ -635,15 +635,6 @@ declare module './routes/ScrollToCell' {
     FileRoutesByPath['/ScrollToCell']['fullPath']
   >
 }
-declare module './routes/Tree' {
-  const createFileRoute: CreateFileRoute<
-    '/Tree',
-    FileRoutesByPath['/Tree']['parentRoute'],
-    FileRoutesByPath['/Tree']['id'],
-    FileRoutesByPath['/Tree']['path'],
-    FileRoutesByPath['/Tree']['fullPath']
-  >
-}
 declare module './routes/TreeView' {
   const createFileRoute: CreateFileRoute<
     '/TreeView',