Agent skill

Chat Gun Frontend Contract

by HsienW in HsienW/chat-gun

Chat Gun 的前端、OpenSpec、Streaming Event、Tool Renderer、型別邊界、多模態流式鏈路與 React/Vite 編程約束。Use when working on frontend code, tool rendering, streaming contracts, multimodal requests/responses, Weather…

Custom licenceAuto-check passedFrontend & Design

Install Chat Gun Frontend Contract

skills CLI
$ npx skills add HsienW/chat-gun --skill chat-gun-frontend-contract -a claude-code

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

GitHub CLI
$ gh skill install HsienW/chat-gun chat-gun-frontend-contract --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/HsienW/chat-gun.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.agents/skills/chat-gun-frontend-contract .claude/skills/chat-gun-frontend-contract && 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/

Facts

Skill name
chat-gun-frontend-contract
GitHub stars
143
Token cost
~467 tokens
SKILL.md length
85 words
Files
9 (incl. references)
Skills in repo
8
Repo updated
First seen
Licence
Custom licence

At a glance

Chat Gun 的前端、OpenSpec、Streaming Event、Tool Renderer、型別邊界、多模態流式鏈路與 React/Vite 編程約束。Use when working on frontend code, tool rendering, streaming contracts, multimodal requests/responses, Weather…

  • Works in 4 steps: 先讀根目錄 AGENTS.md、受影響套件的 AGENTS.md 與… → 判斷任務類型,依下表載入對應 reference。 → 修改前先定位問題層級與契約邊界,不得直接跨層大範圍修改。 → …
  • Working on frontend code
  • SKILL.md covers 快速流程, Reference 載入規則, 硬性規則摘要 and 驗證命令
  • Calls npm

What it does

Chat Gun Frontend Contract is an agent skill from HsienW/chat-gun. Chat Gun 的前端、OpenSpec、Streaming Event、Tool Renderer、型別邊界、多模態流式鏈路與 React/Vite 編程約束。Use when working on frontend code, tool rendering, streaming contracts, multimodal requests/responses, Weather legacy refactors, or OpenSpec-driven changes in this repository.

Its SKILL.md is about 470 tokens, which your agent loads only when the skill is triggered. The skill folder holds 10 other files, including reference files (for example `agents/openai.yaml`, `references/chat-gun-fe-legacy-refactor.md` and `references/chat-gun-fe-multimodal-streaming.md`).

It sits in Frontend & Design, covering Refactoring. It works with Vite, React, LangGraph and Model Context Protocol. The repository describes itself as: 🤖 A full-stack Agent Chat Runtime for pre-production validation, built with act, TypeScript, and LangGraph JS combining streaming, multimodal, HITL, and tools with durable…

When your agent uses it

  • Working on frontend code
  • Streaming contracts
  • Multimodal requests/responses
  • Weather legacy refactors

Example prompts

  • “/chat-gun-frontend-contract”

Workflow steps

4 steps, taken from the first numbered list in SKILL.md.

  1. 先讀根目錄 AGENTS.md、受影響套件的 AGENTS.md 與 openspec/config.yaml。
  2. 判斷任務類型,依下表載入對應 reference。
  3. 修改前先定位問題層級與契約邊界,不得直接跨層大範圍修改。
  4. 修改後執行受影響套件的驗證命令,未執行或失敗必須如實回報。

What it can do on your machine

Read from SKILL.md and the folder at commit 826d29d. 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

    Shell commands in SKILL.md call:

    • npm

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    No URLs in SKILL.md. Its commands use npm, which can reach the network depending on how they are called.

    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

Chat Gun Frontend Contract loads about 467 tokens when it runs, and up to ~13k if it reads all its reference files. Until then it costs about 71 tokens; SKILL.md has 85 words of instructions outside code blocks.

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

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

Its licence (Custom licence) doesn't allow us to republish the file, so here is its outline and opening line. It has 85 words (~467 tokens).

name
chat-gun-frontend-contract

Read the full SKILL.md on GitHub

