Spinner
O componente Spinner nos permite informar o carregamento de conteúdos.
import React from "react";
import { Spinner } from "@nimbus-ds/components";
const Example: React.FC = () => <Spinner size="large" />;
export default Example;O componente é composto por uma forma vetorial, e pode ter suas cores personalizadas de acordo com necessidade.
Utilizamos esse componente para evidenciar algum carregamento de arquivo ou processamento de tarefas, não devendo ser usado no lugar de um skeleton.
O Spinner possui 3 tamanhos pré-definidos large, medium e small e devem ser utilizados levando em consideração o componente e contexto em que serão aplicados.
Esse componente não possui texto, porém ele possui uma tag (Aria Label) para facilitar sua identificação por pessoas com algum tipo de limitação visual ou cognitiva.
- Indicar o upload de arquivos
- Indicar que uma tarefa esta sendo processada
Skeleton - Pode ser usado para comunicar o carregamento dos componentes que compõem uma página.
Instale o componente via terminal.
npm install @nimbus-ds/spinnerAdditional props are passed to the <Spinner> element. See svg docs for a list of props accepted by the <Spinner> element.