Wallet Error

PreviousNext

Error handling components for wallet interactions.

Documentation

Installation

pnpm dlx shadcn@latest add @wallet-kit/error

Usage

import { WalletErrorDialog, NO_ERROR } from "@/components/wallet/error"
import { useState } from "react"
 
export default function Demo() {
  const [error, setError] = useState(NO_ERROR)
 
  return (
    <>
      {error !== NO_ERROR && (
        <WalletErrorDialog error={error} onClose={() => setError(NO_ERROR)} />
      )}
    </>
  )
}

API Reference

WalletErrorDialog

A dialog component that displays wallet-related errors in a user-friendly format.

Props

PropTypeDefaultDescription
errorsymbol-Required. The error symbol to display. Use NO_ERROR to hide the dialog.
onClose() => void-Required. Callback fired when the dialog is closed.

Behavior

  • Displays error messages in a modal dialog
  • Shows error name and message from Wallet Standard errors
  • Provides a close button to dismiss the error
  • Automatically handles error formatting

NO_ERROR

A constant symbol representing no error state. Use this to reset the error state.

Examples

Basic Error Handling

import { WalletErrorDialog, NO_ERROR } from "@/components/wallet/error"
import { useState } from "react"
 
export default function WalletComponent() {
  const [error, setError] = useState(NO_ERROR)
 
  const handleWalletAction = async () => {
    try {
      // Wallet operation
    } catch (err) {
      setError(err as symbol)
    }
  }
 
  return (
    <>
      <button onClick={handleWalletAction}>Connect</button>
      {error !== NO_ERROR && (
        <WalletErrorDialog 
          error={error} 
          onClose={() => setError(NO_ERROR)} 
        />
      )}
    </>
  )
}

With Error from Wallet Standard

import { WalletErrorDialog, NO_ERROR } from "@/components/wallet/error"
import { WalletStandardError } from "@wallet-standard/core"
 
export default function Demo() {
  const [error, setError] = useState(NO_ERROR)
 
  const handleError = (walletError: WalletStandardError) => {
    setError(walletError as symbol)
  }
 
  return (
    <>
      {error !== NO_ERROR && (
        <WalletErrorDialog 
          error={error} 
          onClose={() => setError(NO_ERROR)} 
        />
      )}
    </>
  )
}
  • Errors are displayed using Wallet Standard error format
  • The dialog uses shadcn/ui's AlertDialog component
  • Always provide an onClose handler to reset the error state
  • Use NO_ERROR constant to represent no error state

Last updated 11/21/2025