Skeleton

El componente Skeleton nos permite comunicar de forma visual que un componente está cargando.

Default

import React from "react";
import { Skeleton } from "@nimbus-ds/components";

const Example: React.FC = () => (
  <Skeleton height="3rem" width="9rem" borderRadius="2" />
);

export default Example;

Anatomía del componente

El componente está integrado por un rectángulo con una animación que alterna sus colores.

Guidelines

Usamos este componente de forma individual, para representar visualmente la carga de otros componentes atómicos y compuestos.

Personalización

Es posible personalizar el Skeleton para adaptarse a componentes locales, ajustando la propiedad de width, height y border radius.

Recomendaciones de uso

Comunicar la carga de componentes compuestos
Comunicar la carga de componentes atómicos
Comunicar la carga de componentes locales

Componentes relacionados

Spinner - Puede ser usado para informar el procesamiento de acciones en tiempo real.

Implementación

Instalá el componente via terminal.

npm install @nimbus-ds/skeleton

Props

Additional props are passed to the <Skeleton> element. See div docs for a list of props accepted by the <Skeleton> element.