Files

SKILL.md and 8 other files (references) in .agents/skills/chat-gun-frontend-contract of HsienW/chat-gun.

  • SKILL.md
  • agents/openai.yaml
  • references/chat-gun-fe-legacy-refactor.md
  • references/chat-gun-fe-multimodal-streaming.md
  • references/chat-gun-fe-openspec-workflow.md
  • references/chat-gun-fe-react-vite-conventions.md
  • references/chat-gun-fe-streaming-event-contract.md
  • references/chat-gun-fe-tool-renderer.md
  • references/chat-gun-fe-type-boundary.md

Open the folder on GitHubat commit 826d29d

Compare with similar skills

Chat Gun Frontend Contract 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.

Chat Gun Frontend Contract compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Chat Gun Frontend Contract this skillHsienW/chat-gun143—~467Automated safety check: PassCustom licence
Frontend Build Timing Auditopenops-cloud/openops1.1k—~2.3kAutomated safety check: PassCustom licence
Frontend UI FunctionalvictorGPT/vibeusage130—~939Automated safety check: PassMIT
React Best Practicesryokun6/ryos1.3k—~2kAutomated safety check: PassMIT
Composer Pluginsdxos/dxos526—~13kAutomated safety check: PassCustom licence
Project Form PatternsAkaraChen/aghub272—~1.1kAutomated safety check: PassMIT

