@cookill/wallet-adapter 2.5.3 → 3.0.0

package/README.md

@@ -1,26 +1,32 @@
-# @cookill/wallet-adapter v2.4.0
+# @cookill/wallet-adapter v3.0.0
 
 Official wallet adapter for **Sheep Wallet** on Rialo blockchain.
 
+## 🚀 What's New in v3.0
+
+- **Anti-freeze architecture**: All provider calls wrapped with timeouts
+- **Clean separation**: Core (vanilla JS) vs React layer
+- **Silent auto-connect**: Uses `checkSession()` instead of `connect()` for session restoration
+- **No more hangs**: 20-second timeout on connection, 30-second on operations
+
 ## Installation
 
 ```bash
 npm install @cookill/wallet-adapter
+# or
+pnpm add @cookill/wallet-adapter
+# or
+yarn add @cookill/wallet-adapter
 ```
 
-## Quick Start
+## Quick Start (React)
 
 ```tsx
-import {
-  WalletProvider,
-  ConnectButton,
-  WalletErrorBoundary,
-} from '@cookill/wallet-adapter/react';
+import { WalletProvider, ConnectButton, WalletErrorBoundary } from '@cookill/wallet-adapter/react';
 
 function App() {
   return (
     <WalletErrorBoundary>
-      {/* WalletProvider will render a default WalletModal automatically */}
       <WalletProvider network="devnet" autoConnect>
         <ConnectButton />
         <YourDApp />
@@ -30,77 +36,130 @@ function App() {
 }
 ```
 
