Textarea
설치 확인여러 줄 입력, 글자 수
1. 목적과 출처
여러 줄 입력, 글자 수
- 출처
- shadcn 기본 제공 (Base UI 기반 base-nova 스타일)
- 프로젝트
src/components/ui/textarea.tsx- Registry
@adcapsule/textarea
2. 프리뷰와 변형
오른쪽 위에서 색 모드를 바꾸면 라이트·다크를 비교할 수 있습니다.
| 상태 | 모양 |
|---|---|
| 기본 | |
| 내용에 맞춰 늘어남 | |
| 비활성 disabled | |
| 오류 aria-invalid |
3. 속성 바꿔 보기
0/200
4. 설치와 사용
- npm 패키지
- 없음
- 함께 설치
- @adcapsule/utils
처음 쓰는 프로젝트는 @adcapsule/theme를 먼저 설치합니다. Registry 연결
5. 바꿔도 되는 것과 유지할 토큰
제품에서 바꿔도 되는 것
- rows·maxLength 등 textarea 속성
- disabled / aria-invalid
- 글자 수 표시는 화면에서 따로 그림(컴포넌트에 없음)
- 높이는 내용에 맞춰 늘어남(field-sizing)
공통으로 유지할 토큰
- border.strong (테두리)
- accent.default (포커스 링)
- status.danger (오류)
- radius.md (모서리 6px)