@celerispro/sdk-browser

Browser SDK for Celeris auth, credits, checkout, and sponsored Sui actions.

Install

npm install @celerispro/sdk-browser @mysten/sui

React Usage

"use client";

import { Transaction } from "@mysten/sui/transactions";
import { useCelerisBrowserClient } from "@celerispro/sdk-browser/react";

const PACKAGE_ID = "0x...";
const APP_STATE_OBJECT_ID = "0x...";

export function HelloCelerisButton({ username }: { username: string }) {
  const client = useCelerisBrowserClient({
    appId: process.env.NEXT_PUBLIC_CELERIS_APP_ID!,
    redirectUri: `${process.env.NEXT_PUBLIC_APP_ORIGIN}/auth/callback`,
    suiRpcOrigin: "https://fullnode.testnet.sui.io:443"
  });

  async function signIn() {
    await client?.auth.startLogin();
  }

  async function sayHello() {
    if (!client) return;

    const transaction = new Transaction();
    transaction.moveCall({
      target: `${PACKAGE_ID}::hello_celeris::say_hello`,
      arguments: [
        transaction.object(APP_STATE_OBJECT_ID),
        transaction.object("0x6"),
        transaction.pure.string(username)
      ]
    });

    return client.actions.execute({
      actionType: "say_hello",
      transaction,
      metadata: { username }
    });
  }

  return <button onClick={client ? sayHello : signIn}>Say Hello</button>;
}

The SDK stores auth session and zkLogin ephemeral material in sessionStorage.

Client Configuration

• appId: Celeris app ID from the developer dashboard.
• redirectUri: Browser callback URL registered for the app.
• suiRpcOrigin: Optional Sui RPC origin. Required for real sponsored transaction submission.
• apiOrigin: Optional Celeris API origin. Defaults to https://api.celeris.pro.
• hostedAuthOrigin: Optional hosted auth origin. Defaults to https://auth.celeris.pro.

Public API

• createCelerisBrowserClient(config)
• useCelerisBrowserClient(config) from @celerispro/sdk-browser/react
• client.auth.startLogin()
• client.auth.handleRedirectCallback()
• client.auth.getSession()
• client.auth.signOut()
• client.apps.getCatalog()
• client.credits.getBalance()
• client.credits.startCheckout()
• client.actions.execute({ actionType, transaction, metadata })
• client.transactions.list()

The package also exports consumer-facing TypeScript types for auth sessions, catalog, balances, checkout sessions, transactions, and SDK errors.