@decentnetwork/beagle-ui

npm install @decentnetwork/beagle-ui@0.2.40 react@18.3.1 react-dom@18.3.1 vite@5.4.10

<!-- index.html -->
<!doctype html>
<html>
  <head><meta charset="utf-8" /><title>Beagle UI host</title></head>
  <body>
    <div id="root"></div>
    <script type="module" src="/src/main.js"></script>
  </body>
</html>

// src/globals.js
// beagle-ui reads React and ReactDOM as globals; set them before it loads.
import React from "react";
import * as ReactDOMClient from "react-dom/client";
window.React = React;
window.ReactDOM = ReactDOMClient;

// src/main.js
import "./globals.js";
import { mount, setUiHost, BEAGLE_UI_VERSION } from "@decentnetwork/beagle-ui";

setUiHost({
  fileUrl: (name) => "/api/file-download?name=" + encodeURIComponent(name),
  fileDownloadUrl: (name) => "/api/file-download?name=" + encodeURIComponent(name) + "&dl=1",
});
mount(document.getElementById("root"));
console.log("beagle-ui", BEAGLE_UI_VERSION, "mounted");

// vite.config.js
import { defineConfig } from "vite";
// Forward the UI's /api/* calls to a local `beagle` process (default port 8766).
export default defineConfig({
  server: { proxy: { "/api": process.env.BEAGLE_API ?? "http://127.0.0.1:8766" } },
  preview: { proxy: { "/api": process.env.BEAGLE_API ?? "http://127.0.0.1:8766" } },
});

npx vite build
# with a backend running, e.g. `npx beagle --port 18766` (see /docs/beagle):
BEAGLE_API=http://127.0.0.1:18766 npx vite preview

$ npx vite build
vite v5.4.10 building for production...
transforming...
✓ 26 modules transformed.
rendering chunks...
computing gzip size...
dist/index.html                  0.22 kB │ gzip:   0.18 kB
dist/assets/index-CCw0fUVg.js  413.37 kB │ gzip: 127.69 kB
✓ built in 532ms

browser console:
[log] beagle-ui 0.2.40 mounted
[log] [rtc] Carrier bootstrap ICE servers: {0: stun:13.58.208.50:3478, …}
[log] [rtc] ICE warmup done (relay)
[warn] [call] WebRTC or peer-webrtc unavailable — calls disabled

// wallet.mjs
// Pure helpers from @decentnetwork/beagle-ui/wallet-proof also run in Node.
// Bind a Solana wallet to a Beagle userid, then verify the proof.
import { generateKeyPairSync, sign } from "node:crypto";
import {
  base58Encode, signSolProof, encodeWalletProof, decodeWalletProof,
  verifyWalletProof, isWalletAddress,
} from "@decentnetwork/beagle-ui/wallet-proof";

// A throwaway ed25519 key stands in for a browser wallet (Phantom etc.).
const { publicKey, privateKey } = generateKeyPairSync("ed25519");
const raw = Buffer.from(publicKey.export({ format: "jwk" }).x, "base64url");
const address = base58Encode(raw);
const wallet = { signMessage: async (bytes) => sign(null, bytes, privateKey) };

const userid = "D6p9dm91J49jTkUUrYFVnFRnRqrtEmwEwCR1YuPAZYye"; // a Beagle userid
console.log("valid sol address:", isWalletAddress("sol", address));

const proof = await signSolProof(wallet, { userid, address });
console.log(proof.message);
const blob = encodeWalletProof(proof); // what gets stored in the profile record
console.log("decoded ok:", decodeWalletProof(blob)?.signature === proof.signature);
console.log("verify:", verifyWalletProof({ chain: "sol", address, userid, proof: blob }));
console.log("verify for another userid:",
  verifyWalletProof({ chain: "sol", address, userid: "someone-else", proof: blob }));

$ node wallet.mjs
valid sol address: true
Beagle wallet binding

I bind this wallet to my Beagle identity.

userid: D6p9dm91J49jTkUUrYFVnFRnRqrtEmwEwCR1YuPAZYye
chain: sol
address: 2Ag8oCNN2LVr8vy8hnyahBmxgyMRyTncvNK3FWFYU9BN
issued: 2026-11-06T08:50:28Z
decoded ok: true
verify: { ok: true, issued: '2026-11-06T08:50:28Z' }
verify for another userid: { ok: false, error: 'proof names another Beagle identity' }

type WalletChain = "eth" | "sol";
interface WalletProof { message: string; signature: string }
type VerifyResult = { ok: true; issued: string } | { ok: false; error: string };

const WALLET_PROOF_VERSION: 1;
const WALLET_CHAINS: WalletChain[];
const COIN_TYPE: { eth: "60"; sol: "501" };
const PROOF_KEY: { eth: "proof.eth"; sol: "proof.sol" };
const BIND_MAX_AGE_MS: number;

function isWalletAddress(chain: string, address: unknown): boolean;
function proofTime(date?: Date): string;
function walletProofMessage(f: { userid; chain: WalletChain; address; issued }): string;
function parseWalletProofMessage(msg: unknown): { userid; chain; address; issued } | null;
function encodeWalletProof(p: WalletProof): string;
function decodeWalletProof(text: unknown): WalletProof | null;
function base58Encode(bytes: Uint8Array): string;
function base58Decode(str: string): Uint8Array;
function signEthProof(provider: { request(a: { method: string; params: unknown[] }): Promise<unknown> },
                      f: { userid: string; address: string; issued?: string }): Promise<WalletProof>; // personal_sign
function signSolProof(wallet: { signMessage(m: Uint8Array, display?: string): Promise<unknown> },
                      f: { userid: string; address: string; issued?: string }): Promise<WalletProof>;
function eip191Hash(message: string): Uint8Array;
function recoverEthAddress(message: string, signature: string): string;
function verifyWalletProof(a: { chain; address; userid; proof: string | WalletProof | null | undefined;
                                maxAgeMs?: number; now?: number }): VerifyResult;
function verifyRecordWallet(record, chain: WalletChain):
  { ok: true; address; via: "proof"; issued } | { ok: true; address; via: "owner" } | { ok: false; error };
function applyWalletBind(record, req: { chain; address; proof?; userid; now? }):
  { ok: true; addresses; texts } | { ok: false; status: number; error: string };