UNPKG

@roochnetwork/rooch-sdk-kit

Version:
651 lines (601 loc) 29.2 kB
"use strict"; var __create = Object.create; var __defProp = Object.defineProperty; var __getOwnPropDesc = Object.getOwnPropertyDescriptor; var __getOwnPropNames = Object.getOwnPropertyNames; var __getProtoOf = Object.getPrototypeOf; var __hasOwnProp = Object.prototype.hasOwnProperty; var __export = (target, all) => { for (var name in all) __defProp(target, name, { get: all[name], enumerable: true }); }; var __copyProps = (to, from, except, desc) => { if (from && typeof from === "object" || typeof from === "function") { for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable }); } return to; }; var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps( // If the importer is in node compatibility mode or this is not an ESM // file that has been converted to a CommonJS file using a Babel- // compatible transform (i.e. "__esModule" has not been set), then set // "default" to the CommonJS "module.exports" for node compatibility. isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod )); var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod); // src/components/swap-gas-modal/SwapGasModal.tsx var SwapGasModal_exports = {}; __export(SwapGasModal_exports, { SwapGasModal: () => SwapGasModal }); module.exports = __toCommonJS(SwapGasModal_exports); // src/components/swap-gas-modal/views/SwapGasView.tsx var import_decimal = require("decimal.js"); var import_react11 = require("react"); var import_rooch_sdk3 = require("@roochnetwork/rooch-sdk"); // src/components/swap-gas-modal/views/SwapGasView.css.ts var container = "SwapGasView_container__bmmf7w0"; var infoContainer = "SwapGasView_infoContainer__bmmf7w1"; var inputContainer = "SwapGasView_inputContainer__bmmf7w2"; var separator = "SwapGasView_separator__bmmf7w4"; // src/components/swap-gas-modal/env.ts var MarketEev = { main: { marketCA: "0x701c21bf1c8cd5af8c42983890d8ca55e7a820171b8e744c13f2d9998bf76cc3", btcGasAddress: "bc1prcajaj9n7e29u4dfp33x3hcf52yqeegspdpcd79pqu4fpr6llx4sugkfjt" }, test: { marketCA: "0x701c21bf1c8cd5af8c42983890d8ca55e7a820171b8e744c13f2d9998bf76cc3", btcGasAddress: "tb1prcajaj9n7e29u4dfp33x3hcf52yqeegspdpcd79pqu4fpr6llx4stqqxgy" } }; // src/components/ui/View.css.ts var actionButtonContainer = "View_actionButtonContainer__1lnj8w33"; var container2 = "View_container__1lnj8w30"; var content = "View_content__1lnj8w32"; var title = "View_title__1lnj8w31"; // src/components/ui/Heading.tsx var import_react_slot = require("@radix-ui/react-slot"); var import_clsx = __toESM(require("clsx"), 1); var import_react = require("react"); // src/components/ui/Heading.css.ts var import_createRuntimeFn = require("@vanilla-extract/recipes/createRuntimeFn"); var headingVariants = (0, import_createRuntimeFn.createRuntimeFn)({ defaultClassName: "Heading__1v58k1t0", variantClassNames: { size: { sm: "Heading_headingVariants_size_sm__1v58k1t1", md: "Heading_headingVariants_size_md__1v58k1t2", lg: "Heading_headingVariants_size_lg__1v58k1t3", xl: "Heading_headingVariants_size_xl__1v58k1t4" }, weight: { normal: "Heading_headingVariants_weight_normal__1v58k1t5", bold: "Heading_headingVariants_weight_bold__1v58k1t6" }, truncate: { true: "Heading_headingVariants_truncate_true__1v58k1t7" } }, defaultVariants: { size: "lg", weight: "bold" }, compoundVariants: [] }); // src/components/ui/Heading.tsx var import_jsx_runtime = require("react/jsx-runtime"); var Heading = (0, import_react.forwardRef)( ({ children, className, asChild = false, as: Tag = "h1", size, weight, truncate, ...headingProps }, forwardedRef) => { return /* @__PURE__ */ (0, import_jsx_runtime.jsx)( import_react_slot.Slot, { ...headingProps, ref: forwardedRef, className: (0, import_clsx.default)(headingVariants({ size, weight, truncate }), className), children: asChild ? children : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Tag, { children }) } ); } ); Heading.displayName = "Heading"; // src/components/ui/Button.tsx var import_react_slot2 = require("@radix-ui/react-slot"); var import_clsx2 = __toESM(require("clsx"), 1); var import_react2 = require("react"); // src/components/ui/Button.css.ts var import_createRuntimeFn2 = require("@vanilla-extract/recipes/createRuntimeFn"); var buttonVariants = (0, import_createRuntimeFn2.createRuntimeFn)({ defaultClassName: "Button_buttonVariants__1vdhm2g0", variantClassNames: { variant: { primary: "Button_buttonVariants_variant_primary__1vdhm2g1", outline: "Button_buttonVariants_variant_outline__1vdhm2g2" }, size: { md: "Button_buttonVariants_size_md__1vdhm2g3", lg: "Button_buttonVariants_size_lg__1vdhm2g4" } }, defaultVariants: { variant: "primary", size: "md" }, compoundVariants: [] }); // src/components/ui/Button.tsx var import_jsx_runtime2 = require("react/jsx-runtime"); var Button = (0, import_react2.forwardRef)( ({ className, variant, size, asChild = false, ...props }, forwardedRef) => { const Comp = asChild ? import_react_slot2.Slot : "button"; return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)( Comp, { ...props, className: (0, import_clsx2.default)(buttonVariants({ variant, size }), className), ref: forwardedRef } ); } ); Button.displayName = "Button"; // src/components/ProgressProvider.tsx var import_react3 = require("react"); // src/components/fauct-modal/views/FaucetView.css.ts var progressBar = "FaucetView_progressBar__1ff62y03"; // src/components/ui/Progress.tsx var import_jsx_runtime3 = require("react/jsx-runtime"); function Progress() { const { progress } = useProgress(); return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: progressBar, style: { width: `${progress}%` } }); } // src/components/ProgressProvider.tsx var import_jsx_runtime4 = require("react/jsx-runtime"); var ProgressProviderContext = (0, import_react3.createContext)(null); var ProgressProvider = ({ children }) => { const [progress, setProgress] = (0, import_react3.useState)(0); const [loading, setLoading] = (0, import_react3.useState)(false); const start = (0, import_react3.useCallback)(() => { setLoading(true); setProgress(0); const interval = setInterval(() => { setProgress((prev) => { const nextProgress = prev + 10; if (nextProgress >= 70) { clearInterval(interval); } return Math.min(nextProgress, 70); }); }, 100); }, []); const finish = (0, import_react3.useCallback)((callback) => { const interval = setInterval(() => { setProgress((prev) => { const nextProgress = prev + 5; if (nextProgress >= 100) { clearInterval(interval); setTimeout(() => { setLoading(false); if (callback) { callback(); } }, 300); } return Math.min(nextProgress, 100); }); }, 50); }, []); return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(ProgressProviderContext.Provider, { value: { loading, progress, start, finish }, children: [ children, loading && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Progress, {}) ] }); }; var useProgress = () => { const ctx = (0, import_react3.useContext)(ProgressProviderContext); if (!ctx) { throw new Error("useSubscribeToError must be used within a GlobalProvider"); } return ctx; }; // src/components/ui/View.tsx var import_jsx_runtime5 = require("react/jsx-runtime"); function View({ title: title2, disabledAction, actionText, actionOnClick, children }) { const { loading } = useProgress(); return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: container2, children: [ /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Heading, { as: "h2", className: title, children: title2 }), /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: content, children }), actionText && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: actionButtonContainer, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)( Button, { disabled: loading || disabledAction, type: "button", variant: "outline", onClick: actionOnClick, children: actionText } ) }) ] }); } // src/components/ui/Input.tsx var import_react_slot3 = require("@radix-ui/react-slot"); var import_clsx3 = __toESM(require("clsx"), 1); var import_react4 = require("react"); // src/components/ui/Input.css.ts var import_createRuntimeFn3 = require("@vanilla-extract/recipes/createRuntimeFn"); var inputVariants = (0, import_createRuntimeFn3.createRuntimeFn)({ defaultClassName: "Input_inputVariants__1878es40", variantClassNames: { variant: { primary: "Input_inputVariants_variant_primary__1878es41", outline: "Input_inputVariants_variant_outline__1878es42" }, size: { md: "Input_inputVariants_size_md__1878es43", lg: "Input_inputVariants_size_lg__1878es44" } }, defaultVariants: { variant: "primary", size: "md" }, compoundVariants: [] }); // src/components/ui/Input.tsx var import_jsx_runtime6 = require("react/jsx-runtime"); var Input = (0, import_react4.forwardRef)( ({ className, variant, size, asChild = false, ...props }, forwardedRef) => { const Comp = asChild ? import_react_slot3.Slot : "input"; return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)( Comp, { ...props, className: (0, import_clsx3.default)(inputVariants({ variant, size }), className), ref: forwardedRef } ); } ); Input.displayName = "Button"; // src/components/ui/Card.css.ts var card = "Card_card__1bu3cob0"; var cardBody = "Card_cardBody__1bu3cob4"; var cardFooter = "Card_cardFooter__1bu3cob5"; var cardHeader = "Card_cardHeader__1bu3cob1"; // src/components/ui/Text.tsx var import_react_slot4 = require("@radix-ui/react-slot"); var import_clsx4 = __toESM(require("clsx"), 1); var import_react5 = require("react"); // src/components/ui/Text.css.ts var import_createRuntimeFn4 = require("@vanilla-extract/recipes/createRuntimeFn"); var textVariants = (0, import_createRuntimeFn4.createRuntimeFn)({ defaultClassName: "Text__1utg4wj0", variantClassNames: { size: { sm: "Text_textVariants_size_sm__1utg4wj1" }, weight: { normal: "Text_textVariants_weight_normal__1utg4wj2", medium: "Text_textVariants_weight_medium__1utg4wj3", bold: "Text_textVariants_weight_bold__1utg4wj4" }, color: { muted: "Text_textVariants_color_muted__1utg4wj5", danger: "Text_textVariants_color_danger__1utg4wj6", warning: "Text_textVariants_color_warning__1utg4wj7" }, mono: { true: "Text_textVariants_mono_true__1utg4wj8" } }, defaultVariants: { size: "sm", weight: "normal" }, compoundVariants: [] }); // src/components/ui/Text.tsx var import_jsx_runtime7 = require("react/jsx-runtime"); var Text = (0, import_react5.forwardRef)( ({ children, className, asChild = false, as: Tag = "div", size, weight, color, mono, ...textProps }, forwardedRef) => { return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)( import_react_slot4.Slot, { ...textProps, ref: forwardedRef, className: (0, import_clsx4.default)(textVariants({ size, weight, color, mono }), className), children: asChild ? children : /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(Tag, { children }) } ); } ); Text.displayName = "Text"; // src/components/ui/Card.tsx var import_jsx_runtime8 = require("react/jsx-runtime"); function Card({ header, headerRight, children, footer }) { return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: card, children: [ (header || headerRight) && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: cardHeader, children: [ /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(Heading, { as: "h3", size: "sm", weight: "normal", children: header }), headerRight && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(Text, { weight: "medium", color: "muted", children: headerRight }) ] }), /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: cardBody, children }), footer && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: cardFooter, children: footer }) ] }); } // src/components/icons/BitcoinIcon.tsx var import_jsx_runtime9 = require("react/jsx-runtime"); function BitcoinIcon(props) { return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)( "svg", { xmlns: "http://www.w3.org/2000/svg", xmlSpace: "preserve", width: "24", height: "24", version: "1.1", shapeRendering: "geometricPrecision", textRendering: "geometricPrecision", imageRendering: "optimizeQuality", fillRule: "evenodd", clipRule: "evenodd", viewBox: "0 0 4091.27 4091.73", ...props, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("g", { id: "Layer_x0020_1", children: [ /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("metadata", { id: "CorelCorpID_0Corel-Layer" }), /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("g", { id: "_1421344023328", children: [ /* @__PURE__ */ (0, import_jsx_runtime9.jsx)( "path", { fill: "#F7931A", fillRule: "nonzero", d: "M4030.06 2540.77c-273.24,1096.01 -1383.32,1763.02 -2479.46,1489.71 -1095.68,-273.24 -1762.69,-1383.39 -1489.33,-2479.31 273.12,-1096.13 1383.2,-1763.19 2479,-1489.95 1096.06,273.24 1763.03,1383.51 1489.76,2479.57l0.02 -0.02z" } ), /* @__PURE__ */ (0, import_jsx_runtime9.jsx)( "path", { fill: "white", fillRule: "nonzero", d: "M2947.77 1754.38c40.72,-272.26 -166.56,-418.61 -450,-516.24l91.95 -368.8 -224.5 -55.94 -89.51 359.09c-59.02,-14.72 -119.63,-28.59 -179.87,-42.34l90.16 -361.46 -224.36 -55.94 -92 368.68c-48.84,-11.12 -96.81,-22.11 -143.35,-33.69l0.26 -1.16 -309.59 -77.31 -59.72 239.78c0,0 166.56,38.18 163.05,40.53 90.91,22.69 107.35,82.87 104.62,130.57l-104.74 420.15c6.26,1.59 14.38,3.89 23.34,7.49 -7.49,-1.86 -15.46,-3.89 -23.73,-5.87l-146.81 588.57c-11.11,27.62 -39.31,69.07 -102.87,53.33 2.25,3.26 -163.17,-40.72 -163.17,-40.72l-111.46 256.98 292.15 72.83c54.35,13.63 107.61,27.89 160.06,41.3l-92.9 373.03 224.24 55.94 92 -369.07c61.26,16.63 120.71,31.97 178.91,46.43l-91.69 367.33 224.51 55.94 92.89 -372.33c382.82,72.45 670.67,43.24 791.83,-303.02 97.63,-278.78 -4.86,-439.58 -206.26,-544.44 146.69,-33.83 257.18,-130.31 286.64,-329.61l-0.07 -0.05zm-512.93 719.26c-69.38,278.78 -538.76,128.08 -690.94,90.29l123.28 -494.2c152.17,37.99 640.17,113.17 567.67,403.91zm69.43 -723.3c-63.29,253.58 -453.96,124.75 -580.69,93.16l111.77 -448.21c126.73,31.59 534.85,90.55 468.94,355.05l-0.02 0z" } ) ] }) ] }) } ); } // src/components/icons/RGasIcon.tsx var import_jsx_runtime10 = require("react/jsx-runtime"); function RGasIcon(props) { return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)( "svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 500 500", width: 24, height: 24, ...props, children: [ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)( "circle", { cx: "250", cy: "250", r: "250", fill: "#b2ff04" } ), /* @__PURE__ */ (0, import_jsx_runtime10.jsx)( "path", { fill: "#006840", d: "M346.39,403.15c-26.17-23.18-51.58-45.69-77.73-68.86-.13,2.58-.28,4.18-.29,5.77-.19,30.24-.36,60.48-.54,90.73q-.04,6.48-6.74,6.45c-8.78-.05-17.57-.27-26.35-.07-3.46,.08-4.36-.83-4.32-4.3,.33-31.62,.46-63.23,.64-94.85,0-1.05,.01-2.09,.02-4.12-26.46,22.99-52.29,45.44-78.06,67.84-1.6-.72-.96-1.95-.96-2.88,.04-14.97,.2-29.94,.17-44.9,0-2.36,.75-3.86,2.52-5.42,28.99-25.57,57.91-51.22,86.85-76.84,.67-.59,1.45-1.07,2.4-1.76-1.89-1.66-3.64-1.09-5.18-1.1-27.12-.2-54.24-.43-81.36-.41-3.91,0-4.88-1.05-4.74-4.83,.34-9.46,.42-18.94,.16-28.4-.11-3.83,1.29-4.39,4.68-4.35,26.96,.28,53.93,.38,80.9,.54,1.68,0,3.37,.02,5.83,.03-2.08-3.59-5.06-5.5-7.53-7.74-27-24.56-54.06-49.05-81.17-73.49-1.49-1.35-2.15-2.64-2.13-4.66,.17-16.03,.23-32.07,.33-49.24,26.24,23.34,51.86,46.12,78.27,69.61,.01-2.46,.02-4.06,.03-5.65,.18-31.01,.43-62.01,.45-93.02,0-3.71,1.1-4.55,4.65-4.44,9.39,.29,18.8,.42,28.19,.14,4.06-.12,4.69,1.28,4.65,4.93-.33,30.7-.44,61.4-.62,92.1,0,1.63-.02,3.27-.04,6.19,26.52-23.13,52.16-45.5,77.98-68.01,1.04,1.6,.64,2.99,.64,4.27-.05,13.9-.29,27.8-.13,41.7,.05,3.86-1.14,6.41-4.05,8.97-28.31,24.95-56.48,50.05-84.69,75.1-.78,.69-1.52,1.41-2.45,2.27,1.66,1.71,3.6,1.03,5.27,1.04,26.96,.21,53.93,.41,80.9,.44,3.42,0,4.77,.6,4.62,4.41-.37,9.61-.37,19.24-.19,28.86,.06,3.38-.77,4.35-4.31,4.31-27.12-.32-54.24-.4-81.36-.56-1.64,0-3.28-.02-6.14-.04,8.77,7.94,16.64,15.09,24.54,22.22,21.63,19.52,43.26,39.04,64.91,58.53,1.08,.97,1.81,1.89,1.8,3.46-.14,16.32-.22,32.64-.32,50.05Z" } ) ] } ); } // src/components/util/debounce.ts var import_react6 = require("react"); function useDebounce(value, delay) { const [debouncedValue, setDebouncedValue] = (0, import_react6.useState)(value); (0, import_react6.useEffect)(() => { const handler = setTimeout(() => { setDebouncedValue(value); }, delay); return () => { clearTimeout(handler); }; }, [value, delay]); return debouncedValue; } // src/hooks/client/useCurrentNetwork.ts function useCurrentNetwork() { return useRoochContext().network; } // src/hooks/client/useRoochContext.ts var import_react10 = require("react"); // src/provider/clientProvider.tsx var import_react9 = require("react"); var import_rooch_sdk2 = require("@roochnetwork/rooch-sdk"); // src/constants/styleDataAttribute.ts var styleDataAttributeName = "data-sdk-kit"; var styleDataAttributeSelector = `[${styleDataAttributeName}]`; var styleDataAttribute = { [styleDataAttributeName]: "" }; // src/provider/walletProvider.tsx var import_react8 = require("react"); var import_rooch_sdk = require("@roochnetwork/rooch-sdk"); // src/hooks/wallet/useWalletStore.ts var import_react7 = require("react"); var import_zustand = require("zustand"); function useWalletStore(selector) { const store = (0, import_react7.useContext)(WalletContext); if (!store) { throw new Error("Could not find WalletContext. Ensure that you have set up the WalletProvider."); } return (0, import_zustand.useStore)(store, selector); } // src/provider/walletProvider.tsx var import_jsx_runtime11 = require("react/jsx-runtime"); var WalletContext = (0, import_react8.createContext)(null); // src/provider/clientProvider.tsx var import_jsx_runtime12 = require("react/jsx-runtime"); var ClientContext = (0, import_react9.createContext)(null); var DEFAULT_NETWORKS = { localnet: { url: (0, import_rooch_sdk2.getRoochNodeUrl)("localnet") } }; // src/hooks/client/useRoochContext.ts function useRoochContext() { const context = (0, import_react10.useContext)(ClientContext); if (!context) { throw new Error( "Could not find RoochClientContext. Ensure that you have set up the RoochClientProvider." ); } return context; } // src/hooks/client/useRoochClient.ts function useRoochClient() { return useRoochContext().client; } // src/hooks/wallet/useCurrentAddress.ts function useCurrentAddress() { return useWalletStore((state) => state.currentAddress); } // src/hooks/wallet/useCurrentWallet.ts function useCurrentWallet() { const currentWallet = useWalletStore((state) => state.currentWallet); const connectionStatus = useWalletStore((state) => state.connectionStatus); switch (connectionStatus) { case "connecting": return { status: connectionStatus, wallet: currentWallet, isDisconnected: false, isConnecting: true, isConnected: false }; case "disconnected": return { status: connectionStatus, wallet: currentWallet, isDisconnected: true, isConnecting: false, isConnected: false }; case "connected": { return { status: connectionStatus, wallet: currentWallet, isDisconnected: false, isConnecting: false, isConnected: true }; } } } // src/components/swap-gas-modal/views/SwapGasView.tsx var import_jsx_runtime13 = require("react/jsx-runtime"); var btcDecimals = 1e8; function SwapGasView() { const { wallet } = useCurrentWallet(); const currentAddress = useCurrentAddress(); const client = useRoochClient(); const network = useCurrentNetwork(); const env = network === "mainnet" ? MarketEev.main : MarketEev.test; const [rate, setRate] = (0, import_react11.useState)(0); const [to, setTo] = (0, import_react11.useState)(0); const [rGasBalance, setRGasBalance] = (0, import_react11.useState)(0); const [bitcoinBalance, setBitcoinBalance] = (0, import_react11.useState)(0); const [form, setForm] = (0, import_react11.useState)("0.0"); const debouncedForm = useDebounce(form, 500); const { start, finish } = useProgress(); const [errorMessage, setErrorMessage] = (0, import_react11.useState)(); (0, import_react11.useEffect)(() => { if (!currentAddress) { return; } const fetchBalances = async () => { try { const bitcoinResult = await wallet?.getBalance(); const rGasResult = await client.getBalance({ owner: currentAddress, coinType: "0x3::gas_coin::RGas" }); setBitcoinBalance(bitcoinResult?.confirmed || 0); setRGasBalance(rGasResult.fixedBalance); finish(); } catch (error) { setErrorMessage("Failed to fetch balances. Please try again later."); } }; start(); fetchBalances().finally(() => finish()); }, [client, currentAddress, wallet, start, finish]); (0, import_react11.useEffect)(() => { const fromNumber = Number(debouncedForm); if (fromNumber <= 0) { return; } start(); const stas = fromNumber * btcDecimals; client.executeViewFunction({ address: env.marketCA, module: "gas_market", function: "btc_to_rgas", args: [import_rooch_sdk3.Args.u64(BigInt(stas))] }).then((result) => { const value = Number(result.return_values?.[0]?.decoded_value || 0) || 0; const s = new import_decimal.Decimal(value).div(stas.toString()).toNumber(); setTo(value); setRate(s); }).finally(() => finish()); }, [client, finish, debouncedForm, env.marketCA, start]); const swap = () => { start(); wallet?.sendBtc({ toAddress: env.btcGasAddress, satoshis: Number(Number(debouncedForm) * btcDecimals) }).finally(() => finish()); }; return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(View, { title: "Swap Gas", actionText: "Swap", actionOnClick: swap, children: [ /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: container, children: [ /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Card, { header: "From", headerRight: `Balance: ${(0, import_rooch_sdk3.fixedBalance)(bitcoinBalance, 9)}`, children: /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: inputContainer, children: [ /* @__PURE__ */ (0, import_jsx_runtime13.jsx)( Input, { type: "number", value: form, onChange: (v) => { const value = v.target.value; if (/^\d*\.?\d*$/.test(value)) { setForm(value); } } } ), /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(BitcoinIcon, {}) ] }) }), /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Card, { header: "To", headerRight: `Balance: ${rGasBalance}`, children: /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: inputContainer, children: [ /* @__PURE__ */ (0, import_jsx_runtime13.jsx)( Input, { disabled: true, value: Intl.NumberFormat("en-us").format(Number((0, import_rooch_sdk3.fixedBalance)(to, 8).toFixed(2))) } ), /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(RGasIcon, {}) ] }) }) ] }), /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: infoContainer, children: [ /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(Heading, { as: "h3", size: "sm", weight: "normal", children: [ errorMessage, !errorMessage && `1 BTC = ${rate === 0 ? "\u267E\uFE0F" : Intl.NumberFormat("en-us").format(rate)} RGas` ] }), /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: separator }), /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Text, { weight: "medium", color: "muted", children: "Estimated rate, the actual amount received depends on the rate at the time of transaction confirmation block." }) ] }) ] }); } // src/components/ui/Modal.tsx var import_react14 = require("react"); var Dialog = __toESM(require("@radix-ui/react-dialog"), 1); // src/components/ui/Modal.css.ts var closeButtonContainer = "Modal_closeButtonContainer__1c5z17f2"; var content2 = "Modal_content__1c5z17f1"; var overlay = "Modal_overlay__1c5z17f0"; // src/components/styling/StyleMarker.tsx var import_react_slot5 = require("@radix-ui/react-slot"); var import_react12 = require("react"); var import_jsx_runtime14 = require("react/jsx-runtime"); var StyleMarker = (0, import_react12.forwardRef)(({ children, ...props }, forwardedRef) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react_slot5.Slot, { ref: forwardedRef, ...props, ...styleDataAttribute, children })); StyleMarker.displayName = "StyleMarker"; // src/components/ui/IconButton.tsx var import_react_slot6 = require("@radix-ui/react-slot"); var import_clsx5 = __toESM(require("clsx"), 1); var import_react13 = require("react"); // src/components/ui/IconButton.css.ts var container3 = "IconButton_container__5zr4fg0"; // src/components/ui/IconButton.tsx var import_jsx_runtime15 = require("react/jsx-runtime"); var IconButton = (0, import_react13.forwardRef)( ({ className, asChild = false, ...props }, forwardedRef) => { const Comp = asChild ? import_react_slot6.Slot : "button"; return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Comp, { ...props, className: (0, import_clsx5.default)(container3, className), ref: forwardedRef }); } ); IconButton.displayName = "Button"; // src/components/icons/CloseIcon.tsx var import_jsx_runtime16 = require("react/jsx-runtime"); function CloseIcon(props) { return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("svg", { width: 10, height: 10, fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)( "path", { d: "M9.708.292a.999.999 0 0 0-1.413 0l-3.289 3.29L1.717.291A.999.999 0 0 0 .305 1.705l3.289 3.289-3.29 3.289a.999.999 0 1 0 1.413 1.412l3.29-3.289 3.288 3.29a.999.999 0 0 0 1.413-1.413l-3.29-3.29 3.29-3.288a.999.999 0 0 0 0-1.413Z", fill: "currentColor" } ) }); } // src/components/ui/Modal.tsx var import_jsx_runtime17 = require("react/jsx-runtime"); function Modal({ trigger, children, open, defaultOpen, onOpenChange }) { const [isModalOpen, setModalOpen] = (0, import_react14.useState)(open ?? defaultOpen); const handleOpenChange = (open2) => { setModalOpen(open2); onOpenChange?.(open2); }; return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(Dialog.Root, { open: open ?? isModalOpen, onOpenChange: handleOpenChange, children: [ /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Dialog.Trigger, { asChild: true, children: trigger }), /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Dialog.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(StyleMarker, { children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Dialog.Overlay, { className: overlay, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(Dialog.Content, { className: content2, "aria-describedby": void 0, children: [ /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(ProgressProvider, { children }), /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Dialog.Close, { className: closeButtonContainer, asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(IconButton, { type: "button", "aria-label": "Close", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(CloseIcon, {}) }) }) ] }) }) }) }) ] }); } // src/components/swap-gas-modal/SwapGasModal.tsx var import_jsx_runtime18 = require("react/jsx-runtime"); function SwapGasModal({ trigger, open, defaultOpen, onOpenChange }) { return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(Modal, { trigger, open, defaultOpen, onOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(SwapGasView, {}) }); } //# sourceMappingURL=SwapGasModal.js.map