@baneung-pack
Selection

Calendar

월간 일정 캘린더 (Google Calendar 스타일). 1일/range/다중 lane/더보기/드래그-드롭 지원.

예제

31
1
2
3
4
5
6
디자인 리뷰
7
8
9
10
11
12
13
사내 워크샵
00:00점심 미팅
14
15
16
17
18
19
20
컨퍼런스 출장
발표 준비
리뷰 회의
21
22
23
24
25
26
27
컨퍼런스 출장
연휴
28
29
30
1
2
3
4
5
6
7
8
9
10
11

설치 / Import

import { Calendar } from '@baneung-pack/ui';
import { Calendar } from '@baneung-pack/ui/calendar';

서브패스 import는 트리쉐이킹 친화 — 사용하지 않는 다른 컴포넌트는 번들에 포함되지 않습니다.

API

Property설명Type기본값
events표시할 일정 배열CalendarEvent[]
month표시 월 (controlled)Date
defaultMonth표시 월 초기값Date
onMonthChange월 변경 콜백(date: Date) => void
onEventClick일정 클릭(event) => void
onEventMove일정 드래그 이동 — 전달 시 DnD 활성(event, start, end) => void
maxVisible셀당 최대 표시 일정 수number3
locale표시 언어CalendarLocale | Locale'ko'