function MainComponent() { const [inputAmount, setInputAmount] = React.useState(''); const [calculatedTax, setCalculatedTax] = React.useState(0); const [totalAmount, setTotalAmount] = React.useState(0); const appendToInput = (value)=>{ setInputAmount((prev)=>`${parseFloat(prev + value).toFixed(2)}`.slice(0, 15)); }; const handleCalculate = ()=>{ const parsedAmount = parseFloat(inputAmount); if (!isNaN(parsedAmount) && parsedAmount >= 0) { const taxAmount = parsedAmount * 0.15; setCalculatedTax(taxAmount); setTotalAmount(parsedAmount + taxAmount); } else { alert("Invalid input. Please enter a positive number."); } }; const handleClear = ()=>{ setInputAmount(''); setCalculatedTax(0); setTotalAmount(0); }; const keypadButtons = [ "1", "2", "3", "4", "5", "6", "7", "8", "9", "0", ".", "C" ]; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen flex flex-col items-center justify-center bg-[#f0f0f0]", __source: { fileName: "", lineNumber: 30, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white shadow-md rounded px-8 pt-6 pb-8 mb-4", __source: { fileName: "", lineNumber: 31, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 32, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-3 gap-4", __source: { fileName: "", lineNumber: 33, columnNumber: 11 }, __self: this }, keypadButtons.map((button)=>button !== "C" ? /*#__PURE__*/ React.createElement("button", { key: button, className: "bg-blue-100 hover:bg-blue-200 text-gray-800 font-bold py-2 px-4 rounded", onClick: ()=>appendToInput(button), __source: { fileName: "", lineNumber: 36, columnNumber: 17 }, __self: this }, button) : /*#__PURE__*/ React.createElement("button", { key: button, className: "bg-red-100 hover:bg-red-200 text-gray-800 font-bold py-2 px-4 rounded", onClick: handleClear, __source: { fileName: "", lineNumber: 44, columnNumber: 17 }, __self: this }, button)))), /*#__PURE__*/ React.createElement("div", { className: "mb-6", __source: { fileName: "", lineNumber: 55, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/sales-tax-calculator", target: "_blank", __source: { fileName: "", lineNumber: 56, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: "bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline w-full", onClick: handleCalculate, __source: { fileName: "", lineNumber: 56, columnNumber: 59 }, __self: this }, "Calculate"))), /*#__PURE__*/ React.createElement("div", { className: "mb-3", __source: { fileName: "", lineNumber: 63, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-gray-700", __source: { fileName: "", lineNumber: 64, columnNumber: 11 }, __self: this }, "Entered Amount: ", /*#__PURE__*/ React.createElement("span", { className: "font-bold", __source: { fileName: "", lineNumber: 64, columnNumber: 56 }, __self: this }, "$", inputAmount || '0.00')), /*#__PURE__*/ React.createElement("p", { className: "text-gray-700", __source: { fileName: "", lineNumber: 65, columnNumber: 11 }, __self: this }, "Tax (15%): ", /*#__PURE__*/ React.createElement("span", { className: "font-bold", __source: { fileName: "", lineNumber: 65, columnNumber: 51 }, __self: this }, "$", calculatedTax.toFixed(2))), /*#__PURE__*/ React.createElement("p", { className: "text-gray-700", __source: { fileName: "", lineNumber: 66, columnNumber: 11 }, __self: this }, "Total Amount: ", /*#__PURE__*/ React.createElement("span", { className: "font-bold", __source: { fileName: "", lineNumber: 66, columnNumber: 54 }, __self: this }, "$", totalAmount.toFixed(2)))))); }