Aide & Support
Les questions les plus courantes, avec un renvoi vers la page qui détaille chaque réponse.
Une librairie de composants web qui mise avant tout sur l'accessibilité. Elle prend en charge les patterns où l'accessibilité est difficile à réussir (stepper, datepicker, dialog…) et ne réécrit pas les éléments natifs qui fonctionnent bien. Vous pouvez l'utiliser directement dans vos projets, ou en faire l'une des fondations de votre design system.
Ariane garantit l'accessibilité structurelle : rôles ARIA, attributs, gestion du focus, icônes masquées aux technologies d'assistance. Vous fournissez l'accessibilité éditoriale : messages compréhensibles hors contexte visuel, niveaux de sévérité cohérents, libellés significatifs. Chaque page de composant détaille les deux, dans les sections « Pris en charge automatiquement » et « À votre charge » (par exemple pour Alert).
Ariane est headless : les composants fonctionnent pleinement (accessibilité, interactions) mais n'ont aucun style visuel. Ajoutez une couche CSS. Le plus simple est de partir du thème neutre du starter-kit, présenté sur Appliquer un thème. La vue d'ensemble décrit les leviers disponibles.
Pas encore. Ariane est en alpha : l'API peut changer sans préavis. Les changements de chaque version sont listés dans les Releases GitHub.
Le CDN est la voie recommandée pour démarrer : deux balises dans le <head>, sans outil. Passez à npm si vous avez un bundler et voulez n'importer que les composants utilisés, ou choisir vous-même leurs tags. Voir le démarrage rapide.
Les composants sont des Custom Elements standards. La page Frameworks détaille l'intégration avec React, Next.js, Vue, Angular et Svelte.
Chrome et Edge 125, Firefox 126, Safari 17.5 (macOS, iOS et iPadOS), sans polyfills. Voir Compatibilité.
Pas de support officiel pour l'instant : c'est une fonctionnalité à venir. Le support actuel est partiel et n'est pas testé. Voir Compatibilité.
Les Custom Elements s'enregistrent de façon asynchrone. Avant d'agir sur un composant, attendez sa définition : customElements.whenDefined('ar-alert') pour un seul, ou whenAllDefined(), importé de @ariane-ui/core/utils, pour tous ceux de la page. Voir Attendre le chargement.
Ariane n'impose aucun thème : le mode sombre fait partie du vôtre. Le thème du starter-kit montre comment gérer les modes clair et sombre. Si vous avez déjà un design system, faites pointer les tokens Ariane vers les vôtres : leurs valeurs suivront votre mode sombre. Voir Appliquer un thème.
Oui. Définissez window.ARIANE_CONFIG.prefix avant le script (CDN) ou avant l'import de la librairie (npm). Avec npm, vous pouvez aussi importer les classes depuis @ariane-ui/core/headless et appeler customElements.define() avec le tag de votre choix. Voir Personnaliser le préfixe des tags.
Le français (par défaut) et l'anglais sont fournis. La langue vient de <html lang> ou de l'attribut lang du composant. Pour une autre langue, écrivez votre traduction : voir Traductions.
Posez votre question dans les Discussions, catégorie Q&A. Pour signaler un bug ou proposer une idée, voir Contribuer.