Fix: inverted option causing sticky headers, ListEmptyComponent to appear inverted, and causing scroll direction to be inverted on web

[mtourj]

Description

This fixes three problems that occur when inverted is enabled on FlashList:

• ListEmptyComponent appearing inverted (upside-down)
• Sticky headers appearing inverted
• Scroll position on web becoming inverted

Tested in the expo fixture as well as in my own application.

Resolves #1511 #1351 #1177 #611

Checklist

• I have added a changelog entry following the Keep a Changelog guidelines.

[mtourj]

I have signed the CLA!

[ActaV-N]

I patched package shopify/flash-list@1.7.3 based on this pr but it didn't resolve the problem Scroll position on web becoming inverted

Oh sorry I just patched files that already has been built(js files only) and it works.
#1351 (comment)

[aicopdev]

Hi, this patch fixed the inverted scroll in Web. But created a different issue.

if there is any item with scrollable content, the scroll behaviour will break. You can check this behaviour by rendering any item as scrollable.

Verified with and without the patch. Without the patch, scrollable item is working as expected. But overall scroll behaviour is reveresed.

With the patch, overall scroll behaviour is fixed. But scrollable item is broken..

[mtourj]

Thanks @aicopdev , I fixed it by checking event target for scrollability using getComputedStyles and letting those nested elements handle wheel events if they are scrollable.

[aicopdev]

Thanks @mtourj

Can you please update the patch file with this changes ?? Does it work with the latest changes also ?? Not able to do so by just changing based on the PR and last patch file.

I mean, I tried applying the patch for components based on the PR. But vertical scroll behaviour stopped working. Have you verified scrolls in both directions ??