Spinner

a spinner

Props

color

The border color of the Spinner.
"string"
{
dark:
"string,"
light: string
}

message

When message is a string, the message will be announced for screen readers once the Spinner is loaded. When an object, the 'start' message will be announced as the Spinner appears, and the 'end' message as the spinner closes.

"string"
{
start:
"string,"
end: string
}

size

A fixed size.
"xsmall""small""medium""large""xlarge""string"

Theme

spinner.container

Any valid Box prop for the Spinner container. Including 'color' for the spinner border color and 'size' for the default size of the Spinner.

{
  "animation": "rotateRight",
  "color": "brand",
  "pad": "small",
  "round": "full",
  "size": "small"
}

spinner.icon

An icon or an SVG to use as the default Spinner.
ReactElement | SVG

spinner.size.xsmall

The xsmall size of the Spinner.
"18px"

spinner.size.small

The small size of the Spinner.
"24px"

spinner.size.medium

The medium size of the Spinner.
"48px"

spinner.size.large

The large size of the Spinner.
"72px"

spinner.size.xlarge

The xlarge size of the Spinner.
"96px"