시간 선택기
실험primitive시와 분을 골라 시각을 입력합니다. 24시간·12시간 형식 중 고를 수 있습니다.
@tissue-ui/layout-react설치
bash
npm install @tissue-ui/layout-reacttsx
import { TimePicker } from "@tissue-ui/layout-react";언제 쓰나
- 시각을 입력받을 때. 24시간·12시간 중 고를 수 있습니다.
플레이그라운드
format
disabled
tsx
<TimePicker format="24h" label="예약 시간" value={value} onChange={setValue} />예제
24시간 · 12시간
format 으로 표시 형식을 바꿉니다. 값은 항상 24시간 "HH:MM".
분 간격
minuteStep 으로 분 선택 간격을 정합니다(기본 5분).
1분 간격 · 오류
시각을 입력하세요.
속성
| 속성 | 타입 | 설명 |
|---|---|---|
| value | string | 고른 시각입니다 (HH:MM, 24시간). |
| onChange | node | 시각이 바뀔 때 실행됩니다. |
| format | 24h | 12h | 표시 형식입니다. 24h(00~23) 또는 12h(오전·오후). 기본 24h. |
| minuteStep | string | 분 간격입니다 (기본 5분). |
| label | string | 옆에 붙는 이름입니다 (선택). |
| error | string | 오류 메시지입니다. |
| disabled | boolean | 선택을 막습니다. |
위 옵션 말고도 className·onClick 같은 일반 HTML 속성을 그대로 넘길 수 있습니다.
상태
defaultfocusdisablederror
data 속성
data-disableddata-error
이 페이지의 옵션·상태는 실제 코드 정의에서 그대로 가져온 것입니다. 에이전트는 같은 내용을 llms.txt 로 읽습니다.