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

# useKeystone

> Access the raw KeyStone Elements context for advanced use cases.

## Import

```tsx theme={null}
import { useKeystone } from '@keystoneos/react';
```

## Usage

```tsx theme={null}
function CustomApiCall() {
  const { baseUrl, tokenManager } = useKeystone();

  const fetchCustomData = async () => {
    const authHeader = await tokenManager.getAuthHeader();
    const res = await fetch(`${baseUrl}/v1/some-endpoint`, {
      headers: { Authorization: authHeader },
    });
    return res.json();
  };

  // ...
}
```

## Parameters

None. Must be used inside a `<KeystoneProvider>`.

## Return Type

```typescript theme={null}
interface KeystoneContextValue {
  baseUrl: string;
  tokenManager: SessionTokenManager;
  eventBus: EventBus;
  depositOrchestrator: DepositOrchestrator;
  actionDelegates?: ActionDelegates;
}
```

| Property              | Type                           | Description                                       |
| --------------------- | ------------------------------ | ------------------------------------------------- |
| `baseUrl`             | `string`                       | The KeyStone API base URL.                        |
| `tokenManager`        | `SessionTokenManager`          | Manages session token lifecycle and auth headers. |
| `eventBus`            | `EventBus`                     | Real-time event subscription system.              |
| `depositOrchestrator` | `DepositOrchestrator`          | Manages multi-step deposit flows.                 |
| `actionDelegates`     | `ActionDelegates \| undefined` | Action delegates from the provider.               |

## When to Use

Most integrations should use the higher-level hooks (`useSettlement`, `useDeposit`, etc.). Use `useKeystone` when you need:

* Direct API calls not covered by existing hooks
* Custom event subscriptions on the event bus
* Access to the token manager for auth headers
* Building your own hooks on top of the core primitives

## Example: Custom API Call

```tsx theme={null}
function useCustomEndpoint(path: string) {
  const { baseUrl, tokenManager } = useKeystone();
  const [data, setData] = useState(null);

  useEffect(() => {
    (async () => {
      const auth = await tokenManager.getAuthHeader();
      const res = await fetch(`${baseUrl}${path}`, {
        headers: { Authorization: auth },
      });
      setData(await res.json());
    })();
  }, [baseUrl, path, tokenManager]);

  return data;
}
```

## Example: Custom Event Subscription

```tsx theme={null}
function useCustomEvents(settlementId: string) {
  const { eventBus } = useKeystone();

  useEffect(() => {
    const unsubscribe = eventBus.subscribe(settlementId, (event) => {
      console.log('Settlement event:', event);
    });
    return unsubscribe;
  }, [settlementId, eventBus]);
}
```