Spinner

import { Spinner } from '@yarcl/react';

Save

<Spinner size="lg" color="primary" />
<Button loading={saving}>Save</Button>

A spinner is sized like an icon, so inside a control it matches the control’s size. Without color it uses the current text color. It’s announced as “Loading”; change that with label.

Props

Prop	Type	Default	Description
color	Colorconfig		Semantic color, from the colors config. Uses the current text color when omitted.
label	string	config.labels.loading	Accessible label announced to screen readers.
size	'lg' | 'xs' | 'sm' | 'md' | 'xl'		Diameter from the size's iconSize, from the sizes config. Inherits the surrounding control's size when omitted.