function MainComponent() { const [currentStep, setCurrentStep] = React.useState(0); const steps = [ 'Step 1', 'Step 2', 'Step 3', 'Step 4' ]; const nextStep = ()=>{ setCurrentStep((prev)=>(prev + 1) % steps.length); }; const previousStep = ()=>{ setCurrentStep((prev)=>(prev - 1 + steps.length) % steps.length); }; const skipStep = ()=>{ setCurrentStep((prev)=>(prev + 1) % steps.length); }; let buttonText = 'Let\'s Begin'; if (currentStep === steps.length - 1) { buttonText = 'Finish'; } else if (currentStep > 0) { buttonText = 'Next Step'; } return /*#__PURE__*/ React.createElement("div", { className: "bg-[#FFF3F1] min-h-screen flex flex-col", __source: { fileName: "", lineNumber: 26, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center p-4 border-b border-[#FE7F77]", __source: { fileName: "", lineNumber: 27, columnNumber: 7 }, __self: this }, currentStep > 0 ? /*#__PURE__*/ React.createElement("button", { onClick: previousStep, className: "text-[#FE7F77]", __source: { fileName: "", lineNumber: 29, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-arrow-left", __source: { fileName: "", lineNumber: 30, columnNumber: 13 }, __self: this })) : /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 33, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("i", { className: "fas fa-bars text-[#FE7F77]", __source: { fileName: "", lineNumber: 35, columnNumber: 9 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex-grow flex items-center justify-center p-4", __source: { fileName: "", lineNumber: 37, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-xs mx-auto", __source: { fileName: "", lineNumber: 38, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "./scientist-illustration.png", alt: "Scientist working in a lab with a microscope", className: "w-full", __source: { fileName: "", lineNumber: 39, columnNumber: 11 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "text-center p-4", __source: { fileName: "", lineNumber: 46, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "font-roboto text-[#FE7F77] text-xl mb-2", __source: { fileName: "", lineNumber: 47, columnNumber: 9 }, __self: this }, "Testing"), /*#__PURE__*/ React.createElement("div", { className: "flex justify-center gap-2 mb-4", __source: { fileName: "", lineNumber: 48, columnNumber: 9 }, __self: this }, steps.map((_, idx)=>/*#__PURE__*/ React.createElement("div", { key: idx, className: `h-2 w-2 rounded-full ${idx === currentStep ? 'bg-[#FE7F77]' : 'bg-[#D1D5DB]'}`, __source: { fileName: "", lineNumber: 50, columnNumber: 13 }, __self: this }))), /*#__PURE__*/ React.createElement("button", { onClick: nextStep, className: "bg-[#FE7F77] text-white px-6 py-2 rounded font-roboto font-bold", __source: { fileName: "", lineNumber: 56, columnNumber: 9 }, __self: this }, buttonText), currentStep !== steps.length - 1 && /*#__PURE__*/ React.createElement("button", { onClick: skipStep, className: "text-[#718096] px-6 py-2 font-roboto", __source: { fileName: "", lineNumber: 60, columnNumber: 11 }, __self: this }, "Skip Step"))); }