function DownloadAppButton(props) { return /*#__PURE__*/ React.createElement("a", { href: props.downloadLink, download: props.downloadName, name: "download", className: "bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, props.label); } function DownloadAppButtonStory() { return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 12, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(DownloadAppButton, { label: "Download App", downloadLink: "URL_TO_DOWNLOAD_APP", downloadName: "BTC_Transaction_App", __source: { fileName: "", lineNumber: 13, columnNumber: 7 }, __self: this })); } function MainComponent() { const [activeTab, setActiveTab] = React.useState("new"); const [transactionData, setTransactionData] = React.useState({ fromAddress: "", toAddress: "", amount: "", privateKey: "", fee: "0.0001" }); const [rawTransaction, setRawTransaction] = React.useState(""); const [signedTransaction, setSignedTransaction] = React.useState(""); const [transactionId, setTransactionId] = React.useState(""); const [status, setStatus] = React.useState(""); const [error, setError] = React.useState(""); const [loading, setLoading] = React.useState(false); const handleInputChange = (field, value)=>{ setTransactionData((prev)=>({ ...prev, [field]: value })); setError(""); }; const createTransaction = async ()=>{ setLoading(true); setError(""); try { const response = await fetch("/api/create-transaction", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify(transactionData) }); if (!response.ok) { throw new Error(`Server error: ${response.status}`); } const result = await response.json(); if (result.error) { setError(result.error); } else { setRawTransaction(result.rawTransaction); setStatus("Transaction created successfully"); setActiveTab("verify"); } } catch (err) { setError("Failed to create transaction: " + err.message); } setLoading(false); }; const signTransaction = async ()=>{ setLoading(true); setError(""); try { const response = await fetch("/api/sign-transaction", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ rawTransaction, privateKey: transactionData.privateKey }) }); if (!response.ok) { throw new Error(`Server error: ${response.status}`); } const result = await response.json(); if (result.error) { setError(result.error); } else { setSignedTransaction(result.signedTransaction); setStatus("Transaction signed successfully"); setActiveTab("broadcast"); } } catch (err) { setError("Failed to sign transaction: " + err.message); } setLoading(false); }; const broadcastTransaction = async ()=>{ setLoading(true); setError(""); try { const response = await fetch("/api/broadcast-transaction", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ signedTransaction }) }); if (!response.ok) { throw new Error(`Server error: ${response.status}`); } const result = await response.json(); if (result.error) { setError(result.error); } else { setTransactionId(result.transactionId); setStatus("Transaction broadcasted successfully! BTC sent."); setActiveTab("success"); } } catch (err) { setError("Failed to broadcast transaction: " + err.message); } setLoading(false); }; const downloadApp = ()=>{ const appData = { name: "BTC Transaction Manager", version: "1.0.0", features: [ "Create Bitcoin transactions", "Sign transactions with private keys", "Broadcast to blockchain", "Transaction verification", "Error correction" ], transactions: { created: rawTransaction, signed: signedTransaction, transactionId: transactionId } }; const blob = new Blob([ JSON.stringify(appData, null, 2) ], { type: "application/json" }); const url = URL.createObjectURL(blob); const a = document.createElement("a"); a.href = url; a.download = "BTC_Transaction_App.json"; a.click(); URL.revokeObjectURL(url); }; return /*#__PURE__*/ React.createElement("div", { className: "w-full min-h-screen bg-[#f8f9fa] font-roboto", __source: { fileName: "", lineNumber: 139, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white shadow-sm border-b", __source: { fileName: "", lineNumber: 141, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-6xl mx-auto px-4 py-3 flex items-center justify-between", __source: { fileName: "", lineNumber: 142, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-2", __source: { fileName: "", lineNumber: 143, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-bitcoin text-2xl text-[#f7931a]", __source: { fileName: "", lineNumber: 144, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "text-xl font-bold text-[#333]", __source: { fileName: "", lineNumber: 145, columnNumber: 13 }, __self: this }, "BTC Transaction Manager")), /*#__PURE__*/ React.createElement("div", { className: "flex space-x-4", __source: { fileName: "", lineNumber: 149, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>setActiveTab("new"), className: `px-4 py-2 rounded ${activeTab === "new" ? "bg-blue-500 text-white" : "text-gray-600 hover:bg-gray-100"}`, __source: { fileName: "", lineNumber: 150, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-plus mr-2", __source: { fileName: "", lineNumber: 154, columnNumber: 15 }, __self: this }), "New"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setActiveTab("verify"), className: `px-4 py-2 rounded ${activeTab === "verify" ? "bg-blue-500 text-white" : "text-gray-600 hover:bg-gray-100"}`, __source: { fileName: "", lineNumber: 156, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-check mr-2", __source: { fileName: "", lineNumber: 160, columnNumber: 15 }, __self: this }), "Verify"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setActiveTab("broadcast"), className: `px-4 py-2 rounded ${activeTab === "broadcast" ? "bg-blue-500 text-white" : "text-gray-600 hover:bg-gray-100"}`, __source: { fileName: "", lineNumber: 162, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-broadcast-tower mr-2", __source: { fileName: "", lineNumber: 166, columnNumber: 15 }, __self: this }), "Broadcast")))), /*#__PURE__*/ React.createElement("div", { className: "max-w-6xl mx-auto px-4 py-8", __source: { fileName: "", lineNumber: 172, columnNumber: 7 }, __self: this }, activeTab === "new" && !rawTransaction && /*#__PURE__*/ React.createElement("div", { className: "bg-gradient-to-r from-blue-500 to-purple-600 text-white p-8 rounded-lg mb-8", __source: { fileName: "", lineNumber: 175, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-4xl font-bold mb-4", __source: { fileName: "", lineNumber: 176, columnNumber: 13 }, __self: this }, "Bitcoin. It's your money!"), /*#__PURE__*/ React.createElement("p", { className: "text-xl mb-6", __source: { fileName: "", lineNumber: 179, columnNumber: 13 }, __self: this }, "Be your own bank, take control of your own money and start using Bitcoin today!"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>document.getElementById("transaction-form").scrollIntoView({ behavior: "smooth" }), className: "bg-white text-blue-600 px-6 py-3 rounded-lg font-semibold hover:bg-gray-100", __source: { fileName: "", lineNumber: 183, columnNumber: 13 }, __self: this }, "Create Transaction →")), error && /*#__PURE__*/ React.createElement("div", { className: "bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded mb-4", __source: { fileName: "", lineNumber: 198, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-exclamation-triangle mr-2", __source: { fileName: "", lineNumber: 199, columnNumber: 13 }, __self: this }), error), status && /*#__PURE__*/ React.createElement("div", { className: "bg-green-100 border border-green-400 text-green-700 px-4 py-3 rounded mb-4", __source: { fileName: "", lineNumber: 206, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-check-circle mr-2", __source: { fileName: "", lineNumber: 207, columnNumber: 13 }, __self: this }), status), activeTab === "new" && /*#__PURE__*/ React.createElement("div", { id: "transaction-form", className: "bg-white rounded-lg shadow-md p-6 mb-6", __source: { fileName: "", lineNumber: 214, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold mb-6 flex items-center", __source: { fileName: "", lineNumber: 218, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-plus-circle mr-3 text-blue-500", __source: { fileName: "", lineNumber: 219, columnNumber: 15 }, __self: this }), "Create New Transaction"), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6", __source: { fileName: "", lineNumber: 222, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 223, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium mb-2", __source: { fileName: "", lineNumber: 224, columnNumber: 17 }, __self: this }, "From Address"), /*#__PURE__*/ React.createElement("input", { type: "text", value: transactionData.fromAddress, onChange: (e)=>handleInputChange("fromAddress", e.target.value), className: "w-full p-3 border rounded-lg focus:ring-2 focus:ring-blue-500", placeholder: "Your Bitcoin address", __source: { fileName: "", lineNumber: 227, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 237, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium mb-2", __source: { fileName: "", lineNumber: 238, columnNumber: 17 }, __self: this }, "To Address"), /*#__PURE__*/ React.createElement("input", { type: "text", value: transactionData.toAddress, onChange: (e)=>handleInputChange("toAddress", e.target.value), className: "w-full p-3 border rounded-lg focus:ring-2 focus:ring-blue-500", placeholder: "Recipient Bitcoin address", __source: { fileName: "", lineNumber: 241, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 251, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium mb-2", __source: { fileName: "", lineNumber: 252, columnNumber: 17 }, __self: this }, "Amount (BTC)"), /*#__PURE__*/ React.createElement("input", { type: "number", step: "0.00000001", value: transactionData.amount, onChange: (e)=>handleInputChange("amount", e.target.value), className: "w-full p-3 border rounded-lg focus:ring-2 focus:ring-blue-500", placeholder: "0.00000000", __source: { fileName: "", lineNumber: 255, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 264, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium mb-2", __source: { fileName: "", lineNumber: 265, columnNumber: 17 }, __self: this }, "Fee (BTC)"), /*#__PURE__*/ React.createElement("input", { type: "number", step: "0.00000001", value: transactionData.fee, onChange: (e)=>handleInputChange("fee", e.target.value), className: "w-full p-3 border rounded-lg focus:ring-2 focus:ring-blue-500", __source: { fileName: "", lineNumber: 268, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "md:col-span-2", __source: { fileName: "", lineNumber: 276, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium mb-2", __source: { fileName: "", lineNumber: 277, columnNumber: 17 }, __self: this }, "Private Key (WIF format)"), /*#__PURE__*/ React.createElement("input", { type: "password", value: transactionData.privateKey, onChange: (e)=>handleInputChange("privateKey", e.target.value), className: "w-full p-3 border rounded-lg focus:ring-2 focus:ring-blue-500", placeholder: "Your private key for signing", __source: { fileName: "", lineNumber: 280, columnNumber: 17 }, __self: this }))), /*#__PURE__*/ React.createElement("button", { onClick: createTransaction, disabled: loading || !transactionData.fromAddress || !transactionData.toAddress || !transactionData.amount, className: "mt-6 w-full bg-blue-500 text-white py-3 rounded-lg font-semibold hover:bg-blue-600 disabled:bg-gray-300", __source: { fileName: "", lineNumber: 291, columnNumber: 13 }, __self: this }, loading ? /*#__PURE__*/ React.createElement("i", { className: "fas fa-spinner fa-spin mr-2", __source: { fileName: "", lineNumber: 302, columnNumber: 17 }, __self: this }) : /*#__PURE__*/ React.createElement("i", { className: "fas fa-plus mr-2", __source: { fileName: "", lineNumber: 304, columnNumber: 17 }, __self: this }), "Create Transaction")), activeTab === "verify" && rawTransaction && /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-lg shadow-md p-6 mb-6", __source: { fileName: "", lineNumber: 313, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold mb-6 flex items-center", __source: { fileName: "", lineNumber: 314, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-check-circle mr-3 text-green-500", __source: { fileName: "", lineNumber: 315, columnNumber: 15 }, __self: this }), "Verify Transaction"), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 318, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium mb-2", __source: { fileName: "", lineNumber: 319, columnNumber: 15 }, __self: this }, "Raw Transaction"), /*#__PURE__*/ React.createElement("textarea", { value: rawTransaction, readOnly: true, className: "w-full p-3 border rounded-lg bg-gray-50 font-mono text-sm", rows: "4", __source: { fileName: "", lineNumber: 322, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("button", { onClick: signTransaction, disabled: loading || !transactionData.privateKey, className: "w-full bg-green-500 text-white py-3 rounded-lg font-semibold hover:bg-green-600 disabled:bg-gray-300", __source: { fileName: "", lineNumber: 329, columnNumber: 13 }, __self: this }, loading ? /*#__PURE__*/ React.createElement("i", { className: "fas fa-spinner fa-spin mr-2", __source: { fileName: "", lineNumber: 335, columnNumber: 17 }, __self: this }) : /*#__PURE__*/ React.createElement("i", { className: "fas fa-signature mr-2", __source: { fileName: "", lineNumber: 337, columnNumber: 17 }, __self: this }), "Sign Transaction")), activeTab === "broadcast" && signedTransaction && /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-lg shadow-md p-6 mb-6", __source: { fileName: "", lineNumber: 346, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold mb-6 flex items-center", __source: { fileName: "", lineNumber: 347, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-broadcast-tower mr-3 text-purple-500", __source: { fileName: "", lineNumber: 348, columnNumber: 15 }, __self: this }), "Broadcast Transaction"), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 351, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium mb-2", __source: { fileName: "", lineNumber: 352, columnNumber: 15 }, __self: this }, "Signed Transaction"), /*#__PURE__*/ React.createElement("textarea", { value: signedTransaction, readOnly: true, className: "w-full p-3 border rounded-lg bg-gray-50 font-mono text-sm", rows: "4", __source: { fileName: "", lineNumber: 355, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("button", { onClick: broadcastTransaction, disabled: loading, className: "w-full bg-purple-500 text-white py-3 rounded-lg font-semibold hover:bg-purple-600 disabled:bg-gray-300", __source: { fileName: "", lineNumber: 362, columnNumber: 13 }, __self: this }, loading ? /*#__PURE__*/ React.createElement("i", { className: "fas fa-spinner fa-spin mr-2", __source: { fileName: "", lineNumber: 368, columnNumber: 17 }, __self: this }) : /*#__PURE__*/ React.createElement("i", { className: "fas fa-paper-plane mr-2", __source: { fileName: "", lineNumber: 370, columnNumber: 17 }, __self: this }), "Broadcast to Blockchain")), activeTab === "success" && transactionId && /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-lg shadow-md p-6 mb-6", __source: { fileName: "", lineNumber: 379, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-center", __source: { fileName: "", lineNumber: 380, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-check-circle text-6xl text-green-500 mb-4", __source: { fileName: "", lineNumber: 381, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold mb-4", __source: { fileName: "", lineNumber: 382, columnNumber: 15 }, __self: this }, "Transaction Successful!"), /*#__PURE__*/ React.createElement("p", { className: "text-lg mb-6", __source: { fileName: "", lineNumber: 385, columnNumber: 15 }, __self: this }, "BTC has been sent successfully"), /*#__PURE__*/ React.createElement("div", { className: "bg-gray-50 p-4 rounded-lg mb-6", __source: { fileName: "", lineNumber: 386, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium mb-2", __source: { fileName: "", lineNumber: 387, columnNumber: 17 }, __self: this }, "Transaction ID"), /*#__PURE__*/ React.createElement("p", { className: "font-mono text-sm break-all", __source: { fileName: "", lineNumber: 390, columnNumber: 17 }, __self: this }, transactionId)), /*#__PURE__*/ React.createElement("button", { onClick: downloadApp, className: "bg-[#f7931a] text-white px-8 py-3 rounded-lg font-semibold hover:bg-[#e8890b]", __source: { fileName: "", lineNumber: 392, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-download mr-2", __source: { fileName: "", lineNumber: 396, columnNumber: 17 }, __self: this }), "Download Transaction Data"))), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6 mb-8", __source: { fileName: "", lineNumber: 404, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-lg shadow-md p-6", __source: { fileName: "", lineNumber: 405, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center mb-4", __source: { fileName: "", lineNumber: 406, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-code text-2xl text-blue-500 mr-3", __source: { fileName: "", lineNumber: 407, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("h3", { className: "font-bold", __source: { fileName: "", lineNumber: 408, columnNumber: 15 }, __self: this }, "Open Source")), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600 text-sm", __source: { fileName: "", lineNumber: 410, columnNumber: 13 }, __self: this }, "Free to use and edit Bitcoin transaction tools.")), /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-lg shadow-md p-6", __source: { fileName: "", lineNumber: 414, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center mb-4", __source: { fileName: "", lineNumber: 415, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-users text-2xl text-green-500 mr-3", __source: { fileName: "", lineNumber: 416, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("h3", { className: "font-bold", __source: { fileName: "", lineNumber: 417, columnNumber: 15 }, __self: this }, "MultiSig")), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600 text-sm", __source: { fileName: "", lineNumber: 419, columnNumber: 13 }, __self: this }, "Support for multi-signature transactions and wallets.")), /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-lg shadow-md p-6", __source: { fileName: "", lineNumber: 423, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center mb-4", __source: { fileName: "", lineNumber: 424, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-cog text-2xl text-purple-500 mr-3", __source: { fileName: "", lineNumber: 425, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("h3", { className: "font-bold", __source: { fileName: "", lineNumber: 426, columnNumber: 15 }, __self: this }, "Raw Transactions")), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600 text-sm", __source: { fileName: "", lineNumber: 428, columnNumber: 13 }, __self: this }, "Create, verify, sign and broadcast custom transactions.")), /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-lg shadow-md p-6", __source: { fileName: "", lineNumber: 432, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center mb-4", __source: { fileName: "", lineNumber: 433, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-wallet text-2xl text-orange-500 mr-3", __source: { fileName: "", lineNumber: 434, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("h3", { className: "font-bold", __source: { fileName: "", lineNumber: 435, columnNumber: 15 }, __self: this }, "Wallet")), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600 text-sm", __source: { fileName: "", lineNumber: 437, columnNumber: 13 }, __self: this }, "Access to your private keys and address generation."))))); }