function MainComponent() { const [fishType, setFishType] = React.useState('Rohu'); const [W, setW] = React.useState(0); const [T, setT] = React.useState(0); const [DO, setDO] = React.useState(0); const [PC, setPC] = React.useState(0); const d = 0.1; const fishParams = { Rohu: { a: 0.0612, b: -0.209, c: 0.0613, k: 2.5, p: 0.6 }, Catla: { a: 0.0541, b: -0.192, c: 0.0597, k: 2.7, p: 0.5 }, Mrigal: { a: 0.0459, b: -0.174, c: 0.0611, k: 2.8, p: 0.6 }, GrassCarp: { a: 0.0456, b: -0.195, c: 0.0481, k: 2.7, p: 0.5 }, SilverCarp: { a: 0.0442, b: -0.186, c: 0.0475, k: 2.5, p: 0.5 }, BigheadCarp: { a: 0.0456, b: -0.192, c: 0.0487, k: 2.6, p: 0.6 }, Pangasius: { a: 0.0693, b: -0.248, c: 0.06, k: 2.5, p: 0.5 }, NileTilapia: { a: 0.0801, b: -0.272, c: 0.0604, k: 2.0, p: 0.5 }, RainbowTrout: { a: 0.0275, b: -0.211, c: 0.0613, k: 3.0, p: 0.6 }, ChannelCatfish: { a: 0.0402, b: -0.166, c: 0.0475, k: 3.0, p: 0.5 } }; const handleSubmit = (e)=>{ e.preventDefault(); const { a, b, c, k, p } = fishParams[fishType]; const FR = a * Math.pow(W, b) * Math.exp(c * T) * (DO / Math.pow(DO + k, p)) * (1 + d * PC); alert(`Feeding Rate: ${FR.toFixed(2)} % body weight per day`); }; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center min-h-screen p-4", __source: { fileName: "", lineNumber: 30, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-3xl font-bold mb-4", __source: { fileName: "", lineNumber: 31, columnNumber: 7 }, __self: this }, "Fish Feeding Rate Calculator"), /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, className: "w-full max-w-sm", __source: { fileName: "", lineNumber: 32, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 33, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block font-bold mb-2", htmlFor: "fishType", __source: { fileName: "", lineNumber: 34, columnNumber: 11 }, __self: this }, "Fish Type"), /*#__PURE__*/ React.createElement("select", { id: "fishType", name: "fishType", value: fishType, onChange: (e)=>setFishType(e.target.value), className: "w-full px-3 py-2 border border-gray-300 rounded", __source: { fileName: "", lineNumber: 35, columnNumber: 11 }, __self: this }, Object.keys(fishParams).map((fish)=>/*#__PURE__*/ React.createElement("option", { key: fish, value: fish, __source: { fileName: "", lineNumber: 43, columnNumber: 15 }, __self: this }, fish)))), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 47, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block font-bold mb-2", htmlFor: "W", __source: { fileName: "", lineNumber: 48, columnNumber: 11 }, __self: this }, "Fish body weight (g)"), /*#__PURE__*/ React.createElement("input", { id: "W", name: "W", type: "number", value: W, onChange: (e)=>setW(parseFloat(e.target.value)), className: "w-full px-3 py-2 border border-gray-300 rounded", __source: { fileName: "", lineNumber: 49, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 58, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block font-bold mb-2", htmlFor: "T", __source: { fileName: "", lineNumber: 59, columnNumber: 11 }, __self: this }, "Water temperature (°C)"), /*#__PURE__*/ React.createElement("input", { id: "T", name: "T", type: "number", value: T, onChange: (e)=>setT(parseFloat(e.target.value)), className: "w-full px-3 py-2 border border-gray-300 rounded", __source: { fileName: "", lineNumber: 60, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 69, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block font-bold mb-2", htmlFor: "DO", __source: { fileName: "", lineNumber: 70, columnNumber: 11 }, __self: this }, "Dissolved oxygen concentration (mg/L)"), /*#__PURE__*/ React.createElement("input", { id: "DO", name: "DO", type: "number", value: DO, onChange: (e)=>setDO(parseFloat(e.target.value)), className: "w-full px-3 py-2 border border-gray-300 rounded", __source: { fileName: "", lineNumber: 71, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 80, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block font-bold mb-2", htmlFor: "PC", __source: { fileName: "", lineNumber: 81, columnNumber: 11 }, __self: this }, "Protein content in the feed (%)"), /*#__PURE__*/ React.createElement("input", { id: "PC", name: "PC", type: "number", value: PC, onChange: (e)=>setPC(parseFloat(e.target.value)), className: "w-full px-3 py-2 border border-gray-300 rounded", __source: { fileName: "", lineNumber: 82, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between", __source: { fileName: "", lineNumber: 91, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("button", { type: "submit", className: "w-full bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded", __source: { fileName: "", lineNumber: 92, columnNumber: 11 }, __self: this }, "Calculate")))); }