@assemblyline-agents/openui

Reusable Assembly Line lifecycle tools backed by the official OpenUI runtime.

The default component pack is the complete 54-component `@openuidev/react-ui` standard library. Developers can allow every component, restrict it by name, or register an independently versioned component pack. The model supplies only OpenUI Lang and a title. It never supplies publication HTML, CSS, or JavaScript.

Add the pack

```sh assembly-line add openui agent ```

This creates `tool-config/openui.ts`, three tool wrappers, and the OpenUI operating skill. Configure `R2_PUBLIC_BASE_URL` or `S3_PUBLIC_BASE_URL` with an HTTPS origin before publishing.

The generated configuration uses the official standard pack with every component enabled. Restrict and theme it explicitly when needed:

```ts import { defineOpenUiConfig } from "@assemblyline-agents/openui";

export default defineOpenUiConfig({ allowedComponents: ["Stack", "Card", "CardHeader", "TextContent", "Table", "Col"], brand: { name: "Example", theme: { background: "#F7F7F5", textBrand: "#1F2937", fontHeading: "Georgia, serif", fontBody: "Arial, sans-serif" } } }); ```

The tool's `document` schema is generated from the selected pack and allowlist, so agents see the permitted component signatures rather than a framework-owned report vocabulary. Artifact titles are lifecycle metadata and do not force a particular root component.

The standard renderer keeps desktop row compositions intact and automatically wraps row `Stack` layouts on narrow screens. Metric cards and callouts use a readable minimum width, yielding two columns when the container can support them and one column when it cannot. The document itself cannot scroll sideways; wide tables and Cartesian charts retain component-local scrolling, while pie, radial, and radar compositions wrap within the viewport. Mobile table text stays at the reviewed size instead of being enlarged by browser text autosizing.

Component packs

A component pack combines an OpenUI library, an immutable identity and version, and trusted publication code:

```ts import { createOpenUiLibrary, defineOpenUiConfig, type OpenUiComponentPack } from "@assemblyline-agents/openui";

const pack: OpenUiComponentPack = { id: "@example/product-ui", version: "3.1.0", library: createOpenUiLibrary({ root: "ProductPage", components: [ProductPage, Metric, Chart] }), render({ source, title, config }) { return renderReviewedProductUi({ source, title, theme: config.brand.theme }); } };

export default defineOpenUiConfig({ componentPack: pack }); ```

Pack renderers execute as trusted application code. Review and version them like any other plugin. Project content may select installed packs, but it must not load arbitrary repository code into the runtime.

Lifecycle and security

`openui_create` and `openui_update` store private immutable revisions with the exact pack version, allowlist, theme, and provenance. `openui_publish` renders the selected revision without an approval pause, verifies the bytes served by storage, and selects that exact HTTPS URL for runtime delivery. Its model-facing result omits the URL, so the channel does not depend on the model copying a link.

The official renderer embeds OpenUI's reviewed browser runtime and styles in a network-disabled CSP. Agent content cannot add scripts, styles, external requests, queries, or mutations. Local OpenUI state and actions are disabled by default and can be enabled by the developer. Tightening the current allowlist or interactivity policy also blocks publication of older revisions that exceed it.

Published links are unlisted bearer links. Use the built-in `deliver_artifact` tool instead when the artifact must remain a private channel file.