function MainComponent() { const [oxygenRequirement, setOxygenRequirement] = React.useState(null); const speciesOptions = [ "Climbing perch", "Walking catfish", "Shingi", "Pabda Catfish", "Rohu", "Catla", "Mrigal", "Silver carp", "Big head Carp", "Grass Carp", "Common carp", "Pangasius", "Nile Tilapia", "Koi" ]; const respirationRates = { "Climbing perch": 0.6, "Walking catfish": 0.6, "Shingi": 0.6, "Pabda Catfish": 0.6, "Rohu": 0.6, "Catla": 0.6, "Mrigal": 0.6, "Silver carp": 0.6, "Big head Carp": 0.6, "Grass Carp": 0.6, "Common carp": 0.6, "Pangasius": 0.6, "Nile Tilapia": 0.6, "Koi": 0.6 }; const activityFactors = { "Climbing perch": [ 1.5, 2.0 ], "Walking catfish": [ 1.5, 2.0 ], "Shingi": [ 1.5, 2.0 ], "Pabda Catfish": [ 1.5, 2.0 ], "Rohu": [ 1.5, 2.5 ], "Catla": [ 1.5, 2.5 ], "Mrigal": [ 1.5, 2.0 ], "Silver carp": [ 1.5, 2.5 ], "Big head Carp": [ 1.5, 2.0 ], "Grass Carp": [ 1.5, 2.5 ], "Common carp": [ 1.5, 2.5 ], "Pangasius": [ 1.5, 2.5 ], "Nile Tilapia": [ 1.5, 2.5 ], "Koi": [ 1.5, 2.5 ] }; const KLFish = { "Nile Tilapia": [ 7.54, 8.26 ], "Pangasius": [ 7.54, 8.26 ], "Rohu": [ 7.54, 8.26 ], "Catla": [ 7.54, 8.26 ], "Mrigal": [ 7.54, 8.26 ], "Grass Carp": [ 7.54, 8.26 ], "Silver carp": [ 7.54, 8.26 ], "Big head Carp": [ 7.54, 8.26 ], "Pabda Catfish": [ 7.54, 8.26 ], "Walking catfish": [ 7.54, 8.26 ], "Shingi": [ 7.54, 8.26 ], "Climbing perch": [ 7.54, 8.26 ], "Koi": [ 8.26, 10.08 ] }; const handleSubmit = (event)=>{ event.preventDefault(); const form = event.target; const species = form.species.value; const weight = parseFloat(form.weight.value); const temperature = parseFloat(form.temperature.value); const activity = parseFloat(form.activity.value); const R = respirationRates[species]; const W = weight; const ACT = activity; const CT = 1 + 0.03 * (temperature - 20); const KL = species === 'Koi' && temperature >= 15 && temperature <= 25 || temperature >= 25 && temperature <= 30 ? KLFish[species][1] : KLFish[species][0]; const DO = R * W ** 0.8 * ACT * CT / (KL * 24); setOxygenRequirement(DO.toFixed(2)); }; return /*#__PURE__*/ React.createElement("div", { className: "p-4 max-w-xl mx-auto bg-white shadow-md rounded-lg", __source: { fileName: "", lineNumber: 91, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-semibold mb-4 font-roboto text-center", __source: { fileName: "", lineNumber: 92, columnNumber: 7 }, __self: this }, "Fish Oxygen Requirement Calculator"), /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, __source: { fileName: "", lineNumber: 93, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 94, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium mb-2 font-roboto", htmlFor: "species", __source: { fileName: "", lineNumber: 95, columnNumber: 11 }, __self: this }, "Select Fish Species"), /*#__PURE__*/ React.createElement("select", { name: "species", id: "species", className: "w-full border border-gray-300 p-2 rounded", __source: { fileName: "", lineNumber: 96, columnNumber: 11 }, __self: this }, speciesOptions.map((species)=>/*#__PURE__*/ React.createElement("option", { key: species, value: species, __source: { fileName: "", lineNumber: 98, columnNumber: 15 }, __self: this }, species)))), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 102, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium mb-2 font-roboto", htmlFor: "weight", __source: { fileName: "", lineNumber: 103, columnNumber: 11 }, __self: this }, "Weight of Fish (g)"), /*#__PURE__*/ React.createElement("input", { type: "number", step: "0.01", name: "weight", id: "weight", className: "w-full border border-gray-300 p-2 rounded", __source: { fileName: "", lineNumber: 104, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 106, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium mb-2 font-roboto", htmlFor: "temperature", __source: { fileName: "", lineNumber: 107, columnNumber: 11 }, __self: this }, "Water Temperature (°C)"), /*#__PURE__*/ React.createElement("input", { type: "number", step: "0.01", name: "temperature", id: "temperature", className: "w-full border border-gray-300 p-2 rounded", __source: { fileName: "", lineNumber: 108, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 110, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium mb-2 font-roboto", htmlFor: "activity", __source: { fileName: "", lineNumber: 111, columnNumber: 11 }, __self: this }, "Activity Factor (1-3)"), /*#__PURE__*/ React.createElement("input", { type: "number", step: "0.01", name: "activity", id: "activity", min: "1", max: "3", className: "w-full border border-gray-300 p-2 rounded", __source: { fileName: "", lineNumber: 112, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "w-full bg-blue-500 text-white font-semibold py-2 px-4 rounded hover:bg-blue-600", __source: { fileName: "", lineNumber: 114, columnNumber: 9 }, __self: this }, "Calculate Oxygen Requirement")), oxygenRequirement && /*#__PURE__*/ React.createElement("div", { className: "mt-4 p-4 bg-green-100 text-green-800 rounded font-roboto text-center", __source: { fileName: "", lineNumber: 119, columnNumber: 9 }, __self: this }, "Daily Oxygen Requirement: ", oxygenRequirement, " mg/L")); }