Install Orbsona

Add the live renderer to your React application

React renderer

@accidental-revenue/orbsona

The public package contains the identity contract, TypeScript types, and live React renderer. Every package manager below installs the same v0.1.0 release from npm.

npm install @accidental-revenue/orbsona

Open source · MIT

Use, modify, and ship the renderer under the MIT License. Orbsona has no account requirement, hosted identity store, telemetry, or vendor lock-in.

Runtime: Browser canvas
Framework: React 18+
Module format: ESM
Storage: Your application

Render the identity

Import the downloaded file and drive the generic state contract from your own application.

import { AgentAvatar } from "@accidental-revenue/orbsona/react";
import type { AgentState } from "@accidental-revenue/orbsona";
import aster from "./aster.orbsona.json";

type AgentPresenceProps = {
  state: AgentState;
  inputLevel?: number;
  outputLevel?: number;
};

export function AgentPresence({
  state,
  inputLevel,
  outputLevel,
}: AgentPresenceProps) {
  return (
    <AgentAvatar
      identity={aster.identity}
      state={state}
      inputLevel={inputLevel}
      outputLevel={outputLevel}
      size={64}
    />
  );
}

What ships

React canvas renderer and TypeScript props
Versioned identity types, parser, and serializer
Eight provider-neutral runtime states
Reduced-motion and bounded rendering behavior

Run the repository

View source

For contributors who want to build and test the repository locally.

npm install
npm run test:package
npm run dev

Provider-neutral by design

Orbsona stays independent from voice and agent providers. Your application maps connection, audio, and tool events to the small AgentState contract, so the same identity can move between runtimes without changing its visual language.