Skip to main content
KeyStone Elements is a set of packages that let platforms integrate settlement functionality into their applications with minimal code. Think Stripe Elements, but for settlement orchestration.

​
Packages

PackageWhat it doesWhen to use
@keystoneos/reactReact hooks and provider (headless)You want full UI control with your own components
@keystoneos/react-uiPre-built styled componentsYou want drop-in widgets that just work
@keystoneos/elements-coreFramework-agnostic coreYou’re not using React, or building a custom integration
@keystoneos/nodeServer-side helpersCreating session tokens, handling webhooks

​
Integration Tiers

Elements supports three integration patterns depending on how your platform handles custody and signing:

​
Tier 1: View-Only

Your backend handles everything via the SDK and webhooks. The frontend only displays settlement status. 
import { KeystoneProvider, useSettlement } from '@keystoneos/react';

function SettlementTracker({ id }) {
  const { settlement, isLoading } = useSettlement(id);
  if (isLoading) return <Spinner />;
  return <div>State: {settlement.state}</div>;
}

​
Tier 2: Interactive + Custody (Most Common)

The widget collects user decisions (confirm, deposit). Deposit execution routes through your backend to a custody provider like Fireblocks or BitGo. 
<KeystoneProvider
  sessionToken={token}
  actionDelegates={{
    onDepositRequired: async (leg, info) => {
      // Your backend submits to Fireblocks
      const result = await fetch('/api/deposit', {
        method: 'POST',
        body: JSON.stringify(info),
      }).then(r => r.json());
      return { txHash: result.txHash };
    },
  }}
>
  <YourSettlementUI />
</KeystoneProvider>

​
Tier 3: Full Self-Service

End-users connect their own wallets. The widget handles on-chain transactions directly via wagmi. 
<WagmiProvider config={wagmiConfig}>
  <KeystoneProvider sessionToken={token}>
    <YourSettlementUI />
  </KeystoneProvider>
</WagmiProvider>

​
How It Works

Getting Started

Install and set up your first integration in 5 minutes.

Hooks Reference

Full API reference for all React hooks.