@abstraxn/signer-react 1.0.0

package/dist/src/components/WalletModal/components/ChainSelector.css

@@ -0,0 +1,327 @@
+/* Select Network View */
+.wallet-modal-chain-selector-view {
+  position: relative;
+  width: 100%;
+  height: 100%;
+  min-height: 450px;
+  background: #ffffff;
+  display: flex;
+  flex-direction: column;
+  animation: slideInRight 0.3s ease-out;
+}
+
+@keyframes slideInRight {
+  from { transform: translateX(100%); }
+  to { transform: translateX(0); }
+}
+
+.wallet-modal-chain-selector-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 0;
+  border-bottom: 1px solid #f1f5f9;
+  padding-bottom: 16px;
+  margin-bottom: 16px;
+}
+
+.wallet-modal-chain-selector-back,
+.wallet-modal-chain-selector-close {
+  background: transparent;
+  border: none;
+  cursor: pointer;
+  padding: 8px;
+  border-radius: 8px;
+  color: #64748b;
+  transition: all 0.2s;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  pointer-events: auto;
+  user-select: none;
+  -webkit-user-select: none;
+  width: 36px;
+  height: 36px;
+  flex-shrink: 0;
+}
+
+.wallet-modal-chain-selector-back:hover,
+.wallet-modal-chain-selector-close:hover {
+  background: #f1f5f9;
+  color: #111827;
+}
+
+.wallet-modal-chain-selector-back:active,
+.wallet-modal-chain-selector-close:active {
+  transform: scale(0.95);
+}
+
+.wallet-modal-content .wallet-modal-chain-selector-title {
+  font-size: 18px;
+  font-weight: 500;
+  margin: 0;
+  color: #111827;
+  flex: 1;
+  text-align: center;
+}
+
+.wallet-modal-chain-selector-content {
+  flex: 1;
+  overflow-y: auto;
+  padding: 0;
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+}
+
+/* Custom Scrollbar */
+.wallet-modal-chain-selector-content::-webkit-scrollbar {
+  width: 8px;
+}
+
+.wallet-modal-chain-selector-content::-webkit-scrollbar-track {
+  background: transparent;
+}
+
+.wallet-modal-chain-selector-content::-webkit-scrollbar-thumb {
+  background: #cbd5e1;
+  border-radius: 10px;
+  border: 2px solid transparent;
+  background-clip: content-box;
+}
+
+.wallet-modal-chain-selector-content::-webkit-scrollbar-thumb:hover {
+  background: #94a3b8;
+  background-clip: content-box;
+}
+
+.wallet-modal-theme-dark .wallet-modal-chain-selector-content::-webkit-scrollbar-thumb {
+  background: #475569;
+}
+
+/* Tabs */
+.wallet-modal-chain-tabs {
+  display: flex;
+  gap: 12px;
+}
+
+.wallet-modal-chain-tab {
+  padding: 8px 16px;
+  border-radius: 10px;
+  border: none;
+  background: transparent;
+  cursor: pointer;
+  font-size: 14px;
+  font-weight: 600;
+  color: #64748b;
+  transition: all 0.2s;
+  pointer-events: auto;
+  user-select: none;
+  -webkit-user-select: none;
+}
+
+.wallet-modal-chain-tab:hover {
+  color: #111827;
+}
+
+.wallet-modal-chain-tab.active {
+  background: #f1f5f9;
+  color: #111827;
+}
+
+/* Search */
+.wallet-modal-chain-search-container {
+  position: relative;
+  width: 100%;
+}
+
+.wallet-modal-chain-search-icon {
+  position: absolute;
+  left: 16px;
+  top: 50%;
+  transform: translateY(-50%);
+  color: #94a3b8;
+  pointer-events: none;
+  display: flex;
+}
+
+.wallet-modal-chain-search-input {
+  width: 100%;
+  padding: 12px 16px 12px 48px;
+  border-radius: 12px;
+  border: 1px solid #e2e8f0;
+  background: #ffffff;
+  font-size: 15px;
+  outline: none;
+  transition: all 0.2s;
+  color: #111827;
+  box-sizing: border-box;
+  pointer-events: auto;
+  user-select: text;
+  -webkit-user-select: text;
+}
+
+.wallet-modal-chain-search-input:focus {
+  border-color: #9333ea;
+}
+
+.wallet-modal-chain-search-input::placeholder {
+  color: #94a3b8;
+}
+
+/* List */
+.wallet-modal-chain-list-container {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.wallet-modal-chain-list-header {
+  font-size: 13px;
+  font-weight: 600;
+  color: #94a3b8;
+  text-transform: uppercase;
+  letter-spacing: 0.05em;
+  padding-left: 0;
+}
+
+.wallet-modal-chain-list {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+}
+
+.wallet-modal-chain-item {
+  width: 100%;
+  padding: 10px 12px;
+  border-radius: 12px;
+  border: none;
+  background: transparent;
+  cursor: pointer;
+  transition: all 0.2s;
+  display: flex;
+  align-items: center;
+  gap: 16px;
+  text-align: left;
+  pointer-events: auto;
+  user-select: none;
+  -webkit-user-select: none;
+}
+
+.wallet-modal-chain-item:hover {
+  background: #f8fafc;
+}
+
+.wallet-modal-chain-item.active {
+  background: rgba(147, 51, 234, 0.05);
+}
+
+.wallet-modal-chain-item:active {
+  transform: scale(0.98);
+}
+
+.wallet-modal-chain-item:disabled {
+  opacity: 0.5;
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.wallet-modal-chain-item.switching {
+  opacity: 0.7;
+  pointer-events: none;
+}
+
+.wallet-modal-chain-item-icon-wrapper {
+  position: relative;
+  width: 36px;
+  height: 36px;
+  flex-shrink: 0;
+}
+
+.wallet-modal-chain-item-icon-img {
+  width: 100%;
+  height: 100%;
+  border-radius: 50%;
+  object-fit: cover;
+}
+
+.wallet-modal-chain-item-icon-placeholder {
+  width: 100%;
+  height: 100%;
+  border-radius: 50%;
+  background: #f1f5f9;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-weight: 700;
+  color: #64748b;
+  font-size: 14px;
+}
+
+.wallet-modal-chain-item-status {
+  position: absolute;
+  bottom: -2px;
+  right: -2px;
+  width: 10px;
+  height: 10px;
+  border-radius: 50%;
+  background: #10b981;
+  border: 2px solid #ffffff;
+}
+
+.wallet-modal-chain-item-name {
+  flex: 1;
+  font-size: 16px;
+  font-weight: 600;
+  color: #111827;
+}
+
+.wallet-modal-chain-item-checkmark {
+  color: #10b981;
+  display: flex;
+}
+
+.wallet-modal-chain-no-results {
+  padding: 40px 20px;
+  text-align: center;
+  color: #64748b;
+  font-size: 15px;
+}
+
+/* Dark Theme Support */
+.wallet-modal-theme-dark.wallet-modal-chain-selector-view {
+  background: #1a1a1a;
+}
+
+.wallet-modal-theme-dark .wallet-modal-chain-selector-header {
+  border-color: #2a2a2a;
+}
+
+.wallet-modal-content.wallet-modal-theme-dark .wallet-modal-chain-selector-title {
+  color: #ffffff;
+}
+
+.wallet-modal-theme-dark .wallet-modal-chain-tab.active {
+  background: #2a2a2a;
+  color: #ffffff;
+}
+
+.wallet-modal-theme-dark .wallet-modal-chain-search-input {
+  background: #2a2a2a;
+  border-color: #3a3a3a;
+  color: #ffffff;
+}
+
+.wallet-modal-theme-dark .wallet-modal-chain-item:hover {
+  background: #2a2a2a;
+}
+
+.wallet-modal-theme-dark .wallet-modal-chain-item-name {
+  color: #ffffff;
+}
+
+.wallet-modal-theme-dark .wallet-modal-chain-item-status {
+  border-color: #1a1a1a;
+}
+
+

package/dist/src/components/WalletModal/components/ChainSelector.d.ts

@@ -0,0 +1,11 @@
+import type { ChainData } from "../../../chains";
+import "./ChainSelector.css";
+export interface ChainSelectorProps {
+    currentChain: ChainData | null;
+    availableChains: ChainData[];
+    onChainSelect: (chainId: number) => Promise<void> | void;
+    onClose: () => void;
+    theme?: "light" | "dark";
+    isOpen: boolean;
+}
+export declare function ChainSelector({ currentChain, availableChains, onChainSelect, onClose, theme, isOpen, }: ChainSelectorProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/src/components/WalletModal/components/ChainSelector.js

@@ -0,0 +1,75 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Chain Selector Component
+ */
+import { useState, useEffect, useMemo } from "react";
+import "./ChainSelector.css";
+export function ChainSelector({ currentChain, availableChains, onChainSelect, onClose, theme = "dark", isOpen, }) {
+    const [searchQuery, setSearchQuery] = useState("");
+    const [filterType, setFilterType] = useState("all");
+    const [isSwitching, setIsSwitching] = useState(false);
+    const [switchingChainId, setSwitchingChainId] = useState(null);
+    // Reset state when opened
+    useEffect(() => {
+        if (isOpen) {
+            setSearchQuery("");
+            setFilterType("all");
+            setIsSwitching(false);
+            setSwitchingChainId(null);
+        }
+    }, [isOpen]);
+    const filteredChains = useMemo(() => {
+        return availableChains.filter((chain) => {
+            const matchesSearch = chain.displayName.toLowerCase().includes(searchQuery.toLowerCase()) ||
+                chain.id.toString().includes(searchQuery);
+            const matchesFilter = filterType === "all" ||
+                (filterType === "mainnet" && !chain.isTestnet) ||
+                (filterType === "testnet" && chain.isTestnet);
+            return matchesSearch && matchesFilter;
+        });
+    }, [availableChains, searchQuery, filterType]);
+    if (!isOpen)
+        return null;
+    return (_jsxs("div", { className: `wallet-modal-chain-selector-view wallet-modal-theme-${theme}`, onClick: (e) => e.stopPropagation(), children: [_jsxs("div", { className: "wallet-modal-chain-selector-header", children: [_jsx("button", { className: "wallet-modal-chain-selector-back", onClick: (e) => {
+                            e.stopPropagation();
+                            onClose();
+                        }, children: _jsx("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: _jsx("polyline", { points: "15 18 9 12 15 6" }) }) }), _jsx("h2", { className: "wallet-modal-chain-selector-title", children: "Select Network" }), _jsx("button", { className: "wallet-modal-chain-selector-close", onClick: (e) => {
+                            e.stopPropagation();
+                            onClose();
+                        }, children: _jsxs("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [_jsx("line", { x1: "18", y1: "6", x2: "6", y2: "18" }), _jsx("line", { x1: "6", y1: "6", x2: "18", y2: "18" })] }) })] }), _jsxs("div", { className: "wallet-modal-chain-selector-content", children: [_jsxs("div", { className: "wallet-modal-chain-tabs", children: [_jsx("button", { className: `wallet-modal-chain-tab ${filterType === "all" ? "active" : ""}`, onClick: (e) => {
+                                    e.stopPropagation();
+                                    setFilterType("all");
+                                }, children: "All" }), _jsx("button", { className: `wallet-modal-chain-tab ${filterType === "mainnet" ? "active" : ""}`, onClick: (e) => {
+                                    e.stopPropagation();
+                                    setFilterType("mainnet");
+                                }, children: "Mainnets" }), _jsx("button", { className: `wallet-modal-chain-tab ${filterType === "testnet" ? "active" : ""}`, onClick: (e) => {
+                                    e.stopPropagation();
+                                    setFilterType("testnet");
+                                }, children: "Testnets" })] }), _jsxs("div", { className: "wallet-modal-chain-search-container", children: [_jsx("div", { className: "wallet-modal-chain-search-icon", children: _jsxs("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [_jsx("circle", { cx: "11", cy: "11", r: "8" }), _jsx("line", { x1: "21", y1: "21", x2: "16.65", y2: "16.65" })] }) }), _jsx("input", { type: "text", className: "wallet-modal-chain-search-input", placeholder: "Search Network or Chain ID", value: searchQuery, onChange: (e) => {
+                                    e.stopPropagation();
+                                    setSearchQuery(e.target.value);
+                                }, onClick: (e) => e.stopPropagation(), autoFocus: true })] }), _jsxs("div", { className: "wallet-modal-chain-list-container", children: [_jsx("div", { className: "wallet-modal-chain-list-header", children: filterType === "all"
+                                    ? "ALL NETWORKS"
+                                    : filterType === "mainnet"
+                                        ? "MAINNETS"
+                                        : "TESTNETS" }), _jsxs("div", { className: "wallet-modal-chain-list", children: [filteredChains.map((chain) => (_jsxs("button", { className: `wallet-modal-chain-item ${currentChain?.id === chain.id ? "active" : ""} ${isSwitching && switchingChainId === chain.id
+                                            ? "switching"
+                                            : ""}`, disabled: isSwitching, onClick: async (e) => {
+                                            e.stopPropagation();
+                                            if (isSwitching)
+                                                return;
+                                            try {
+                                                setIsSwitching(true);
+                                                setSwitchingChainId(chain.id);
+                                                await onChainSelect(chain.id);
+                                            }
+                                            catch (error) {
+                                                console.error("Chain switch error:", error);
+                                            }
+                                            finally {
+                                                setIsSwitching(false);
+                                                setSwitchingChainId(null);
+                                            }
+                                        }, children: [_jsxs("div", { className: "wallet-modal-chain-item-icon-wrapper", children: [chain.iconUrl ? (_jsx("img", { src: chain.iconUrl, alt: chain.displayName, className: "wallet-modal-chain-item-icon-img" })) : (_jsx("div", { className: "wallet-modal-chain-item-icon-placeholder", children: chain.displayName.charAt(0) })), currentChain?.id === chain.id && (_jsx("span", { className: "wallet-modal-chain-item-status" }))] }), _jsx("span", { className: "wallet-modal-chain-item-name", children: chain.displayName }), currentChain?.id === chain.id && (_jsx("div", { className: "wallet-modal-chain-item-checkmark", children: _jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "3", strokeLinecap: "round", strokeLinejoin: "round", children: _jsx("polyline", { points: "20 6 9 17 4 12" }) }) }))] }, chain.id))), filteredChains.length === 0 && (_jsxs("div", { className: "wallet-modal-chain-no-results", children: ["No networks found for \"", searchQuery, "\""] }))] })] })] })] }));
+}
+//# sourceMappingURL=ChainSelector.js.map

