react-aria-patterns
✓후크를 사용하여 WCAG 호환 대화형 UI를 구축하기 위한 React Aria(Adobe) 액세스 가능 구성 요소 패턴입니다. React 애플리케이션에서 버튼, 대화 상자, 콤보 상자, 메뉴 및 기타 액세스 가능한 구성 요소를 구현할 때 사용합니다.
SKILL.md
Build accessible UI components using Adobe's React Aria hooks library with React 19 patterns.
| Decision | Option A | Option B | Recommendation |
| Hook vs Component | useButton hooks | Button from react-aria-components | Hooks for control, Components for speed | | Focus Management | Manual tabIndex | FocusScope component | FocusScope - trapping, restore, auto-focus | | Virtual Lists | Native scroll | useVirtualizer + useListBox | Virtualizer for lists > 100 items |
후크를 사용하여 WCAG 호환 대화형 UI를 구축하기 위한 React Aria(Adobe) 액세스 가능 구성 요소 패턴입니다. React 애플리케이션에서 버튼, 대화 상자, 콤보 상자, 메뉴 및 기타 액세스 가능한 구성 요소를 구현할 때 사용합니다. 출처: yonatangross/skillforge-claude-plugin.
인용 가능한 정보
AI/검색 인용용 안정적인 필드와 명령어.
- 설치 명령어
npx skills add https://github.com/yonatangross/skillforge-claude-plugin --skill react-aria-patterns- 카테고리
- </>개발 도구
- 인증됨
- ✓
- 최초 등록
- 2026-02-01
- 업데이트
- 2026-02-18
빠른 답변
react-aria-patterns이란?
후크를 사용하여 WCAG 호환 대화형 UI를 구축하기 위한 React Aria(Adobe) 액세스 가능 구성 요소 패턴입니다. React 애플리케이션에서 버튼, 대화 상자, 콤보 상자, 메뉴 및 기타 액세스 가능한 구성 요소를 구현할 때 사용합니다. 출처: yonatangross/skillforge-claude-plugin.
react-aria-patterns 설치 방법은?
터미널 또는 명령줄 도구(Terminal, iTerm, Windows Terminal 등)를 엽니다 이 명령어를 복사하여 실행합니다: npx skills add https://github.com/yonatangross/skillforge-claude-plugin --skill react-aria-patterns 설치 후 스킬은 자동으로 AI 코딩 환경에 설정되어 Claude Code나 Cursor에서 사용할 수 있습니다
소스 저장소는 어디인가요?
https://github.com/yonatangross/skillforge-claude-plugin
상세
- 카테고리
- </>개발 도구
- 출처
- skills.sh
- 최초 등록
- 2026-02-01