Spinner

Loading indicator with size and color options.

Import

import '@kittl/ui';

import { Spinner } from '@kittl/ui-react';

Usage

<kittl-spinner></kittl-spinner>
<kittl-spinner size="xl"></kittl-spinner>
<kittl-spinner size="xs" color="inherit"></kittl-spinner>

import { Spinner } from '@kittl/ui-react';

/** Basic Spinner usage, rendered live on the docs site. */
export const SpinnerUsage = () => (
  <>
    <Spinner />
    <Spinner size="xl" />
    <Spinner size="xs" color="inherit" />
  </>
);

Props

Property	Attribute	Type	Default	Description
size	size	'xs' | 'm' | 'l' | 'xl'	'm'	Spinner size
color	color	'default' | 'inherit'	'default'	Color mode (inherit uses parent's text color)

Accessibility

• role="status"
• aria-live="polite"