@possibl/rcrt-ui

React UI for RCRT apps: the chat primitive, the JIT-UI widget registry (stream / feed / studio cards), the client-side SAPL renderer, and the App Control surfaces (advisor overlay, interpret:ui-manifest publishing). Built on @possibl/rcrt-sdk.

@possibl/rcrt-ui              everything (re-exports the subpaths below)
@possibl/rcrt-ui/chat         <Chat> primitive + breadcrumb→stream mapping
@possibl/rcrt-ui/widgets      widget registry, <WidgetRenderer>, stream/feed/studio cards
@possibl/rcrt-ui/sapl         client-side SAPL renderer + 29 primitives
@possibl/rcrt-ui/app-control  ui-manifest publish, advisor GuideOverlay, store
@possibl/rcrt-ui/layout       layout/theme config types

This is the chat / JIT-UI widget layer. It is intentionally separate from @possibl/rcrt-app-kit (the app shell + section registry + UI primitives), so an app can embed the kit without dragging in widget deps it doesn't use, and vice versa. The two share the same --rcrt-* design-token contract.

Install

npm install @possibl/rcrt-ui @possibl/rcrt-sdk react react-dom

@possibl/rcrt-sdk, react and react-dom are peer dependencies — the host owns the single SDK client instance and React copy.

The client is a seam

rcrt-ui never constructs a wire client and has no dependency on the legacy @possibl/rcrt-api. Components that talk to the platform accept a host-provided client through a structural interface (RcrtClientLike, useDataSource's client, the manifest client). Any object matching the shape — in practice a configured @possibl/rcrt-sdk RcrtClient — works:

import { RcrtClient } from '@possibl/rcrt-sdk';
import { Chat } from '@possibl/rcrt-ui/chat';

const client = new RcrtClient({ apiUrl, tokenProvider });

<Chat client={client} config={{ agent: 'advisor', show_tool_calls: true }} />;

Where the package needs a breadcrumb type it imports it directly from @possibl/rcrt-sdk (e.g. breadcrumbToStreamItem), so wire shapes stay in one place.

Widgets

import { WidgetRenderer, registerDefaultWidgets } from '@possibl/rcrt-ui/widgets';

registerDefaultWidgets();
<WidgetRenderer widget={{ type: 'fact', config: { claim: '…', status: 'verified' } }} />;

Stream/feed widgets receive their data pre-resolved (via config); page widgets resolve DataSource bindings at render time through useDataSource and the host client.

SAPL

@possibl/rcrt-ui/sapl renders interpret:renderable pipelines client-side: LiveSAPLRenderer subscribes to breadcrumb updates over SSE and re-renders as agents change the tree.

Licence

MIT.