Empty State
Placeholder for empty content areas.
Vista previa
No se encontraron resultados
Intente ajustar su búsqueda o filtro para encontrar lo que busca.
Este ejemplo usa estilos solo para documentación. En producción, utiliza una de las recetas incluidas (CSS, Tailwind o UnoCSS).
Placeholder for empty content areas.
Uso
Compón Root, Icon, Title, Description, Action.
import * as EmptyState from "@solidiom/empty-state"
;<EmptyState.Root>Contenido de Empty State</EmptyState.Root>Instalación
Instala el paquete con pnpm add @solidiom/empty-state. El paquete requiere dependencias pares compatibles de solid-js y @solidjs/web.
Partes
Empty State expone 5 partes:
- Root —
data-part="root". - Icon —
data-part="icon". - Title —
data-part="title". - Description —
data-part="description". - Action —
data-part="action".
Estilos
Empty State lleva los atributos data-scope="empty-state" y data-part en cada parte para la selección CSS/receta. Los atributos de estado como data-state, data-disabled y data-highlighted se exponen donde corresponda.
Interacción con teclado
Este primitivo no tiene interacción con teclado. Renderiza contenido que no recibe foco ni responde a eventos de teclado de forma independiente.
Composición
Empty State está diseñado para componerse con otras primitivas. Sus partes pueden combinarse con Field, Button u otras primitivas según sea necesario.
Renderizado SSR e hidratación
Empty State se renderiza como HTML semántico durante el renderizado en servidor. El comportamiento interactivo (manejadores de teclado, gestión de estado) se activa en la hidratación sin desplazamiento de diseño.