function MainComponent() { const [amount, setAmount] = useState(""); const [error, setError] = useState(null); const formatNumber = (num)=>{ if (!num) return "0"; try { return num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ","); } catch (err) { console.error("Error formatting number:", err); return "0"; } }; const calculateMarketplaceFee = (value)=>{ if (!value) return 0; try { return Math.floor(parseFloat(value) * 0.7); } catch (err) { console.error("Error calculating marketplace fee:", err); return 0; } }; const calculateDevEx = (value)=>{ if (!value) return 0; try { return Math.floor(parseFloat(value) * 0.0035); } catch (err) { console.error("Error calculating DevEx:", err); return 0; } }; const handleInputChange = (e)=>{ try { const value = e.target.value.replace(/[^0-9]/g, ""); setAmount(value); } catch (err) { console.error("Error handling input change:", err); setError("Error updating amount"); } }; const displayAmount = amount || "0"; const marketplaceAmount = calculateMarketplaceFee(amount); const devExAmount = calculateDevEx(amount); return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gradient-to-br from-[#6b77e8] to-[#5865f2] p-4 md:p-8", __source: { fileName: "", lineNumber: 45, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-4xl mx-auto bg-white rounded-2xl shadow-xl p-6 md:p-8", __source: { fileName: "", lineNumber: 46, columnNumber: 7 }, __self: this }, error && /*#__PURE__*/ React.createElement("div", { className: "bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded-md mb-4", __source: { fileName: "", lineNumber: 48, columnNumber: 11 }, __self: this }, error), /*#__PURE__*/ React.createElement("h1", { className: "text-3xl md:text-4xl font-bold text-center text-[#393B3D] mb-4 font-roboto", __source: { fileName: "", lineNumber: 53, columnNumber: 9 }, __self: this }, "Roblox Tax Calculator"), /*#__PURE__*/ React.createElement("p", { className: "text-[#666] mb-8 text-center text-lg font-roboto", __source: { fileName: "", lineNumber: 56, columnNumber: 9 }, __self: this }, "Calculate your earnings after Roblox's 30% marketplace fee and see the real money value through DevEx ($0.0035 per Robux)"), /*#__PURE__*/ React.createElement("div", { className: "relative mb-12", __source: { fileName: "", lineNumber: 60, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "absolute inset-y-0 left-4 flex items-center text-2xl font-bold text-[#393B3D]", __source: { fileName: "", lineNumber: 61, columnNumber: 11 }, __self: this }, "R$"), /*#__PURE__*/ React.createElement("input", { type: "text", value: amount, onChange: handleInputChange, className: "w-full text-3xl md:text-4xl p-6 pl-14 rounded-xl border-2 border-[#5865f2] focus:outline-none focus:border-[#6b77e8] font-roboto shadow-sm", placeholder: "Enter Robux amount", name: "amount", __source: { fileName: "", lineNumber: 64, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-6 mb-8", __source: { fileName: "", lineNumber: 74, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white p-6 rounded-xl shadow-md hover:shadow-lg transition-shadow", __source: { fileName: "", lineNumber: 75, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between", __source: { fileName: "", lineNumber: 76, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-lg text-[#666] mb-2 font-roboto", __source: { fileName: "", lineNumber: 77, columnNumber: 15 }, __self: this }, "Original Amount"), /*#__PURE__*/ React.createElement("i", { className: "fas fa-info-circle text-[#5865f2]", title: "The amount before any fees are applied", __source: { fileName: "", lineNumber: 80, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "text-3xl md:text-4xl font-bold text-[#393B3D] font-roboto", __source: { fileName: "", lineNumber: 85, columnNumber: 13 }, __self: this }, "R$ ", formatNumber(displayAmount))), /*#__PURE__*/ React.createElement("div", { className: "bg-white p-6 rounded-xl shadow-md hover:shadow-lg transition-shadow", __source: { fileName: "", lineNumber: 89, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between", __source: { fileName: "", lineNumber: 90, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-lg text-[#666] mb-2 font-roboto", __source: { fileName: "", lineNumber: 91, columnNumber: 15 }, __self: this }, "After Fee"), /*#__PURE__*/ React.createElement("i", { className: "fas fa-info-circle text-[#5865f2]", title: "Amount after Roblox's 30% marketplace fee", __source: { fileName: "", lineNumber: 94, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "text-3xl md:text-4xl font-bold text-[#393B3D] font-roboto", __source: { fileName: "", lineNumber: 99, columnNumber: 13 }, __self: this }, "R$ ", formatNumber(marketplaceAmount))), /*#__PURE__*/ React.createElement("div", { className: "bg-white p-6 rounded-xl shadow-md hover:shadow-lg transition-shadow", __source: { fileName: "", lineNumber: 104, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between", __source: { fileName: "", lineNumber: 105, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-lg text-[#666] mb-2 font-roboto", __source: { fileName: "", lineNumber: 106, columnNumber: 15 }, __self: this }, "USD Value"), /*#__PURE__*/ React.createElement("i", { className: "fas fa-info-circle text-[#5865f2]", title: "Real money value through DevEx ($0.0035 per Robux)", __source: { fileName: "", lineNumber: 109, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "text-3xl md:text-4xl font-bold text-[#393B3D] font-roboto", __source: { fileName: "", lineNumber: 114, columnNumber: 13 }, __self: this }, "$", formatNumber(devExAmount)))), /*#__PURE__*/ React.createElement("div", { className: "text-center mt-8", __source: { fileName: "", lineNumber: 120, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "https://www.roblox.com/game-pass/1097659286/Calculator-Supporter", target: "_blank", rel: "noopener noreferrer", className: "inline-block px-8 py-4 rounded-xl bg-gradient-to-r from-[#FFD700] to-[#FFA500] text-[#393B3D] font-bold text-lg shadow-lg hover:shadow-xl transform hover:scale-105 transition-all duration-200 font-roboto relative overflow-hidden supporter-button", __source: { fileName: "", lineNumber: 121, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "flex items-center justify-center", __source: { fileName: "", lineNumber: 127, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-star mr-2", __source: { fileName: "", lineNumber: 128, columnNumber: 15 }, __self: this }), "Support Us - Get Supporter Pass!"), /*#__PURE__*/ React.createElement("div", { className: "text-sm mt-1 text-[#666] font-normal", __source: { fileName: "", lineNumber: 131, columnNumber: 13 }, __self: this }, "Only 25 Robux")))), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 137, columnNumber: 7 }, __self: this }, ` .supporter-button::before { content: ''; position: absolute; top: -50%; left: -50%; width: 200%; height: 200%; background: linear-gradient( 45deg, transparent, rgba(255, 255, 255, 0.3), transparent ); transform: rotate(45deg); animation: shine 3s infinite; } @keyframes shine { 0% { transform: translateX(-100%) rotate(45deg); } 100% { transform: translateX(100%) rotate(45deg); } } `)); }