Skip to main content

Overview

This section documents the React integration surface exposed by @interopio/io-assist-react.

io.Assist React is designed around a single public entry point:

  • the IoAssist component, configured through two props — staticConfig and dynamicConfig

Unlike the Angular delivery, there is no provider function to register at bootstrap. Both configuration objects are passed directly to the component, which makes the React integration a single import and a single component.

What This Reference Covers​

The io.Assist React reference is organized into these pages:

  • Component API for the IoAssist component and its props
  • Configuration for static config, dynamic config, and prompt shapes
  • Examples for common React integration patterns

Integration Model​

Most applications use io.Assist React like this:

  1. install @interopio/io-assist-react
  2. import the stylesheet from @interopio/io-assist-react/styles
  3. build a staticConfig (io.Connect setup, agent server, MCP, prompts, Working Context)
  4. build a dynamicConfig (the active user and optional per-user agent headers)
  5. render <IoAssist staticConfig={staticConfig} dynamicConfig={dynamicConfig} />

The static config holds infrastructure details that are known at bootstrap. The dynamic config holds the active user and optional per-user agent headers, which are often only known after login.

Public API Surface​

The package exposes a deliberately small surface:

ExportKindDescription
IoAssistComponentThe root component. Takes staticConfig and dynamicConfig props
IoAssistStaticConfigTypeStatic configuration shape for the staticConfig prop
IoAssistDynamicConfigTypeRuntime configuration shape for the dynamicConfig prop

Prompt, icon, and Working Context shapes are reachable structurally through IoAssistStaticConfig, so you author them as inline literals rather than importing extra types.

Relationship to AI Web​

io.Assist React is built on AI Web, so MCP, Working Context, and backend protocol behavior ultimately flow through the underlying AI Web configuration model.

Use io.Assist React when you want the ready-made React UI. Use AI Web directly when you want full control over the frontend experience.