@lazerkit/webauthn-client

A powerful, flexible WebAuthn client SDK for passwordless authentication and non-custodial wallet management. Built on WebAuthn standards with support for passkey-based authentication on multiple blockchains.

Features

✨ Passkey Authentication - Biometric security meets Web3. No passwords, no seed phrases—just seamless access with your device.

🔐 Non-Custodial Wallets - Users maintain complete control. Wallets are created instantly with passkey authentication.

⚡ Multi-Chain Support - Built-in support for Ethereum, Mantle, Base, and more EVM-compatible networks.

🛡️ Enterprise Security - Military-grade encryption with WebAuthn standard compliance.

🎨 UI Components - Ready-to-use React components or build your own with the headless SDK.

Installation

npm install @lazerkit/webauthn-client

Quick Start

Using the UI Provider

import { LazerkitProvider, useLazerkit } from '@lazerkit/webauthn-client';

function App() {
  const walletConfig = {
    rpcUrl: 'https://rpc.sepolia.mantle.xyz/',
    chainId: 5003,
    rpName: 'My App',
    rpId: window.location.hostname,
  };

  return (
    <LazerkitProvider rpcConfig={walletConfig}>
      <YourWalletComponent />
    </LazerkitProvider>
  );
}

function YourWalletComponent() {
  const {
    isLoggedIn,
    currentUser,
    walletInfo,
    balance,
    createPasskeyWallet,
    unlockPasskeyWallet,
    register,
  } = useLazerkit();

  return (
    <>
      {!isLoggedIn ? (
        <button onClick={() => register('username')}>
          Create Wallet
        </button>
      ) : (
        <div>
          <p>User: {currentUser?.username}</p>
          <p>Address: {walletInfo?.address}</p>
          <p>Balance: {balance} MNT</p>
        </div>
      )}
    </>
  );
}

Using the Headless SDK

import { WebAuthnClient } from '@lazerkit/webauthn-client/headless';

const client = new WebAuthnClient();

// Check support
if (WebAuthnClient.isSupported()) {
  const options = {
    challenge: new Uint8Array(32),
    rp: { name: 'My App', id: 'example.com' },
    user: {
      id: new Uint8Array(16),
      name: '[email protected]',
      displayName: 'User',
    },
    pubKeyCredParams: [
      { type: 'public-key', alg: -7 },
      { type: 'public-key', alg: -257 },
    ],
  };

  const credential = await client.register(options);
  console.log('Passkey registered:', credential);
}

API Reference

LazerkitProvider Props

interface PasskeyWalletConfig {
  rpcUrl: string;        // RPC endpoint for blockchain
  chainId?: number;      // Chain ID (default: Ethereum mainnet)
  rpName?: string;       // Relying Party name
  rpId?: string;         // Relying Party ID (defaults to hostname)
  storage?: IStorage;    // Custom storage implementation
  networks?: NetworkConfig[]; // Custom network configs
}

useLazerkit Hook

const {
  // Authentication
  isLoggedIn: boolean;
  currentUser: User | null;
  register: (username: string) => Promise<void>;
  authenticate: (username: string) => Promise<void>;
  logout: () => void;

  // Wallet
  passkeyWallet: PasskeyWallet | null;
  walletInfo: WalletInfo | null;
  balance: string | null;
  isWalletConnected: boolean;
  hasStoredWallet: boolean;

  // Wallet Actions
  createPasskeyWallet: (username: string) => Promise<void>;
  unlockPasskeyWallet: (username?: string) => Promise<void>;
  lockPasskeyWallet: () => void;
  deletePasskeyWallet: () => void;

  // Interactions
  signMessage: (message: string) => Promise<string>;
  sendEthTransaction: (toAddress: string, amountEth: string) => Promise<any>;
  refreshBalance: () => Promise<void>;
} = useLazerkit();

Supported Networks

• Ethereum Mainnet - Chain ID: 1
• Mantle Sepolia - Chain ID: 5003 (recommended for testing)
• Base Sepolia - Chain ID: 84532
• And more EVM-compatible networks

Exports

Main Entry Point

import {
  LazerkitProvider,
  useLazerkit,
  WebAuthnButton,
  WebAuthnModal,
  LazerkitUI,
  PasskeyWallet,
  WalletUI,
} from '@lazerkit/webauthn-client';

Headless SDK

import {
  WebAuthnClient,
  Base64,
  Validation,
  WebAuthnClientError,
  ERROR_CODES,
  ALGORITHMS,
} from '@lazerkit/webauthn-client/headless';

Browser Support

WebAuthn is supported in:

• Chrome 67+
• Firefox 60+
• Safari 13+
• Edge 18+

Check support with:

if (WebAuthnClient.isSupported()) {
  // Use WebAuthn
}

Security Considerations

1. Always use HTTPS in production
2. Validate on the backend - Verify credentials on your server
3. Use consistent RP ID - Ensure RP ID matches your domain
4. Handle errors gracefully - Provide user-friendly error messages
5. Implement rate limiting - Protect against brute force attacks

Contributing

We welcome contributions! Please feel free to submit a Pull Request.

License

MIT License - see LICENSE file for details

Support

For issues, feature requests, or questions:

• GitHub Issues: lazerkitexpo/lazerkit
• Documentation: lazerkit.dev

Changelog

v1.0.0

• Initial release
• Passkey registration and authentication
• Non-custodial wallet support
• Multi-chain EVM support
• React provider and hooks
• UI components