facultyai / dash-bootstrap-components

Bootstrap components for Plotly Dash
https://dash-bootstrap-components.opensource.faculty.ai/
Apache License 2.0
1.11k stars 220 forks source link

Support loading states data attribute #165

Closed ned2 closed 5 years ago

ned2 commented 5 years ago

I have an app with some CSS selectors that apply loading spinners to elements with the data attribute data-dash-is-loading="true" as described in the Loading States documentation.

It seems that this isn't supported on Dash Bootstrap Components however, as I have a dbc.Col who's children property is set by a callback, but doesn't get the data-dash-is-loading="true" while the callback is running. Replacing dbc.Col with an html.Div worked fine.

tcbegley commented 5 years ago

Thanks for reporting @ned2

Looking at html.Div here it appears that there's some additional logic that needs to be added to our components to support this. Doesn't look too complicated though, so I think we should be able to support it.

ned2 commented 5 years ago

Awesome, that's great. Given how frequently dbc components can be used within a given layout, I think not having that support would probably often preclude the use of this loading state API within Dash apps using dbc.

On Tue, 26 Mar 2019 at 20:23, Tom Begley notifications@github.com wrote:

Thanks for reporting @ned2 https://github.com/ned2

Looking at html.Div here https://github.com/plotly/dash-html-components/blob/master/src/components/Div.react.js#L7-L10 it appears that there's some additional logic that needs to be added to our components to support this. Doesn't look too complicated though, so I think we should be able to support it.

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/facultyai/dash-bootstrap-components/issues/165#issuecomment-476539956, or mute the thread https://github.com/notifications/unsubscribe-auth/ACs1GKhcrkGHFE_3ynSs_bf88HOaxmRDks5vaecUgaJpZM4cK4hA .

-- nedned.net

tcbegley commented 5 years ago

Hey @ned2, I've had a go at this, see #171.

Obviously there's a lot of components to test, so if you're interested in trying it out and letting us know if you run into any problems please do:

pip install dash-bootstrap-components==0.3.7rc1
ned2 commented 5 years ago

I just tried it out on the app I was working on, and components underneath a dbc.Col are now getting data-dash-is-loading="true" being applied!

Unfortunately, I don't have any apps with other dbc components having components underneath them ready to try out.

tcbegley commented 5 years ago

That’s great! I’ll keep testing it before releasing, but some independent validation is useful, so thanks!

tcbegley commented 5 years ago

Resolved by #171