Allaw UI

Allaw UI est une bibliothèque de composants React personnalisés pour les applications Allaw. Elle fournit un ensemble cohérent d'éléments d'interface utilisateur conçus pour s'intégrer parfaitement dans l'écosystème Allaw.

Installation

npm install @allaw/allaw-ui

Utilisation

Importez les composants dont vous avez besoin dans votre application React.

Composants disponibles

• Button
• Icon
• Tag
• EmployeeCard
• CaseCard
• DocumentCard
• ContactCard
• Stepper
• ProgressBar
• Input
• SearchBar
• Typography (Heading, Subtitle, Paragraph, TinyInfo, SmallTitle)
• AppointementStatusTag
• FolderStatusTag
• PendingDocuments
• ActionCircleButton
• GhostButton
• Checkbox

Pour une documentation complète de chaque composant, veuillez consulter notre Storybook.

Développement

Prérequis

• npm
• nextjs 14 ou supérieur
• react 17 ou supérieur

Installation des dépendances

npm install

Storybook sera disponible à l'adresse http://localhost:6006.

Utilisation des Couleurs

import "../node_modules/allaw-ui/dist/styles/colors.css";

<div className={styles.testCouleur}>
Test couleur variable --bleu-allaw
</div>

Fichier page.modules.css : .testCouleur { color: var(--bleu-allaw); }

Utilisation des Boutons

import PrimaryButton from "allaw-ui/dist/components/atoms/buttons/PrimaryButton";

<Button
      label="click me"
      startIcon="allaw-icon-arrow-right"
      endIcon="allaw-icon-arrow-left"
    />

Utilisation des Tags

import { Tag } from "allaw-ui";
<Tag status="passed" variant="big" />

Build

Pour construire la bibliothèque :

npm run build

Storybook

Pour lancer Storybook en mode développement :

npm run build-storybook

Contribution

Allaw UI est un projet privé. Pour toute question ou suggestion, veuillez contacter l'équipe de développement Allaw.

Licence

Ce projet est sous licence propriétaire. Copyright © 2024 Allaw. Tous droits réservés.