Saltar al contenido principal
NeuralUIv1.14.3Nuevo
GitHub
Componente

Skeleton

Placeholders animados para simular la carga de contenido. Tres variantes: texto, círculo y rectángulo.

TypeScript
import { NeuSkeletonComponent } from '@neural-ui/core/skeleton';

Tarjeta de carga

Lista de usuarios

Tarjetas de métricas

TypeScript
import { NeuSkeletonComponent } from '@neural-ui/core/skeleton';

@Component({
  imports: [NeuSkeletonComponent],
  template: `
    <!-- Texto / Text -->
    <neu-skeleton variant="text" width="80%" />
    <neu-skeleton variant="text" width="60%" />

    <!-- Círculo (avatar) / Circle (avatar) -->
    <neu-skeleton variant="circle" width="40px" height="40px" />

    <!-- Rectángulo (imagen/card) / Rectangle (image/card) -->
    <neu-skeleton variant="rect" width="100%" height="180px" />

    <!-- Border radius personalizado / Custom border radius -->
    <neu-skeleton width="120px" height="32px" borderRadius="16px" />
  `
})
export class MyComponent {}