> ## Documentation Index
> Fetch the complete documentation index at: https://docs.getpara.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Flutter SDK Overview

> Para Flutter SDK documentation for cross-platform wallet integration

export const Card = ({imgUrl, title, description, href, horizontal = false, newTab = false}) => {
  const [isHovered, setIsHovered] = useState(false);
  const handleClick = e => {
    e.preventDefault();
    if (newTab) {
      window.open(href, '_blank', 'noopener,noreferrer');
    } else {
      window.location.href = href;
    }
  };
  return <div className={`not-prose relative my-2 p-[1px] rounded-xl transition-all duration-300 ${isHovered ? 'bg-gradient-to-r from-[#FF4E00] to-[#874AE3]' : 'bg-gray-200'}`} onMouseEnter={() => setIsHovered(true)} onMouseLeave={() => setIsHovered(false)}>
      <a href={href} onClick={handleClick} className={`not-prose flex ${horizontal ? 'flex-row' : 'flex-col'} font-normal h-full bg-white overflow-hidden w-full cursor-pointer rounded-[11px] no-underline`}>
        {imgUrl && <div className={`relative overflow-hidden flex-shrink-0 ${horizontal ? 'w-[30%] rounded-l-[11px]' : 'w-full'}`} onClick={e => e.stopPropagation()}>
            <img src={imgUrl} alt={title} className="w-full h-full object-cover pointer-events-none select-none" draggable="false" />
            <div className="absolute inset-0 pointer-events-none" />
          </div>}
        <div className={`flex-grow px-6 py-5 ${horizontal ? 'w-[70%]' : 'w-full'} flex flex-col ${horizontal && imgUrl ? 'justify-center' : 'justify-start'}`}>
          {title && <h2 className="font-semibold text-base text-gray-800 m-0">{title}</h2>}
          {description && <div className={`font-normal text-gray-500 re leading-6 ${horizontal || !imgUrl ? 'mt-0' : 'mt-1'}`}>
              <p className="m-0 text-xs">{description}</p>
            </div>}
        </div>
      </a>
    </div>;
};

Para Flutter SDK eliminates the complexity of blockchain integration by providing a unified interface for wallet creation, authentication, and multi-chain transactions across iOS and Android.

## Quick Start

```dart main.dart theme={null}
// Initialize Para
final para = Para.fromConfig(
  config: ParaConfig(
    apiKey: 'YOUR_API_KEY',
    environment: Environment.beta,
  ),
  appScheme: 'yourapp',
);

// Prepare a web authentication session for browser-based auth flows
final webAuthSession = FlutterWebAuthSession(
  callbackUrlScheme: 'yourapp',
);

// Authenticate user
final authState = await para.initiateAuthFlow(
  auth: Auth.email('user@example.com'),
);

switch (authState.stage) {
  case AuthStage.login:
    // One‑Click Login when a loginUrl is provided
    final url = authState.loginUrl;
    if (url?.isNotEmpty == true) {
      await para.presentAuthUrl(
        url: url!,
        webAuthenticationSession: webAuthSession,
      );

      await para.waitForLogin();
      await para.touchSession();
      await para.fetchWallets();
      break;
    }

    // Fallback to other login methods
    await para.handleLogin(
      authState: authState,
      webAuthenticationSession: webAuthSession,
    );
    break;

  case AuthStage.verify:
    // Show OTP UI, then continue the flow
    break;

  case AuthStage.signup:
    // Call handleSignup if passkeys/passwords are enabled
    break;
}
```

## Sign Transactions

```dart transaction_handler.dart theme={null}
// Get wallets
final wallets = await para.fetchWallets();
final evmWallet = wallets.firstWhere((w) => w.type == WalletType.evm && w.id != null);
final solanaWallet = wallets.firstWhere((w) => w.type == WalletType.solana && w.id != null);

// EVM transaction
final evmTx = EVMTransaction(
  to: '0x742d35Cc6634C0532925a3b844Bc9e7595f6E2c0',
  value: '1000000000000000', // 0.001 ETH in wei
  chainId: '11155111',
  type: 2, // EIP-1559
);

final evmResult = await para.signTransaction(
  walletId: evmWallet.id!,
  transaction: evmTx.toJson(),
  chainId: '11155111',
  rpcUrl: 'https://rpc.ankr.com/eth_sepolia',
);

if (evmResult is SuccessfulSignatureResult) {
  final signedTx = evmResult.signedTransaction;
  // Broadcast signedTx using your RPC client
}

// Solana message signing
final solanaResult = await para.signMessage(
  walletId: solanaWallet.id!,
  message: 'Hello, Solana!',
);

if (solanaResult is SuccessfulSignatureResult) {
  final signature = solanaResult.signedTransaction; // Base64 signature string
}
```

## Next Steps

<CardGroup cols={3}>
  <Card title="Set Up the SDK" imgUrl="/images/v3/framework-flutter.png" href="/v3/flutter/setup" description="Install Para SDK and configure your Flutter project" />

  <Card title="Sign a Transaction" imgUrl="/images/v3/network-evm.png" href="/v3/flutter/guides/evm#signing-transactions" description="Jump straight to signing your first transaction" />

  <Card title="View Full Example" imgUrl="/images/v3/framework-flutter.png" href="https://github.com/getpara/examples-hub/tree/3.0.0/mobile/with-flutter" description="Complete Flutter app with authentication and signing" />
</CardGroup>
