Exemples et démos

Voir Ori en action

Quatre démos couvrent les principaux cas d usage des services administratifs PF : portail citoyen, site institutionnel, authentification fédérée, back-office agent. Toutes consomment les packages @govpf/ori-* publiés, sans modification.

  • React + Vite

    Portail citoyen (parcours bout en bout)

    Démo complète du portail PF : connexion fédérée, page d accueil personnalisée, dépôt et suivi de démarches, espace messages. Pendant citoyen du back-office agent ci-dessous.

    Composants démontrés : Tous les composants Ori React, ChatBot d aide intégré

  • HTML statique

    Landing institutionnelle

    Site institutionnel d un service administratif (Direction du Patrimoine) en HTML pur. Hero avec motif polynésien, sections trust strip, chiffres clés, actualités, missions. Pages Mentions légales et Recrutement incluses.

    Composants démontrés : ori-card, ori-tag, ori-statistic, ori-link, ori-breadcrumb, ori-button

  • HTML statique

    Mires d authentification Keycloak

    7 écrans HTML pur servant de référence pour les équipes qui développent un thème Keycloak : connexion, création de compte, mot de passe oublié, définition de mot de passe, code à usage unique, session expirée, erreur.

    Composants démontrés : ori-card--elevated, ori-input, ori-button, ori-alert, ori-link

  • Angular 20 standalone

    Back-office agent (instruction de dossiers)

    Espace agent administratif construit en Angular 20 standalone. Démontre la consommation de @govpf/ori-angular en conditions réelles : sélection multiple, tri, cellTemplate, menus, dialog de confirmation, notifications, recherche et filtres.

    Composants démontrés : ori-app-shell, ori-table (sélection + tri + cellTemplate), ori-dropdown-menu, ori-alert-dialog, ori-notification, ori-search-bar, ori-statistic

Outils interactifs

  • Storybook React

    Catalogue interactif de tous les composants @govpf/ori-react. Variantes, contrôles et documentation générée à partir des types TypeScript.

  • Storybook Angular

    Catalogue interactif de tous les composants @govpf/ori-angular. Miroir parité du Storybook React.