stepperiser

Une bibliothèque pour créer des workflows étape par étape dans vos applications

• Rapide et efficace

• Puissant et flexible

• Léger (< 1 Ko gzippé)

• Entièrement sécurisé

• Architecture composable

• Sans style pour une personnalisation maximale

Installation

 npm installer @stepperize/react

Démarrage rapide

1. Importez le constructeur :

 importer { definitionStepper } depuis "@stepperize/react" ;

2. Définissez vos étapes :

 const { Scoped, useStepper, étapes } = definitionStepper(
  { id : "étape 1", titre : "Étape 1", description : "Description de l'étape 1" },
  { id : "étape 2", titre : "Étape 2", description : "Description de l'étape 2" },
  { id : "étape 3", titre : "Étape 3", description : "Description de l'étape 3" },
  { id : "étape 4", titre : "Étape 4", description : "Description de l'étape 4" });

3. Utilisez le hook dans vos composants :

 fonction StepperComponent() {
  const { currentStep, nextStep, prevStep } = useStepper();

  return (
 
{currentStep.title}
 
{currentStep.description>
 Précédent  Suivant
  );}

Comment ça marche

Stepperize vous permet de définir une série d'étapes avec des identifiants uniques. Lorsque vous créez vos étapes à l'aide de defineStepper , vous obtenez :

• Un composant Scoped pour la gestion du contexte

• Un crochet useStepper pour le contrôle des pas

• Un éventail d' steps pour le rendu

Le seul champ obligatoire pour chaque étape est le id . Vous pouvez ajouter toutes les propriétés supplémentaires dont vous avez besoin, et elles seront entièrement sécurisées lors de l'utilisation du hook.

Documentation

Pour des informations plus détaillées sur l’utilisation, la configuration et les fonctionnalités avancées, consultez notre documentation complète.

Contribuer

Nous apprécions les contributions ! Veuillez consulter notre Guide de contribution pour plus de détails.

Licence

Stepperize est sous licence MIT.