Components

Spinner

A compact loading indicator for inline fetch states, button progress, and lightweight asynchronous feedback.

Tap to show a QR code for the Expo showcase deep link. The web preview below runs in the browser.

Showing a compact loading indicator.

Installation

Install the registry item directly, then add any package dependencies if you are setting the component up manually.

1

Install the component

Run the registry command below to add spinner to your project.

watermelon add spinner
2

Import the component

Import Spinner from your local UI registry output.

Import

import { Spinner } from "@/components/ui/spinner";

Import

Import

import { Spinner } from "@/components/ui/spinner";

Usage

Use Spinner for short-running work where a full skeleton or progress bar would feel too heavy.

Loading...

API Reference

proptypedefaultdescription
size"sm" | "default" | "lg""default"Adjusts the indicator size for tight or prominent loading states.
colorstringtheme primaryOverrides the spinner color when needed.
animatingbooleantrueControls whether the spinner is actively rotating.