Agent skill

Assistant UI Primitives

Guide for assistant-ui UI primitives - ThreadPrimitive, ComposerPrimitive, MessagePrimitive.

MITAuto-check passed

Install Assistant UI Primitives

skills CLI

$ npx skills add compozy/compozy --skill assistant-ui-primitives -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI

$ gh skill install compozy/compozy assistant-ui-primitives --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy

$ git clone --depth 1 https://github.com/compozy/compozy.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.agents/skills/assistant-ui/assistant-ui-primitives .claude/skills/assistant-ui-primitives && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Paste into Claude Code

Install the "assistant-ui-primitives" agent skill from https://github.com/compozy/compozy/tree/main/.agents/skills/assistant-ui/assistant-ui-primitives into .claude/skills/assistant-ui-primitives/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "assistant-ui-primitives", then confirm the skill loads.

Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

$skill-installer

$skill-installer install https://github.com/compozy/compozy/tree/main/.agents/skills/assistant-ui/assistant-ui-primitives

Type this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.

skills CLI

$ npx skills add compozy/compozy --skill assistant-ui-primitives -a codex

Project install goes to .agents/skills/; add -g for ~/.codex/skills/.

GitHub CLI

$ gh skill install compozy/compozy assistant-ui-primitives --agent codex

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/compozy/compozy.git skills-src && mkdir -p .agents/skills && cp -r skills-src/.agents/skills/assistant-ui/assistant-ui-primitives .agents/skills/assistant-ui-primitives && rm -rf skills-src

Use ~/.agents/skills/ instead of .agents/skills for a personal install.

Codex skills documentation · loads skills from .agents/skills/

Paste into Codex

Install the "assistant-ui-primitives" agent skill from https://github.com/compozy/compozy/tree/main/.agents/skills/assistant-ui/assistant-ui-primitives into .agents/skills/assistant-ui-primitives/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "assistant-ui-primitives", then confirm the skill loads.

Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

skills CLI

$ npx skills add compozy/compozy --skill assistant-ui-primitives -a cursor

Project install goes to .agents/skills/; add -g for ~/.cursor/skills/.

GitHub CLI

$ gh skill install compozy/compozy assistant-ui-primitives --agent cursor

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/compozy/compozy.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/.agents/skills/assistant-ui/assistant-ui-primitives .cursor/skills/assistant-ui-primitives && rm -rf skills-src

Use ~/.cursor/skills/ instead of .cursor/skills for a personal install.

Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/

Paste into Cursor

Install the "assistant-ui-primitives" agent skill from https://github.com/compozy/compozy/tree/main/.agents/skills/assistant-ui/assistant-ui-primitives into .cursor/skills/assistant-ui-primitives/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "assistant-ui-primitives", then confirm the skill loads.

Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

gemini skills install

$ gemini skills install https://github.com/compozy/compozy.git --path .agents/skills/assistant-ui/assistant-ui-primitives

--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.

skills CLI

$ npx skills add compozy/compozy --skill assistant-ui-primitives -a gemini-cli

Project install goes to .agents/skills/; add -g for ~/.gemini/skills/.

GitHub CLI

$ gh skill install compozy/compozy assistant-ui-primitives --agent gemini-cli

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/compozy/compozy.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/.agents/skills/assistant-ui/assistant-ui-primitives .gemini/skills/assistant-ui-primitives && rm -rf skills-src

Use ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.

Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/

Paste into Gemini CLI

Install the "assistant-ui-primitives" agent skill from https://github.com/compozy/compozy/tree/main/.agents/skills/assistant-ui/assistant-ui-primitives into .gemini/skills/assistant-ui-primitives/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "assistant-ui-primitives", then confirm the skill loads.

Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

GitHub CLI

$ gh skill install compozy/compozy assistant-ui-primitives

Installs for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).

skills CLI

$ npx skills add compozy/compozy --skill assistant-ui-primitives -a github-copilot

Project install goes to .agents/skills/; add -g for ~/.copilot/skills/.

Manual copy

$ git clone --depth 1 https://github.com/compozy/compozy.git skills-src && mkdir -p .github/skills && cp -r skills-src/.agents/skills/assistant-ui/assistant-ui-primitives .github/skills/assistant-ui-primitives && rm -rf skills-src

Use ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.

GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/

Paste into GitHub Copilot

Install the "assistant-ui-primitives" agent skill from https://github.com/compozy/compozy/tree/main/.agents/skills/assistant-ui/assistant-ui-primitives into .github/skills/assistant-ui-primitives/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "assistant-ui-primitives", then confirm the skill loads.

GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

skills CLI

$ npx skills add compozy/compozy --skill assistant-ui-primitives -a opencode

OpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.

GitHub CLI

$ gh skill install compozy/compozy assistant-ui-primitives --agent opencode

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/compozy/compozy.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/.agents/skills/assistant-ui/assistant-ui-primitives .opencode/skills/assistant-ui-primitives && rm -rf skills-src

Use ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.

OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/

Paste into OpenCode

Install the "assistant-ui-primitives" agent skill from https://github.com/compozy/compozy/tree/main/.agents/skills/assistant-ui/assistant-ui-primitives into .opencode/skills/assistant-ui-primitives/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "assistant-ui-primitives", then confirm the skill loads.

OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

Facts

Skill name: assistant-ui-primitives
GitHub stars: 2.8k
Token cost: ~999 tokens
SKILL.md length: 120 words
Files: 5 (incl. references)
Skills in repo: 47
Repo updated: Oct 7, 2026
First seen: Oct 7, 2026
Licence: MIT

At a glance

Guide for assistant-ui UI primitives - ThreadPrimitive, ComposerPrimitive, MessagePrimitive.

Customizing chat UI components
SKILL.md covers References, Import, Primitive Parts and Custom Thread Example, plus 4 more sections
Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md

What it does

Assistant UI Primitives is an agent skill from compozy/compozy. Guide for assistant-ui UI primitives - ThreadPrimitive, ComposerPrimitive, MessagePrimitive. Use when customizing chat UI components.

Its SKILL.md is about 1000 tokens, which your agent loads only when the skill is triggered. The skill folder holds 5 other files, including reference files (for example `references/action-bar.md`, `references/composer.md` and `references/message.md`).

The repository describes itself as: An operating system for AI agents. Plug in the agent CLIs you already use (Claude Code, Codex, Gemini CLI, Cursor) and they become a team: they split the work, hand tasks to each… The licence is MIT.

When your agent uses it

Customizing chat UI components

Example prompts

“/assistant-ui-primitives”

What it can do on your machine

Read from SKILL.md and the folder at commit c46be43. It shows what the files ask for, not the result of running them.

Tool permissions
Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.
From allowed-tools in the SKILL.md frontmatter.
Runs code
No scripts in the folder and no shell commands in SKILL.md (its code samples are typescript).
From the folder's file list and the shell code blocks in SKILL.md.
Network
Links to these hosts (documentation or services it may open):
- assistant-ui.com
From URLs in SKILL.md, links to its own repository left out.
Credentials
Names no API keys, tokens, secrets or passwords.
From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Assistant UI Primitives loads about 999 tokens when it runs, and up to ~7.2k if it reads all its reference files. Until then it costs about 39 tokens; SKILL.md has 120 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it: ~39
When it runs · the whole SKILL.md, loaded when a task matches: ~999
With references · SKILL.md plus every file in references/, read only if the agent opens them: ~7.2k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from compozy/compozy at commit c46be43, republished under its MIT licence (© compozy). 120 words, ~999 tokens.

