Beta
System
Guides
CLI
Routing
Layout
Components
Hooks
Etc
Render this component to show a loading progress bar at the top of the browser frame while pages are loading. This is a web-only component and should be rendered in your root _layout.tsx file.
_layout.tsx
import { LoadProgressBar, Slot } from 'one' export default function Layout() { return ( <> <LoadProgressBar /> <Slot /> </> ) }
export type LoadProgressBarProps = { /** How long after a navigation to wait before showing the progress bar (in ms) */ startDelay?: number /** How long after a navigation completes to wait before hiding the progress bar (in ms) */ finishDelay?: number /** The starting percent it should show the loading state at */ initialPercent?: number /** How often the progress bar should update (in ms) */ updateInterval?: number /** How often to skip an update (checked each during the loop) */ sporadicness?: number /** Pass style to the inner View */ style?: ViewProps['style'] /** Pass onLayout to the inner View */ onLayout?: ViewProps['onLayout'] /** Pass children to the inner View */ children?: ViewProps['children'] }
Next
ScrollBehavior
Edit this page on GitHub.