Pull to refresh
Pull a scroll region down past a threshold to refresh it. The gesture only engages at the top of the scroll, so it never fights an upward scroll. Provide a non-gesture equivalent — a refresh action in the MobileHeader, or the opt-in built-in button.
<PullToRefresh onRefresh={async () => { await reload(); }}> <List aria-label="Projects">{rows}</List></PullToRefresh>Live
Pull the list down from the top. An indeterminate spinner shows until the refresh resolves; a second pull is ignored while one is in flight.
Motion
The refresh spinner is the one looping animation the design system allows (indeterminate progress). Under prefers-reduced-motion it drops to a static icon.
Props
| Prop | Type | Default | Notes |
|---|---|---|---|
onRefresh | () => void | Promise<unknown> | — | Runs on pull or button; spinner shows until it settles. |
refreshButton | boolean | false | Opt-in built-in button; off by default as it overlaps edge-to-edge content. |
refreshLabel | string | 'Refresh' | Accessible label for the built-in button. |
children | ReactNode | — | The scrolling content. |