fix: move stable item style to outside scope

I've been using your library recently and stumbled across an issue. When scrolling, the style of TableRow is changing between rerenders, which stops it from being properly memoized.

I traced this back to inline styles changing the referential equality between renders. So, I made a small tweak: I moved the stable style to an outside scope. Now, the TableRow is memoizing like a champ.

I saw something similar being done in the Virtuoso component (https://github.com/petyosi/react-virtuoso/blob/cb156cc3009cc544ca31eb30041ef35c4a278f8d/src/Virtuoso.tsx#L68), so I guess it's in line with your usual patterns.

To help illustrate the impact of this change, I've taken before-and-after snapshots from React's profiler tab (modified example from https://virtuoso.dev/table-fixed-headers/). before:

after:

Would love to hear what you think about this. If it seems like a good fix, it'd be cool to see it become part of the library.

Thanks for your time, and kudos for your fantastic work in open-source 🙇 .

petyosi / react-virtuoso

fix: move stable item style to outside scope #950