@0xsequence/wallet-widget 0.0.0-20250314205219

package/dist/cjs/views/Search/components/CoinsTab.js

@@ -0,0 +1,49 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CoinsTab = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const design_system_1 = require("@0xsequence/design-system");
+const react_1 = require("react");
+const BalanceItem_1 = require("./BalanceItem");
+const CoinsTab = ({ displayedCoinBalances, fetchMoreCoinBalances, fetchMoreSearchCoinBalances, hasMoreCoins, hasMoreSearchCoins, isSearching, isPending, coinBalances }) => {
+    const [isLoading, setIsLoading] = (0, react_1.useState)(false);
+    const endOfPageRefCoins = (0, react_1.useRef)(null);
+    (0, react_1.useEffect)(() => {
+        if (!endOfPageRefCoins.current) {
+            return;
+        }
+        const observer = new IntersectionObserver(entries => {
+            const endOfPage = entries[0];
+            if (!endOfPage.isIntersecting) {
+                return;
+            }
+            if (isSearching && hasMoreSearchCoins) {
+                setIsLoading(true);
+                setTimeout(() => {
+                    fetchMoreSearchCoinBalances();
+                    setIsLoading(false);
+                }, 500);
+            }
+            else if (!isSearching && hasMoreCoins) {
+                setIsLoading(true);
+                setTimeout(() => {
+                    fetchMoreCoinBalances();
+                    setIsLoading(false);
+                }, 500);
+            }
+        });
+        observer.observe(endOfPageRefCoins.current);
+        return () => {
+            observer.disconnect();
+        };
+    }, [fetchMoreCoinBalances, fetchMoreSearchCoinBalances, isSearching]);
+    return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-3", children: [isPending && ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: Array(8)
+                            .fill(null)
+                            .map((_, i) => ((0, jsx_runtime_1.jsx)(design_system_1.Skeleton, { className: "w-full h-8" }, i))) })), !isPending && displayedCoinBalances.length === 0 && (0, jsx_runtime_1.jsx)(design_system_1.Text, { color: "primary", children: "No Coins Found" }), !isPending &&
+                        displayedCoinBalances.map((indexItem, index) => {
+                            const balance = coinBalances[indexItem.index];
+                            return (0, jsx_runtime_1.jsx)(BalanceItem_1.BalanceItem, { balance: balance }, index);
+                        }), isLoading && (0, jsx_runtime_1.jsx)(design_system_1.Spinner, { className: "flex self-center mt-3" })] }), (0, jsx_runtime_1.jsx)("div", { ref: endOfPageRefCoins, style: { height: '1px' } })] }));
+};
+exports.CoinsTab = CoinsTab;
+//# sourceMappingURL=CoinsTab.js.map

package/dist/cjs/views/Search/components/CoinsTab.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CoinsTab.js","sourceRoot":"","sources":["../../../../../src/views/Search/components/CoinsTab.tsx"],"names":[],"mappings":";;;;AAAA,6DAAmE;AAEnE,iCAA0D;AAI1D,+CAA2C;AAapC,MAAM,QAAQ,GAA4B,CAAC,EAChD,qBAAqB,EACrB,qBAAqB,EACrB,2BAA2B,EAC3B,YAAY,EACZ,kBAAkB,EAClB,WAAW,EACX,SAAS,EACT,YAAY,EACb,EAAE,EAAE;IACH,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAA;IAEjD,MAAM,iBAAiB,GAAG,IAAA,cAAM,EAAwB,IAAI,CAAC,CAAA;IAE7D,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,IAAI,CAAC,iBAAiB,CAAC,OAAO,EAAE,CAAC;YAC/B,OAAM;QACR,CAAC;QAED,MAAM,QAAQ,GAAG,IAAI,oBAAoB,CAAC,OAAO,CAAC,EAAE;YAClD,MAAM,SAAS,GAAG,OAAO,CAAC,CAAC,CAAC,CAAA;YAC5B,IAAI,CAAC,SAAS,CAAC,cAAc,EAAE,CAAC;gBAC9B,OAAM;YACR,CAAC;YACD,IAAI,WAAW,IAAI,kBAAkB,EAAE,CAAC;gBACtC,YAAY,CAAC,IAAI,CAAC,CAAA;gBAClB,UAAU,CAAC,GAAG,EAAE;oBACd,2BAA2B,EAAE,CAAA;oBAC7B,YAAY,CAAC,KAAK,CAAC,CAAA;gBACrB,CAAC,EAAE,GAAG,CAAC,CAAA;YACT,CAAC;iBAAM,IAAI,CAAC,WAAW,IAAI,YAAY,EAAE,CAAC;gBACxC,YAAY,CAAC,IAAI,CAAC,CAAA;gBAClB,UAAU,CAAC,GAAG,EAAE;oBACd,qBAAqB,EAAE,CAAA;oBACvB,YAAY,CAAC,KAAK,CAAC,CAAA;gBACrB,CAAC,EAAE,GAAG,CAAC,CAAA;YACT,CAAC;QACH,CAAC,CAAC,CAAA;QAEF,QAAQ,CAAC,OAAO,CAAC,iBAAiB,CAAC,OAAO,CAAC,CAAA;QAE3C,OAAO,GAAG,EAAE;YACV,QAAQ,CAAC,UAAU,EAAE,CAAA;QACvB,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,qBAAqB,EAAE,2BAA2B,EAAE,WAAW,CAAC,CAAC,CAAA;IAErE,OAAO,CACL,4CACE,iCAAK,SAAS,EAAC,qBAAqB,aACjC,SAAS,IAAI,CACZ,2DACG,KAAK,CAAC,CAAC,CAAC;6BACN,IAAI,CAAC,IAAI,CAAC;6BACV,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CACb,uBAAC,wBAAQ,IAAC,SAAS,EAAC,YAAY,IAAM,CAAC,CAAI,CAC5C,CAAC,GACH,CACJ,EACA,CAAC,SAAS,IAAI,qBAAqB,CAAC,MAAM,KAAK,CAAC,IAAI,uBAAC,oBAAI,IAAC,KAAK,EAAC,SAAS,+BAAsB,EAC/F,CAAC,SAAS;wBACT,qBAAqB,CAAC,GAAG,CAAC,CAAC,SAAS,EAAE,KAAK,EAAE,EAAE;4BAC7C,MAAM,OAAO,GAAG,YAAY,CAAC,SAAS,CAAC,KAAK,CAAC,CAAA;4BAC7C,OAAO,uBAAC,yBAAW,IAAa,OAAO,EAAE,OAAO,IAAvB,KAAK,CAAsB,CAAA;wBACtD,CAAC,CAAC,EACH,SAAS,IAAI,uBAAC,uBAAO,IAAC,SAAS,EAAC,uBAAuB,GAAG,IACvD,EACN,gCAAK,GAAG,EAAE,iBAAiB,EAAE,KAAK,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,GAAI,IACrD,CACP,CAAA;AACH,CAAC,CAAA;AArEY,QAAA,QAAQ,YAqEpB"}

