formik-stepper/dist/fromikForm/FormikStepper.js

Get ready to take your form-building game to the next level with this revolutionary React component. With its seamless integration with the powerful Formik library, you'll be building forms faster and more efficiently than ever before. But that's not all

var __assign = (this && this.__assign) || function () {
    __assign = Object.assign || function(t) {
        for (var s, i = 1, n = arguments.length; i < n; i++) {
            s = arguments[i];
            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
                t[p] = s[p];
        }
        return t;
    };
    return __assign.apply(this, arguments);
};
var __rest = (this && this.__rest) || function (s, e) {
    var t = {};
    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
        t[p] = s[p];
    if (s != null && typeof Object.getOwnPropertySymbols === "function")
        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
                t[p[i]] = s[p[i]];
        }
    return t;
};
import React, { useEffect, useState, memo, useMemo, useCallback } from "react";
import { Form, Formik } from "formik";
import Stepper from "../stepper";
import FormikButtons from "./FormikButtons";
export var FormikStepper = memo(function (_a) {
    var children = _a.children, nextButton = _a.nextButton, prevButton = _a.prevButton, submitButton = _a.submitButton, withStepperLine = _a.withStepperLine, props = __rest(_a, ["children", "nextButton", "prevButton", "submitButton", "withStepperLine"]);
    var steps = useMemo(function () { return React.Children.toArray(children); }, [children]);
    var _b = useState(0), step = _b[0], setStep = _b[1];
    var _c = useState(steps[step]), currentStep = _c[0], setCurrentStep = _c[1];
    var changeCurrentStep = useCallback(function () {
        setCurrentStep(steps[step]);
    }, [step, steps]);
    useEffect(function () {
        changeCurrentStep();
    }, [changeCurrentStep]);
    var mainForm = useMemo(function () { return (React.createElement(Form, null,
        withStepperLine && steps.length > 1 && (React.createElement(Stepper, { activeStep: step, steps: steps })),
        React.isValidElement(currentStep) &&
            React.cloneElement(currentStep, {
                key: "step-".concat(step, "-").concat(Math.random()),
            }),
        React.createElement(FormikButtons, { nextButton: nextButton, prevButton: prevButton, submitButton: submitButton, step: step, childrenLength: steps.length, setStep: setStep, currentStep: currentStep }))); }, [
        currentStep,
        nextButton,
        prevButton,
        step,
        steps,
        submitButton,
        withStepperLine,
    ]);
    return React.createElement(Formik, __assign({}, props), mainForm);
}, function (prevProps, nextProps) {
    var strPrev = JSON.stringify(prevProps);
    var strNext = JSON.stringify(nextProps);
    return strPrev === strNext;
});
FormikStepper.displayName = "FormikStepper";
export default FormikStepper;