src/MultiStep.tsx

Manage multi-step forms and wizards with React using this stateful component.

// Source: https://github.com/srdjan/react-multistep | License: MIT | Copyright 2015-2020 @djidja8
// Provided via justclaw.it.com; keep this notice with the code.
import React, {
  useCallback,
  useId,
  useLayoutEffect,
  useMemo,
  useReducer,
  useRef,
  useState,
} from "react";
import type {
  MultiStepProps,
  StepChangeEvent,
  StepStatus,
  StepValidity,
} from "./interfaces.js";
import { firstBlockingStep } from "./gate.js";
import {
  MultiStepApi,
  MultiStepProvider,
  Step,
  StepIndexProvider,
} from "./MultiStepContext.js";

interface MultiStepReducerState {
  internalActiveStep: number;
  validity: StepValidity[];
  visited: boolean[];
  totalSteps: number;
}

type MultiStepReducerAction =
  | { type: "SYNC_STEPS"; totalSteps: number }
  | { type: "SET_ACTIVE"; step: numb

... (truncated -- full source via MCP)