package/dist/cjs/views/Search/components/CollectionsTab.js

@@ -0,0 +1,49 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CollectionsTab = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const design_system_1 = require("@0xsequence/design-system");
+const react_1 = require("react");
+const BalanceItem_1 = require("./BalanceItem");
+const CollectionsTab = ({ displayedCollectionBalances, fetchMoreCollectionBalances, fetchMoreSearchCollectionBalances, hasMoreCollections, hasMoreSearchCollections, isSearching, isPending, collectionBalances }) => {
+    const [isLoading, setIsLoading] = (0, react_1.useState)(false);
+    const endOfPageRefCollections = (0, react_1.useRef)(null);
+    (0, react_1.useEffect)(() => {
+        if (!endOfPageRefCollections.current) {
+            return;
+        }
+        const observer = new IntersectionObserver(entries => {
+            const endOfPage = entries[0];
+            if (!endOfPage.isIntersecting) {
+                return;
+            }
+            if (isSearching && hasMoreSearchCollections) {
+                setIsLoading(true);
+                setTimeout(() => {
+                    fetchMoreSearchCollectionBalances();
+                    setIsLoading(false);
+                }, 500);
+            }
+            else if (!isSearching && hasMoreCollections) {
+                setIsLoading(true);
+                setTimeout(() => {
+                    fetchMoreCollectionBalances();
+                    setIsLoading(false);
+                }, 500);
+            }
+        });
+        observer.observe(endOfPageRefCollections.current);
+        return () => {
+            observer.disconnect();
+        };
+    }, [fetchMoreCollectionBalances, fetchMoreSearchCollectionBalances, isSearching]);
+    return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-3", children: [isPending && ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: Array(8)
+                            .fill(null)
+                            .map((_, i) => ((0, jsx_runtime_1.jsx)(design_system_1.Skeleton, { className: "w-full h-8" }, i))) })), !isPending && displayedCollectionBalances.length === 0 && (0, jsx_runtime_1.jsx)(design_system_1.Text, { color: "primary", children: "No Collectibles Found" }), !isPending &&
+                        displayedCollectionBalances.map((indexItem, index) => {
+                            const balance = collectionBalances[indexItem.index];
+                            return (0, jsx_runtime_1.jsx)(BalanceItem_1.BalanceItem, { balance: balance }, index);
+                        }), isLoading && (0, jsx_runtime_1.jsx)(design_system_1.Spinner, { className: "flex self-center mt-3" })] }), (0, jsx_runtime_1.jsx)("div", { ref: endOfPageRefCollections, style: { height: '1px' } })] }));
+};
+exports.CollectionsTab = CollectionsTab;
+//# sourceMappingURL=CollectionsTab.js.map

