Feature: Use Mantine ScrollArea

[sbasher314]

Adds Mantine ScrollArea component as an optional wrapper for the table body; Supports virtualization as well as standard / non-virtualized tables.

Usage:

• provide withScrollArea to the table props to enable this feature -- disabled by default so as to not break back-compatibility
• exposes mantineScrollAreaProps for further customization if needed

I've fleshed out a few storybook examples as well as a few examples on the docs (specifically virtualization / infinite loading). Let me know if I missed anything or if there's any room for improvement!

Address the following discussion / issue : #3

[vercel[bot]]

@studylog-sbasher is attempting to deploy a commit to the Kevin Vandy OSS Team on Vercel.

A member of the Team first needs to authorize it.

[KevinVandy]

Also, since we're still in beta, we could just totally replace the current scrolling setup and just go with the stock mantine one. It would be a minor (mostly non-breaking) change before a stable release. It's a bit complicated with the two different ways.

[alessandrojcm]

Hey @sbasher314 just checking if you're still available to continue working in this PR?

[sbasher314]

Hey @sbasher314 just checking if you're still available to continue working in this PR?

Hey yeah, started a new job so things have been pretty busy but I should have capacity to work on this shortly. I should be able to make the requested changes

[sarendipitee]

I second using Mantine's ScrollArea and dropping native scrolling entirely — smart decision. We're all invested in Mantine anyways so it makes MRT just that much more cohesive.

[ladderschool]

Hey @sbasher314 just checking if you're still available to continue working in this PR?

Hey yeah, started a new job so things have been pretty busy but I should have capacity to work on this shortly. I should be able to make the requested changes

Amazing feature proposal, thank you!

[sbasher314]

Alright sorry for the delay folks! I've been putting off getting this setup as it was previously on my old work laptop and was caught up with the new job. I've pulled this project down and will start making the requested changes - I've already brought my fork / branch up to date with the current v2 branch and will ensure that all functionality / asks have been resolved.

It looks like some of the unrelated bugs I addressed have already been addressed in different ways upstream (such as the rangeExtractor function), so where applicable I will prefer upstream code over my fixes where conflicts arose.

[vercel[bot]]

Deployment failed with the following error:

The provided GitHub repository does not contain the requested branch or commit reference. Please ensure the repository is not empty.

[sbasher314]

@KevinVandy I believe that I should have addressed all comments / feedback as originally put forward -- there's still an open discussion here whether to use the scroll container by default or to make it opt-in. I think that there's a strong argument for performance and accessibility purposes that we would want to default to the current behavior, but I'm open to alternative thoughts on that matter.

It does complicate the code by having this be conditional like this. A middleground approach is to have the 'type' be specified on the table scrollContainer as native or scrollarea based on the withScrollArea prop but I'm not 100% sure how that would work with virtualization and I would need to revalidate the behaviors if we went that route. Also, this prop is only available in Mantinev7+ so if v2 is still targeting compatibility with v6 that would be a non-starter anyway.

[sarendipitee]

@KevinVandy 🧑‍🍳 👀