Skip to content

React SDK

Import React integrations from @seams/sdk/react and place consumers inside a SeamsWebProvider or SeamsContextProvider.

tsx
import { SeamsWebProvider, SeamsAuthMenu, useSeams } from '@seams/sdk/react';

Providers and hooks

ExportPurpose
SeamsWebProviderCreates and owns the SDK client for a React subtree.
SeamsContextProviderSupplies an existing context value.
useSeamsReads the current SDK capabilities and lifecycle state.
useDeviceLinkingRuns the approving-device side of a link flow.
useGoogleEmailOtpWalletAuthCoordinates the public Google and email OTP wallet flow.
useNearClient, useAccountInput, useQRCameraFocused integration helpers.

Components

The stable surface includes SeamsAuthMenu, HostedSeamsAuthMenu, AccountMenuButton, ProfileSettingsButton, QRCodeScanner, and ShowQRCode. Use the hosted auth menu when the wallet-origin boundary owns the complete auth experience.

Focused entrypoints are available for applications that need smaller or SSR-specific imports:

  • @seams/sdk/react/provider;
  • @seams/sdk/react/profile;
  • @seams/sdk/react/seams-auth-menu plus /client, /skeleton, and /preload;
  • @seams/sdk/react/hosted-seams-auth-menu;
  • @seams/sdk/react/styles.

Appearance

Theme, useTheme, LIGHT_TOKENS, DARK_TOKENS, and SHAPE_PRESETS style app-owned React surfaces. Send the corresponding appearance into the browser SDK for wallet-iframe surfaces. See the theming guide.

React boundary

Keep credential prompts and signing actions attached to a direct user action. Render loading, success, cancelled, and recoverable failure branches from the result union instead of collapsing them into a Boolean.