package/dist/cjs/views/Search/components/CollectionsTab.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CollectionsTab.js","sourceRoot":"","sources":["../../../../../src/views/Search/components/CollectionsTab.tsx"],"names":[],"mappings":";;;;AAAA,6DAAmE;AAEnE,iCAA0D;AAI1D,+CAA2C;AAapC,MAAM,cAAc,GAAkC,CAAC,EAC5D,2BAA2B,EAC3B,2BAA2B,EAC3B,iCAAiC,EACjC,kBAAkB,EAClB,wBAAwB,EACxB,WAAW,EACX,SAAS,EACT,kBAAkB,EACnB,EAAE,EAAE;IACH,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAA;IAEjD,MAAM,uBAAuB,GAAG,IAAA,cAAM,EAAwB,IAAI,CAAC,CAAA;IAEnE,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,IAAI,CAAC,uBAAuB,CAAC,OAAO,EAAE,CAAC;YACrC,OAAM;QACR,CAAC;QAED,MAAM,QAAQ,GAAG,IAAI,oBAAoB,CAAC,OAAO,CAAC,EAAE;YAClD,MAAM,SAAS,GAAG,OAAO,CAAC,CAAC,CAAC,CAAA;YAC5B,IAAI,CAAC,SAAS,CAAC,cAAc,EAAE,CAAC;gBAC9B,OAAM;YACR,CAAC;YACD,IAAI,WAAW,IAAI,wBAAwB,EAAE,CAAC;gBAC5C,YAAY,CAAC,IAAI,CAAC,CAAA;gBAClB,UAAU,CAAC,GAAG,EAAE;oBACd,iCAAiC,EAAE,CAAA;oBACnC,YAAY,CAAC,KAAK,CAAC,CAAA;gBACrB,CAAC,EAAE,GAAG,CAAC,CAAA;YACT,CAAC;iBAAM,IAAI,CAAC,WAAW,IAAI,kBAAkB,EAAE,CAAC;gBAC9C,YAAY,CAAC,IAAI,CAAC,CAAA;gBAClB,UAAU,CAAC,GAAG,EAAE;oBACd,2BAA2B,EAAE,CAAA;oBAC7B,YAAY,CAAC,KAAK,CAAC,CAAA;gBACrB,CAAC,EAAE,GAAG,CAAC,CAAA;YACT,CAAC;QACH,CAAC,CAAC,CAAA;QACF,QAAQ,CAAC,OAAO,CAAC,uBAAuB,CAAC,OAAO,CAAC,CAAA;QAEjD,OAAO,GAAG,EAAE;YACV,QAAQ,CAAC,UAAU,EAAE,CAAA;QACvB,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,2BAA2B,EAAE,iCAAiC,EAAE,WAAW,CAAC,CAAC,CAAA;IAEjF,OAAO,CACL,4CACE,iCAAK,SAAS,EAAC,qBAAqB,aACjC,SAAS,IAAI,CACZ,2DACG,KAAK,CAAC,CAAC,CAAC;6BACN,IAAI,CAAC,IAAI,CAAC;6BACV,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CACb,uBAAC,wBAAQ,IAAC,SAAS,EAAC,YAAY,IAAM,CAAC,CAAI,CAC5C,CAAC,GACH,CACJ,EACA,CAAC,SAAS,IAAI,2BAA2B,CAAC,MAAM,KAAK,CAAC,IAAI,uBAAC,oBAAI,IAAC,KAAK,EAAC,SAAS,sCAA6B,EAC5G,CAAC,SAAS;wBACT,2BAA2B,CAAC,GAAG,CAAC,CAAC,SAAS,EAAE,KAAK,EAAE,EAAE;4BACnD,MAAM,OAAO,GAAG,kBAAkB,CAAC,SAAS,CAAC,KAAK,CAAC,CAAA;4BACnD,OAAO,uBAAC,yBAAW,IAAa,OAAO,EAAE,OAAO,IAAvB,KAAK,CAAsB,CAAA;wBACtD,CAAC,CAAC,EACH,SAAS,IAAI,uBAAC,uBAAO,IAAC,SAAS,EAAC,uBAAuB,GAAG,IACvD,EACN,gCAAK,GAAG,EAAE,uBAAuB,EAAE,KAAK,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,GAAI,IAC3D,CACP,CAAA;AACH,CAAC,CAAA;AApEY,QAAA,cAAc,kBAoE1B"}

package/dist/cjs/views/Search/components/WalletLink.js

