iTwin / iTwinUI

A design system for building beautiful and well-working web interfaces.
https://itwin.github.io/iTwinUI/
MIT License
101 stars 37 forks source link

ComboBox: loading state #925

Open mayank99 opened 2 years ago

mayank99 commented 2 years ago

image https://react-select.com/home#async

_Originally posted by @mayank99 in https://github.com/iTwin/iTwinUI-react/pull/338#discussion_r718504790_

klopez213 commented 2 years ago

This would really help us. We have a use case to load users and loading them all takes forever. So dynamically populating the options while user types would be very beneficial.

mayank99 commented 2 years ago

Reopening because it's only half done.

veekeys commented 2 years ago

Skeleton implementation is released with 1.40.0 Here is the example

SpencerWBarnes commented 1 year ago

I see this enhancement is still open. Is the intent to offer both the MenuItemSkeleon and the meatball icon to represent loading? Should there only be one approach for consistency? If not, which method would be recommended?

mayank99 commented 1 year ago

@SpencerWBarnes It would depend on your use case. The skeleton ui would be more applicable when lazy loading the initial menu items.

The loading indicator on the right side (once implemented) would probably be more useful because you get to keep showing the currently loaded menu items, and then replace it with the new list when done loading.

https://user-images.githubusercontent.com/9084735/217003006-0d2b2857-4ab4-4d7b-b33c-0888f37724fe.mov

SpencerWBarnes commented 1 year ago

@mayank99 Gotcha so the skeleton ui best represents a total change to the list whereas the loading indicator best represents a progressive change. Thanks!