stepperizar

Uma biblioteca para criar fluxos de trabalho passo a passo em seus aplicativos

• Rápido e eficiente

• Poderoso e flexível

• Leve (<1kB compactado)

• Totalmente seguro

• Arquitetura combinável

• Sem estilo para personalização máxima

Instalação

 npm instalar @stepperize/react

Início rápido

1. Importe o construtor:

 importar {defineStepper} de "@stepperize/react";

2. Defina suas etapas:

 const { Escopo, useStepper, etapas } = defineStepper(
  { id: "etapa-1", título: "Etapa 1", descrição: "Descrição da etapa 1" },
  { id: "etapa-2", título: "Etapa 2", descrição: "Descrição da etapa 2" },
  { id: "etapa-3", título: "Etapa 3", descrição: "Descrição da etapa 3" },
  { id: "etapa-4", título: "Etapa 4", descrição: "Descrição da etapa 4" });

3. Use o gancho em seus componentes:

 função StepperComponent() {
  const { currentStep, nextStep, prevStep } = useStepper();

  return (
 
{currentStep.title}
 
{currentStep.description}
 Anterior  Próximo
  );}

Como funciona

Stepperize permite definir uma série de etapas com IDs exclusivos. Ao criar suas etapas usando defineStepper , você obtém:

• Um componente Scoped para gerenciamento de contexto

• Um gancho useStepper para controle de etapas

• Uma série de steps para renderização

O único campo obrigatório para cada etapa é o id . Você pode adicionar quaisquer propriedades adicionais necessárias e elas serão totalmente seguras ao usar o gancho.

Documentação

Para obter informações mais detalhadas sobre uso, configuração e recursos avançados, visite nossa documentação completa.

Contribuindo

Aceitamos contribuições! Consulte nosso Guia de contribuição para obter mais detalhes.

Licença

Stepperize é licenciado pelo MIT.