Files
progress-test/app/javascript/pages/question/Form/SteppedForm.tsx
2022-07-21 21:16:59 -03:00

35 lines
624 B
TypeScript

import React, { FC } from "react";
type StepProps = {
children: any
step: number
}
export const Step: FC<StepProps> = ({ children }) => (children);
type Props = {
children: any;
currentStep: number;
className?: string;
};
export const SteppedForm: FC<Props> = ({
children,
currentStep,
className = '',
}) => {
return (
<div className={className}>
{children?.map((x: any) => {
const visible = x.props.step === currentStep;
return (
<div key={x.props.step} className={visible ? "" : "hidden"}>
{x}
</div>
);
})}
</div>
);
};