function MainComponent() { const [totalMedicalExpenses, setTotalMedicalExpenses] = React.useState(""); const [treatmentReceived, setTreatmentReceived] = React.useState(""); const [totalLostWages, setTotalLostWages] = React.useState(""); const [fault, setFault] = React.useState("theirs"); const [injuries, setInjuries] = React.useState("temporary"); const [estimate, setEstimate] = React.useState(null); const [showContactForm, setShowContactForm] = React.useState(false); const [email, setEmail] = React.useState(""); const [phone, setPhone] = React.useState(""); const handleCalculate = ()=>{ const estimateValue = calculateEstimate(totalMedicalExpenses, treatmentReceived, totalLostWages, fault, injuries); setEstimate(estimateValue); }; const handleContact = ()=>setShowContactForm(true); const calculateEstimate = (medical, treatment, wages, fault, injuries)=>{ let baseValue = parseFloat(medical) + parseFloat(wages); if (treatment === "surgery") baseValue *= 1.5; if (fault === "mine") baseValue *= 0.5; if (injuries === "permanent") baseValue *= 2; return baseValue.toFixed(2); }; const handleSubmit = ()=>{ console.log({ totalMedicalExpenses, treatmentReceived, totalLostWages, fault, injuries, email, phone }); }; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center p-5 font-roboto w-full min-h-screen", style: { backgroundImage: `url(https://images.leadconnectorhq.com/image/f_webp/q_80/r_1200/u_https://assets.cdn.filesafe.space/0VAy2jLo5xAZ08FQAnuj/media/65412a584fb4b00a1450cb2f.jpeg)`, backgroundSize: 'cover' }, __source: { fileName: "", lineNumber: 32, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white p-[20px] w-full max-w-[600px] float-right rounded shadow-lg", __source: { fileName: "", lineNumber: 36, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-xl font-semibold mb-4", __source: { fileName: "", lineNumber: 37, columnNumber: 9 }, __self: this }, "Claim Value Calculator"), /*#__PURE__*/ React.createElement("div", { className: "flex mb-4 gap-4", __source: { fileName: "", lineNumber: 38, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-1/2", __source: { fileName: "", lineNumber: 39, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block mb-2", __source: { fileName: "", lineNumber: 40, columnNumber: 13 }, __self: this }, "Total Medical Expenses ($):"), /*#__PURE__*/ React.createElement("input", { name: "totalMedicalExpenses", type: "number", value: totalMedicalExpenses, onChange: (e)=>setTotalMedicalExpenses(e.target.value), className: "w-full p-2 border border-gray-300 rounded", __source: { fileName: "", lineNumber: 41, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "w-1/2", __source: { fileName: "", lineNumber: 49, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block mb-2", __source: { fileName: "", lineNumber: 50, columnNumber: 13 }, __self: this }, "Total Lost Wages ($):"), /*#__PURE__*/ React.createElement("input", { name: "totalLostWages", type: "number", value: totalLostWages, onChange: (e)=>setTotalLostWages(e.target.value), className: "w-full p-2 border border-gray-300 rounded", __source: { fileName: "", lineNumber: 51, columnNumber: 13 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 60, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block mb-2", __source: { fileName: "", lineNumber: 61, columnNumber: 11 }, __self: this }, "Treatment Received:"), /*#__PURE__*/ React.createElement("select", { name: "treatmentReceived", value: treatmentReceived, onChange: (e)=>setTreatmentReceived(e.target.value), className: "w-full p-2 border border-gray-300 rounded", __source: { fileName: "", lineNumber: 62, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "", __source: { fileName: "", lineNumber: 68, columnNumber: 13 }, __self: this }, "Select treatment"), /*#__PURE__*/ React.createElement("option", { value: "physical_therapy", __source: { fileName: "", lineNumber: 69, columnNumber: 13 }, __self: this }, "Physical Therapy"), /*#__PURE__*/ React.createElement("option", { value: "surgery", __source: { fileName: "", lineNumber: 70, columnNumber: 13 }, __self: this }, "Surgery"), /*#__PURE__*/ React.createElement("option", { value: "medication", __source: { fileName: "", lineNumber: 71, columnNumber: 13 }, __self: this }, "Medication"))), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 74, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block mb-2", __source: { fileName: "", lineNumber: 75, columnNumber: 11 }, __self: this }, "Who was at fault?"), /*#__PURE__*/ React.createElement("select", { name: "fault", value: fault, onChange: (e)=>setFault(e.target.value), className: "w-full p-2 border border-gray-300 rounded", __source: { fileName: "", lineNumber: 76, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "theirs", __source: { fileName: "", lineNumber: 82, columnNumber: 13 }, __self: this }, "The other party was at fault"), /*#__PURE__*/ React.createElement("option", { value: "mine", __source: { fileName: "", lineNumber: 83, columnNumber: 13 }, __self: this }, "I was at fault"))), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 86, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block mb-2", __source: { fileName: "", lineNumber: 87, columnNumber: 11 }, __self: this }, "Seriousness of Injuries:"), /*#__PURE__*/ React.createElement("select", { name: "injuries", value: injuries, onChange: (e)=>setInjuries(e.target.value), className: "w-full p-2 border border-gray-300 rounded", __source: { fileName: "", lineNumber: 88, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "temporary", __source: { fileName: "", lineNumber: 94, columnNumber: 13 }, __self: this }, "Temporary"), /*#__PURE__*/ React.createElement("option", { value: "permanent", __source: { fileName: "", lineNumber: 95, columnNumber: 13 }, __self: this }, "Permanent"))), estimate === null ? /*#__PURE__*/ React.createElement("button", { onClick: handleCalculate, className: "w-full px-4 py-2 bg-blue-500 text-white rounded hover:bg-blue-700", __source: { fileName: "", lineNumber: 99, columnNumber: 11 }, __self: this }, "Calculate estimate value of my claim") : /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("div", { className: "mb-4 p-4 bg-green-100 rounded w-full text-center", __source: { fileName: "", lineNumber: 107, columnNumber: 13 }, __self: this }, "Estimated value of your claim: $", estimate), !showContactForm ? /*#__PURE__*/ React.createElement("button", { onClick: handleContact, className: "w-full px-4 py-2 mb-4 bg-blue-500 text-white rounded hover:bg-blue-700", __source: { fileName: "", lineNumber: 109, columnNumber: 15 }, __self: this }, "Have an attorney contact me") : /*#__PURE__*/ React.createElement("div", { className: "flex mb-4 gap-4", __source: { fileName: "", lineNumber: 113, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-1/2", __source: { fileName: "", lineNumber: 114, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block mb-2", __source: { fileName: "", lineNumber: 115, columnNumber: 19 }, __self: this }, "Email:"), /*#__PURE__*/ React.createElement("input", { name: "email", type: "email", value: email, onChange: (e)=>setEmail(e.target.value), className: "w-full p-2 border border-gray-300 rounded", __source: { fileName: "", lineNumber: 116, columnNumber: 19 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "w-1/2", __source: { fileName: "", lineNumber: 124, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block mb-2", __source: { fileName: "", lineNumber: 125, columnNumber: 19 }, __self: this }, "Phone Number:"), /*#__PURE__*/ React.createElement("input", { name: "phone", type: "tel", value: phone, onChange: (e)=>setPhone(e.target.value), className: "w-full p-2 border border-gray-300 rounded", __source: { fileName: "", lineNumber: 126, columnNumber: 19 }, __self: this })), /*#__PURE__*/ React.createElement("button", { onClick: handleSubmit, className: "px-4 py-2 bg-blue-500 text-white rounded hover:bg-blue-700", __source: { fileName: "", lineNumber: 134, columnNumber: 17 }, __self: this }, "Request a call back"))))); }