Support sticky elements taken into account when scrollIntoView is called

[lukpsaxo]

Provide a general summary of the feature here

scrollIntoView is called when moving focus around the table, but it does not take into sticky elements, so when a table cell is sticky, you can move into a table cell but it is not brought into view because it is behind the sticky cell and the current logic does not scroll so it is visible.

🤔 Expected Behavior?

scrollIntoView takes sticky elements that are children of a scroll container into account.

😯 Current Behavior

sticky elements are ignored

💁 Possible Solution

I made a POC that works, modifying scrollIntoView

• find sticky elements that are a child of the current "scrollView"
• see if the sticky elements overlap with the current element being scrolled into view
• if so, adjust the scroll one way or another so they are in view

Additionally, if you call scrollIntoView on a sticky element, don't try and scroll its immediate parent which will stop focussing on sticky cells from making the rows move by 1px each time.

If accepted I will make a PR along these lines so please indicate if this kind of approach sounds good.

🔦 Context

We have a table with a sticky first and last column and we would like the keyboard navigation to work - scrolling the cell into view when it is highlighted.

💻 Examples

No response

🧢 Your Company/Team

Saxo Bank

🕷 Tracking Issue

No response

[lukpsaxo]

an alternative approach would be to respect a scroll margin during the algorithm. Then if a consumer can set a scroll margin in order to make space for a sticky element.
I would prefer not to do this approach as its more work for me to get a scroll margin set with the right values, but it is more flexible for situations where a sticky element is not positioned directly onto one side.

[lukpsaxo]

I've changed my mind, I think making the react aria scrollIntoView support scrollMargin/scrollPadding like the browser version does is the best solution.

@snowystinger would you accept a PR implementing this enhancement? I'm not sure if I should ask before making PR's or its easier to just make the PR's. I think if you didn't accept it I would need to fork.

[lukpsaxo]

I'm so sorry, your code already does this.

[piecyk]

I'm so sorry, your code already does this.

@lukpsaxo can you elaborate more how did you handle it?

[lukeapage]

We set a scroll padding style on the scroll container equal to the space currently taken up by sticky elements

[piecyk]

Thanks, found it 👍