@@ -0,0 +1,15 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.WalletLink = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const design_system_1 = require("@0xsequence/design-system");
+const hooks_1 = require("../../../hooks");
+const WalletLink = ({ toLocation, label }) => {
+    const { setNavigation } = (0, hooks_1.useNavigation)();
+    const onClick = () => {
+        setNavigation(toLocation);
+    };
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "flex w-full flex-row justify-between items-center select-none cursor-pointer", onClick: onClick, children: [(0, jsx_runtime_1.jsx)(design_system_1.Text, { variant: "normal", color: "muted", fontWeight: "medium", children: label }), (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-row justify-center items-center", children: [(0, jsx_runtime_1.jsx)(design_system_1.Text, { variant: "normal", color: "muted", fontWeight: "medium", children: "View all" }), (0, jsx_runtime_1.jsx)(design_system_1.ChevronRightIcon, { className: "text-muted", size: "sm" })] })] }));
+};
+exports.WalletLink = WalletLink;
+//# sourceMappingURL=WalletLink.js.map

package/dist/cjs/views/Search/components/WalletLink.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"WalletLink.js","sourceRoot":"","sources":["../../../../../src/views/Search/components/WalletLink.tsx"],"names":[],"mappings":";;;;AAAA,6DAAkE;AAIlE,0CAA8C;AAOvC,MAAM,UAAU,GAAG,CAAC,EAAE,UAAU,EAAE,KAAK,EAAmB,EAAE,EAAE;IACnE,MAAM,EAAE,aAAa,EAAE,GAAG,IAAA,qBAAa,GAAE,CAAA;IAEzC,MAAM,OAAO,GAAG,GAAG,EAAE;QACnB,aAAa,CAAC,UAAU,CAAC,CAAA;IAC3B,CAAC,CAAA;IAED,OAAO,CACL,iCAAK,SAAS,EAAC,8EAA8E,EAAC,OAAO,EAAE,OAAO,aAC5G,uBAAC,oBAAI,IAAC,OAAO,EAAC,QAAQ,EAAC,KAAK,EAAC,OAAO,EAAC,UAAU,EAAC,QAAQ,YACrD,KAAK,GACD,EACP,iCAAK,SAAS,EAAC,2CAA2C,aACxD,uBAAC,oBAAI,IAAC,OAAO,EAAC,QAAQ,EAAC,KAAK,EAAC,OAAO,EAAC,UAAU,EAAC,QAAQ,yBAEjD,EACP,uBAAC,gCAAgB,IAAC,SAAS,EAAC,YAAY,EAAC,IAAI,EAAC,IAAI,GAAG,IACjD,IACF,CACP,CAAA;AACH,CAAC,CAAA;AApBY,QAAA,UAAU,cAoBtB"}

package/dist/cjs/views/Search/index.js

@@ -0,0 +1,19 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./SearchWallet"), exports);
+__exportStar(require("./SearchWalletViewAll"), exports);
+//# sourceMappingURL=index.js.map

package/dist/cjs/views/Search/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/views/Search/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,iDAA8B;AAC9B,wDAAqC"}

package/dist/cjs/views/SendCoin.js

@@ -0,0 +1,198 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SendCoin = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const connect_1 = require("@0xsequence/connect");
+const design_system_1 = require("@0xsequence/design-system");
+const indexer_1 = require("@0xsequence/indexer");
+const react_hooks_1 = require("@0xsequence/react-hooks");
+const react_1 = require("react");
+const viem_1 = require("viem");
+const wagmi_1 = require("wagmi");
+const SendItemInfo_1 = require("../components/SendItemInfo");
+const TransactionConfirmation_1 = require("../components/TransactionConfirmation");
+const constants_1 = require("../constants");
+const Navigation_1 = require("../contexts/Navigation");
+const hooks_1 = require("../hooks");
+const utils_1 = require("../utils");
+const SendCoin = ({ chainId, contractAddress }) => {
+    const { setNavigation } = (0, hooks_1.useNavigation)();
+    const { setIsBackButtonEnabled } = (0, Navigation_1.useNavigationContext)();
+    const { analytics } = (0, connect_1.useAnalyticsContext)();
+    const { chains } = (0, wagmi_1.useConfig)();
+    const connectedChainId = (0, wagmi_1.useChainId)();
+    const { address: accountAddress = '', connector } = (0, wagmi_1.useAccount)();
+    const isConnectorSequenceBased = !!connector?._wallet?.isSequenceBased;
+    const isCorrectChainId = connectedChainId === chainId;
+    const showSwitchNetwork = !isCorrectChainId && !isConnectorSequenceBased;
+    const { switchChainAsync } = (0, wagmi_1.useSwitchChain)();
+    const amountInputRef = (0, react_1.useRef)(null);
+    const { fiatCurrency } = (0, hooks_1.useSettings)();
+    const [amount, setAmount] = (0, react_1.useState)('0');
+    const [toAddress, setToAddress] = (0, react_1.useState)('');
+    const { sendTransaction } = (0, wagmi_1.useSendTransaction)();
+    const [isSendTxnPending, setIsSendTxnPending] = (0, react_1.useState)(false);
+    const [showConfirmation, setShowConfirmation] = (0, react_1.useState)(false);
+    const [feeOptions, setFeeOptions] = (0, react_1.useState)();
+    const [isCheckingFeeOptions, setIsCheckingFeeOptions] = (0, react_1.useState)(false);
+    const [selectedFeeTokenAddress, setSelectedFeeTokenAddress] = (0, react_1.useState)(null);
+    const checkFeeOptions = (0, connect_1.useCheckWaasFeeOptions)();
+    const [pendingFeeOption, confirmFeeOption, _rejectFeeOption] = (0, connect_1.useWaasFeeOptions)();
+    const { data: balances = [], isPending: isPendingBalances } = (0, react_hooks_1.useGetTokenBalancesSummary)({
+        chainIds: [chainId],
+        filter: {
+            accountAddresses: [accountAddress],
+            contractStatus: indexer_1.ContractVerificationStatus.ALL,
+            contractWhitelist: [contractAddress],
+            omitNativeBalances: false
+        }
+    });
+    const nativeTokenInfo = (0, connect_1.getNativeTokenInfoByChainId)(chainId, chains);
+    const tokenBalance = balances.find(b => b.contractAddress === contractAddress);
+    const { data: coinPrices = [], isPending: isPendingCoinPrices } = (0, react_hooks_1.useGetCoinPrices)([
+        {
+            chainId,
+            contractAddress
+        }
+    ]);
+    const { data: conversionRate = 1, isPending: isPendingConversionRate } = (0, react_hooks_1.useGetExchangeRate)(fiatCurrency.symbol);
+    const isPending = isPendingBalances || isPendingCoinPrices || isPendingConversionRate;
+    // Handle fee option confirmation when pendingFeeOption is available
+    (0, react_1.useEffect)(() => {
+        if (pendingFeeOption && selectedFeeTokenAddress !== null) {
+            confirmFeeOption(pendingFeeOption.id, selectedFeeTokenAddress);
+        }
+    }, [pendingFeeOption, selectedFeeTokenAddress]);
+    // Control back button when showing confirmation
+    (0, react_1.useEffect)(() => {
+        setIsBackButtonEnabled(!showConfirmation);
+    }, [showConfirmation, setIsBackButtonEnabled]);
+    if (isPending) {
+        return null;
+    }
+    const isNativeCoin = (0, connect_1.compareAddress)(contractAddress, viem_1.zeroAddress);
+    const decimals = isNativeCoin ? nativeTokenInfo.decimals : tokenBalance?.contractInfo?.decimals || 18;
+    const name = isNativeCoin ? nativeTokenInfo.name : tokenBalance?.contractInfo?.name || '';
+    const imageUrl = isNativeCoin ? nativeTokenInfo.logoURI : tokenBalance?.contractInfo?.logoURI;
+    const symbol = isNativeCoin ? nativeTokenInfo.symbol : tokenBalance?.contractInfo?.symbol || '';
+    const amountToSendFormatted = amount === '' ? '0' : amount;
+    const amountRaw = (0, viem_1.parseUnits)(amountToSendFormatted, decimals);
+    const amountToSendFiat = (0, utils_1.computeBalanceFiat)({
+        balance: {
+            ...tokenBalance,
+            balance: amountRaw.toString()
+        },
+        prices: coinPrices,
+        conversionRate,
+        decimals
+    });
+    const insufficientFunds = amountRaw > BigInt(tokenBalance?.balance || '0');
+    const isNonZeroAmount = amountRaw > 0n;
+    const handleChangeAmount = (ev) => {
+        const { value } = ev.target;
+        // Prevent value from having more decimals than the token supports
+        const formattedValue = (0, utils_1.limitDecimals)(value, decimals);
+        setAmount(formattedValue);
+    };
+    const handleMax = () => {
+        amountInputRef.current?.focus();
+        const maxAmount = (0, viem_1.formatUnits)(BigInt(tokenBalance?.balance || 0), decimals).toString();
+        setAmount(maxAmount);
+    };
+    const handlePaste = async () => {
+        const result = await navigator.clipboard.readText();
+        setToAddress(result);
+    };
+    const handleToAddressClear = () => {
+        setToAddress('');
+    };
+    const handleSendClick = async (e) => {
+        e.preventDefault();
+        setIsCheckingFeeOptions(true);
+        const sendAmount = (0, viem_1.parseUnits)(amountToSendFormatted, decimals);
+        let transaction;
+        if (isNativeCoin) {
+            transaction = {
+                to: toAddress,
+                value: BigInt(sendAmount.toString())
+            };
+        }
+        else {
+            transaction = {
+                to: tokenBalance?.contractAddress,
+                data: (0, viem_1.encodeFunctionData)({ abi: constants_1.ERC_20_ABI, functionName: 'transfer', args: [toAddress, (0, viem_1.toHex)(sendAmount)] })
+            };
+        }
+        // Check fee options before showing confirmation
+        const feeOptionsResult = await checkFeeOptions({
+            transactions: [transaction],
+            chainId
+        });
+        setFeeOptions(feeOptionsResult?.feeOptions
+            ? {
+                options: feeOptionsResult.feeOptions,
+                chainId
+            }
+            : undefined);
+        setShowConfirmation(true);
+        setIsCheckingFeeOptions(false);
+    };
+    const executeTransaction = async () => {
+        if (!isCorrectChainId && isConnectorSequenceBased) {
+            await switchChainAsync({ chainId });
+        }
+        analytics?.track({
+            event: 'SEND_TRANSACTION_REQUEST',
+            props: {
+                walletClient: connector?._wallet?.id || 'unknown',
+                source: 'sequence-kit/wallet'
+            }
+        });
+        setIsSendTxnPending(true);
+        const sendAmount = (0, viem_1.parseUnits)(amountToSendFormatted, decimals);
+        const txOptions = {
+            onSettled: (result) => {
+                setIsBackButtonEnabled(true);
+                if (result) {
+                    setNavigation({
+                        location: 'home'
+                    });
+                }
+                setIsSendTxnPending(false);
+            }
+        };
+        if (isNativeCoin) {
+            sendTransaction({
+                to: toAddress,
+                value: BigInt(sendAmount.toString()),
+                gas: null
+            }, txOptions);
+        }
+        else {
+            sendTransaction({
+                to: tokenBalance?.contractAddress,
+                data: (0, viem_1.encodeFunctionData)({ abi: constants_1.ERC_20_ABI, functionName: 'transfer', args: [toAddress, (0, viem_1.toHex)(sendAmount)] }),
+                gas: null
+            }, txOptions);
+        }
+    };
+    return ((0, jsx_runtime_1.jsxs)("form", { className: "flex p-5 pt-3 gap-2 flex-col", style: {
+            marginTop: constants_1.HEADER_HEIGHT
+        }, onSubmit: handleSendClick, children: [!showConfirmation && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex bg-background-secondary rounded-xl p-4 gap-2 flex-col", children: [(0, jsx_runtime_1.jsx)(SendItemInfo_1.SendItemInfo, { imageUrl: imageUrl, decimals: decimals, name: name, symbol: symbol, balance: tokenBalance?.balance || '0', fiatValue: (0, utils_1.computeBalanceFiat)({
+                                    balance: tokenBalance,
+                                    prices: coinPrices,
+                                    conversionRate,
+                                    decimals
+                                }), chainId: chainId }), (0, jsx_runtime_1.jsx)(design_system_1.NumericInput, { ref: amountInputRef, name: "amount", value: amount, onChange: handleChangeAmount, controls: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(design_system_1.Text, { className: "whitespace-nowrap", variant: "small", color: "muted", children: `~${fiatCurrency.sign}${amountToSendFiat}` }), (0, jsx_runtime_1.jsx)(design_system_1.Button, { className: "shrink-0", size: "xs", shape: "square", label: "Max", onClick: handleMax, "data-id": "maxCoin" }), (0, jsx_runtime_1.jsx)(design_system_1.Text, { variant: "xlarge", fontWeight: "bold", color: "primary", children: symbol })] }) }), insufficientFunds && ((0, jsx_runtime_1.jsx)(design_system_1.Text, { className: "mt-2", variant: "normal", color: "negative", asChild: true, children: (0, jsx_runtime_1.jsx)("div", { children: "Insufficient Funds" }) }))] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex bg-background-secondary rounded-xl p-4 gap-2 flex-col", children: [(0, jsx_runtime_1.jsx)(design_system_1.Text, { variant: "normal", color: "muted", children: "To" }), (0, utils_1.isEthAddress)(toAddress) ? ((0, jsx_runtime_1.jsxs)(design_system_1.Card, { className: "flex w-full flex-row justify-between items-center", clickable: true, onClick: handleToAddressClear, style: { height: '52px' }, children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex flex-row justify-center items-center gap-2", children: [(0, jsx_runtime_1.jsx)(design_system_1.GradientAvatar, { size: "sm", address: toAddress }), (0, jsx_runtime_1.jsx)(design_system_1.Text, { color: "primary", variant: "normal", children: `0x${(0, connect_1.truncateAtMiddle)(toAddress.substring(2), 10)}` })] }), (0, jsx_runtime_1.jsx)(design_system_1.CloseIcon, { className: "text-white", size: "sm" })] })) : ((0, jsx_runtime_1.jsx)(design_system_1.TextInput, { value: toAddress, onChange: ev => setToAddress(ev.target.value), placeholder: `${nativeTokenInfo.name} Address (0x...)`, name: "to-address", "data-1p-ignore": true, controls: (0, jsx_runtime_1.jsx)(design_system_1.Button, { className: "shrink-0", size: "xs", shape: "square", label: "Paste", onClick: handlePaste, "data-id": "to-address", leftIcon: design_system_1.CopyIcon }) }))] }), showSwitchNetwork && ((0, jsx_runtime_1.jsxs)("div", { className: "mt-3", children: [(0, jsx_runtime_1.jsx)(design_system_1.Text, { className: "mb-2", variant: "small", color: "negative", children: "The wallet is connected to the wrong network. Please switch network before proceeding" }), (0, jsx_runtime_1.jsx)(design_system_1.Button, { className: "mt-2 w-full", variant: "primary", size: "lg", type: "button", label: "Switch Network", onClick: async () => await switchChainAsync({ chainId }), disabled: isCorrectChainId })] })), (0, jsx_runtime_1.jsx)("div", { className: "flex items-center justify-center", style: { height: '52px' }, children: isCheckingFeeOptions ? ((0, jsx_runtime_1.jsx)(design_system_1.Spinner, {})) : ((0, jsx_runtime_1.jsx)(design_system_1.Button, { className: "text-primary mt-3 w-full", variant: "primary", size: "lg", type: "submit", disabled: !isNonZeroAmount ||
+                                !(0, utils_1.isEthAddress)(toAddress) ||
+                                insufficientFunds ||
+                                (!isCorrectChainId && !isConnectorSequenceBased), label: "Send", rightIcon: design_system_1.ChevronRightIcon })) })] })), showConfirmation && ((0, jsx_runtime_1.jsx)(TransactionConfirmation_1.TransactionConfirmation, { name: name, symbol: symbol, imageUrl: imageUrl, amount: amountToSendFormatted, toAddress: toAddress, chainId: chainId, balance: tokenBalance?.balance || '0', decimals: decimals, fiatValue: amountToSendFiat, feeOptions: feeOptions, onSelectFeeOption: feeTokenAddress => {
+                    setSelectedFeeTokenAddress(feeTokenAddress);
+                }, isLoading: isSendTxnPending, onConfirm: () => {
+                    executeTransaction();
+                }, onCancel: () => {
+                    setShowConfirmation(false);
+                } }))] }));
+};
+exports.SendCoin = SendCoin;
+//# sourceMappingURL=SendCoin.js.map

