Use when the user's task involves HiUI (@hi-ui/*) — writing HiUI components, debugging HiUI issues, querying HiUI props/docs, migrating from HiUI V4 to V5, or setting up React 19 compatibility with @hi-ui/patch-for-react. Triggers on imports from '@hi-ui/*', hi-ui/hiui mentions, or explicit HiUI questions.
Installer avec Codex ou Claude Copiez ce prompt, collez-le dans Codex, Claude ou un autre assistant, puis laissez-le vérifier la page du skill et l'installer pour vous.
Une commande directe contourne le prompt de vérification. Examinez la source avant de l'exécuter.
Use when the user's task involves HiUI (@hi-ui/*) — writing HiUI components, debugging HiUI issues, querying HiUI props/docs, migrating from HiUI V4 to V5, or setting up React 19 compatibility with @hi-ui/patch-for-react. Triggers on imports from '@hi-ui/*', hi-ui/hiui mentions, or explicit HiUI questions.
You have access to @hi-ui/hiui-cli — a CLI for querying HiUI component documentation and automating common upgrade tasks. Component docs are fetched from official llms endpoints (network required for list / doc / info / url). Migration and React 19 patch setup run locally on the project filesystem.
Setup
Before first use, check if the CLI is installed. If not, install it:
which hiui || npm install -g @hi-ui/hiui-cli
hiui version
The hiui command comes from the globally installed @hi-ui/hiui-cli package.
Always use --format json for structured output you can parse programmatically.
Scenarios
1. Writing HiUI component code
Before writing any HiUI component code, look up its API first — don't rely on memory.
# Check available props
hiui info Button --format json
# Full docs with usage examples (TSX demos in markdown)
hiui doc Button --format json
hiui url Button --format json
HiUI packages use kebab-case names (@hi-ui/date-picker). Component CLI args accept Button, datePicker, or date-picker (auto-normalized to kebab-case).
Import patterns:
// Full bundleimport { Button, Input } from'@hi-ui/hiui'// Per-component (recommended for existing apps)importButtonfrom'@hi-ui/button'importInputfrom'@hi-ui/input'import { InfoCircleFilled } from'@hi-ui/icons'
2. Looking up full documentation
When you need comprehensive component docs (not just props):
hiui doc Table --format json
Markdown includes description, usage examples, and props tables. Source: https://xiaomi.github.io/hiui/llms/<component>.md.
3. Exploring available components
When choosing which component to use:
hiui list --format json
Index is derived from llms.txt. For offline context, you can also reference llms-full.txt.
4. Migrating HiUI V4 → V5
When upgrading a project from HiUI 4.x to 5.x:
# Preview changes (no writes)
hiui migrate 4 5 --dry-run --format json
# Apply to current directory
hiui migrate 4 5 --format json
# Monorepo sub-app
hiui migrate 4 5 --path ./apps/web --format json
# Only bump @hi-ui/* in package.json
hiui migrate 4 5 --deps-only
# Only replace .hi-v4 / hi-v4- class prefixes
hiui migrate 4 5 --class-only
What migrate 4 5 does:
Sets @hi-ui/* in all package.json files to ^5.0.0 (excludes tooling like @hi-ui/hi-build)
Replaces .hi-v4 → .hi-v5 and hi-v4- → hi-v5- in project source/styles
What it does NOT do: API breaking changes, import path refactors, or business logic. After migrate, run npm install or yarn, then fix remaining issues manually. See project migration docs.
Workflow:hiui migrate 4 5 --dry-run → review → hiui migrate 4 5 → install deps → hiui doc / hiui info per changed component → fix API usage.
Currently only 4 → 5 is supported; other version pairs return UNSUPPORTED_MIGRATION.
5. React 19 compatibility
When the project uses React 19 and needs ReactDOM.render / legacy static APIs patched for HiUI:
