ZARITALK DESIGN DOCS
Tokens
Colors
Type Scale
Components
Button
Input
Typography
Alert
Badge
Tag
Tab
CheckBox
Toggle
Rating
Modal
BottomSheet
Divider
LoadingSpinner
Skeleton
Radio
TextArea
DropDown
Tooltip
SplitRating
Slider
AutoHeightTextArea
Avatar
HighlightTypography
RedDot
HR
VR
Overlay
Loading
Popup
Menu
AlertWithConfirmButton
MultiCheckBox
TabBottomBorder
Calendar
DatePicker
TimePicker
WeekPicker
DayPicker
InfiniteScroll
PullToRefresh
RevealAnimation
SignaturePad
ImagePreview
Variants
Design Docs
DayPicker월별 날짜(일)를 다중 선택할 수 있는 컴포넌트입니다. 특정 월의 여러 날짜를 선택할 수 있습니다.
Examples
Basic Usage월별 날짜 다중 선택 (2019년 7월 기준)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
(말일)
선택된 날짜:선택된 날짜가 없습니다
날짜를 클릭하여 선택/해제할 수 있습니다. 여러 날짜를 동시에 선택 가능합니다.
Implementation Note컴포넌트 구조 및 사용 방법
고정된 날짜 범위이 컴포넌트는 내부적으로 2019년 7월을 기준으로 동작합니다. 실제 사용 시 현재 날짜 기반 로직으로 수정이 필요할 수 있습니다.선택 방식클릭 시 해당 날짜가 배열에 추가되거나 제거됩니다. 반환되는 배열은 항상 정렬된 상태로 유지됩니다.
Props
NameTypeDefaultRequiredDescription
selectedDatestring[]-선택된 날짜 배열 (숫자 배열, 예: [1, 5, 10])
onClickstringYes날짜 선택 시 호출되는 콜백 함수 - 업데이트된 날짜 배열을 인자로 받음