날짜 선택기

실험primitive

날짜를 고르는 입력칸입니다. 달력에서 고르거나 직접 적을 수 있습니다.

@tissue-ui/layout-react

설치

bash
npm install @tissue-ui/layout-react
tsx
import { DatePicker } from "@tissue-ui/layout-react";

언제 쓰나

  • 날짜를 입력받을 때(YYYY.MM.DD).

플레이그라운드

disabled
tsx
<DatePicker label="예약일" value={value} onChange={setValue} />

예제

기본
오류 · 비활성
기간 선택
두 개를 나란히 두어 시작·종료 기간을 받습니다.

속성

속성타입설명
valuestring고른 날짜입니다 (YYYY-MM-DD).
onChangenode날짜가 바뀔 때 실행됩니다.
labelstring옆에 붙는 이름입니다 (선택).
errorstring오류 메시지입니다.
disabledboolean선택을 막습니다.

위 옵션 말고도 className·onClick 같은 일반 HTML 속성을 그대로 넘길 수 있습니다.

상태
defaulthoverfocusdisablederror
data 속성
data-disableddata-error
이 페이지의 옵션·상태는 실제 코드 정의에서 그대로 가져온 것입니다. 에이전트는 같은 내용을 llms.txt 로 읽습니다.