사용 방법
- 설치 명령을 복사하고 자신의 에이전트 환경에 설치하기 전에 소스 패키지를 확인하세요.
- 필요한 도구, 인증 정보, 지원 환경은 원본 문서에서 확인하세요.
- 입력과 원하는 산출물을 설명하고 출처와 결과를 대조하세요.
npx skills add https://github.com/arla6ka/design.how --skill component-docs시작 전 확인
- 설치에는 모델 구독, API 한도, 파일 접근 권한이 포함되지 않습니다.
- 별점 수와 설치 수는 활동 지표이며 독립적인 품질·보안 검증이 아닙니다.
원본 저장소의 제목, 예시, 코드, 표, 링크, 이미지를 유지해 표시합니다.
Component docs
A draft entry for one component, built only from what its sources say. Gaps are marked, not filled. It does not judge the design and it publishes nothing. The heading order and a worked example are in references/doc-format.md.
Steps
- Paste the nine headings from
references/doc-format.mdinto the draft, empty. - Find the component. Read its code, props type, styles and stories, and record each as a Sources line.
- Find two real uses, by call-site search or from the ask. One real use or none changes the stop table below.
- Trace which source gave each example, variant, prop, state and token. Every disagreement between sources is a line under Conflicts, with the quoted rule that settles it, or "no rule, not chosen".
- Fill each section from sourced facts, copying token names and example code character for character.
- Write Usage rules last. Each rule is
rule/<component>-<slug>, a condition, an action, a reason, its evidence (two call sites, a measurement with its path, a named principle, or the person's words), and aDon't:line with real code that breaks it. A rule you cannot break with a snippet is cut. - Fill Guessed at, one line per judgement call. Reread the draft against the Done list below.
Output
The entry, then Sources, Conflicts, Guessed at, and Gates (a question with its default) only where a rule adds one. Run on its own, it saves to docs/system/<name>.md with a draft comment on line 1 and writes each missing example file. The reply opens with the path, what the entry covers and its status, then up to three questions with defaults and one prompt the person can paste to take the next step.
Stops
| Missing after searching | Why it stops |
|---|---|
| The code | Nothing else sources the variants, props or behaviour |
| The variant list (props type or stories) | A guessed list documents a different component |
| Any use, real or planned | Invented uses read like real ones and readers copy them first |
A props type with no variant prop is an empty list. Variants reads "None" and the run goes on. One real use, planned uses and a deprecated predecessor are marked as such, not stopped on. A stopped run returns the stop, the facts sourced so far by section, and the smallest reply that unblocks it ("one screen name, what put the component there, and which variant showed").
Rules
- Never write a variant, prop, token name, example or use that has no listed source. A planned use says planned.
- Never invent a state or a precedence order to make a section look complete.
- A behaviour that looks like a bug is written as it is, followed by a
Defect:line to the owner with what goes wrong for the user and the smallest fix. - A part also used on its own gets a
### Partssubsection under Description. A compound component (TabswithTab) is one entry. - Do not edit the code, stories or spec being documented.
- Counts in the reply come from
grep -oon the saved file, below the draft comment.
Done
Every variant, prop, token and example has a Sources line. Every Usage rule has evidence and a Don't: line. Every conflict is shown. The nine headings are present in order, and a section with nothing sourced reads Not applicable: <reason>.


