Loading Bar
LoadingBar is Orbital's global navigation chrome indicator — a slim teleported bar for route changes and coarse async work.
Mount a single LoadingBarProvider (or this LoadingBar alias) near your app root, then call LoadingBarInjection::start, LoadingBarInjection::finish, or LoadingBarInjection::error from handlers. The bar itself has no props — the provider teleports it to the viewport top.
- Route transitions and full-page data fetches
- Long-running saves where a slim top indicator is enough
- App-wide async that should not block page interaction
Prefer Spinner for inline panel waits. Prefer ProgressBar when you have a known completion percentage.
- Wrap your app shell (or preview subtree) in
LoadingBarProvideror LoadingBar. - From a button handler, router hook, or resource callback, call
LoadingBarInjection::expect_context().start()when work begins. - Call
.finish()when the operation succeeds — the bar animates to 100% and hides. - Call
.error()on failure — the bar completes with danger semantic color. - The bar teleports to the top of the viewport; children stay in place — only the provider placement matters.
Wrap content in LoadingBarProvider, then call LoadingBarInjection::start() from a child trigger.
Typical async pattern: start() when work begins, finish() when it completes successfully.
Call error() instead of finish() so the teleported bar completes with danger tokens.