Skills chat-ui

📦

chat-ui

Name: chat-ui
Author: inferen-sh

Content revision r1 Safe ⚙️ External commands🌐 Network access

Build React Chat Interfaces

Teams need chat interfaces that feel consistent with modern React applications. This skill provides reusable chat component patterns for React, Next.js, and shadcn-style projects.

Supports: Claude Codex Code(CC)

🥉 78 Bronze

Install with my Agent

Copy this request to your Agent. It includes the canonical Skill page and manifest.

Agent request

Review the Skillstore skill "chat-ui" from https://skillstore.io/skills/inferen-sh-chat-ui.md and its manifest at https://skillstore.io/api/skills/inferen-sh-chat-ui/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.

Your Agent should still show its plan and request any confirmation required by the security policy.

Agent-readable resources

Use these links when an AI agent, crawler, or script needs clean context instead of reading the full page.

Markdown detail GET /skills/inferen-sh-chat-ui.md Signed manifest GET /api/skills/inferen-sh-chat-ui/manifest Signed lockfile GET /api/skills/inferen-sh-chat-ui/lockfile

Test it

Using "chat-ui". Create a basic support chat screen for a Next.js app.

Expected outcome:

A React chat layout with a message container, user and assistant messages, a disabled state during loading, and a send input.

Using "chat-ui". Add feedback for an assistant response that is still generating.

Expected outcome:

A chat flow that shows the latest user message, displays a typing indicator, and prevents duplicate sends while loading.

Using "chat-ui". Explain how to style assistant messages differently.

Expected outcome:

Guidance for applying project design tokens to assistant message backgrounds while preserving role-based alignment.

Security Audit

Safe

v6 • 7/9/2026 Open versioned report

Most static findings are false positives from Markdown fences, inline code formatting, React examples, and documentation links. The remaining confirmed risks are user-invoked install commands that fetch external component or skill content, so users should review remote sources before running them.

Files scanned

141

Lines analyzed

Review items

False positives ignored

Capability review items (3)

These are real local capabilities that may be expected for this skill, so they require review but are not counted as confirmed malicious behavior.

Medium

SKILL.md:14-17

Ruby/shell backtick execution

```bash

Lines 14-17 contain a bash quick-start example that runs npx and fetches a remote shadcn registry URL. This is user-invoked, but it still introduces external command and supply-chain risk.

Medium

SKILL.md:122-131

Ruby/shell backtick execution

```bash

Lines 122-131 contain bash examples that run npx skills add for related packages. These are user-invoked install commands and can fetch external skill content.

Low

SKILL.md:16

Hardcoded URL

npx shadcn@latest add https://ui.inference.sh/r/chat.json

The URL is passed to npx shadcn as a remote component registry source. This network dependency is expected, but users should review fetched code before installation.

Risk Factors

Audited by: codex View Audit History →

Share & cite this report

Share the versioned assessment report, neutral badge, embed card, and citations. Skillstore reports evidence without deciding whether this Skill is safe.

Open versioned report

Copy report link

https://skillstore.io/skills/inferen-sh-chat-ui/audits/6?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_report

Markdown badge

[![Skillstore security assessment](https://skillstore.io/badges/skills/inferen-sh-chat-ui/security.svg)](https://skillstore.io/skills/inferen-sh-chat-ui?utm_source=security_passport_badge)

HTML badge

<a href="https://skillstore.io/skills/inferen-sh-chat-ui?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/inferen-sh-chat-ui/security.svg" alt="Skillstore security assessment" loading="lazy"></a>

Embed card

<iframe src="https://skillstore.io/embed/skills/inferen-sh-chat-ui.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>

Academic citations (APA · BibTeX · CFF)

APA citation

inferen-sh. (2026). chat-ui security audit report (audit version 6) [Author version unspecified]. Skillstore. https://skillstore.io/skills/inferen-sh-chat-ui/audits/6

BibTeX citation

@techreport{inferen-sh-inferen-sh-chat-ui-2026,
  author = {inferen-sh},
  title = {chat-ui security audit report (audit version 6)},
  institution = {Skillstore},
  year = {2026},
  number = {6},
  url = {https://skillstore.io/skills/inferen-sh-chat-ui/audits/6},
  note = {Author version unspecified}
}

CITATION.cff

cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "chat-ui security audit report (audit version 6)"
version: "unspecified"
type: report
authors:
  - name: "inferen-sh"
date-released: "2026-07-09"
url: "https://skillstore.io/skills/inferen-sh-chat-ui/audits/6"
identifiers:
  - type: other
    value: "skillstore:inferen-sh-chat-ui:audit:6"
    description: "Skillstore immutable audit report identifier"

Compare variants

2 installable variants

Each author remains a separate installable skill. The recommended variant is ranked by Skillstore evidence.

Why this variant is first

Highest Skillstore Score

Author / source Skillstore Score Evidence Confidence Skillstore usage Updated

inferen-sh Recommended Current

inferen-sh-chat-ui

Skillstore Score 78

Evidence Confidence High

Skillstore usage 8

Updated

2026-08-21

inference-sh-9

inference-sh-9-chat-ui

Skillstore Score 69

Evidence Confidence High

Skillstore usage 9

Updated

2026-08-21

Skillstore Score

Why this score Evidence Confidence: High

Architecture

Maintainability

Content

Community

Spec Compliance

What You Can Build

Prototype an AI Assistant

Create a chat screen with message bubbles, input handling, and loading feedback for early product testing.

Standardize Chat Components

Use shared React examples to keep message layouts and interaction states consistent across an application.

Plan Streaming Chat UX

Combine typing indicators and linked guidance to design responsive agent conversations.

Try These Prompts

Create a Basic Chat View

Use the chat-ui skill to build a simple React chat view with messages, an input, and a typing indicator.

Adapt Components to My Project

Review my React project structure and show where the chat container, message, and input components should be placed.

Design Loading and Empty States

Extend the chat UI pattern with empty, loading, disabled, and error states that match my current design system.

Build a Streaming Assistant Interface

Use the chat-ui examples to design a streaming assistant interface with message roles, pending responses, and accessible controls.

Best Practices

Review remote registry content before running install commands.
Keep chat state, loading state, and input disabled state synchronized.
Use clear role handling for user, assistant, and system messages.

Avoid

Do not run remote install commands without reviewing the fetched files.
Do not mix backend API logic into presentational chat components.
Do not hide loading or disabled states during message submission.

Frequently Asked Questions

What does this skill help build?

It helps build React and Next.js chat interfaces with reusable component patterns.

Does it include a backend chat service?

No. It focuses on frontend components and leaves API integration to your application.

Can I use it with Claude, Codex, and Claude Code?

Yes. The report marks support for Claude, Codex, and Claude Code.

Does it support streaming responses?

It includes UI patterns and documentation links that help design streaming chat experiences.

Are the install commands safe to run automatically?

They fetch external content, so users should inspect sources and pin trusted versions first.

What projects are a good fit?

It fits React or Next.js projects that use Tailwind CSS and shadcn-style components.

Developer Details

Author

inferen-sh

License

MIT

Skillstore revision

Version notice

The author did not declare a version.

Repository

https://github.com/inferen-sh/skills/tree/main/ui/chat-ui/

Ref

0519034dad657fb1f7706e0550e962beeda73fdf

Maintenance freshness

7/18/2026

Usage

3 downloads · 124 views

File structure

📄 SKILL.md