function CalculatorUi({ firstNumber, secondNumber, setFirstNumber, setSecondNumber, handleCalculation, result }) { return /*#__PURE__*/ React.createElement("div", { className: "p-6 bg-white rounded shadow-md w-[400px]", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "number", name: "firstNumber", value: firstNumber, onChange: (e)=>setFirstNumber(+e.target.value), placeholder: "First Number", className: "border p-2 mb-4 w-full", __source: { fileName: "", lineNumber: 4, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "number", name: "secondNumber", value: secondNumber, onChange: (e)=>setSecondNumber(+e.target.value), placeholder: "Second Number", className: "border p-2 mb-4 w-full", __source: { fileName: "", lineNumber: 12, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "flex justify-between mb-4", __source: { fileName: "", lineNumber: 20, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>handleCalculation('add'), className: "bg-blue-500 text-white p-2 rounded w-[80px] text-sm flex justify-center items-center", __source: { fileName: "", lineNumber: 21, columnNumber: 9 }, __self: this }, "➕"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>handleCalculation('subtract'), className: "bg-blue-500 text-white p-2 rounded w-[80px] text-sm flex justify-center items-center", __source: { fileName: "", lineNumber: 27, columnNumber: 9 }, __self: this }, "➖"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>handleCalculation('multiply'), className: "bg-blue-500 text-white p-2 rounded w-[80px] text-sm flex justify-center items-center", __source: { fileName: "", lineNumber: 33, columnNumber: 9 }, __self: this }, "✖️"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>handleCalculation('divide'), className: "bg-blue-500 text-white p-2 rounded w-[80px] text-sm flex justify-center items-center", __source: { fileName: "", lineNumber: 39, columnNumber: 9 }, __self: this }, "➗")), result !== null && /*#__PURE__*/ React.createElement("div", { className: "text-center mt-4 text-lg font-bold", __source: { fileName: "", lineNumber: 47, columnNumber: 9 }, __self: this }, "Result: ", result)); } function MainComponent() { const [firstNumber, setFirstNumber] = React.useState(0); const [secondNumber, setSecondNumber] = React.useState(0); const [result, setResult] = React.useState(null); const handleCalculation = (operation)=>{ let res; switch(operation){ case 'add': res = firstNumber + secondNumber; break; case 'subtract': res = firstNumber - secondNumber; break; case 'multiply': res = firstNumber * secondNumber; break; case 'divide': res = firstNumber / secondNumber; break; default: res = 'Unknown operation'; } setResult(res); }; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center min-h-screen bg-gray-100", __source: { fileName: "", lineNumber: 82, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(CalculatorUi, { firstNumber: firstNumber, secondNumber: secondNumber, setFirstNumber: setFirstNumber, setSecondNumber: setSecondNumber, handleCalculation: handleCalculation, result: result, __source: { fileName: "", lineNumber: 83, columnNumber: 7 }, __self: this })); }