Similar skills

  • Frontend Build Timing Audit

    openops-cloud/openops

    Detects and diagnoses chunk-evaluation timing bugs in the Vite/rolldown production build of react-ui (works-in-dev / broken-in-build i18n regressions, missing UI labels, module-scope t()…

    1.1k GitHub stars~2.3k tokensUpdated yesterday
    Frontend & DesignAuto-check passed
  • Frontend UI Functional

    victorGPT/vibeusage

    A skill your agent uses when building or refactoring functional React/Vite/Tailwind UI pages, templates, or component libraries that need consistent structure, tokenized styling, accessibility…

    130 GitHub stars~939 tokensUpdated 2 mo ago
    Frontend & DesignAuto-check passed
  • React performance optimization guidelines from Vercel Engineering (vercel-labs/agent-skills).

    1.3k GitHub stars~2k tokensUpdated today
    Frontend & DesignAuto-check passed
  • A skill your agent uses when working on files in packages/plugins/, adding new plugins, refactoring plugin components/containers, writing storybooks for plugins, or wiring capabilities like…

    526 GitHub stars~13k tokensUpdated yesterday
    Frontend & DesignAuto-check passed
  • Project Form Patterns

    AkaraChen/aghub

    Form implementation guidance for the aghub desktop app. An agent skill from AkaraChen/aghub.

    272 GitHub stars~1.1k tokensUpdated 5 days ago
    DevelopmentAuto-check passed
  • Web Artifacts Builder

    anthropics/skills

    Official

    Builds multi-component claude.ai HTML artifacts as a small React, TypeScript and Tailwind project, then bundles it into one shareable HTML file.

    180k GitHub starsUsed in 40 repos~769 tokens
    Frontend & DesignAuto-check passed

More from HsienW/chat-gun

All 8 skills in this repo
  • Node

    HsienW/chat-gun

    Provides domain-specific best practices for Node.js development with TypeScript, covering type stripping, async patterns, error handling, streams, modules, testing, performance, caching, logging…

    143 GitHub stars~1.6k tokensUpdated today
    Auto-check passed
  • MUST be considered at task start in this repository to detect OpenSpec change lifecycle work and route Claude Code/CCR coordination tasks without loading unnecessary context.

    143 GitHub stars~939 tokensUpdated today
    Auto-check passed
  • MUST be considered at task start in this repository to detect OpenSpec change lifecycle work and route it to token-efficient stage prompts.

    143 GitHub stars~907 tokensUpdated today
    Auto-check passed
  • MUST be considered at task start in this repository to detect OpenSpec change lifecycle work and route Qwen Code review tasks without loading unnecessary context.

    143 GitHub stars~923 tokensUpdated today
    Auto-check passed
  • 對 OpenSpec、Git Diff、frontend、bff、backend、LangGraph、Tool、MCP 與安全邊界進行獨立唯讀審查,輸出 Blocker、Major、Minor 與標準 Verdict。

    143 GitHub stars~775 tokensUpdated today
    Auto-check passed
  • Apply when creating, modifying, refactoring, debugging, testing, or reviewing TypeScript, LangGraph JS, LangChain, provider adapter, tool, MCP, prompt, state, checkpoint, runtime event, or backend…

    143 GitHub stars~2.1k tokensUpdated today
    Auto-check passed

Questions about Chat Gun Frontend Contract

What does Chat Gun Frontend Contract do?

Chat Gun 的前端、OpenSpec、Streaming Event、Tool Renderer、型別邊界、多模態流式鏈路與 React/Vite 編程約束。Use when working on frontend code, tool rendering, streaming contracts, multimodal requests/responses, Weather…. Chat Gun Frontend Contract is an agent skill from HsienW/chat-gun. Chat Gun 的前端、OpenSpec、Streaming Event、Tool Renderer、型別邊界、多模態流式鏈路與 React/Vite 編程約束。Use when working on frontend code, tool rendering, streaming contracts, multimodal requests/responses, Weather legacy refactors, or OpenSpec-driven changes in this repository.

When should I use Chat Gun Frontend Contract?

Chat Gun Frontend Contract fits situations like: working on frontend code; streaming contracts; multimodal requests/responses; weather legacy refactors.

How do I install Chat Gun Frontend Contract in Claude Code?

Run `npx skills add HsienW/chat-gun --skill chat-gun-frontend-contract -a claude-code`. Or copy the skill folder (.agents/skills/chat-gun-frontend-contract in HsienW/chat-gun) into .claude/skills/chat-gun-frontend-contract in your project. Claude Code loads it when a task matches its description.

How do I install Chat Gun Frontend Contract in Codex?

Run `npx skills add HsienW/chat-gun --skill chat-gun-frontend-contract -a codex`. Or copy the skill folder (.agents/skills/chat-gun-frontend-contract in HsienW/chat-gun) into .agents/skills/chat-gun-frontend-contract in your project. Codex loads it when a task matches its description.

Can I use Chat Gun Frontend Contract 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 HsienW/chat-gun --skill chat-gun-frontend-contract -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/chat-gun-frontend-contract, .gemini/skills/chat-gun-frontend-contract, .github/skills/chat-gun-frontend-contract and .opencode/skills/chat-gun-frontend-contract in your project.

What does Chat Gun Frontend Contract need to run?

Going by SKILL.md and its folder, Chat Gun Frontend Contract needs the command-line tools its instructions call (npm).

Does Chat Gun Frontend Contract access the network?

SKILL.md contains no URLs. Its commands use npm, which can reach the network depending on how they are called. This is read from the text; nothing was executed.

Is Chat Gun Frontend Contract 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 Chat Gun Frontend Contract use?

Chat Gun Frontend Contract has a licence file (the repository's licence) that doesn't match a standard licence. Read it on GitHub before reusing the skill.

How many tokens does Chat Gun Frontend Contract use?

About 467 tokens (SKILL.md is roughly 1.9k 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 13k tokens, read only when the agent opens those files.

What are the alternatives to Chat Gun Frontend Contract?

Skills that share tags, products or a category with Chat Gun Frontend Contract: Frontend Build Timing Audit (openops-cloud/openops, 1.1k stars), Frontend UI Functional (victorGPT/vibeusage, 130 stars), React Best Practices (ryokun6/ryos, 1.3k stars) and Composer Plugins (dxos/dxos, 526 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Chat Gun Frontend Contract?

HsienW (a GitHub user) maintains it in HsienW/chat-gun, which has 143 GitHub stars. The repository holds 8 skills in this directory. The repository was last updated on October 11, 2026.

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