Guidelines

Les règles qui gardent kView INVESTOR cohérent.

Un résumé opératoire des contrats de composants, données, interaction et responsive.

À faire

  • Réutiliser x-ui.* et x-erp.* avant d’ajouter du markup.
  • Définir la sémantique d’une colonne une seule fois.
  • Passer par les tokens et les variantes existantes.
  • Garder les labels, rôles et relations ARIA rendus côté Blade.
  • Porter les popovers, tooltips, modals et drawers dans la floating layer.
  • Vérifier desktop large, desktop contraint, tablette et mobile.

À éviter

  • Dupliquer un SVG, un format financier ou un état de cellule.
  • Créer une nouvelle primitive pour une variante seulement visuelle.
  • Ajouter un script inline, un onclick ou un listener document local.
  • Utiliser le z-index pour contourner un ancestor qui clippe.
  • Encoder un statut uniquement par la couleur.
  • Transformer une interface finance dense en collection de cartes décoratives.

Ownership

Un seul propriétaire CSS et JavaScript par famille de sélecteurs ou comportement.

Accessibility

Nom accessible avant JavaScript, focus visible, Escape et restauration du focus.

Density

Lignes stables, libellés tronqués et données alignées sans augmenter la hauteur.

Responsive

Les commandes se replient par priorité ; seules les régions data peuvent scroller horizontalement.

Inventory

La carte de l’API publique.

Une vue compacte des composants que les pages et les SaaS consommateurs peuvent invoquer.

@foreach ($componentInventory as $group => $components)
{{ $group }} {{ count($components) }} composants
@foreach ($components as $component)
<{{ $component['tag'] }} /> {{ $component['purpose'] }}
@endforeach
@endforeach