Analytique du système de design
Statistiques en temps réel, conformité d'accessibilité et utilisation des jetons.
231
Composants au total
97%
Couverture MDX (225/231)
88%
Conformité ARIA
5
Jetons uniques utilisés
Nombre de composants par niveau
atoms
52 composants
molecules
90 composants
organisms
83 composants
templates
6 composants
Couverture dans le temps
| Date | Couverture (%) |
|---|---|
| 08-04T12:58 | 143 |
| 08-04T12:52 | 143 |
| 08-04T12:37 | 143 |
| 08-04T12:26 | 143 |
| 08-04T12:06 | 143 |
| 08-04T11:54 | 128 |
| 08-04T11:50 | 125 |
08-04T12:5808-04T12:5208-04T12:3708-04T12:2608-04T12:0608-04T11:5408-04T11:50
Conformité d'accessibilité
204 composants sur 231 ont un rôle ARIA explicitement défini.
region: 23group: 20button: 12table: 12dialog: 10img: 9status: 9article: 9list: 9combobox: 4navigation: 4link: 4application: 4textbox: 3radiogroup: 3form: 3complementary: 3contentinfo: 3banner: 3main: 3listbox: 2radio: 2alert: 2menu: 2search: 2section: 2figure: 2toolbar: 2banner/contentinfo composition: 2checkbox: 1separator: 1presentation (decorative): 1label: 1text: 1combobox (native select): 1switch: 1listitem: 1list (aria-labelledby): 1link | button: 1progressbar: 1radiogroup (input) | img (read-only): 1slider: 1tablist: 1script: 1status (alert for error): 1tooltip (dialog when interactive): 1button (with aria-haspopup='menu'): 1button (interactive) / complementary aside named via aria-labelledby (static): 1none (layout container): 1none (page provides <main>): 1document: 1navigation (left): 1presentation: 1alert (error paragraph): 1group (when as='fieldset'; auto-named via aria-labelledby → title): 1listbox (popover): 1presentation (wrapper): 1group (when as='fieldset'): 1generic: 1group (only when asGroup): 1tablist (preset pill group; each pill role=tab with aria-selected): 1button (switch semantics): 1grid: 1dialog (combobox pattern): 1navigation (complementary): 1
Utilisation des jetons (Top 20)
JetonComposants
text-muted1
sm1
text-heading1
more-menu-item-content1
md1
Jetons inutilisés
147 jeton(s) défini(s) dans globals.css mais jamais référencé(s) par un fichier .tsx de composant.
Variable CSSSlug
--ep-amberamber
--ep-barcode-bgbarcode-bg
--ep-barcode-fgbarcode-fg
--ep-barcode-quiet-zonebarcode-quiet-zone
--ep-bgbg
--ep-bg-3bg-3
--ep-bg-page-darkbg-page-dark
--ep-bg-secondarybg-secondary
--ep-bg-tertiarybg-tertiary
--ep-blueblue
--ep-borderborder
--ep-border-strongborder-strong
--ep-border-subtleborder-subtle
--ep-btn-primary-bgbtn-primary-bg
--ep-btn-primary-hoverbtn-primary-hover
--ep-cyancyan
--ep-duration-crossfadeduration-crossfade
--ep-duration-entranceduration-entrance
--ep-duration-expandduration-expand
--ep-duration-fastduration-fast
--ep-duration-hoverduration-hover
--ep-duration-normalduration-normal
--ep-duration-sheetduration-sheet
--ep-duration-slowduration-slow
--ep-ease-brandease-brand
--ep-ease-inease-in
--ep-ease-in-outease-in-out
--ep-ease-outease-out
--ep-errorerror
--ep-focus-ringfocus-ring
--ep-focus-ring-offsetfocus-ring-offset
--ep-font-displayfont-display
--ep-font-monofont-mono
--ep-font-sansfont-sans
--ep-font-size-2xlfont-size-2xl
--ep-font-size-2xsfont-size-2xs
--ep-font-size-3xlfont-size-3xl
--ep-font-size-4xlfont-size-4xl
--ep-font-size-basefont-size-base
--ep-font-size-lgfont-size-lg
--ep-font-size-sectionfont-size-section
--ep-font-size-smfont-size-sm
--ep-font-size-stubbarfont-size-stubbar
--ep-font-size-xlfont-size-xl
--ep-font-size-xsfont-size-xs
--ep-font-text-codefont-text-code
--ep-font-text-primaryfont-text-primary
--ep-font-text-secondaryfont-text-secondary
--ep-gradient-scrimgradient-scrim
--ep-header-h-desktopheader-h-desktop
--ep-header-h-mobileheader-h-mobile
--ep-icon-text-inset-lgicon-text-inset-lg
--ep-icon-text-inset-mdicon-text-inset-md
--ep-indigoindigo
--ep-infoinfo
--ep-neutral-500neutral-500
--ep-overlay-border-mediumoverlay-border-medium
--ep-overlay-border-subtleoverlay-border-subtle
--ep-overlay-faintoverlay-faint
--ep-overlay-mediumoverlay-medium
--ep-overlay-scrimoverlay-scrim
--ep-overlay-scrim-lightoverlay-scrim-light
--ep-overlay-softoverlay-soft
--ep-overlay-text-iconoverlay-text-icon
--ep-overlay-text-mutedoverlay-text-muted
--ep-overlay-text-strongoverlay-text-strong
--ep-overlay-text-subtleoverlay-text-subtle
--ep-overlay-traceoverlay-trace
--ep-pinkpink
--ep-qr-bgqr-bg
--ep-radius-2xlradius-2xl
--ep-radius-fullradius-full
--ep-radius-lgradius-lg
--ep-radius-mdradius-md
--ep-radius-noneradius-none
--ep-radius-smradius-sm
--ep-radius-xlradius-xl
--ep-row-h-collapsedrow-h-collapsed
--ep-row-h-expandedrow-h-expanded
--ep-semantic-errorsemantic-error
--ep-semantic-error-bgsemantic-error-bg
--ep-semantic-error-fgsemantic-error-fg
--ep-semantic-error-tintsemantic-error-tint
--ep-semantic-error-tint-bordersemantic-error-tint-border
--ep-semantic-info-bgsemantic-info-bg
--ep-semantic-info-fgsemantic-info-fg
--ep-semantic-info-tintsemantic-info-tint
--ep-semantic-info-tint-bordersemantic-info-tint-border
--ep-semantic-success-bgsemantic-success-bg
--ep-semantic-success-fgsemantic-success-fg
--ep-semantic-success-tintsemantic-success-tint
--ep-semantic-success-tint-bordersemantic-success-tint-border
--ep-semantic-warningsemantic-warning
--ep-semantic-warning-fgsemantic-warning-fg
--ep-semantic-warning-tintsemantic-warning-tint
--ep-semantic-warning-tint-bordersemantic-warning-tint-border
--ep-shadow-lgshadow-lg
--ep-shadow-mdshadow-md
--ep-shadow-overlayshadow-overlay
--ep-shadow-smshadow-sm
--ep-shadow-xlshadow-xl
--ep-space-1space-1
--ep-space-10space-10
--ep-space-12space-12
--ep-space-16space-16
--ep-space-2space-2
--ep-space-20space-20
--ep-space-24space-24
--ep-space-3space-3
--ep-space-32space-32
--ep-space-3xlspace-3xl
--ep-space-4space-4
--ep-space-4xlspace-4xl
--ep-space-5space-5
--ep-space-6space-6
--ep-space-8space-8
--ep-space-lgspace-lg
--ep-space-mdspace-md
--ep-space-smspace-sm
--ep-space-xlspace-xl
--ep-space-xsspace-xs
--ep-space-xxlspace-xxl
--ep-space-xxsspace-xxs
--ep-stamp-hstamp-h
--ep-stamp-wstamp-w
--ep-successsuccess
--ep-surface-cardsurface-card
--ep-surface-elevatedsurface-elevated
--ep-surface-navysurface-navy
--ep-tap-mintap-min
--ep-tealteal
--ep-text-bodytext-body
--ep-text-inversetext-inverse
--ep-text-linktext-link
--ep-text-tealtext-teal
--ep-transition-fasttransition-fast
--ep-transition-normaltransition-normal
--ep-transition-slowtransition-slow
--ep-warningwarning
--ep-z-basez-base
--ep-z-dropdownz-dropdown
--ep-z-modalz-modal
--ep-z-overlayz-overlay
--ep-z-popoverz-popover
--ep-z-skip-linkz-skip-link
--ep-z-stickyz-sticky
--ep-z-toastz-toast
Dernière vérification : 9 novembre 2026 à 07 h 52 — Source : /app/packages/storefront/../design-system/docs/components