Loader Carregador - Docs - Artefact

Loader Carregador

Feedback

Apresentacional

Introdução

Um componente utilitário que gerencia o estado visual de um Spinner e o texto associado.

Uso

Loading data...

import { Loader, Spinner } from "../components/ui";

export default function MyPage() {
  return <Loader text="Loading data..." />;
}

Spinner e posicionamento personalizados

import { Loader, Spinner } from "../components/ui";

export default function MyPage() {
  return (
    <Loader
      spinner={<Spinner size="lg" colorPalette="blue" />}
      spinnerPlacement="end"
    >
      Please wait
    </Loader>
  );
}

Construtor de páginas do CMS

Este componente está disponível como um bloco loader no Construtor de Páginas (content/pages/*.json) — o campo text do CMS é mapeado diretamente para a propriedade text própria de Loader:

{
  "type": "loader",
  "text": "Checking availability...",
  "spinnerPlacement": "start"
}

Propriedades

Prop	Type	Description
`children`	`any`	Conteúdo de texto a ser renderizado junto ao spinner.
`spinner`	`Child`	Elemento spinner personalizado. Padrão `<Spinner size="inherit" />`.
`text`	`Child`	Propriedade alternativa para o conteúdo de texto.