컴포넌트
InputCopy
복사 버튼이 내장된 읽기 전용 인풋으로, 클릭 시 값을 클립보드에 복사하고 체크 아이콘·복사됨 라벨과 브랜드 컬러 스윕 하이라이트로 성공을 피드백한다.
- 분류
- 컴포넌트
- 난이도
- easy
- 변형
- TS-TW
설치
npx shadcn@latest add https://gasan.ai.kr/tools/effect/r/InputCopy-TS-TW
Props
| 이름 | 타입 | 기본값 | 설명 |
|---|---|---|---|
| value | string | vivid-kit.dev/share/a1b2c3 | 인풋에 표시하고 복사할 값 |
| label | string | "" | 필드 상단 설명 라벨 (빈 문자열이면 미표시) |
| copyLabel | string | 복사 | 복사 대기 상태의 버튼 라벨 |
| copiedLabel | string | 복사됨 | 복사 성공 후 버튼에 표시할 라벨 |
| resetDelay | number | 1800 | 성공(복사됨) 상태를 유지하는 시간(ms) |
| onCopy | (success: boolean, value: string) => void | undefined | 복사 시도 후 성공 여부와 복사된 값을 전달하는 콜백 |