Componentes HonoX Hono/JSX

Un conjunto de componentes bellamente diseñado y accesible.

Un sistema de diseño completo de 3 niveles creado para HonoX, PandaCSS y Sveltia CMS. Rápido, ligero y totalmente accesible, siguiendo los hábitos estándar de los usuarios.

Muestra de Pestañas

Reimplementado completamente en Hono/JSX puro con indicadores deslizantes, activación de foco manual/automática y soporte completo de navegación por teclado.

Ultra Rápido

SSR por defecto con una huella estática mínima. Se hidrata solo cuando se requiere interacción.
Opción Sin JS

Totalmente Accesible

Siguiendo exactamente los estándares WAI-ARIA. Totalmente navegable por teclado con tabIndex itinerante y estados aria.
Conforme A11y

Diseño Impresionante

Transiciones de indicador deslizante y diseños con precisión de píxel adaptados a los hábitos modernos de los usuarios.
Panda CSS

Demostrando nuestra sólida implementación en Hono/JSX del Slider Carousel de Ark UI. Deslizable, listo para reproducción automática y totalmente accesible.

Carrusel Interactivo con Reproducción Automática

Activadores de reproducción automática, puntos personalizados y pausa al pasar el cursor.

Carrusel en Bucle Multi-Diapositiva

Mostrando 2 diapositivas por página con una cuadrícula rica y responsiva.

Centro Interactivo de Componentes

Explora las ricas funciones del sistema de componentes Artefact UI agrupadas por categoría de uso.

Controles de Formulario

Control Switch

Botones de alternancia elegantes

Grupo de Casillas

Soporte para estados normal e indeterminado

Control Deslizante

Valores numéricos ajustables
Control Único45
Selección de Rango15, 75

Grupo de Radio

Opciones mutuamente excluyentes

Grupo de Tarjetas de Radio

Opciones exclusivas estilo tarjeta
Contorno
Sutil
Superficie
Sólido

Grupo Segmentado

Controles de selección deslizantes

Campo de Etiquetas

Añade y elimina etiquetas de palabras clave
Hono
Vite
Panda
Presiona Enter para añadir una etiqueta

Campo PIN

Entrada de código de un solo uso con pegado y avance automático
Revisa tu correo para el código de 6 dígitos

Grupo de Calificación

Calificaciones con estrellas y precisión de medio valor
Califica tu experiencia
Precisión de media estrella
Calificación promedio

Campo

Entrada etiquetada con validación en vivo
Debe tener al menos 3 caracteres

Área de Texto

Entrada multilínea con validación en vivo
Cuéntanos un poco más (mínimo 20 caracteres)

Selectores Complejos

Selector de Fecha

Selectores avanzados de fecha y rango

Selección Desplegable

Selects accesibles y comboboxes con autocompletado
React
Solid
Svelte
Vue
Hono

Selector de Color

Selector de espectro completo de color
Elige el Color del Tema

Subida de Archivos

Zona de arrastrar y soltar con reglas de validación
Arrastra y suelta o busca archivos

    Superposiciones y Navegación

    Popover y Tooltip

    Cuadros de información contextual

    Modales y Cajones

    Paneles superpuestos con captura de foco

    Menús Desplegables de Acción

    Activadores de listas de acción anidables

    Tarjeta al Pasar el Cursor

    Ventana emergente de información al pasar el cursor

    Contenido Colapsable

    Secciones de acordeón suaves

    Nuestra captura de foco accesible y navegación por teclado funcionan perfectamente en todos los dispositivos.

    Ruta de Navegación

    Jerarquías de navegación

    Retroalimentación y Utilidades

    Barras de Progreso

    Cargadores de progreso lineales y circulares
    Subiendo Datos
    72%
    ProcesandoProgress

    Esqueletos y Alertas

    Widgets de retroalimentación y marcador de posición

    Portapapeles y Toast

    Utilidades interactivas de retroalimentación al usuario

    Editable

    Haz clic para editar en línea, en el lugar
    Artefact UI Suite
    Añade una descripción…