npm install @solana/connector @lazorkit/wallet

# For pre-built UI components (shadcn/ui)
npx shadcn@latest add button dialog \
  dropdown-menu avatar badge

import { useEffect } from 'react';
import { AppProvider } from '@solana/connector/react';
import { getDefaultConfig } from '@solana/connector/headless';
import { registerLazorkitWallet } from '@lazorkit/wallet';

function App() {
  // Register LazorKit on mount
  useEffect(() => {
    registerLazorkitWallet({
      rpcUrl: 'https://api.devnet.solana.com',
      portalUrl: 'https://portal.lazor.sh',
      paymasterConfig: {
        paymasterUrl: 'https://kora.devnet.lazorkit.com',
      },
      clusterSimulation: 'devnet',
    });
  }, []);

  const config = getDefaultConfig({
    appName: 'My App',
    network: 'devnet',
  });

  return (
    <AppProvider connectorConfig={config}>
      <YourApp />
    </AppProvider>
  );
}

import {
  useConnector,
} from '@solana/connector/react';
import { useTransactionSigner } from '@solana/connector';
import { Connection, Transaction, PublicKey } from '@solana/web3.js';

function MyComponent() {
  const { signer } = useTransactionSigner();
  const { disconnect } = useConnector();

  const handleSend = async () => {
    const connection = new Connection('https://api.devnet.solana.com');
    const publicKey = new PublicKey(walletAdapter.publicKey);

    // Build transaction with web3.js
    const { blockhash, lastValidBlockHeight } = await connection
      .getLatestBlockhash('finalized');

    const transaction = new Transaction({
      feePayer: publicKey,
      blockhash,
      lastValidBlockHeight,
    });
    transaction.add(...instructions);

    // Send via useTransactionSigner (for Solana Web3.js)
    const signature = await signer.signAndSendTransaction(transaction);
  };

  return (
    <div>
      <ConnectButton />
      {(
        <button onClick={handleSend}>Send TX</button>
      )}
    </div>
  );
}