-## Troubleshooting (Connect stuck)
-
-If clicking **Connect** does nothing or feels "stuck":
-
-- Make sure your dApp is wrapped in `<WalletProvider>` (and ideally `<WalletErrorBoundary>`).
-- Prefer `useConnectWallet().connect` (opens the modal) instead of `connectDirect`.
-- The modal is rendered automatically by `WalletProvider`.
-
 ## React Hooks
 
 ### useWallet
 
 ```tsx
-const {
-  // State
-  connected,           // boolean
-  connecting,          // boolean
-  accounts,            // WalletAccount[]
-  activeAccount,       // WalletAccount | null
-  network,             // 'mainnet' | 'testnet' | 'devnet' | 'localnet'
-  chainId,             // 'rialo:devnet' etc
-  balance,             // string | null (in kelvins)
-  error,               // Error | null
-  
-  // Actions
-  connect,             // () => Promise<WalletAccount[]>
-  disconnect,          // () => Promise<void>
-  switchNetwork,       // (network) => Promise<void>
-  refreshBalance,      // () => Promise<void>
-  
-  // Transactions
-  signMessage,         // (message: string) => Promise<SignedMessage>
-  signTransaction,     // (tx) => Promise<string>
-  sendTransaction,     // (tx) => Promise<TransactionResult>
-  signAndSendTransaction, // (tx) => Promise<TransactionResult>
-  
-  // Modal
-  isModalOpen,
-  openModal,
-  closeModal,
-} = useWallet();
-```
-
-### useConnectWallet
+import { useWallet } from '@cookill/wallet-adapter/react';
+
+function MyComponent() {
+  const {
+    // State
+    connected,           // boolean
+    connecting,          // boolean
+    activeAccount,       // WalletAccount | null
+    state,               // Full state object
+    chainId,             // 'rialo:devnet' etc
+    isInstalled,         // boolean
+    
+    // Actions
+    connect,             // () => Promise<WalletAccount[]>
+    disconnect,          // () => Promise<void>
+    switchNetwork,       // (network) => Promise<void>
+    refreshBalance,      // () => Promise<void>
+    
+    // Transactions
+    signMessage,         // (message: string) => Promise<SignedMessage>
+    signTransaction,     // (tx) => Promise<string>
+    sendTransaction,     // (tx) => Promise<TransactionResult>
+    signAndSendTransaction, // (tx) => Promise<TransactionResult>
+    
+    // Modal
+    openModal,
+    closeModal,
+  } = useWallet();
 
-```tsx
-const { 
-  connect,       // Opens modal (recommended)
-  connectDirect, // Calls provider directly
-  connecting, 
-  isInstalled, 
-  error,
-  openModal,
-} = useConnectWallet();
-
-<button onClick={connect}>Connect Wallet</button>
+  return (
+    <div>
+      {connected ? (
+        <p>Connected: {activeAccount?.address}</p>
+      ) : (
+        <button onClick={connect}>Connect</button>
+      )}
+    </div>
+  );
+}
 ```
 
-### Other Hooks
+### Specialized Hooks
 
 ```tsx
+// Connection
+const { connect, connecting, isInstalled, error } = useConnectWallet();
+const { disconnect, connected } = useDisconnectWallet();
 const connected = useIsConnected();
+
+// Account
 const account = useActiveAccount();
 const accounts = useAccounts();
-const { balance, formatted, refresh } = useBalance();
-const { network, chainId, config } = useNetwork();
-const { switchNetwork, switching, error, currentNetwork } = useSwitchNetwork();
-const { disconnect, connected } = useDisconnectWallet();
-const { sign, signing, signature, error, address } = useSignMessage();
-const { sign, signing, signature, error } = useSignTransaction();
-const { send, sending, txHash, error, reset } = useSendTransaction();
+
+// Balance
+const { balance, refresh } = useBalance();
+
+// Network
+const { network, chainId } = useNetwork();
+const { switchNetwork, network } = useSwitchNetwork();
+
+// Transactions
+const { signMessage, connected } = useSignMessage();
+const { sendTransaction, signAndSendTransaction, connected } = useSendTransaction();
+```
+
+## Vanilla JavaScript
+
+```typescript
+import { SheepWallet, isInstalled, formatBalance } from '@cookill/wallet-adapter';
+
+// Check if installed
+if (!isInstalled()) {
+  console.log('Please install Sheep Wallet');
+}
+
+// Create wallet instance
+const wallet = new SheepWallet();
+
+// Connect (with built-in timeout)
+try {
+  const accounts = await wallet.connect();
+  console.log('Connected:', accounts[0].address);
+} catch (error) {
+  console.error('Connection failed:', error.message);
+}
+
+// Get balance
+const balance = await wallet.getBalance();
+console.log('Balance:', formatBalance(balance), 'RLO');
+
+// Sign message
+const signed = await wallet.signMessage('Hello!');
+
+// Send transaction
+const tx = await wallet.signAndSendTransaction({
+  to: 'RecipientAddress...',
+  value: '1000000000', // 1 RLO in kelvins
+});
+console.log('TX Hash:', tx.hash);
+
+// Silent session check (for auto-connect, never triggers approval)
+const existingSession = await wallet.checkSession();
+if (existingSession) {
+  console.log('Session restored:', existingSession[0].address);
+}
+```
+
+## Direct Provider Access
+
+```typescript
+// Access window.rialo directly
+if (window.rialo) {
+  const accounts = await window.rialo.connect();
+  const balance = await window.rialo.getBalance();
+  const tx = await window.rialo.signAndSendTransaction({
+    to: 'RecipientAddress...',
+    value: '1000000000',
+  });
+}
 ```
 
 ## Components
@@ -114,22 +173,17 @@ const { send, sending, txHash, error, reset } = useSendTransaction();
   showAddress={true}
   showBalance={false}
   className="my-button"
+  style={{ backgroundColor: '#6EB9A8' }}
 />
 ```
 
-### WalletModal
-
-```tsx
-<WalletModal title="Select Wallet" className="my-modal" />
-```
-
 ### WalletProvider
 
 ```tsx
 <WalletProvider
-  network="devnet"
-  autoConnect={true}
-  wallets={[customWallet]}
+  network="devnet"        // 'mainnet' | 'testnet' | 'devnet' | 'localnet'
+  autoConnect={true}      // Restore session silently on mount
+  wallets={[customWallet]} // Additional wallets to show
   onConnect={(accounts) => console.log('Connected', accounts)}
   onDisconnect={() => console.log('Disconnected')}
   onNetworkChange={(network) => console.log('Network:', network)}
@@ -144,22 +198,19 @@ const { send, sending, txHash, error, reset } = useSendTransaction();
 ```tsx
 import { 
   WalletErrorBoundary,
-  SafeWalletProvider,
   ApprovalPending,
   LoadingSpinner,
   ConnectionStatus,
 } from '@cookill/wallet-adapter/react';
 
-// Option 1: Error Boundary wrapper
-<WalletErrorBoundary fallback={<CustomError />} onError={logError}>
+// Error Boundary
+<WalletErrorBoundary 
+  fallback={<CustomError />} 
+  onError={(error, info) => logError(error)}
+>
   <WalletProvider>...</WalletProvider>
 </WalletErrorBoundary>
 
-// Option 2: SafeWalletProvider (includes boundary)
-<SafeWalletProvider network="devnet" errorFallback={<CustomError />}>
-  ...
-</SafeWalletProvider>
-
 // Loading states
 <ApprovalPending
   title="Waiting for Approval"
@@ -172,44 +223,9 @@ import {
 
 <ConnectionStatus status="connecting" />
 <ConnectionStatus status="approving" message="Check your wallet" />
-<ConnectionStatus status="signing" />
-<ConnectionStatus status="success" />
 <ConnectionStatus status="error" onRetry={() => connect()} />
 ```
 
-## Vanilla JavaScript
-
-```typescript
-import { RialoWallet, isRialoInstalled, formatBalance } from '@cookill/wallet-adapter';
-
-const wallet = new RialoWallet();
-
-if (!isRialoInstalled()) {
-  console.log('Please install Sheep Wallet');
-}
-
-const accounts = await wallet.connect();
-const balance = await wallet.getBalance();
-const signed = await wallet.signMessage('Hello!');
-const tx = await wallet.signAndSendTransaction({
-  to: 'RecipientAddress...',
-  value: '1000000000', // 1 RLO in kelvins
-});
-```
-
-## Direct Provider Access
-
-```typescript
-if (window.rialo) {
-  const accounts = await window.rialo.connect();
-  const balance = await window.rialo.getBalance();
-  const tx = await window.rialo.signAndSendTransaction({
-    to: 'RecipientAddress...',
-    value: '1000000000',
-  });
-}
-```
-
 ## Networks
 
 | Network  | Chain ID        | RPC URL                         | Symbol |
@@ -229,9 +245,9 @@ import {
   isValidAddress,     // (address) => boolean
   toChainId,          // (network) => 'rialo:devnet'
   fromChainId,        // (chainId) => 'devnet'
-  isRialoInstalled,   // () => boolean
-  getRialoProvider,   // () => RialoProvider | undefined
-  waitForRialoProvider, // (timeout?) => Promise<RialoProvider>
+  isInstalled,        // () => boolean
+  getProvider,        // () => RialoProvider | undefined
+  waitForProvider,    // (timeout?) => Promise<RialoProvider | undefined>
   NETWORKS,           // Network configurations
 } from '@cookill/wallet-adapter';
 ```
@@ -249,10 +265,50 @@ import type {
   WalletInfo,
   RialoProvider,
   RialoNetwork,
-  RialoChain,
+  RialoChainId,
 } from '@cookill/wallet-adapter';
 ```
 
+## Troubleshooting
+
+### Connection hangs / freezes
+
+v3.0 has built-in 20-second timeout. If connection still hangs:
+
+1. Make sure extension is installed and unlocked
+2. Check if popup was blocked by browser
+3. Try refreshing the page
+
+### Auto-connect not working
+
+Auto-connect uses `checkSession()` which only restores **existing** sessions silently.
+It won't trigger the approval popup. User must explicitly call `connect()` first time.
+
+### Modal not opening
+
+The `WalletProvider` renders the modal automatically. If you see issues:
+
+```tsx
+// Make sure you're inside WalletProvider
+const { openModal } = useWallet();
+openModal(); // This should work
+```
+
+## Migration from v2.x
+
+```diff
+// Imports are the same
+import { WalletProvider, ConnectButton } from '@cookill/wallet-adapter/react';
+
+// Hook usage is the same
+const { connect, connected } = useWallet();
+
+// Main changes:
+// - connect() now has 20s timeout built-in
+// - autoConnect uses checkSession() (silent, never triggers popup)
+// - New SheepWallet class for vanilla JS (replaces RialoWallet)
+```
+
 ## License
 
 MIT

package/dist/ErrorBoundary.cjs

@@ -1,107 +1,70 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
 var react = require('react');
 var jsxRuntime = require('react/jsx-runtime');
 
-// src/ErrorBoundary.tsx
 var WalletErrorBoundary = class extends react.Component {
-  constructor() {
-    super(...arguments);
-    this.state = {
-      hasError: false,
-      error: null
-    };
-    this.handleRetry = () => {
+  constructor(props) {
+    super(props);
+    this.handleReset = () => {
       this.setState({ hasError: false, error: null });
     };
+    this.state = { hasError: false, error: null };
   }
   static getDerivedStateFromError(error) {
     return { hasError: true, error };
   }
   componentDidCatch(error, errorInfo) {
-    console.error("[WalletAdapter] Error caught by boundary:", error, errorInfo);
+    console.error("[WalletErrorBoundary] Caught error:", error, errorInfo);
     this.props.onError?.(error, errorInfo);
   }
   render() {
-    if (this.state.hasError) {
-      if (this.props.fallback) {
-        return this.props.fallback;
+    if (this.state.hasError && this.state.error) {
+      const { fallback } = this.props;
+      if (typeof fallback === "function") {
+        return fallback(this.state.error, this.handleReset);
+      }
+      if (fallback) {
+        return fallback;
       }
-      return /* @__PURE__ */ jsxRuntime.jsxs(
-        "div",
-        {
-          style: {
-            padding: "20px",
-            borderRadius: "12px",
-            border: "1px solid #fee2e2",
-            backgroundColor: "#fef2f2",
-            textAlign: "center"
-          },
-          children: [
-            /* @__PURE__ */ jsxRuntime.jsx(
-              "div",
-              {
-                style: {
-                  width: "48px",
-                  height: "48px",
-                  margin: "0 auto 12px",
-                  borderRadius: "50%",
-                  backgroundColor: "#fecaca",
-                  display: "flex",
-                  alignItems: "center",
-                  justifyContent: "center"
-                },
-                children: /* @__PURE__ */ jsxRuntime.jsxs(
-                  "svg",
-                  {
-                    width: "24",
-                    height: "24",
-                    viewBox: "0 0 24 24",
-                    fill: "none",
-                    stroke: "#dc2626",
-                    strokeWidth: "2",
-                    strokeLinecap: "round",
-                    strokeLinejoin: "round",
-                    children: [
-                      /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "10" }),
-                      /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "12", y1: "8", x2: "12", y2: "12" }),
-                      /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "12", y1: "16", x2: "12.01", y2: "16" })
-                    ]
-                  }
-                )
-              }
-            ),
-            /* @__PURE__ */ jsxRuntime.jsx("h3", { style: { margin: "0 0 8px", fontSize: "16px", fontWeight: 600, color: "#991b1b" }, children: "Wallet Connection Error" }),
-            /* @__PURE__ */ jsxRuntime.jsx("p", { style: { margin: "0 0 16px", fontSize: "14px", color: "#b91c1c" }, children: this.state.error?.message || "Something went wrong" }),
-            /* @__PURE__ */ jsxRuntime.jsx(
-              "button",
-              {
-                onClick: this.handleRetry,
-                style: {
-                  padding: "8px 16px",
-                  borderRadius: "8px",
-                  border: "none",
-                  backgroundColor: "#dc2626",
-                  color: "white",
-                  cursor: "pointer",
-                  fontSize: "14px",
-                  fontWeight: 500
-                },
-                children: "Try Again"
-              }
-            )
-          ]
-        }
-      );
+      return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: {
+        padding: "20px",
+        margin: "10px",
+        backgroundColor: "#1a1a2e",
+        border: "1px solid #ef4444",
+        borderRadius: "12px",
+        color: "#ffffff"
+      }, children: [
+        /* @__PURE__ */ jsxRuntime.jsx("h3", { style: { color: "#ef4444", margin: "0 0 12px 0" }, children: "Wallet Connection Error" }),
+        /* @__PURE__ */ jsxRuntime.jsx("p", { style: { color: "#94a3b8", margin: "0 0 16px 0", fontSize: "14px" }, children: this.state.error.message }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "button",
+          {
+            onClick: this.handleReset,
+            style: {
+              padding: "8px 16px",
+              backgroundColor: "#6EB9A8",
+              color: "#011B29",
+              border: "none",
+              borderRadius: "8px",
+              cursor: "pointer",
+              fontWeight: 500
+            },
+            children: "Try Again"
+          }
+        )
+      ] });
     }
     return this.props.children;
   }
 };
