Spinner

The smallest waiting indicator.

Just a spinning icon — for tight spots like inside a button.

export const client = "only";

import { Spinner, Button } from "@squadbase/vantage/ui";

export default function Example() {
  return (
    <div className="flex items-center gap-4">
      <Spinner />
      <Button disabled>
        <Spinner />
        保存中
      </Button>
      <Spinner className="size-6 text-muted-foreground" />
    </div>
  );
}

import { Spinner } from "@squadbase/vantage/ui";

It is an <svg>, so size-* sets the size and text-* the colour.

For a whole panel use Loading; to hold the layout while you wait, Skeleton.