function MainComponent() { const [patientName, setPatientName] = React.useState(''); const [symptoms, setSymptoms] = React.useState(''); const [diagnosis, setDiagnosis] = React.useState(''); function handlePatientNameChange(event) { setPatientName(event.target.value); } function handleSymptomsChange(event) { setSymptoms(event.target.value); } function handleDiagnosisChange(event) { setDiagnosis(event.target.value); } function handleSubmit(event) { event.preventDefault(); const message = `Patient Name: ${patientName}\nSymptoms: ${symptoms}\nDiagnosis: ${diagnosis}`; alert(message); } const isSubmitDisabled = patientName.trim() === '' || symptoms.trim() === '' || diagnosis.trim() === ''; return /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-center min-h-screen bg-[#f7f8fc]", __source: { fileName: "", lineNumber: 21, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "p-6 w-full max-w-[600px] bg-white rounded-md shadow-lg", __source: { fileName: "", lineNumber: 22, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "mb-4 text-2xl font-semibold text-center text-[#121212] font-roboto", __source: { fileName: "", lineNumber: 23, columnNumber: 9 }, __self: this }, "Remote Diagnostic Device"), /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, className: "space-y-6", __source: { fileName: "", lineNumber: 24, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 25, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "patientName", className: "block mb-2 text-sm font-medium text-[#6b7280] font-roboto", __source: { fileName: "", lineNumber: 26, columnNumber: 13 }, __self: this }, "Patient Name"), /*#__PURE__*/ React.createElement("input", { type: "text", id: "patientName", name: "patientName", className: "block w-full p-2.5 text-sm border-gray-200 rounded-lg shadow-sm focus:border-blue-500 focus:ring-blue-500", placeholder: "Enter patient's name", onChange: handlePatientNameChange, __source: { fileName: "", lineNumber: 27, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 36, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "symptoms", className: "block mb-2 text-sm font-medium text-[#6b7280] font-roboto", __source: { fileName: "", lineNumber: 37, columnNumber: 13 }, __self: this }, "Symptoms"), /*#__PURE__*/ React.createElement("textarea", { id: "symptoms", name: "symptoms", rows: "4", className: "block w-full p-2.5 text-sm border-gray-200 rounded-lg shadow-sm focus:border-blue-500 focus:ring-blue-500", placeholder: "Describe the symptoms...", onChange: handleSymptomsChange, __source: { fileName: "", lineNumber: 38, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 47, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "diagnosis", className: "block mb-2 text-sm font-medium text-[#6b7280] font-roboto", __source: { fileName: "", lineNumber: 48, columnNumber: 13 }, __self: this }, "Diagnosis"), /*#__PURE__*/ React.createElement("textarea", { id: "diagnosis", name: "diagnosis", rows: "4", className: "block w-full p-2.5 text-sm border-gray-200 rounded-lg shadow-sm focus:border-blue-500 focus:ring-blue-500", placeholder: "Enter your diagnostic findings...", onChange: handleDiagnosisChange, __source: { fileName: "", lineNumber: 49, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("button", { type: "submit", disabled: isSubmitDisabled, className: `w-full px-4 py-2 text-white bg-blue-500 rounded-md font-roboto hover:bg-blue-600 focus:outline-none focus:ring-2 focus:ring-blue-300 focus:ring-offset-2 ${isSubmitDisabled ? 'opacity-50 cursor-not-allowed' : 'opacity-100'}`, __source: { fileName: "", lineNumber: 58, columnNumber: 11 }, __self: this }, "Submit")))); }