-var ErrorBoundary_default = WalletErrorBoundary;
+function withWalletErrorBoundary(WrappedComponent, fallback) {
+  return function WithErrorBoundary(props) {
+    return /* @__PURE__ */ jsxRuntime.jsx(WalletErrorBoundary, { fallback, children: /* @__PURE__ */ jsxRuntime.jsx(WrappedComponent, { ...props }) });
+  };
+}
 
 exports.WalletErrorBoundary = WalletErrorBoundary;
-exports.default = ErrorBoundary_default;
+exports.withWalletErrorBoundary = withWalletErrorBoundary;
 //# sourceMappingURL=ErrorBoundary.cjs.map
 //# sourceMappingURL=ErrorBoundary.cjs.map

package/dist/ErrorBoundary.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/ErrorBoundary.tsx"],"names":["Component","jsxs","jsx"],"mappings":"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","file":"ErrorBoundary.cjs","sourcesContent":["/**\n * @cookill/wallet-adapter - Error Boundary\n * Prevents blank screens from uncaught errors\n */\n\nimport React, { Component, ErrorInfo, ReactNode } from 'react';\n\ninterface Props {\n  children: ReactNode;\n  fallback?: ReactNode;\n  onError?: (error: Error, errorInfo: ErrorInfo) => void;\n}\n\ninterface State {\n  hasError: boolean;\n  error: Error | null;\n}\n\nexport class WalletErrorBoundary extends Component<Props, State> {\n  public state: State = {\n    hasError: false,\n    error: null,\n  };\n\n  public static getDerivedStateFromError(error: Error): State {\n    return { hasError: true, error };\n  }\n\n  public componentDidCatch(error: Error, errorInfo: ErrorInfo) {\n    console.error('[WalletAdapter] Error caught by boundary:', error, errorInfo);\n    this.props.onError?.(error, errorInfo);\n  }\n\n  private handleRetry = () => {\n    this.setState({ hasError: false, error: null });\n  };\n\n  public render() {\n    if (this.state.hasError) {\n      if (this.props.fallback) {\n        return this.props.fallback;\n      }\n\n      return (\n        <div\n          style={{\n            padding: '20px',\n            borderRadius: '12px',\n            border: '1px solid #fee2e2',\n            backgroundColor: '#fef2f2',\n            textAlign: 'center',\n          }}\n        >\n          <div\n            style={{\n              width: '48px',\n              height: '48px',\n              margin: '0 auto 12px',\n              borderRadius: '50%',\n              backgroundColor: '#fecaca',\n              display: 'flex',\n              alignItems: 'center',\n              justifyContent: 'center',\n            }}\n          >\n            <svg\n              width=\"24\"\n              height=\"24\"\n              viewBox=\"0 0 24 24\"\n              fill=\"none\"\n              stroke=\"#dc2626\"\n              strokeWidth=\"2\"\n              strokeLinecap=\"round\"\n              strokeLinejoin=\"round\"\n            >\n              <circle cx=\"12\" cy=\"12\" r=\"10\" />\n              <line x1=\"12\" y1=\"8\" x2=\"12\" y2=\"12\" />\n              <line x1=\"12\" y1=\"16\" x2=\"12.01\" y2=\"16\" />\n            </svg>\n          </div>\n          <h3 style={{ margin: '0 0 8px', fontSize: '16px', fontWeight: 600, color: '#991b1b' }}>\n            Wallet Connection Error\n          </h3>\n          <p style={{ margin: '0 0 16px', fontSize: '14px', color: '#b91c1c' }}>\n            {this.state.error?.message || 'Something went wrong'}\n          </p>\n          <button\n            onClick={this.handleRetry}\n            style={{\n              padding: '8px 16px',\n              borderRadius: '8px',\n              border: 'none',\n              backgroundColor: '#dc2626',\n              color: 'white',\n              cursor: 'pointer',\n              fontSize: '14px',\n              fontWeight: 500,\n            }}\n          >\n            Try Again\n          </button>\n        </div>\n      );\n    }\n\n    return this.props.children;\n  }\n}\n\nexport default WalletErrorBoundary;\n"]}
+{"version":3,"sources":["../src/react/ErrorBoundary.tsx"],"names":["Component","jsxs","jsx"],"mappings":";;;;;AAkBO,IAAM,mBAAA,GAAN,cAAkCA,eAAA,CAA2C;AAAA,EAClF,YAAY,KAAA,EAAiC;AAC3C,IAAA,KAAA,CAAM,KAAK,CAAA;AAab,IAAA,IAAA,CAAA,WAAA,GAAc,MAAY;AACxB,MAAA,IAAA,CAAK,SAAS,EAAE,QAAA,EAAU,KAAA,EAAO,KAAA,EAAO,MAAM,CAAA;AAAA,IAChD,CAAA;AAdE,IAAA,IAAA,CAAK,KAAA,GAAQ,EAAE,QAAA,EAAU,KAAA,EAAO,OAAO,IAAA,EAAK;AAAA,EAC9C;AAAA,EAEA,OAAO,yBAAyB,KAAA,EAAqB;AACnD,IAAA,OAAO,EAAE,QAAA,EAAU,IAAA,EAAM,KAAA,EAAM;AAAA,EACjC;AAAA,EAEA,iBAAA,CAAkB,OAAc,SAAA,EAA4B;AAC1D,IAAA,OAAA,CAAQ,KAAA,CAAM,qCAAA,EAAuC,KAAA,EAAO,SAAS,CAAA;AACrE,IAAA,IAAA,CAAK,KAAA,CAAM,OAAA,GAAU,KAAA,EAAO,SAAS,CAAA;AAAA,EACvC;AAAA,EAMA,MAAA,GAAoB;AAClB,IAAA,IAAI,IAAA,CAAK,KAAA,CAAM,QAAA,IAAY,IAAA,CAAK,MAAM,KAAA,EAAO;AAC3C,MAAA,MAAM,EAAE,QAAA,EAAS,GAAI,IAAA,CAAK,KAAA;AAE1B,MAAA,IAAI,OAAO,aAAa,UAAA,EAAY;AAClC,QAAA,OAAO,QAAA,CAAS,IAAA,CAAK,KAAA,CAAM,KAAA,EAAO,KAAK,WAAW,CAAA;AAAA,MACpD;AAEA,MAAA,IAAI,QAAA,EAAU;AACZ,QAAA,OAAO,QAAA;AAAA,MACT;AAEA,MAAA,uBACEC,eAAA,CAAC,SAAI,KAAA,EAAO;AAAA,QACV,OAAA,EAAS,MAAA;AAAA,QACT,MAAA,EAAQ,MAAA;AAAA,QACR,eAAA,EAAiB,SAAA;AAAA,QACjB,MAAA,EAAQ,mBAAA;AAAA,QACR,YAAA,EAAc,MAAA;AAAA,QACd,KAAA,EAAO;AAAA,OACT,EACE,QAAA,EAAA;AAAA,wBAAAC,cAAA,CAAC,IAAA,EAAA,EAAG,OAAO,EAAE,KAAA,EAAO,WAAW,MAAA,EAAQ,YAAA,IAAgB,QAAA,EAAA,yBAAA,EAEvD,CAAA;AAAA,wBACAA,cAAA,CAAC,GAAA,EAAA,EAAE,KAAA,EAAO,EAAE,OAAO,SAAA,EAAW,MAAA,EAAQ,YAAA,EAAc,QAAA,EAAU,MAAA,EAAO,EAClE,QAAA,EAAA,IAAA,CAAK,KAAA,CAAM,MAAM,OAAA,EACpB,CAAA;AAAA,wBACAA,cAAA;AAAA,UAAC,QAAA;AAAA,UAAA;AAAA,YACC,SAAS,IAAA,CAAK,WAAA;AAAA,YACd,KAAA,EAAO;AAAA,cACL,OAAA,EAAS,UAAA;AAAA,cACT,eAAA,EAAiB,SAAA;AAAA,cACjB,KAAA,EAAO,SAAA;AAAA,cACP,MAAA,EAAQ,MAAA;AAAA,cACR,YAAA,EAAc,KAAA;AAAA,cACd,MAAA,EAAQ,SAAA;AAAA,cACR,UAAA,EAAY;AAAA,aACd;AAAA,YACD,QAAA,EAAA;AAAA;AAAA;AAED,OAAA,EACF,CAAA;AAAA,IAEJ;AAEA,IAAA,OAAO,KAAK,KAAA,CAAM,QAAA;AAAA,EACpB;AACF;AAKO,SAAS,uBAAA,CACd,kBACA,QAAA,EACA;AACA,EAAA,OAAO,SAAS,kBAAkB,KAAA,EAAU;AAC1C,IAAA,sCACG,mBAAA,EAAA,EAAoB,QAAA,EACnB,yCAAC,gBAAA,EAAA,EAAkB,GAAG,OAAO,CAAA,EAC/B,CAAA;AAAA,EAEJ,CAAA;AACF","file":"ErrorBoundary.cjs","sourcesContent":["/**\n * @cookill/wallet-adapter/react v3.0.0\n * Error Boundary for wallet integration\n */\n\nimport React, { Component, type ReactNode, type ErrorInfo } from 'react';\n\nexport interface WalletErrorBoundaryProps {\n  children: ReactNode;\n  fallback?: ReactNode | ((error: Error, reset: () => void) => ReactNode);\n  onError?: (error: Error, errorInfo: ErrorInfo) => void;\n}\n\ninterface State {\n  hasError: boolean;\n  error: Error | null;\n}\n\nexport class WalletErrorBoundary extends Component<WalletErrorBoundaryProps, State> {\n  constructor(props: WalletErrorBoundaryProps) {\n    super(props);\n    this.state = { hasError: false, error: null };\n  }\n\n  static getDerivedStateFromError(error: Error): State {\n    return { hasError: true, error };\n  }\n\n  componentDidCatch(error: Error, errorInfo: ErrorInfo): void {\n    console.error('[WalletErrorBoundary] Caught error:', error, errorInfo);\n    this.props.onError?.(error, errorInfo);\n  }\n\n  handleReset = (): void => {\n    this.setState({ hasError: false, error: null });\n  };\n\n  render(): ReactNode {\n    if (this.state.hasError && this.state.error) {\n      const { fallback } = this.props;\n      \n      if (typeof fallback === 'function') {\n        return fallback(this.state.error, this.handleReset);\n      }\n      \n      if (fallback) {\n        return fallback;\n      }\n\n      return (\n        <div style={{\n          padding: '20px',\n          margin: '10px',\n          backgroundColor: '#1a1a2e',\n          border: '1px solid #ef4444',\n          borderRadius: '12px',\n          color: '#ffffff',\n        }}>\n          <h3 style={{ color: '#ef4444', margin: '0 0 12px 0' }}>\n            Wallet Connection Error\n          </h3>\n          <p style={{ color: '#94a3b8', margin: '0 0 16px 0', fontSize: '14px' }}>\n            {this.state.error.message}\n          </p>\n          <button\n            onClick={this.handleReset}\n            style={{\n              padding: '8px 16px',\n              backgroundColor: '#6EB9A8',\n              color: '#011B29',\n              border: 'none',\n              borderRadius: '8px',\n              cursor: 'pointer',\n              fontWeight: 500,\n            }}\n          >\n            Try Again\n          </button>\n        </div>\n      );\n    }\n\n    return this.props.children;\n  }\n}\n\n/**\n * HOC to wrap components with error boundary\n */\nexport function withWalletErrorBoundary<P extends object>(\n  WrappedComponent: React.ComponentType<P>,\n  fallback?: WalletErrorBoundaryProps['fallback']\n) {\n  return function WithErrorBoundary(props: P) {\n    return (\n      <WalletErrorBoundary fallback={fallback}>\n        <WrappedComponent {...props} />\n      </WalletErrorBoundary>\n    );\n  };\n}\n\nexport default WalletErrorBoundary;\n"]}

package/dist/ErrorBoundary.d.cts

@@ -1,21 +1,25 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import React, { Component, ReactNode, ErrorInfo } from 'react';
 
-interface Props {
+interface WalletErrorBoundaryProps {
     children: ReactNode;
-    fallback?: ReactNode;
+    fallback?: ReactNode | ((error: Error, reset: () => void) => ReactNode);
     onError?: (error: Error, errorInfo: ErrorInfo) => void;
 }
 interface State {
     hasError: boolean;
     error: Error | null;
 }
-declare class WalletErrorBoundary extends Component<Props, State> {
-    state: State;
+declare class WalletErrorBoundary extends Component<WalletErrorBoundaryProps, State> {
+    constructor(props: WalletErrorBoundaryProps);
     static getDerivedStateFromError(error: Error): State;
     componentDidCatch(error: Error, errorInfo: ErrorInfo): void;
-    private handleRetry;
-    render(): string | number | boolean | Iterable<React.ReactNode> | react_jsx_runtime.JSX.Element | null | undefined;
+    handleReset: () => void;
+    render(): ReactNode;
 }
+/**
+ * HOC to wrap components with error boundary
+ */
+declare function withWalletErrorBoundary<P extends object>(WrappedComponent: React.ComponentType<P>, fallback?: WalletErrorBoundaryProps['fallback']): (props: P) => react_jsx_runtime.JSX.Element;
 
-export { WalletErrorBoundary, WalletErrorBoundary as default };
+export { WalletErrorBoundary, type WalletErrorBoundaryProps, withWalletErrorBoundary };

package/dist/ErrorBoundary.d.ts

@@ -1,21 +1,25 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import React, { Component, ReactNode, ErrorInfo } from 'react';
 
-interface Props {
+interface WalletErrorBoundaryProps {
     children: ReactNode;
-    fallback?: ReactNode;
+    fallback?: ReactNode | ((error: Error, reset: () => void) => ReactNode);
     onError?: (error: Error, errorInfo: ErrorInfo) => void;
 }
 interface State {
     hasError: boolean;
     error: Error | null;
 }
-declare class WalletErrorBoundary extends Component<Props, State> {
-    state: State;
+declare class WalletErrorBoundary extends Component<WalletErrorBoundaryProps, State> {
+    constructor(props: WalletErrorBoundaryProps);
     static getDerivedStateFromError(error: Error): State;
     componentDidCatch(error: Error, errorInfo: ErrorInfo): void;
-    private handleRetry;
-    render(): string | number | boolean | Iterable<React.ReactNode> | react_jsx_runtime.JSX.Element | null | undefined;
+    handleReset: () => void;
+    render(): ReactNode;
 }
+/**
+ * HOC to wrap components with error boundary
+ */
+declare function withWalletErrorBoundary<P extends object>(WrappedComponent: React.ComponentType<P>, fallback?: WalletErrorBoundaryProps['fallback']): (props: P) => react_jsx_runtime.JSX.Element;
 
-export { WalletErrorBoundary, WalletErrorBoundary as default };
+export { WalletErrorBoundary, type WalletErrorBoundaryProps, withWalletErrorBoundary };