Traduction technique
Du concept à l’implémentation
Une projection générée depuis l’ontologie publiée : élément HTML, motif ARIA, primitive Radix, recette shadcn et source de vérification.
41 correspondances sur 41
| Concept | HTML | ARIA | Radix | shadcn/ui | Preuve |
|---|---|---|---|---|---|
| Infobulleradix | — | tooltip | Tooltip | Tooltip | Vérifié |
| Fenêtre contextuelleradix | — | nonmodal dialog when interactive content requires it | Popover | Popover | Vérifié |
| Menu d'actions déroulantradix | — | menu | Dropdown Menu | Dropdown Menu | Vérifié |
| Boîte de dialogue modaleradix | — | dialog | Dialog | Dialog | Vérifié |
| Dialogue d'alerteradix | — | alertdialog | Alert Dialog | Alert Dialog | Vérifié |
| Visionneuse modaleshadcn-radix | — | dialog | Dialog | Dialog with figure viewer | Vérifié |
| Volet latéralshadcn-radix | — | dialog | Dialog | Sheet | Vérifié |
| Feuille bassespecialized | — | dialog when modal | — | Drawer (Radix backend) | Exception |
| Barre latéralecustom | aside with nav | complementary or navigation region | — | — | Exception |
| Liste de sélectionnative | select | native select | — | — | Vérifié |
| Comboboxshadcn-base | input | combobox with listbox popup | — | Combobox (Base UI backend) | Exception |
| Liste d'optionsnative | select[size] | listbox | — | — | Vérifié |
| Case à cochernative | input[type=checkbox] | checkbox | — | — | Vérifié |
| Groupe de boutons radionative | fieldset with input[type=radio] | radiogroup | — | — | Vérifié |
| Interrupteurradix | — | switch | Switch | Switch | Vérifié |
| Ongletsradix | — | tabs | Tabs | Tabs | Vérifié |
| Contrôle segmenténative | fieldset with input[type=radio] | radiogroup | — | — | Vérifié |
| Accordéonradix | — | disclosure buttons with aria-expanded | Accordion | Accordion | Vérifié |
| Notification temporaireradix | — | status or alert according to urgency | Toast | Toast | Vérifié |
| Alerte dans le contextecustom | div or section | status, alert, or no live role according to urgency | — | — | Exception |
| Bannière d'annoncecustom | section or aside with an accessible name | named region | — | — | Exception |
| Indicateur d'attentecustom | status text plus decorative indicator | status and aria-busy on the updated region | — | — | Exception |
| Barre de progressionnative | progress | progressbar | — | — | Vérifié |
| Squelette de chargementcustom | decorative blocks | aria-busy on the content region | — | — | Exception |
| Boutonnative | button[type=button|submit|reset] | button | — | — | Vérifié |
| Liennative | a[href] | link | — | — | Vérifié |
| Bouton icônenative | button[type=button] with accessible name | button | — | — | Vérifié |
| Champ de textenative | label with input | textbox | — | — | Vérifié |
| Zone de texte multilignenative | label with textarea | textbox | — | — | Vérifié |
| Champ de recherchenative | form[role=search] with input[type=search] | search landmark and searchbox | — | — | Vérifié |
| Fil d’Arianecustom | nav with ol and a[href] | breadcrumb navigation landmark with aria-current=page | — | — | Exception |
| Paginationcustom | nav with ul and a[href] | named pagination navigation with aria-current=page | — | — | Exception |
| Indicateur d’étapescustom | ol with status text and optional a[href] | ordered process stages with aria-current=step or true | — | — | Exception |
| Tableaunative | table with caption, th[scope], and td | native table | — | — | Vérifié |
| Grille de donnéescustom | div or table with managed cell focus | grid with row, columnheader, rowheader, and gridcell | — | — | Exception |
| Vue arborescentecustom | nested elements with managed item focus | tree with treeitem and group | — | — | Exception |
| Courbe d’animationcustom | button, label, select, input[type=checkbox] and decorative div | native controls and status text | — | — | Exception |
| Animation à ressortcustom | button, label, select, input[type=checkbox] and decorative div | native controls and status text | — | — | Exception |
| Transition d’étatcustom | button, label, select, input[type=checkbox] and decorative div | native controls and status text | — | — | Exception |
| Reflet de chargementcustom | button, label, select, input[type=checkbox] and decorative div | native controls and status text | — | — | Exception |
| Mouvement réduit et replicustom | button, label, input[type=checkbox] and decorative div | native controls and status text | — | — | Exception |