feat: Async loading support for S2 ComboBox/Picker (#7938)
* initial support for async loading in Combobox/picker/listbox in RAC
* test against Listbox standalone and put on content size change issue
* update S2 CardView/RAC GridList for new useLoadMore
* fix v3 load more stories and tests
* update table to call useLoadMore internally
* first attempt at refactoring useLoadmore
* refactor useLoadMore to get rid of scroll handlers
* Add S2 Picker async support, support horizontal scrolling, fix types and data-attributes
* async support for S2 combobox
* fix lint and add horizontal scrolling story
* hack together async listbox virtualized example
* add loading spinners to RAC stories
* fix FF load more resizable wrapping container table, make s2 picker load more like v3
* update S2 Picker/Combobox so they are described by loading spinner
* fix Talkback and NVDA announcements for loading spinner
* clean up some todos
* set overflow to visible on ListLayout
* add useLoadMoreSentinel instead of changing useLoadMore
revert v3 components to still use old useLoadMore
* refactor useLoadMore and update RAC components load more
render a sentinel in the loading indicator always and call useLoadMoreSentinel from there instead. This allows the user to theoretically render as many sentinels as they want with each having its own loading state/logic
* add separator height to list layout
* change css for picker and combobox
* fix s2 combobox and picker
* fix separator height
* fix picker's separator
* cleanup
* update yarn lock
* update S2 CardView and TableView for new loading sentinel refactor
* fix lint
* remove workflow dependency
* remove style from s1 theme oops
* fix lint
* picker fixes
* picker cleanup
* fix lint
* fix line height in header
* properly persist table loading spinner in virtualized case
* fix listbox and gridlist persisted sentinel and fix double spinners
* stray console log
* fix react 19 tests
* fix lint?
* persist sentinel in card layouts
* forgot to fix waterfall empty state
* get rid of extranous space when listbox/table loaded all of the available items
* fix empty state for S2 ComboBox and make sure S2 Picker doesnt open when empty
* fix scroll offset issue after loadMore operations finish in virtualized components
works for the most part but is problematic if you dont want the loadingRow to appear with performing initial load (aka loadingState = loading). Due to how useLoadMoreSentinel work, we need to reobserve the list when we go from loading to loadingMore, but is isLoading is true the layout willpreserve room for the loading row...
* dont reserve room for the isLoadingMore spinner if performing initial load
also fixes RAC examples by properly applying a height to the tablebody if performing initial load
* add translations and clean up
* get rid of flex: none since loader is part of virtualized collection
was only needed when rendering the loader after the virutalizer div
* fix lint
* update grid areas and fix edgeToText
* prevent the empty w/ loading sentinel select from opening on arrow down
* adding chromatic tests for S2 Combobox/Picker async loading
* making sure sentinel is rendered even when empty
for cases like Listbox in Combobox, the content area is actually 0 since we dont have a height on the listbox nor does it reserve room like table layout
* update gridlist stories so that it is easier to see useLoadMore is only called once per load
due to the number of items returned by the star wars api and the height of the rows, making the gridlist too tall causes the loadmore to be called multiple times in order to fill enough content for a single page
* add gridlist tests for loadmore
* fix install?
* fix sizes
* fix lint
* update ScrollView to fix ComboBox tests
the issue was that updateSize was being called before the listboxref was attached due to it being immediatelly called in the test. The change makes it so the updateSize is called in the next render instead
* refactor to use collection instead of isLoading in useLoadMoreSentinel
this allows us to only have one prop in the sentinel to control visiblility of the loader while still calling loadMore when the collection changes. Also gives the added benefit of causing load more to happen if items are deleted from the collection
* update getItemCount so it doesnt include loaders in custom announcements
* make sure listbox doesnt add extranous padding above the empty state when empty or loading
since we are now rendering the virtualizer body if there is a loading sentinel, we dont want to add padding to the body rect calc since that will push the renderEmpty node down. Not a problem in TableLayout it seems
* add listbox and table tests
* fix delay when opening many items S2 select
* sorta get selected item to scroll into view virtualized
* fix tests
* cleanup fix lint
* more cleanup
* fix picker tests
* fix collection index incrementing when performing insertBefore
previously was only checking elements in the collection after the loading spinner node, thus items loaded async into the collection all remained with incorrect index, resulting in incorrect aria-rowIndex
* fix tests and lint
* update test-util dev dep in S2 so 16/17 tests pass
* forgot yarn lock change
* fix overflow on windows potentially...
* fix rowindex calculation when filtering async s2 combobox
the document didnt seem to be both updating its _minInvalidChildIndex nor updating its child indicies properly when the combobox list was filtered async (aka the collection got new items added and removed via insertBefore and/or removeChild. Additionally, we didnt see to ever call updateChildIndices on the Document other than the first time the collection loaded
* make S2 picker button not throw warning when rending in fake DOM
* fix s2 picker scroll selected item into view
* fix lint
* clean up and add row index tests for GridList and Table
* small improvements from testing session
* update yarn lock
* remove comment
* review comments
* missed yarn.lock conflict
* fix picker test
* mixed up which react-dom dep to remove derp
* fix Combobox test so it properly catches previous Document bug
tested with the Document changes removed and verified that the test fails properly. Swore it failed when I first wrote it...
* fix cases where extra separators appeared on combobox filter/if load sentinel is present
* marking the document as dirty when _minInvalidChildIndex is changing
* get rid of extra todos and obsolte test
---------
Co-authored-by: Yihui Liao <44729383+yihuiliao@users.noreply.github.com>