Tradeshift / tradeshift-ui

The Tradeshift UI Library & Framework
https://ui.tradeshift.com
Other
33 stars 45 forks source link

Make Spinner independent of its container #753

Closed bogdan-brezuica closed 5 years ago

bogdan-brezuica commented 5 years ago

Is your feature request related to a problem? Please describe. At the moment, we only support Spinners on Main, Aside and Table components. In my opinion, this is insufficient because there can be lots of cases where we need to load data asynchronously and need to use a spinner. One specific situation where I need a spinner is while loading the options for a checkbox group. One more thing to keep in mind is that in the future, clients will hopefully build third party apps on the Tradeshift platform and they will use our ui components library, so it needs to be as flexible as possible.

Describe the solution you'd like We can either attach the spinner on any element with data-ts.busy like we do now, or have the spinner a separate component e.g. <div data-ts="Spinner"></div> Keep in mind that I'm not familiar with the ui components code so maybe my suggestions don't make sense

Describe alternatives you've considered One temporary solution that I can use is to extract the spinner html and css code and make a Spinner component in my project, but this would clearly not be a good solution for the problem.

zdlm commented 5 years ago

If you really want it. You can use it the same as aside, sidebar, main.

For example

ts.ui.get('#board', function(board) {
    board.busy('My Board');
});
ts.ui.get('#board', function(board) {
    board.done();
});