1# Calendar
2 
3Date selection grid (alpha)
4 
5**Parts:** `CalendarRoot`, `CalendarHeader`, `CalendarHeading`, `CalendarGrid`, `CalendarGridHead`, `CalendarGridBody`, `CalendarGridRow`, `CalendarCell`, `CalendarCellTrigger`, `CalendarHeadCell`, `CalendarNext`, `CalendarPrev`
6 
7## CalendarRoot
8 
9### Props
10| Prop | Type | Default |
11|------|------|---------|
12| `as` | `AsTag \| Component` | `"div"` |
13| `asChild` | `boolean` | - |
14| `calendarLabel` | `string` | - |
15| `defaultPlaceholder` | `DateValue` | - |
16| `defaultValue` | `DateValue` | - |
17| `dir` | `"ltr" \| "rtl"` | - |
18| `disabled` | `boolean` | `false` |
19| `fixedWeeks` | `boolean` | `false` |
20| `initialFocus` | `boolean` | `false` |
21| `isDateDisabled` | `Matcher` | - |
22| `isDateUnavailable` | `Matcher` | - |
23| `locale` | `string` | `"en"` |
24| `maxValue` | `DateValue` | - |
25| `minValue` | `DateValue` | - |
26| `modelValue` | `DateValue \| DateValue[]` | - |
27| `multiple` | `boolean` | `false` |
28| `nextPage` | `((placeholder: DateValue) => DateValue)` | - |
29| `numberOfMonths` | `number` | `1` |
30| `pagedNavigation` | `boolean` | `false` |
31| `placeholder` | `DateValue` | - |
32| `preventDeselect` | `boolean` | `false` |
33| `prevPage` | `((placeholder: DateValue) => DateValue)` | - |
34| `readonly` | `boolean` | `false` |
35| `weekdayFormat` | `"narrow" \| "short" \| "long"` | `"narrow"` |
36| `weekStartsOn` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6` | `0` |
37 
38### Emits
39| Event | Payload |
40|-------|---------|
41| `update:modelValue` | `[date: DateValue]` |
42| `update:placeholder` | `[date: DateValue]` |
43 
44### Slots
45| Slot | Type |
46|------|------|
47| `date` | `DateValue` |
48| `grid` | `Grid<DateValue>[]` |
49| `weekDays` | `string[]` |
50| `weekStartsOn` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6` |
51| `locale` | `string` |
52| `fixedWeeks` | `boolean` |
53 
54## CalendarHeader
55 
56### Props
57| Prop | Type | Default |
58|------|------|---------|
59| `as` | `AsTag \| Component` | `"div"` |
60| `asChild` | `boolean` | - |
61 
62## CalendarHeading
63 
64### Props
65| Prop | Type | Default |
66|------|------|---------|
67| `as` | `AsTag \| Component` | `"div"` |
68| `asChild` | `boolean` | - |
69 
70### Slots
71| Slot | Type |
72|------|------|
73| `headingValue` | `string` |
74 
75## CalendarGrid
76 
77### Props
78| Prop | Type | Default |
79|------|------|---------|
80| `as` | `AsTag \| Component` | `"table"` |
81| `asChild` | `boolean` | - |
82 
83## CalendarGridHead
84 
85### Props
86| Prop | Type | Default |
87|------|------|---------|
88| `as` | `AsTag \| Component` | `"thead"` |
89| `asChild` | `boolean` | - |
90 
91## CalendarGridBody
92 
93### Props
94| Prop | Type | Default |
95|------|------|---------|
96| `as` | `AsTag \| Component` | `"tbody"` |
97| `asChild` | `boolean` | - |
98 
99## CalendarGridRow
100 
101### Props
102| Prop | Type | Default |
103|------|------|---------|
104| `as` | `AsTag \| Component` | `"tr"` |
105| `asChild` | `boolean` | - |
106 
107## CalendarCell
108 
109### Props
110| Prop | Type | Default |
111|------|------|---------|
112| `as` | `AsTag \| Component` | `"td"` |
113| `asChild` | `boolean` | - |
114| `date`* | `DateValue` | - |
115 
116## CalendarCellTrigger
117 
118### Props
119| Prop | Type | Default |
120|------|------|---------|
121| `as` | `AsTag \| Component` | `"div"` |
122| `asChild` | `boolean` | - |
123| `day`* | `DateValue` | - |
124| `month`* | `DateValue` | - |
125 
126### Slots
127| Slot | Type |
128|------|------|
129| `dayValue` | `string` |
130 
131## CalendarHeadCell
132 
133### Props
134| Prop | Type | Default |
135|------|------|---------|
136| `as` | `AsTag \| Component` | `"th"` |
137| `asChild` | `boolean` | - |
138 
139## CalendarNext
140 
141### Props
142| Prop | Type | Default |
143|------|------|---------|
144| `as` | `AsTag \| Component` | `"button"` |
145| `asChild` | `boolean` | - |
146| `nextPage` | `((placeholder: DateValue) => DateValue)` | - |
147| `step` | `"month" \| "year"` | `"month"` |
148 
149## CalendarPrev
150 
151### Props
152| Prop | Type | Default |
153|------|------|---------|
154| `as` | `AsTag \| Component` | `"button"` |
155| `asChild` | `boolean` | - |
156| `prevPage` | `((placeholder: DateValue) => DateValue)` | - |
157| `step` | `"month" \| "year"` | `"month"` |
158