XBoard UI Docs
Architecture modulaire, patterns, demos et contrats d’intégration.
Ouvrir Storybook

XBoard UI Docs

Portail central du design system XBoard: composants partagés, patterns métier, contrats d’intégration backend, feedback system, et tutoriels pas à pas.

Pourquoi cette documentation existe

  • Réduire la duplication entre base apps (tenant-admin, store, erp-ops).
  • Accélérer l’onboarding des devs juniors avec des pages guidées.
  • Garantir des implémentations cohérentes (scope, erreurs, feedback, workflows).

Vue d’ensemble du système

  1. UI Foundation: `@kiwal/ui-web` (primitives + variants + smart inputs).
  2. Smart CRUD: `@xboard/ui-smart-crud-core` + adapter server actions.
  3. Feature Layer: `@xboard/feature-smart-list`, `@xboard/feature-smart-fields`, `@xboard/feature-feedback-ui`.
  4. App Governance: scope tenant/OU, contrat d’erreur, feedback-first.

Comment utiliser cette doc (ordre recommandé)

  1. Getting Started pour setup local et conventions.
  2. Scope & Tenant pour les règles d’accès.
  3. Scope Resolver: Vue d’ensemble pour le contrat global.
  4. Scope Resolver: Hook pour l’intégration frontend.
  5. Scope Resolver: Server Actions pour l’intégration backend.
  6. Scope Troubleshooting pour le diagnostic incidents.
  7. Server Actions Handbook pour les contrats API.
  8. Feedback System pour la gestion des erreurs.
  9. XBoard Smart Layer pour CRUD + smart fields.
  10. Tutoriels pour construire une page de A à Z.

Parcours selon profil

Environnements docs

Playground
http://localhost:6007
Docs
http://localhost:6008
Scope
@kiwal/ui-web + @xboard/feature-*

Règle clé d’implémentation

Ne pas créer un composant local si:
1) un composant partagé existe déjà,
2) son contrat couvre le besoin,
3) l’extension peut être faite par props/composition.