@aomi-labs/react provides runtime logic, state management, hooks, and an API client with zero UI opinions. Use it to build completely custom interfaces or integrate Aomi logic into existing applications.
npm install @aomi-labs/react Export Description AomiRuntimeProviderTop-level provider that connects to the Aomi backend and sets up all contexts ThreadContextProviderThread state management (messages, metadata, thread switching) ExtUserProviderWallet/user state (address, chain, connection status) NotificationContextProviderToast notification state EventContextProviderSSE subscription and system event dispatch ControlContextProviderModel/app/API key selection state
Hook Description useAomiRuntimeUnified API combining all sub-contexts (threads, messages, user, events, notifications, wallet) useUserWallet/user state and setters useThreadContextCurrent thread ID, messages map, metadata map useCurrentThreadMessagesMessages for the active thread useCurrentThreadMetadataMetadata (title, status) for the active thread useControlModel/app/API key state and selection useNotificationShow, dismiss, and list notifications useEventContextSSE subscription and outbound event dispatch useWalletHandlerHandle wallet transaction and signing requests useNotificationHandlerProcess notification events from the backend
Export Description BackendApiDirect HTTP client for the Aomi backend (usable outside React)
Export Description cnClass name merger (clsx + tailwind-merge) formatAddressTruncates wallet addresses for display (0xABC...12) getNetworkNameResolves chain ID to human-readable network name getChainInfoReturns chain metadata (name, ticker, explorer URL) SUPPORTED_CHAINSArray of supported chain configurations
import type { AomiRuntimeApi , AomiMessage , ThreadMetadata , ThreadControlState , UserState , ControlState , Notification , NotificationType , WalletRequest , WalletTxPayload , WalletEip712Payload , InboundEvent , OutboundEvent , SSEStatus , } from "@aomi-labs/react" ; { " @assistant-ui/react " : "^0.11.0" , " react " : "^18.0.0 || ^19.0.0" , " react-dom " : "^18.0.0 || ^19.0.0" } Wrap your app with AomiRuntimeProvider:
import { AomiRuntimeProvider } from "@aomi-labs/react" ; function App () { return ( < AomiRuntimeProvider backendUrl = "https://api.aomi.dev" > < YourCustomUI /> </ AomiRuntimeProvider > ) ; } AomiRuntimeProvider internally sets up all nested providers (ThreadContext, UserContext, NotificationContext, EventContext, ControlContext), so you get the full runtime with a single wrapper.
Scenario Recommendation Standard chat interface needed quickly Widget Existing design system, custom look Headless Non-Next.js React app Headless Server-side API calls (no React) Headless (BackendApi class directly) Want to start fast, customize later Widget (edit source files) Embedding in an existing complex layout Headless
