Skeleton

Indica carregamento de conteúdo com placeholders animados.

Uso

<script setup lang="ts">
import { Skeleton } from '@halfbyte/maka'
</script>

<template>
  <Skeleton variant="rect" width="200px" height="120px" />
</template>

Variantes

<!-- Retângulo (card, imagem) -->
<Skeleton variant="rect" width="200px" height="80px" />

<!-- Círculo (avatar) -->
<Skeleton variant="circle" width="48px" height="48px" />

<!-- Linha de texto -->
<Skeleton variant="text" width="300px" />

<!-- Múltiplas linhas de texto -->
<Skeleton variant="text" :lines="3" width="300px" />

Props

Prop	Tipo	Padrão
variant	"rect" | "circle" | "text"	"rect"
width	string	—
height	string	—
lines	number	1