package/dist/src/components/WalletModal/components/ChainSelector.js.map

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

package/dist/src/components/WalletModal/components/ExportKeyModal.css

@@ -0,0 +1,134 @@
+/* Export Key Modal Styles - extracted from WalletModal.css */
+.wallet-modal-export-key-body {
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+}
+
+.wallet-modal-export-key-warning {
+  display: flex;
+  align-items: flex-start;
+  gap: 12px;
+  padding: 12px 14px;
+  border-radius: 12px;
+  border: 1px solid;
+}
+
+.wallet-modal-theme-light .wallet-modal-export-key-warning {
+  background: #f3f4f6;
+  border-color: #e5e7eb;
+}
+
+.wallet-modal-theme-dark .wallet-modal-export-key-warning {
+  background: #2a2a2a;
+  border-color: #3a3a3a;
+}
+
+.wallet-modal-export-key-warning-icon {
+  flex-shrink: 0;
+  margin-top: 2px;
+  color: #2563eb;
+}
+
+.wallet-modal-theme-dark .wallet-modal-export-key-warning-icon {
+  color: #60a5fa;
+}
+
+.wallet-modal-export-key-warning-text {
+  min-width: 0;
+}
+
+.wallet-modal-export-key-warning-title {
+  font-size: 13px;
+  font-weight: 700;
+  line-height: 1.35;
+}
+
+.wallet-modal-export-key-warning-subtitle {
+  margin-top: 2px;
+  font-size: 12px;
+  line-height: 1.35;
+  opacity: 0.85;
+}
+
+.wallet-modal-theme-light .wallet-modal-export-key-warning-title,
+.wallet-modal-theme-light .wallet-modal-export-key-warning-subtitle {
+  color: #111827;
+}
+
+.wallet-modal-theme-dark .wallet-modal-export-key-warning-title,
+.wallet-modal-theme-dark .wallet-modal-export-key-warning-subtitle {
+  color: #ffffff;
+}
+
+.wallet-modal-export-key-field {
+  width: 100%;
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  padding: 12px 14px;
+  border-radius: 12px;
+  border: 1px solid;
+  box-sizing: border-box;
+}
+
+.wallet-modal-theme-light .wallet-modal-export-key-field {
+  background: #ffffff;
+  border-color: #e5e7eb;
+}
+
+.wallet-modal-theme-dark .wallet-modal-export-key-field {
+  background: #2a2a2a;
+  border-color: #3a3a3a;
+}
+
+.wallet-modal-export-key-value {
+  flex: 1;
+  min-width: 0;
+  font-family: 'GeistMono', 'SF Mono', monospace;
+  font-size: 13px;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.wallet-modal-theme-light .wallet-modal-export-key-value {
+  color: #111827;
+}
+
+.wallet-modal-theme-dark .wallet-modal-export-key-value {
+  color: #ffffff;
+}
+
+.wallet-modal-export-key-inline-copy {
+  background: transparent;
+  border: none;
+  cursor: pointer;
+  padding: 6px;
+  border-radius: 8px;
+  transition: background 0.15s ease;
+  color: inherit;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+}
+
+.wallet-modal-theme-light .wallet-modal-export-key-inline-copy {
+  color: #6b7280;
+}
+
+.wallet-modal-theme-dark .wallet-modal-export-key-inline-copy {
+  color: #9ca3af;
+}
+
+.wallet-modal-theme-light .wallet-modal-export-key-inline-copy:hover {
+  background: rgba(17, 24, 39, 0.06);
+  color: #111827;
+}
+
+.wallet-modal-theme-dark .wallet-modal-export-key-inline-copy:hover {
+  background: rgba(255, 255, 255, 0.08);
+  color: #ffffff;
+}

package/dist/src/components/WalletModal/components/ExportKeyModal.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Export Key Modal Component
+ */
+import { type CSSProperties } from 'react';
+import './ExportKeyModal.css';
+import '../../../WalletModal.css';
+export interface ExportKeyModalProps {
+    isOpen: boolean;
+    onClose: () => void;
+    privateKey: string;
+    theme?: 'light' | 'dark';
+    style?: CSSProperties;
+}
+export declare function ExportKeyModal({ isOpen, onClose, privateKey, theme, style, }: ExportKeyModalProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/src/components/WalletModal/components/ExportKeyModal.js

@@ -0,0 +1,26 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Export Key Modal Component
+ */
+import { useState, useCallback } from 'react';
+import './ExportKeyModal.css';
+import '../../../WalletModal.css';
+import { FiInfo } from 'react-icons/fi';
+export function ExportKeyModal({ isOpen, onClose, privateKey, theme = 'dark', style, }) {
+    const [copied, setCopied] = useState(false);
+    const handleCopy = useCallback(() => {
+        if (privateKey) {
+            navigator.clipboard.writeText(privateKey);
+            setCopied(true);
+            setTimeout(() => setCopied(false), 2000);
+        }
+    }, [privateKey]);
+    const handleClose = useCallback(() => {
+        setCopied(false);
+        onClose();
+    }, [onClose]);
+    if (!isOpen)
+        return null;
+    return (_jsx("div", { className: `wallet-modal-overlay wallet-modal-theme-${theme}`, onClick: handleClose, style: style, children: _jsxs("div", { className: `wallet-modal-content wallet-modal-theme-${theme} wallet-modal-export-key`, onClick: (e) => e.stopPropagation(), children: [_jsxs("div", { className: "wallet-modal-receive-header", children: [_jsx("button", { className: "wallet-modal-back", onClick: handleClose, children: _jsx("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", children: _jsx("path", { d: "M12.5 15L7.5 10L12.5 5", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }) }), _jsx("h2", { className: "wallet-modal-receive-title", children: "Export Private Key" }), _jsx("button", { className: "wallet-modal-close", onClick: handleClose, "aria-label": "Close", children: _jsx("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", children: _jsx("path", { d: "M18 6L6 18M6 6L18 18", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }) })] }), _jsxs("div", { className: "wallet-modal-export-key-body", children: [_jsxs("div", { className: "wallet-modal-export-key-warning", role: "note", children: [_jsx("div", { className: "wallet-modal-export-key-warning-icon", "aria-hidden": "true", children: _jsx(FiInfo, { size: 18 }) }), _jsxs("div", { className: "wallet-modal-export-key-warning-text", children: [_jsx("div", { className: "wallet-modal-export-key-warning-title", children: "Don't share your private key with anyone." }), _jsx("div", { className: "wallet-modal-export-key-warning-subtitle", children: "This private key grants full access to your wallet and all held assets." })] })] }), _jsxs("div", { className: "wallet-modal-export-key-field", children: [_jsx("div", { className: "wallet-modal-export-key-value", title: privateKey, children: privateKey }), _jsx("button", { className: "wallet-modal-export-key-inline-copy", onClick: handleCopy, type: "button", "aria-label": "Copy private key", children: _jsxs("svg", { width: "18", height: "18", viewBox: "0 0 16 16", fill: "none", children: [_jsx("path", { d: "M5.5 3.5H3.5C2.67157 3.5 2 4.17157 2 5V12.5C2 13.3284 2.67157 14 3.5 14H11C11.8284 14 12.5 13.3284 12.5 12.5V10.5", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }), _jsx("path", { d: "M5.5 3.5C5.5 2.67157 6.17157 2 7 2H12.5C13.3284 2 14 2.67157 14 3.5V9C14 9.82843 13.3284 10.5 12.5 10.5H7C6.17157 10.5 5.5 9.82843 5.5 9V3.5Z", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })] }) })] }), _jsx("button", { className: "wallet-modal-primary-btn", onClick: handleCopy, type: "button", children: copied ? "Copied" : "Copy" })] })] }) }));
+}
+//# sourceMappingURL=ExportKeyModal.js.map

package/dist/src/components/WalletModal/components/ExportKeyModal.js.map

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