Download SKILL.mdSave it as .claude/skills/assistant-ui-primitives/SKILL.md (or your agent's skills folder). This skill also uses 4 other files; get the full folder from GitHub.

name: assistant-ui-primitives
description: Guide for assistant-ui UI primitives - ThreadPrimitive, ComposerPrimitive, MessagePrimitive. Use when customizing chat UI components.
version: 0.0.1
license: MIT

assistant-ui Primitives

Always consult assistant-ui.com/llms.txt for latest API.

Composable, unstyled components following Radix UI patterns.

References

./references/thread.md -- ThreadPrimitive deep dive
./references/composer.md -- ComposerPrimitive deep dive
./references/message.md -- MessagePrimitive deep dive
./references/action-bar.md -- ActionBarPrimitive deep dive

Import

tsx

import {
  AuiIf,
  ThreadPrimitive,
  ComposerPrimitive,
  MessagePrimitive,
  ActionBarPrimitive,
  BranchPickerPrimitive,
  AttachmentPrimitive,
  ThreadListPrimitive,
  ThreadListItemPrimitive,
} from "@assistant-ui/react";

Primitive Parts

Primitive	Key Parts
`ThreadPrimitive`	`.Root`, `.Viewport`, `.Messages`, `.Empty`, `.ScrollToBottom`
`ComposerPrimitive`	`.Root`, `.Input`, `.Send`, `.Cancel`, `.Attachments`
`MessagePrimitive`	`.Root`, `.Parts`/`.Content`, `.If`, `.Error`
`ActionBarPrimitive`	`.Copy`, `.Edit`, `.Reload`, `.Speak`, `.FeedbackPositive`, `.FeedbackNegative`, `.ExportMarkdown`
`BranchPickerPrimitive`	`.Previous`, `.Next`, `.Number`, `.Count`

Custom Thread Example

tsx

function CustomThread() {
  return (
    <ThreadPrimitive.Root className="flex flex-col h-full">
      <ThreadPrimitive.Empty>
        <div className="flex-1 flex items-center justify-center">
          Start a conversation
        </div>
      </ThreadPrimitive.Empty>

      <ThreadPrimitive.Viewport className="flex-1 overflow-y-auto p-4">
        <ThreadPrimitive.Messages components={{
          UserMessage: CustomUserMessage,
          AssistantMessage: CustomAssistantMessage,
        }} />
      </ThreadPrimitive.Viewport>

      <ComposerPrimitive.Root className="border-t p-4 flex gap-2">
        <ComposerPrimitive.Input className="flex-1 rounded-lg border px-4 py-2" />
        <ComposerPrimitive.Send className="bg-blue-500 text-white px-4 py-2 rounded-lg">
          Send
        </ComposerPrimitive.Send>
      </ComposerPrimitive.Root>
    </ThreadPrimitive.Root>
  );
}

Conditional Rendering

Prefer AuiIf for new code. Primitive .If components still exist but are deprecated.

tsx

<AuiIf condition={({ message }) => message.role === "user"}>
  User only
</AuiIf>
<AuiIf condition={({ thread }) => thread.isRunning}>
  Generating...
</AuiIf>
<AuiIf condition={({ message }) => message.branchCount > 1}>
  Has edit history
</AuiIf>

<AuiIf condition={({ thread }) => thread.isRunning}>
  <ComposerPrimitive.Cancel>Stop</ComposerPrimitive.Cancel>
</AuiIf>

<AuiIf condition={({ thread }) => thread.isEmpty}>No messages</AuiIf>

Content Parts

tsx

<MessagePrimitive.Content components={{
  Text: ({ part }) => <p>{part.text}</p>,
  Image: ({ part }) => <img src={part.image} alt="" />,
  ToolCall: ({ part }) => <div>Tool: {part.toolName}</div>,
  Reasoning: ({ part }) => <details><summary>Thinking</summary>{part.text}</details>,
}} />

Branch Picker

tsx

<MessagePrimitive.If hasBranches>
  <BranchPickerPrimitive.Root className="flex items-center gap-1">
    <BranchPickerPrimitive.Previous>←</BranchPickerPrimitive.Previous>
    <span><BranchPickerPrimitive.Number /> / <BranchPickerPrimitive.Count /></span>
    <BranchPickerPrimitive.Next>→</BranchPickerPrimitive.Next>
  </BranchPickerPrimitive.Root>
</MessagePrimitive.If>

Common Gotchas

Primitives not rendering

Wrap in AssistantRuntimeProvider
Ensure parent primitive provides context

Styles not applying

Primitives are unstyled by default
Add className and style with your app's Tailwind/CSS system

Files

SKILL.md and 4 other files (references) in .agents/skills/assistant-ui/assistant-ui-primitives of compozy/compozy.

SKILL.md
references/action-bar.md
references/composer.md
references/message.md
references/thread.md

Open the folder on GitHubat commit c46be43

Compare with similar skills

Assistant UI Primitives next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Assistant UI Primitives compared with similar skills
Skill	Stars	Used in	Tokens	Auto-check	Licence	Repo updated
Assistant UI Primitives this skillcompozy/compozy	2.8k	—	~999	Automated safety check: Pass	MIT	today
Generic Assistantmastra-ai/mastra	29k	—	~1.1k	Automated safety check: Pass	Custom licence	today
Author UI Primitivesremix-run/remix	33k	—	~2.5k	Automated safety check: Pass	MIT	yesterday
RAG AssistantAtmosphere/atmosphere	3.8k	—	~504	Automated safety check: Pass	Apache-2.0	yesterday
AI AssistantAtmosphere/atmosphere	3.8k	—	~193	Automated safety check: Pass	Apache-2.0	yesterday
Tool AssistantAtmosphere/atmosphere	3.8k	—	~412	Automated safety check: Pass	Apache-2.0	yesterday

Similar skills

Generic Assistant
mastra-ai/mastra
Fallback authoring playbook for building general-purpose personal assistant agents that do not fit a more specific archetype.
29k GitHub stars~1.1k tokensUpdated today
Sales & SupportAuto-check passed
Author UI Primitives
remix-run/remix
Build idiomatic headless primitives in packages/ui for Remix.
33k GitHub stars~2.5k tokensUpdated yesterday
DevelopmentAuto-check passed
RAG Assistant
Atmosphere/atmosphere
Knowledge base assistant that retrieves and cites documents from a curated index.
3.8k GitHub stars~504 tokensUpdated yesterday
AI & LLM EngineeringAuto-check passed
AI Assistant
Atmosphere/atmosphere
Streaming chat assistant with conversation memory. An agent skill from Atmosphere/atmosphere.
3.8k GitHub stars~193 tokensUpdated yesterday
Backend & APIsAuto-check passed
Tool Assistant
Atmosphere/atmosphere
Tool-calling assistant with backend functions for time, city time, weather, and temperature conversion, plus cost metering and approval workflows.
3.8k GitHub stars~412 tokensUpdated yesterday
Backend & APIsAuto-check passed
Job Application Assistant
MadsLorentzen/ai-job-search
Evaluates job postings against your profile, then tailors a LaTeX CV and cover letter and prepares interview answers for the roles you pursue.
45k GitHub stars~1.2k tokensUpdated 2 days ago
Business, Finance & HRAuto-check: notes

Questions about Assistant UI Primitives

What does Assistant UI Primitives do?

Guide for assistant-ui UI primitives - ThreadPrimitive, ComposerPrimitive, MessagePrimitive. Assistant UI Primitives is an agent skill from compozy/compozy. Guide for assistant-ui UI primitives - ThreadPrimitive, ComposerPrimitive, MessagePrimitive.

When should I use Assistant UI Primitives?

Assistant UI Primitives fits situations like: customizing chat UI components.

How do I install Assistant UI Primitives in Claude Code?

Run `npx skills add compozy/compozy --skill assistant-ui-primitives -a claude-code`. Or copy the skill folder (.agents/skills/assistant-ui/assistant-ui-primitives in compozy/compozy) into .claude/skills/assistant-ui-primitives in your project. Claude Code loads it when a task matches its description.

How do I install Assistant UI Primitives in Codex?

Run `npx skills add compozy/compozy --skill assistant-ui-primitives -a codex`. Or copy the skill folder (.agents/skills/assistant-ui/assistant-ui-primitives in compozy/compozy) into .agents/skills/assistant-ui-primitives in your project. Codex loads it when a task matches its description.

Can I use Assistant UI Primitives in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add compozy/compozy --skill assistant-ui-primitives -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/assistant-ui-primitives, .gemini/skills/assistant-ui-primitives, .github/skills/assistant-ui-primitives and .opencode/skills/assistant-ui-primitives in your project.

What does Assistant UI Primitives need to run?

SKILL.md names no scripts, command-line tools or credentials: Assistant UI Primitives is instructions for the agent only.

Does Assistant UI Primitives access the network?

SKILL.md names 1 domain. As links in the text: assistant-ui.com. This is read from the text; nothing was executed.

Is Assistant UI Primitives safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does Assistant UI Primitives use?

Assistant UI Primitives is published under the MIT licence (declared in SKILL.md). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Assistant UI Primitives use?

About 999 tokens (SKILL.md is roughly 4k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full. Its references folder adds about 6.2k tokens, read only when the agent opens those files.

What are the alternatives to Assistant UI Primitives?

Skills that share tags, products or a category with Assistant UI Primitives: Generic Assistant (mastra-ai/mastra, 29k stars), Author UI Primitives (remix-run/remix, 33k stars), RAG Assistant (Atmosphere/atmosphere, 3.8k stars) and AI Assistant (Atmosphere/atmosphere, 3.8k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Assistant UI Primitives?

compozy (a GitHub organization) maintains it in compozy/compozy, which has 2,791 GitHub stars. The repository holds 47 skills in this directory. The repository was last updated on October 7, 2026.

Source: compozy/compozy on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.

Install Assistant UI Primitives

Facts

At a glance

What it does

When your agent uses it

Example prompts

What it can do on your machine

Tool permissions

Runs code

Network

Credentials

Context cost

Safety

SKILL.md

assistant-ui Primitives

References

Import

Primitive Parts

Custom Thread Example

Conditional Rendering

Content Parts

Branch Picker

Common Gotchas

Files

Compare with similar skills

Similar skills

More from compozy/compozy

Questions about Assistant UI Primitives