feat: add offsetX to renderFn (#269)

* feat: add offsetX to renderFn * test: add case
react-component · May 20, 2024 · b438d2d · b438d2d
1 parent 37ed992
commit b438d2d
Show file tree

Hide file tree

Showing 4 changed files with 18 additions and 2 deletions.
diff --git a/src/List.tsx b/src/List.tsx
@@ -504,6 +504,7 @@ export function RawList<T>(props: ListProps<T>, ref: React.Ref<ListRef>) {
     start,
     end,
     scrollWidth,
+    offsetLeft,
     setInstanceRef,
     children,
     sharedConfig,

diff --git a/src/hooks/useChildren.tsx b/src/hooks/useChildren.tsx
@@ -1,12 +1,13 @@
 import * as React from 'react';
-import type { SharedConfig, RenderFunc } from '../interface';
+import type { RenderFunc, SharedConfig } from '../interface';
 import { Item } from '../Item';
 
 export default function useChildren<T>(
   list: T[],
   startIndex: number,
   endIndex: number,
   scrollWidth: number,
+  offsetX: number,
   setNodeRef: (item: T, element: HTMLElement) => void,
   renderFunc: RenderFunc<T>,
   { getKey }: SharedConfig<T>,
@@ -17,6 +18,7 @@ export default function useChildren<T>(
       style: {
         width: scrollWidth,
       },
+      offsetX,
     }) as React.ReactElement;
 
     const key = getKey(item);

diff --git a/src/interface.ts b/src/interface.ts
@@ -1,7 +1,7 @@
 export type RenderFunc<T> = (
   item: T,
   index: number,
-  props: { style?: React.CSSProperties },
+  props: { style: React.CSSProperties; offsetX: number },
 ) => React.ReactNode;
 
 export interface SharedConfig<T> {

diff --git a/tests/props.test.js b/tests/props.test.js
@@ -40,4 +40,17 @@ describe('Props', () => {
 
     expect(wrapper.find('.prefix-holder-inner').length).toBeTruthy();
   });
+
+  it('offsetX in renderFn', () => {
+    let scrollLeft;
+    mount(
+      <List data={[0]} itemKey={id => id} prefixCls="prefix">
+        {(id, _, { offsetX }) => { 
+          scrollLeft = offsetX;
+          return <div>{id}</div>}}
+      </List>,
+    );
+
+    expect(scrollLeft).toEqual(0);
+  });
 });