Murasaki
コンポーネント

Spinner

処理が進行中であることを示します。

使い方

import { Button, Spinner } from '@murasakijs/ui'

<Button disabled>
  <Spinner aria-label="保存中" />
  保存中…
</Button>

Spinnerrole="status" を持つ SVG を表示します。隣に処理内容を説明するテキストがない場合は特に、デフォルトの「Loading」ではなく、処理内容に合った aria-label を指定してください。継続的なアニメーションが必須でない場合は、アプリケーションのスタイルシートで prefers-reduced-motion に対応してください。

GitHub でこのページを改善

On this page