Loading

Spinner for in-progress states. Render an icon alone, or pass label for a caption under the clock. Use size for small, medium (default), or large.

Icon only

LoadingIconExample.tsrx
import { Loading } from "@octaneui/core";

export function LoadingIconExample() @{
  <Loading aria-label="Loading" />
}

With label

LoadingLabelExample.tsrx
import { Loading } from "@octaneui/core";

export function LoadingLabelExample() @{
  <Loading label="Loading" />
}

Sizes

Small

Medium

Large

LoadingSizeExample.tsrx
import { Loading } from "@octaneui/core";

export function LoadingSizeExample() @{
  <>
    <Loading size="small" label="Small" />
    <Loading size="medium" label="Medium" />
    <Loading size="large" label="Large" />
  </>
}