package/dist/cjs/views/SendCoin.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SendCoin.js","sourceRoot":"","sources":["../../../src/views/SendCoin.tsx"],"names":[],"mappings":"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"}

package/dist/cjs/views/SendCollectible.js

@@ -0,0 +1,237 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SendCollectible = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const connect_1 = require("@0xsequence/connect");
+const design_system_1 = require("@0xsequence/design-system");
+const indexer_1 = require("@0xsequence/indexer");
+const react_hooks_1 = require("@0xsequence/react-hooks");
+const react_1 = require("react");
+const viem_1 = require("viem");
+const wagmi_1 = require("wagmi");
+const SendItemInfo_1 = require("../components/SendItemInfo");
+const TransactionConfirmation_1 = require("../components/TransactionConfirmation");
+const constants_1 = require("../constants");
+const Navigation_1 = require("../contexts/Navigation");
+const hooks_1 = require("../hooks");
+const utils_1 = require("../utils");
+const SendCollectible = ({ chainId, contractAddress, tokenId }) => {
+    const { setNavigation } = (0, hooks_1.useNavigation)();
+    const { setIsBackButtonEnabled } = (0, Navigation_1.useNavigationContext)();
+    const { analytics } = (0, connect_1.useAnalyticsContext)();
+    const { chains } = (0, wagmi_1.useConfig)();
+    const connectedChainId = (0, wagmi_1.useChainId)();
+    const { address: accountAddress = '', connector } = (0, wagmi_1.useAccount)();
+    const isConnectorSequenceBased = !!connector?._wallet?.isSequenceBased;
+    const isCorrectChainId = connectedChainId === chainId;
+    const showSwitchNetwork = !isCorrectChainId && !isConnectorSequenceBased;
+    const { switchChain } = (0, wagmi_1.useSwitchChain)();
+    const amountInputRef = (0, react_1.useRef)(null);
+    const [amount, setAmount] = (0, react_1.useState)('0');
+    const [toAddress, setToAddress] = (0, react_1.useState)('');
+    const [showAmountControls, setShowAmountControls] = (0, react_1.useState)(false);
+    const { sendTransaction } = (0, wagmi_1.useSendTransaction)();
+    const [isSendTxnPending, setIsSendTxnPending] = (0, react_1.useState)(false);
+    const [showConfirmation, setShowConfirmation] = (0, react_1.useState)(false);
+    const [feeOptions, setFeeOptions] = (0, react_1.useState)();
+    const [isCheckingFeeOptions, setIsCheckingFeeOptions] = (0, react_1.useState)(false);
+    const [selectedFeeTokenAddress, setSelectedFeeTokenAddress] = (0, react_1.useState)(null);
+    const checkFeeOptions = (0, connect_1.useCheckWaasFeeOptions)();
+    const [pendingFeeOption, confirmFeeOption, _rejectFeeOption] = (0, connect_1.useWaasFeeOptions)();
+    const { data: dataTokens, isPending: isPendingBalances } = (0, react_hooks_1.useGetTokenBalancesDetails)({
+        filter: {
+            accountAddresses: [accountAddress],
+            contractStatus: indexer_1.ContractVerificationStatus.ALL,
+            contractWhitelist: [contractAddress],
+            omitNativeBalances: false
+        },
+        chainIds: [chainId]
+    });
+    const tokenBalance = dataTokens && dataTokens.length > 0 ? dataTokens.find(balance => balance.tokenID === tokenId) : undefined;
+    let contractType;
+    if (tokenBalance) {
+        contractType = tokenBalance.contractType;
+    }
+    (0, react_1.useEffect)(() => {
+        if (tokenBalance) {
+            if (contractType === 'ERC721') {
+                setAmount('1');
+                setShowAmountControls(false);
+            }
+            else if (contractType === 'ERC1155') {
+                if (Number((0, viem_1.formatUnits)(BigInt(tokenBalance?.balance || 0), decimals)) >= 1) {
+                    setAmount('1');
+                }
+                setShowAmountControls(true);
+            }
+        }
+    }, [tokenBalance]);
+    (0, react_1.useEffect)(() => {
+        if (pendingFeeOption && selectedFeeTokenAddress !== null) {
+            confirmFeeOption(pendingFeeOption.id, selectedFeeTokenAddress);
+        }
+    }, [pendingFeeOption, selectedFeeTokenAddress]);
+    (0, react_1.useEffect)(() => {
+        setIsBackButtonEnabled(!showConfirmation);
+    }, [showConfirmation, setIsBackButtonEnabled]);
+    const nativeTokenInfo = (0, connect_1.getNativeTokenInfoByChainId)(chainId, chains);
+    const isPending = isPendingBalances;
+    if (isPending) {
+        return null;
+    }
+    const decimals = tokenBalance?.tokenMetadata?.decimals || 0;
+    const name = tokenBalance?.tokenMetadata?.name || 'Unknown';
+    const imageUrl = tokenBalance?.tokenMetadata?.image || tokenBalance?.contractInfo?.logoURI || '';
+    const amountToSendFormatted = amount === '' ? '0' : amount;
+    const amountRaw = (0, viem_1.parseUnits)(amountToSendFormatted, decimals);
+    const insufficientFunds = amountRaw > BigInt(tokenBalance?.balance || '0');
+    const isNonZeroAmount = amountRaw > 0n;
+    const handleChangeAmount = (ev) => {
+        const { value } = ev.target;
+        // Prevent value from having more decimals than the token supports
+        const formattedValue = (0, utils_1.limitDecimals)(value, decimals);
+        setAmount(formattedValue);
+    };
+    const handleSubtractOne = () => {
+        amountInputRef.current?.focus();
+        const decrementedAmount = Number(amount) - 1;
+        const newAmount = Math.max(decrementedAmount, 0).toString();
+        setAmount(newAmount);
+    };
+    const handleAddOne = () => {
+        amountInputRef.current?.focus();
+        const incrementedAmount = Number(amount) + 1;
+        const maxAmount = Number((0, viem_1.formatUnits)(BigInt(tokenBalance?.balance || 0), decimals));
+        const newAmount = Math.min(incrementedAmount, maxAmount).toString();
+        setAmount(newAmount);
+    };
+    const handleMax = () => {
+        amountInputRef.current?.focus();
+        const maxAmount = (0, viem_1.formatUnits)(BigInt(tokenBalance?.balance || 0), decimals).toString();
+        setAmount(maxAmount);
+    };
+    const handlePaste = async () => {
+        const result = await navigator.clipboard.readText();
+        setToAddress(result);
+    };
+    const handleToAddressClear = () => {
+        setToAddress('');
+    };
+    const handleSendClick = async (e) => {
+        e.preventDefault();
+        setIsCheckingFeeOptions(true);
+        const sendAmount = (0, viem_1.parseUnits)(amountToSendFormatted, decimals);
+        let transaction;
+        switch (contractType) {
+            case 'ERC721':
+                transaction = {
+                    to: tokenBalance.contractAddress,
+                    data: (0, viem_1.encodeFunctionData)({
+                        abi: constants_1.ERC_721_ABI,
+                        functionName: 'safeTransferFrom',
+                        args: [accountAddress, toAddress, tokenId]
+                    })
+                };
+                break;
+            case 'ERC1155':
+            default:
+                transaction = {
+                    to: tokenBalance.contractAddress,
+                    data: (0, viem_1.encodeFunctionData)({
+                        abi: constants_1.ERC_1155_ABI,
+                        functionName: 'safeBatchTransferFrom',
+                        args: [accountAddress, toAddress, [tokenId], [(0, viem_1.toHex)(sendAmount)], new Uint8Array()]
+                    })
+                };
+        }
+        // Check fee options before showing confirmation
+        const feeOptionsResult = await checkFeeOptions({
+            transactions: [transaction],
+            chainId
+        });
+        setFeeOptions(feeOptionsResult?.feeOptions
+            ? {
+                options: feeOptionsResult.feeOptions,
+                chainId
+            }
+            : undefined);
+        setShowConfirmation(true);
+        setIsCheckingFeeOptions(false);
+    };
+    const executeTransaction = async () => {
+        if (!isCorrectChainId && isConnectorSequenceBased) {
+            switchChain({ chainId });
+        }
+        const sendAmount = (0, viem_1.parseUnits)(amountToSendFormatted, decimals);
+        const txOptions = {
+            onSettled: (result) => {
+                setIsBackButtonEnabled(true);
+                if (result) {
+                    setNavigation({
+                        location: 'home'
+                    });
+                }
+                setIsSendTxnPending(false);
+            }
+        };
+        switch (contractType) {
+            case 'ERC721':
+                analytics?.track({
+                    event: 'SEND_TRANSACTION_REQUEST',
+                    props: {
+                        walletClient: connector?._wallet?.id || 'unknown',
+                        source: 'sequence-kit/wallet'
+                    }
+                });
+                setIsSendTxnPending(true);
+                // _from, _to, _id
+                sendTransaction({
+                    to: tokenBalance.contractAddress,
+                    data: (0, viem_1.encodeFunctionData)({
+                        abi: constants_1.ERC_721_ABI,
+                        functionName: 'safeTransferFrom',
+                        args: [accountAddress, toAddress, tokenId]
+                    }),
+                    gas: null
+                }, txOptions);
+                break;
+            case 'ERC1155':
+            default:
+                analytics?.track({
+                    event: 'SEND_TRANSACTION_REQUEST',
+                    props: {
+                        walletClient: connector?._wallet?.id || 'unknown',
+                        source: 'sequence-kit/wallet'
+                    }
+                });
+                setIsSendTxnPending(true);
+                // _from, _to, _ids, _amounts, _data
+                sendTransaction({
+                    to: tokenBalance.contractAddress,
+                    data: (0, viem_1.encodeFunctionData)({
+                        abi: constants_1.ERC_1155_ABI,
+                        functionName: 'safeBatchTransferFrom',
+                        args: [accountAddress, toAddress, [tokenId], [(0, viem_1.toHex)(sendAmount)], new Uint8Array()]
+                    }),
+                    gas: null
+                }, txOptions);
+        }
+    };
+    const maxAmount = (0, viem_1.formatUnits)(BigInt(tokenBalance?.balance || 0), decimals).toString();
+    const isMinimum = Number(amount) === 0;
+    const isMaximum = Number(amount) >= Number(maxAmount);
+    return ((0, jsx_runtime_1.jsxs)("form", { className: "flex p-5 pt-3 gap-2 flex-col", style: {
+            marginTop: constants_1.HEADER_HEIGHT
+        }, onSubmit: handleSendClick, children: [!showConfirmation && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex bg-background-secondary rounded-xl p-4 gap-2 flex-col", children: [(0, jsx_runtime_1.jsx)(SendItemInfo_1.SendItemInfo, { imageUrl: imageUrl, showSquareImage: true, decimals: decimals, name: name, symbol: '', balance: tokenBalance?.balance || '0', chainId: chainId }), (0, jsx_runtime_1.jsx)(design_system_1.NumericInput, { ref: amountInputRef, name: "amount", value: amount, onChange: handleChangeAmount, disabled: !showAmountControls, controls: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: showAmountControls && ((0, jsx_runtime_1.jsxs)("div", { className: "flex gap-2", children: [(0, jsx_runtime_1.jsx)(design_system_1.Button, { disabled: isMinimum, size: "xs", onClick: handleSubtractOne, leftIcon: design_system_1.SubtractIcon }), (0, jsx_runtime_1.jsx)(design_system_1.Button, { disabled: isMaximum, size: "xs", onClick: handleAddOne, leftIcon: design_system_1.AddIcon }), (0, jsx_runtime_1.jsx)(design_system_1.Button, { className: "shrink-0", size: "xs", shape: "square", label: "Max", onClick: handleMax, "data-id": "maxCoin" })] })) }) }), insufficientFunds && ((0, jsx_runtime_1.jsx)(design_system_1.Text, { className: "mt-2", variant: "normal", color: "negative", asChild: true, children: (0, jsx_runtime_1.jsx)("div", { children: "Insufficient Balance" }) }))] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex bg-background-secondary rounded-xl p-4 gap-2 flex-col", children: [(0, jsx_runtime_1.jsx)(design_system_1.Text, { variant: "normal", color: "muted", children: "To" }), (0, utils_1.isEthAddress)(toAddress) ? ((0, jsx_runtime_1.jsxs)(design_system_1.Card, { className: "flex w-full flex-row justify-between items-center", clickable: true, onClick: handleToAddressClear, style: { height: '52px' }, children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex flex-row justify-center items-center gap-2", children: [(0, jsx_runtime_1.jsx)(design_system_1.GradientAvatar, { size: "sm", address: toAddress }), (0, jsx_runtime_1.jsx)(design_system_1.Text, { color: "primary", variant: "normal", children: `0x${(0, connect_1.truncateAtMiddle)(toAddress.substring(2), 10)}` })] }), (0, jsx_runtime_1.jsx)(design_system_1.CloseIcon, { className: "text-white", size: "sm" })] })) : ((0, jsx_runtime_1.jsx)(design_system_1.TextInput, { value: toAddress, onChange: ev => setToAddress(ev.target.value), placeholder: `${nativeTokenInfo.name} Address (0x...)`, name: "to-address", "data-1p-ignore": true, controls: (0, jsx_runtime_1.jsx)(design_system_1.Button, { className: "shrink-0", size: "xs", shape: "square", label: "Paste", onClick: handlePaste, "data-id": "to-address", leftIcon: design_system_1.CopyIcon }) }))] }), showSwitchNetwork && ((0, jsx_runtime_1.jsxs)("div", { className: "mt-3", children: [(0, jsx_runtime_1.jsx)(design_system_1.Text, { className: "mb-2", variant: "small", color: "negative", children: "The wallet is connected to the wrong network. Please switch network before proceeding" }), (0, jsx_runtime_1.jsx)(design_system_1.Button, { className: "mt-2 w-full", variant: "primary", size: "lg", type: "button", label: "Switch Network", onClick: () => switchChain({ chainId }), disabled: isCorrectChainId })] })), (0, jsx_runtime_1.jsx)("div", { className: "flex items-center justify-center", style: { height: '52px' }, children: isCheckingFeeOptions ? ((0, jsx_runtime_1.jsx)(design_system_1.Spinner, {})) : ((0, jsx_runtime_1.jsx)(design_system_1.Button, { className: "text-primary mt-3 w-full", variant: "primary", size: "lg", type: "submit", disabled: !isNonZeroAmount ||
+                                !(0, utils_1.isEthAddress)(toAddress) ||
+                                insufficientFunds ||
+                                (!isCorrectChainId && !isConnectorSequenceBased), label: "Send", rightIcon: design_system_1.ChevronRightIcon })) })] })), showConfirmation && ((0, jsx_runtime_1.jsx)(TransactionConfirmation_1.TransactionConfirmation, { name: name, symbol: "", imageUrl: imageUrl, amount: amountToSendFormatted, toAddress: toAddress, showSquareImage: true, chainId: chainId, balance: tokenBalance?.balance || '0', decimals: decimals, feeOptions: feeOptions, onSelectFeeOption: feeTokenAddress => {
+                    setSelectedFeeTokenAddress(feeTokenAddress);
+                }, isLoading: isSendTxnPending, onConfirm: () => {
+                    executeTransaction();
+                }, onCancel: () => {
+                    setShowConfirmation(false);
+                } }))] }));
+};
+exports.SendCollectible = SendCollectible;
+//# sourceMappingURL=SendCollectible.js.map