goorm-dev
- 4 skills
- 0 followers
- 7 hours ago last updated
- ▌ Token Lint · goorm-dev bundle지정한 경로의 vapor 디자인 토큰 CSS 변수 사용을 검사합니다. .css/.scss/.sass/.less/.ts/.tsx/.js/.jsx 파일에서 `var(--vapor-...)` 참조를 스캔하여, 정식 토큰 집합에 없는 이름을 신고하고 세그먼트 정렬 Damerau-Levenshtein 합 거리 2 이내의 가장 가까운 유효 토큰을 최대 3개까지 제안합니다. 사용자가 디자인 토큰 린트, 토큰 오타 검사, vapor 토큰 사용 검증, Figma에서 코드로 변환한 결과의 `var(--vapor-)` 참조 감사를 언급하거나 `/token-lint <path>`를 요청할 때 사용하세요. 디자인 의도 단계의 린트(의미 범위, 사용 가능/금지 여부)는 Figma 단계에서 이미 끝난 것으로 가정합니다 — 이 스킬은 개발자가 토큰을 코드에 옮겨 적는 과정에서 발생하는 전사 오타만 잡습니다. 자동 수정은 하지 않고 제안만 합니다.
- ▌ Figma Token Review · goorm-dev bundleFigma 시안에서 vapor 디자인 토큰(색상 + typography)이 올바르게 쓰였는지 4축으로 검증하는 스킬. Figma URL이 등장하고 토큰·색상·폰트·스타일 사용에 대한 질문이 조금이라도 있으면 반드시 이 스킬을 써라. 사용자가 "토큰 검토", "색상 맞게 썼어?", "폰트 위계", "Text Style", "do-not-use", "raw 색", "토큰 사용성", "디자인 토큰 적법성", "fg 배경 맞아?" 같은 표현을 쓰거나, Figma 링크를 던지며 "이거 맞아?", "확인해줘", "리뷰해줘"라고만 해도 이 스킬을 적용한다. 영어로 "check token usage", "review design tokens", "color token audit", "typography hierarchy", "is this token correct" 같이 물어도 마찬가지다. 이 스킬은 4축(raw/바인딩 · semantic 의미 · typography 위계 · 배경-전경 짝)을 결정론(코드)과 의미 판정(LLM)으로 나눠 PASS/FAIL + confidence + 근거 + 대체 토큰을 출력한다. 단, "컴포넌트 가이드라인 ↔ 코드 props 간극" 비교는 design-gap 스킬의 영역이다.
- ▌ Write Component Jsdocs · goorm-dev bundleGuide for writing JSDoc comments on vapor-ui components and their props. Use when adding, reviewing, or fixing JSDoc on component tsx files or css.ts variant files. Covers where to place comments based on component pattern — standalone, compound root, compound sub-part — language and format rules, and a checklist for review. Triggers on requests like add jsdocs, write component docs, document props, jsdoc 작성, or when reviewing a component documentation completeness.
- ▌