AU

Artefact UI

Composants HonoX Hono/JSX

Une suite de composants magnifiquement conçue et accessible.

Un système de conception complet à 3 niveaux conçu pour HonoX, PandaCSS et Sveltia CMS. Rapide, léger et entièrement accessible, respectant les habitudes standard des utilisateurs.

Vitrine des Onglets

Entièrement réimplémenté en Hono/JSX pur avec des indicateurs glissants, une activation du focus manuelle/automatique et une prise en charge complète de la navigation au clavier.

Ultra Rapide

SSR par défaut avec une empreinte statique minimale. Ne s'hydrate que lorsque l'interaction est nécessaire.
Option Zéro JS

Entièrement Accessible

Suivant exactement les normes WAI-ARIA. Entièrement navigable au clavier avec un tabIndex itinérant et des états aria.
Conforme A11y

Design Époustouflant

Transitions d'indicateur glissant et mises en page au pixel près adaptées aux habitudes modernes des utilisateurs.
Panda CSS

Implémentation Vedette du Carrousel

Démonstration de notre implémentation robuste en Hono/JSX du Slider Carousel d'Ark UI. Balayable, prêt pour la lecture automatique et entièrement accessible.

Carrousel Interactif à Lecture Automatique

Déclencheurs de lecture automatique, points personnalisés et pause au survol.
Analytique en Temps Réel — Pulse fournit des données en direct et des tableaux de bord avec une latence de streaming inférieure à la seconde.

Analytique en Temps Réel — Pulse fournit des données en direct et des tableaux de bord avec une latence de streaming inférieure à la seconde.

Carrousel en Boucle Multi-Diapositives

Affichage de 2 diapositives par page avec une grille riche et responsive.
Diapositive 1

Diapositive 1

Diapositive 2

Diapositive 2

Hub Interactif de Composants

Explorez les riches fonctionnalités du système de composants Artefact UI regroupées par catégorie d'utilisation.

Contrôles de Formulaire

Contrôle Switch

Boutons bascule élégants

Groupe de Cases à Cocher

Prise en charge des états normal et indéterminé

Curseur

Valeurs numériques ajustables
Curseur Unique45
Sélection de Plage15, 75

Groupe de Boutons Radio

Choix mutuellement exclusifs

Groupe de Cartes Radio

Choix exclusifs façon carte
Contour
Subtil
Surface
Plein

Groupe Segmenté

Contrôles de sélection glissants

Champ de Tags

Ajoutez et supprimez des tags de mots-clés
Hono
Vite
Panda
Appuyez sur Entrée pour ajouter un tag

Champ PIN

Saisie de code à usage unique avec collage et avancement automatique
Consultez votre e-mail pour le code à 6 chiffres

Groupe de Notation

Notation par étoiles avec précision au demi-point
Évaluez votre expérience
Précision au demi-étoile
Note moyenne

Champ

Champ étiqueté avec validation en direct
Doit contenir au moins 3 caractères

Zone de Texte

Champ multiligne avec validation en direct
Dites-nous en un peu plus (20 caractères minimum)

Sélecteurs Complexes

Sélecteur de Date

Sélecteurs avancés de date et de plage

Sélection Déroulante

Listes déroulantes accessibles et zones de saisie avec autocomplétion
React
Solid
Svelte
Vue
Hono

Sélecteur de Couleur

Sélecteur de spectre de couleurs complet
Choisissez la Couleur du Thème

Téléversement de Fichiers

Zone de glisser-déposer avec règles de validation
Glissez-déposez ou parcourez les fichiers

    Superpositions et Navigation

    Popover et Infobulle

    Boîtes d'information contextuelles

    Modales et Tiroirs

    Panneaux superposés avec piégeage du focus

    Menus Déroulants d'Action

    Déclencheurs de listes d'actions imbricables

    Carte au Survol

    Fenêtre d'information contextuelle au survol

    Contenu Rétractable

    Sections accordéon fluides

    Notre piégeage du focus accessible et notre navigation au clavier fonctionnent parfaitement sur tous les appareils.

    Fil d'Ariane

    Hiérarchies de navigation

    Retour et Utilitaires

    Barres de Progression

    Indicateurs de progression linéaires et circulaires
    Téléversement des Données
    72%
    Traitement en CoursProgress

    Squelettes et Alertes

    Widgets de retour et d'espace réservé

    Presse-papiers et Toast

    Utilitaires interactifs de retour utilisateur

    Éditable

    Cliquez pour éditer en ligne, sur place
    Artefact UI Suite
    Ajoutez une description…