z-uiDesign system
Componentes · z-ui

EmptyState

O que mostrar quando não há nada para mostrar: ícone, título, explicação curta e o próximo passo. A ação pode ser um objeto que vira Button ou qualquer nó.

Nenhum envelope encontrado

Busca sem resultado, com ação principal e secundária.

Nenhum envelope encontrado

Nenhum envelope em assinatura corresponde a “sala 1204” nos últimos 30 dias.

Primeiro uso

Com borda tracejada e tom de ação, para a caixa de entrada ainda vazia.

Sua caixa de envelopes está vazia

Envie um contrato em PDF, adicione os signatários e acompanhe cada assinatura por aqui.

Tamanhos e tons

Sem documentos anexados

Arraste um PDF para este envelope.

Sem certificado instalado

Instale um certificado ICP-Brasil para assinar este documento.

Props

PropTipoPadrãoDescrição
iconReactNode | componente de ícone—Ícone lucide como componente ou nó pronto.
tone"neutral" | "primary" | "success" | "warning" | "caution" | "danger" | "info""neutral"Cor do selo do ícone.
titleReactNode—Título do estado.
descriptionReactNode—Explicação curta.
action{ label, onClick, variant?, color?, startIcon? } | ReactNode—Próximo passo. O objeto vira Button primário.
secondaryActionmesmo formato de action—Ação alternativa. O objeto vira Button outline.
size"sm" | "md" | "lg""md"Respiro, ícone e tipografia.
headingLevel"h2" | "h3" | "h4""h3"Nível do título na hierarquia da página.
borderedbooleanfalseMoldura tracejada sobre fundo sutil.