@rio-cloud/uikit-mcp 1.1.11 → 1.1.12
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/doc-metadata.json +26 -26
- package/dist/docs/components/accentBar.md +1 -1
- package/dist/docs/components/activity.md +1 -1
- package/dist/docs/components/analyticsAnalysisOverlay.md +1 -1
- package/dist/docs/components/animatedNumber.md +2 -2
- package/dist/docs/components/animatedTextReveal.md +6 -6
- package/dist/docs/components/animations.md +21 -21
- package/dist/docs/components/appHeader.md +1 -1
- package/dist/docs/components/appLayout.md +39 -23
- package/dist/docs/components/appNavigationBar.md +1 -1
- package/dist/docs/components/areaCharts.md +4 -4
- package/dist/docs/components/aspectRatioPlaceholder.md +1 -1
- package/dist/docs/components/assetTree.md +384 -420
- package/dist/docs/components/autosuggests.md +1 -1
- package/dist/docs/components/avatar.md +1 -1
- package/dist/docs/components/banner.md +2 -2
- package/dist/docs/components/barCharts.md +13 -13
- package/dist/docs/components/barList.md +10 -10
- package/dist/docs/components/basicMap.md +1 -1
- package/dist/docs/components/bottomSheet.md +1 -1
- package/dist/docs/components/button.md +1 -1
- package/dist/docs/components/buttonToolbar.md +1 -1
- package/dist/docs/components/calendarStripe.md +45 -49
- package/dist/docs/components/card.md +1 -1
- package/dist/docs/components/carousel.md +1 -1
- package/dist/docs/components/chartColors.md +1 -1
- package/dist/docs/components/chartsGettingStarted.md +1 -1
- package/dist/docs/components/chat.md +2 -2
- package/dist/docs/components/checkbox.md +1 -1
- package/dist/docs/components/circularProgress.md +8 -8
- package/dist/docs/components/clearableInput.md +1 -1
- package/dist/docs/components/collapse.md +2 -2
- package/dist/docs/components/composedCharts.md +15 -15
- package/dist/docs/components/contentLoader.md +1 -1
- package/dist/docs/components/dataTabs.md +1 -1
- package/dist/docs/components/datepickers.md +660 -660
- package/dist/docs/components/dayPicker.md +5 -5
- package/dist/docs/components/dayPickerCalendar.md +469 -469
- package/dist/docs/components/dialogs.md +1 -1
- package/dist/docs/components/divider.md +1 -1
- package/dist/docs/components/dropdowns.md +3270 -3256
- package/dist/docs/components/editableContent.md +1 -1
- package/dist/docs/components/expander.md +1 -1
- package/dist/docs/components/fade.md +1 -1
- package/dist/docs/components/fadeExpander.md +1 -1
- package/dist/docs/components/fadeUp.md +2 -2
- package/dist/docs/components/feedback.md +1 -1
- package/dist/docs/components/filePickers.md +1 -1
- package/dist/docs/components/formLabel.md +1 -1
- package/dist/docs/components/groupedItemList.md +1 -1
- package/dist/docs/components/htmlTable.md +111 -113
- package/dist/docs/components/iconList.md +3 -3
- package/dist/docs/components/imagePreloader.md +1 -1
- package/dist/docs/components/labeledElement.md +1 -1
- package/dist/docs/components/licensePlate.md +1 -1
- package/dist/docs/components/lineCharts.md +3 -3
- package/dist/docs/components/listMenu.md +1 -1
- package/dist/docs/components/loadMore.md +1 -1
- package/dist/docs/components/mainNavigation.md +1 -1
- package/dist/docs/components/mapCircle.md +1 -1
- package/dist/docs/components/mapCluster.md +1 -1
- package/dist/docs/components/mapContext.md +1 -1
- package/dist/docs/components/mapDraggableMarker.md +1 -1
- package/dist/docs/components/mapGettingStarted.md +1 -1
- package/dist/docs/components/mapInfoBubble.md +1 -1
- package/dist/docs/components/mapLayerGroup.md +1 -1
- package/dist/docs/components/mapMarker.md +1 -1
- package/dist/docs/components/mapPolygon.md +1 -1
- package/dist/docs/components/mapRoute.md +1 -1
- package/dist/docs/components/mapSettings.md +31 -9
- package/dist/docs/components/mapUtils.md +65 -2
- package/dist/docs/components/mapViewportHistory.md +1 -1
- package/dist/docs/components/multiselects.md +165 -1
- package/dist/docs/components/noData.md +1 -1
- package/dist/docs/components/notifications.md +1 -1
- package/dist/docs/components/numbercontrol.md +1 -1
- package/dist/docs/components/onboarding.md +1 -1
- package/dist/docs/components/page.md +1 -1
- package/dist/docs/components/pager.md +1 -1
- package/dist/docs/components/pieCharts.md +36 -36
- package/dist/docs/components/popover.md +1 -1
- package/dist/docs/components/position.md +1 -1
- package/dist/docs/components/radialBarCharts.md +25 -25
- package/dist/docs/components/radioCardGroup.md +1 -1
- package/dist/docs/components/radiobutton.md +1 -1
- package/dist/docs/components/releaseNotes.md +1 -1
- package/dist/docs/components/resizer.md +1 -1
- package/dist/docs/components/responsiveColumnStripe.md +1 -1
- package/dist/docs/components/responsiveVideo.md +1 -1
- package/dist/docs/components/rioglyph.md +1 -1
- package/dist/docs/components/rules.md +1 -1
- package/dist/docs/components/saveableInput.md +247 -247
- package/dist/docs/components/selects.md +1 -1
- package/dist/docs/components/sidebar.md +1 -1
- package/dist/docs/components/sliders.md +1 -1
- package/dist/docs/components/smoothScrollbars.md +1 -1
- package/dist/docs/components/spinners.md +1 -1
- package/dist/docs/components/states.md +1 -1
- package/dist/docs/components/statsWidgets.md +1 -1
- package/dist/docs/components/statusBar.md +1 -1
- package/dist/docs/components/stepButton.md +1 -1
- package/dist/docs/components/steppedProgressBars.md +1 -1
- package/dist/docs/components/subNavigation.md +1 -1
- package/dist/docs/components/supportMarker.md +1 -1
- package/dist/docs/components/svgImage.md +1 -1
- package/dist/docs/components/switch.md +1 -1
- package/dist/docs/components/table.md +14 -14
- package/dist/docs/components/tableControls.md +51 -51
- package/dist/docs/components/tagManager.md +1 -1
- package/dist/docs/components/tags.md +1 -1
- package/dist/docs/components/teaser.md +1 -1
- package/dist/docs/components/textTruncateMiddle.md +1 -1
- package/dist/docs/components/timeline.md +1 -1
- package/dist/docs/components/timepicker.md +1 -1
- package/dist/docs/components/toggleButton.md +1 -1
- package/dist/docs/components/tooltip.md +1 -1
- package/dist/docs/components/tracker.md +1 -1
- package/dist/docs/components/virtualList.md +55 -53
- package/dist/docs/foundations.md +105 -105
- package/dist/docs/start/changelog.md +25 -213
- package/dist/docs/start/goodtoknow.md +1 -1
- package/dist/docs/start/guidelines/color-combinations.md +1 -1
- package/dist/docs/start/guidelines/custom-css.md +1 -1
- package/dist/docs/start/guidelines/custom-rioglyph.md +1 -1
- package/dist/docs/start/guidelines/formatting.md +1 -1
- package/dist/docs/start/guidelines/iframe.md +1 -1
- package/dist/docs/start/guidelines/obfuscate-data.md +1 -1
- package/dist/docs/start/guidelines/print-css.md +1 -1
- package/dist/docs/start/guidelines/spinner.md +1 -1
- package/dist/docs/start/guidelines/state-in-url.md +1 -1
- package/dist/docs/start/guidelines/supported-browsers.md +1 -1
- package/dist/docs/start/guidelines/writing.md +1 -1
- package/dist/docs/start/howto.md +16 -16
- package/dist/docs/start/intro.md +2 -2
- package/dist/docs/start/responsiveness.md +1 -1
- package/dist/docs/templates/ai-assistant.md +1 -1
- package/dist/docs/templates/common-table.md +55 -55
- package/dist/docs/templates/detail-views.md +2 -2
- package/dist/docs/templates/expandable-details.md +1 -1
- package/dist/docs/templates/feature-cards.md +37 -37
- package/dist/docs/templates/form-summary.md +15 -15
- package/dist/docs/templates/form-toggle.md +1 -1
- package/dist/docs/templates/list-blocks.md +137 -137
- package/dist/docs/templates/loading-progress.md +1 -1
- package/dist/docs/templates/options-panel.md +1 -1
- package/dist/docs/templates/panel-variants.md +1 -1
- package/dist/docs/templates/progress-cards.md +1 -1
- package/dist/docs/templates/progress-success.md +1 -1
- package/dist/docs/templates/settings-form.md +18 -18
- package/dist/docs/templates/stats-blocks.md +12 -12
- package/dist/docs/templates/table-panel.md +1 -1
- package/dist/docs/templates/usage-cards.md +1 -1
- package/dist/docs/utilities/classNames.md +1 -1
- package/dist/docs/utilities/deviceUtils.md +1 -1
- package/dist/docs/utilities/featureToggles.md +1 -1
- package/dist/docs/utilities/fuelTypeUtils.md +1 -1
- package/dist/docs/utilities/getTrackingAttributes.md +1 -1
- package/dist/docs/utilities/routeUtils.md +1 -1
- package/dist/docs/utilities/useAfterMount.md +1 -1
- package/dist/docs/utilities/useAutoAnimate.md +1 -1
- package/dist/docs/utilities/useAverage.md +1 -1
- package/dist/docs/utilities/useClickOutside.md +1 -1
- package/dist/docs/utilities/useClipboard.md +2 -2
- package/dist/docs/utilities/useCookies.md +1 -1
- package/dist/docs/utilities/useCount.md +1 -1
- package/dist/docs/utilities/useDarkMode.md +1 -1
- package/dist/docs/utilities/useDebugInfo.md +3 -3
- package/dist/docs/utilities/useDraggableElement.md +1 -1
- package/dist/docs/utilities/useEffectOnce.md +1 -1
- package/dist/docs/utilities/useElapsedTime.md +1 -1
- package/dist/docs/utilities/useElementSize.md +1 -1
- package/dist/docs/utilities/useEsc.md +1 -1
- package/dist/docs/utilities/useEvent.md +1 -1
- package/dist/docs/utilities/useFocusTrap.md +1 -1
- package/dist/docs/utilities/useFullscreen.md +1 -1
- package/dist/docs/utilities/useHover.md +1 -1
- package/dist/docs/utilities/useIncomingPostMessages.md +1 -1
- package/dist/docs/utilities/useInterval.md +1 -1
- package/dist/docs/utilities/useIsFocusWithin.md +1 -1
- package/dist/docs/utilities/useKey.md +1 -1
- package/dist/docs/utilities/useLocalStorage.md +1 -1
- package/dist/docs/utilities/useLocationSuggestions.md +1 -1
- package/dist/docs/utilities/useMax.md +1 -1
- package/dist/docs/utilities/useMin.md +1 -1
- package/dist/docs/utilities/useMutationObserver.md +1 -1
- package/dist/docs/utilities/useOnScreen.md +1 -1
- package/dist/docs/utilities/useOnlineStatus.md +1 -1
- package/dist/docs/utilities/usePostMessage.md +1 -1
- package/dist/docs/utilities/usePostMessageSender.md +1 -1
- package/dist/docs/utilities/usePrevious.md +1 -1
- package/dist/docs/utilities/useResizeObserver.md +1 -1
- package/dist/docs/utilities/useRioCookieConsent.md +1 -1
- package/dist/docs/utilities/useScrollPosition.md +1 -1
- package/dist/docs/utilities/useSearch.md +1 -1
- package/dist/docs/utilities/useSearchHighlight.md +1 -1
- package/dist/docs/utilities/useSorting.md +1 -1
- package/dist/docs/utilities/useStateWithValidation.md +1 -1
- package/dist/docs/utilities/useSum.md +1 -1
- package/dist/docs/utilities/useTableExport.md +61 -61
- package/dist/docs/utilities/useTableSelection.md +72 -72
- package/dist/docs/utilities/useTimeout.md +1 -1
- package/dist/docs/utilities/useToggle.md +1 -1
- package/dist/docs/utilities/useUrlState.md +1 -1
- package/dist/docs/utilities/useWindowResize.md +1 -1
- package/dist/index.mjs +1 -1
- package/dist/version.json +2 -2
- package/package.json +7 -4
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
*Category:* Components
|
|
4
4
|
*Section:* Pickers
|
|
5
5
|
*Source:* https://uikit.developers.rio.cloud/#/components/dayPickerCalendar
|
|
6
|
-
*Captured:* 2026-
|
|
6
|
+
*Captured:* 2026-05-06T12:13:52.067Z
|
|
7
7
|
|
|
8
8
|
DayPickerCalendar is the lower-level calendar wrapper without input or dropdown. Use it when you only need calendar selection or when you want to build your own shell around it.
|
|
9
9
|
|
|
@@ -18,14 +18,14 @@ The calendar wrapper exposes the supported selection modes without coupling cons
|
|
|
18
18
|
### Example: Single date
|
|
19
19
|
|
|
20
20
|
Single date
|
|
21
|
-
January February March April May June July August September October November December
|
|
21
|
+
January February March April May June July August September October November December May 1926 1927 1928 1929 1930 1931 1932 1933 1934 1935 1936 1937 1938 1939 1940 1941 1942 1943 1944 1945 1946 1947 1948 1949 1950 1951 1952 1953 1954 1955 1956 1957 1958 1959 1960 1961 1962 1963 1964 1965 1966 1967 1968 1969 1970 1971 1972 1973 1974 1975 1976 1977 1978 1979 1980 1981 1982 1983 1984 1985 1986 1987 1988 1989 1990 1991 1992 1993 1994 1995 1996 1997 1998 1999 2000 2001 2002 2003 2004 2005 2006 2007 2008 2009 2010 2011 2012 2013 2014 2015 2016 2017 2018 2019 2020 2021 2022 2023 2024 2025 2026 2026 May 2026 Mo Tu We Th Fr Sa Su
|
|
22
22
|
|
|
23
|
-
30 31 1 2 3 4 5
|
|
24
|
-
6 7 8 9 10 11 12
|
|
25
|
-
13 14 15 16 17 18 19
|
|
26
|
-
20 21 22 23 24 25 26
|
|
27
23
|
27 28 29 30 1 2 3
|
|
28
24
|
4 5 6 7 8 9 10
|
|
25
|
+
11 12 13 14 15 16 17
|
|
26
|
+
18 19 20 21 22 23 24
|
|
27
|
+
25 26 27 28 29 30 31
|
|
28
|
+
1 2 3 4 5 6 7
|
|
29
29
|
|
|
30
30
|
You picked: No date selected
|
|
31
31
|
|
|
@@ -86,7 +86,7 @@ export default DayPickerCalendarSingleSelectionExample;
|
|
|
86
86
|
<option value="10">November</option>
|
|
87
87
|
<option value="11">December</option>
|
|
88
88
|
</select>
|
|
89
|
-
<span class="rdp-caption_label" aria-hidden="true">
|
|
89
|
+
<span class="rdp-caption_label" aria-hidden="true">May<svg class="rdp-chevron" width="18" height="18" viewBox="0 0 24 24">
|
|
90
90
|
<polygon points="6.77 8 12.5 13.57 18.24 8 20 9.72 12.5 17 5 9.72">
|
|
91
91
|
</polygon>
|
|
92
92
|
</svg>
|
|
@@ -202,7 +202,7 @@ export default DayPickerCalendarSingleSelectionExample;
|
|
|
202
202
|
</svg>
|
|
203
203
|
</span>
|
|
204
204
|
</span>
|
|
205
|
-
<span role="status" aria-live="polite" style="border: 0px; clip: rect(0px, 0px, 0px, 0px); height: 1px; margin: -1px; overflow: hidden; padding: 0px; position: absolute; width: 1px; white-space: nowrap; overflow-wrap: normal;">
|
|
205
|
+
<span role="status" aria-live="polite" style="border: 0px; clip: rect(0px, 0px, 0px, 0px); height: 1px; margin: -1px; overflow: hidden; padding: 0px; position: absolute; width: 1px; white-space: nowrap; overflow-wrap: normal;">May 2026</span>
|
|
206
206
|
</div>
|
|
207
207
|
</div>
|
|
208
208
|
<button type="button" class="rdp-button_next" aria-label="Go to the Next Month" data-animated-button="true">
|
|
@@ -211,7 +211,7 @@ export default DayPickerCalendarSingleSelectionExample;
|
|
|
211
211
|
</polygon>
|
|
212
212
|
</svg>
|
|
213
213
|
</button>
|
|
214
|
-
<table role="grid" aria-multiselectable="false" aria-label="
|
|
214
|
+
<table role="grid" aria-multiselectable="false" aria-label="May 2026" class="rdp-month_grid">
|
|
215
215
|
<thead aria-hidden="true">
|
|
216
216
|
<tr data-animated-weekdays="true" class="rdp-weekdays">
|
|
217
217
|
<th aria-label="Monday" class="rdp-weekday" scope="col">Mo</th>
|
|
@@ -225,141 +225,141 @@ export default DayPickerCalendarSingleSelectionExample;
|
|
|
225
225
|
</thead>
|
|
226
226
|
<tbody data-animated-weeks="true" class="rdp-weeks">
|
|
227
227
|
<tr class="rdp-week">
|
|
228
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-
|
|
229
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday,
|
|
228
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-04-27" data-month="2026-04" data-outside="true">
|
|
229
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday, 27 April 2026">27</button>
|
|
230
230
|
</td>
|
|
231
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-
|
|
232
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday,
|
|
231
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-04-28" data-month="2026-04" data-outside="true">
|
|
232
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday, 28 April 2026">28</button>
|
|
233
233
|
</td>
|
|
234
|
-
<td class="rdp-day" role="gridcell" data-day="2026-04-
|
|
235
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday,
|
|
234
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-04-29" data-month="2026-04" data-outside="true">
|
|
235
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday, 29 April 2026">29</button>
|
|
236
236
|
</td>
|
|
237
|
-
<td class="rdp-day" role="gridcell" data-day="2026-04-
|
|
238
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday,
|
|
237
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-04-30" data-month="2026-04" data-outside="true">
|
|
238
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday, 30 April 2026">30</button>
|
|
239
239
|
</td>
|
|
240
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
241
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday,
|
|
240
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-01">
|
|
241
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday, 1 May 2026">1</button>
|
|
242
242
|
</td>
|
|
243
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
244
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday,
|
|
243
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-02">
|
|
244
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday, 2 May 2026">2</button>
|
|
245
245
|
</td>
|
|
246
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
247
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday,
|
|
246
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-03">
|
|
247
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday, 3 May 2026">3</button>
|
|
248
248
|
</td>
|
|
249
249
|
</tr>
|
|
250
250
|
<tr class="rdp-week">
|
|
251
|
-
<td class="rdp-day" role="gridcell" data-day="2026-04
|
|
252
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday,
|
|
251
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-04">
|
|
252
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday, 4 May 2026">4</button>
|
|
253
253
|
</td>
|
|
254
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
255
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday,
|
|
254
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-05">
|
|
255
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday, 5 May 2026">5</button>
|
|
256
256
|
</td>
|
|
257
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
258
|
-
<button class="rdp-day_button" type="button" tabindex="
|
|
257
|
+
<td class="rdp-day rdp-today" role="gridcell" data-day="2026-05-06" data-today="true">
|
|
258
|
+
<button class="rdp-day_button" type="button" tabindex="0" aria-label="Today, Wednesday, 6 May 2026">6</button>
|
|
259
259
|
</td>
|
|
260
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
261
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday,
|
|
260
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-07">
|
|
261
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday, 7 May 2026">7</button>
|
|
262
262
|
</td>
|
|
263
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
264
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday,
|
|
263
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-08">
|
|
264
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday, 8 May 2026">8</button>
|
|
265
265
|
</td>
|
|
266
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
267
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday,
|
|
266
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-09">
|
|
267
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday, 9 May 2026">9</button>
|
|
268
268
|
</td>
|
|
269
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
270
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday,
|
|
269
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-10">
|
|
270
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday, 10 May 2026">10</button>
|
|
271
271
|
</td>
|
|
272
272
|
</tr>
|
|
273
273
|
<tr class="rdp-week">
|
|
274
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
275
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday,
|
|
274
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-11">
|
|
275
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday, 11 May 2026">11</button>
|
|
276
276
|
</td>
|
|
277
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
278
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday,
|
|
277
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-12">
|
|
278
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday, 12 May 2026">12</button>
|
|
279
279
|
</td>
|
|
280
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
281
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday,
|
|
280
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-13">
|
|
281
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday, 13 May 2026">13</button>
|
|
282
282
|
</td>
|
|
283
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
284
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday,
|
|
283
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-14">
|
|
284
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday, 14 May 2026">14</button>
|
|
285
285
|
</td>
|
|
286
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
287
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday,
|
|
286
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-15">
|
|
287
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday, 15 May 2026">15</button>
|
|
288
288
|
</td>
|
|
289
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
290
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday,
|
|
289
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-16">
|
|
290
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday, 16 May 2026">16</button>
|
|
291
291
|
</td>
|
|
292
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
293
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday,
|
|
292
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-17">
|
|
293
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday, 17 May 2026">17</button>
|
|
294
294
|
</td>
|
|
295
295
|
</tr>
|
|
296
296
|
<tr class="rdp-week">
|
|
297
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
298
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday,
|
|
297
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-18">
|
|
298
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday, 18 May 2026">18</button>
|
|
299
299
|
</td>
|
|
300
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
301
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday,
|
|
300
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-19">
|
|
301
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday, 19 May 2026">19</button>
|
|
302
302
|
</td>
|
|
303
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
304
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday,
|
|
303
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-20">
|
|
304
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday, 20 May 2026">20</button>
|
|
305
305
|
</td>
|
|
306
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
307
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday,
|
|
306
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-21">
|
|
307
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday, 21 May 2026">21</button>
|
|
308
308
|
</td>
|
|
309
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
310
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday,
|
|
309
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-22">
|
|
310
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday, 22 May 2026">22</button>
|
|
311
311
|
</td>
|
|
312
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
313
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday,
|
|
312
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-23">
|
|
313
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday, 23 May 2026">23</button>
|
|
314
314
|
</td>
|
|
315
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
316
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday,
|
|
315
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-24">
|
|
316
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday, 24 May 2026">24</button>
|
|
317
317
|
</td>
|
|
318
318
|
</tr>
|
|
319
319
|
<tr class="rdp-week">
|
|
320
|
-
<td class="rdp-day
|
|
321
|
-
<button class="rdp-day_button" type="button" tabindex="
|
|
320
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-25">
|
|
321
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday, 25 May 2026">25</button>
|
|
322
322
|
</td>
|
|
323
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
324
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday,
|
|
323
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-26">
|
|
324
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday, 26 May 2026">26</button>
|
|
325
325
|
</td>
|
|
326
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
327
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday,
|
|
326
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-27">
|
|
327
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday, 27 May 2026">27</button>
|
|
328
328
|
</td>
|
|
329
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
330
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday,
|
|
329
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-28">
|
|
330
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday, 28 May 2026">28</button>
|
|
331
331
|
</td>
|
|
332
|
-
<td class="rdp-day
|
|
333
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday,
|
|
332
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-29">
|
|
333
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday, 29 May 2026">29</button>
|
|
334
334
|
</td>
|
|
335
|
-
<td class="rdp-day
|
|
336
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday,
|
|
335
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-30">
|
|
336
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday, 30 May 2026">30</button>
|
|
337
337
|
</td>
|
|
338
|
-
<td class="rdp-day
|
|
339
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday,
|
|
338
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-31">
|
|
339
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday, 31 May 2026">31</button>
|
|
340
340
|
</td>
|
|
341
341
|
</tr>
|
|
342
342
|
<tr class="rdp-week">
|
|
343
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-
|
|
344
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday,
|
|
343
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-06-01" data-month="2026-06" data-outside="true">
|
|
344
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday, 1 June 2026">1</button>
|
|
345
345
|
</td>
|
|
346
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-
|
|
347
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday,
|
|
346
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-06-02" data-month="2026-06" data-outside="true">
|
|
347
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday, 2 June 2026">2</button>
|
|
348
348
|
</td>
|
|
349
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-
|
|
350
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday,
|
|
349
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-06-03" data-month="2026-06" data-outside="true">
|
|
350
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday, 3 June 2026">3</button>
|
|
351
351
|
</td>
|
|
352
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-
|
|
353
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday,
|
|
352
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-06-04" data-month="2026-06" data-outside="true">
|
|
353
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday, 4 June 2026">4</button>
|
|
354
354
|
</td>
|
|
355
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-05
|
|
356
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday,
|
|
355
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-06-05" data-month="2026-06" data-outside="true">
|
|
356
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday, 5 June 2026">5</button>
|
|
357
357
|
</td>
|
|
358
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-
|
|
359
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday,
|
|
358
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-06-06" data-month="2026-06" data-outside="true">
|
|
359
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday, 6 June 2026">6</button>
|
|
360
360
|
</td>
|
|
361
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-
|
|
362
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday,
|
|
361
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-06-07" data-month="2026-06" data-outside="true">
|
|
362
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday, 7 June 2026">7</button>
|
|
363
363
|
</td>
|
|
364
364
|
</tr>
|
|
365
365
|
</tbody>
|
|
@@ -440,34 +440,34 @@ Use size to adjust the density of the day grid. The size variant changes the spa
|
|
|
440
440
|
### Example: Small
|
|
441
441
|
|
|
442
442
|
Small
|
|
443
|
-
January February March April May June July August September October November December
|
|
443
|
+
January February March April May June July August September October November December May 1926 1927 1928 1929 1930 1931 1932 1933 1934 1935 1936 1937 1938 1939 1940 1941 1942 1943 1944 1945 1946 1947 1948 1949 1950 1951 1952 1953 1954 1955 1956 1957 1958 1959 1960 1961 1962 1963 1964 1965 1966 1967 1968 1969 1970 1971 1972 1973 1974 1975 1976 1977 1978 1979 1980 1981 1982 1983 1984 1985 1986 1987 1988 1989 1990 1991 1992 1993 1994 1995 1996 1997 1998 1999 2000 2001 2002 2003 2004 2005 2006 2007 2008 2009 2010 2011 2012 2013 2014 2015 2016 2017 2018 2019 2020 2021 2022 2023 2024 2025 2026 2026 May 2026 Mo Tu We Th Fr Sa Su
|
|
444
444
|
|
|
445
|
-
30 31 1 2 3 4 5
|
|
446
|
-
6 7 8 9 10 11 12
|
|
447
|
-
13 14 15 16 17 18 19
|
|
448
|
-
20 21 22 23 24 25 26
|
|
449
445
|
27 28 29 30 1 2 3
|
|
450
446
|
4 5 6 7 8 9 10
|
|
447
|
+
11 12 13 14 15 16 17
|
|
448
|
+
18 19 20 21 22 23 24
|
|
449
|
+
25 26 27 28 29 30 31
|
|
450
|
+
1 2 3 4 5 6 7
|
|
451
451
|
|
|
452
452
|
Medium (default)
|
|
453
|
-
January February March April May June July August September October November December
|
|
453
|
+
January February March April May June July August September October November December May 1926 1927 1928 1929 1930 1931 1932 1933 1934 1935 1936 1937 1938 1939 1940 1941 1942 1943 1944 1945 1946 1947 1948 1949 1950 1951 1952 1953 1954 1955 1956 1957 1958 1959 1960 1961 1962 1963 1964 1965 1966 1967 1968 1969 1970 1971 1972 1973 1974 1975 1976 1977 1978 1979 1980 1981 1982 1983 1984 1985 1986 1987 1988 1989 1990 1991 1992 1993 1994 1995 1996 1997 1998 1999 2000 2001 2002 2003 2004 2005 2006 2007 2008 2009 2010 2011 2012 2013 2014 2015 2016 2017 2018 2019 2020 2021 2022 2023 2024 2025 2026 2026 May 2026 Mo Tu We Th Fr Sa Su
|
|
454
454
|
|
|
455
|
-
30 31 1 2 3 4 5
|
|
456
|
-
6 7 8 9 10 11 12
|
|
457
|
-
13 14 15 16 17 18 19
|
|
458
|
-
20 21 22 23 24 25 26
|
|
459
455
|
27 28 29 30 1 2 3
|
|
460
456
|
4 5 6 7 8 9 10
|
|
457
|
+
11 12 13 14 15 16 17
|
|
458
|
+
18 19 20 21 22 23 24
|
|
459
|
+
25 26 27 28 29 30 31
|
|
460
|
+
1 2 3 4 5 6 7
|
|
461
461
|
|
|
462
462
|
Large
|
|
463
|
-
January February March April May June July August September October November December
|
|
463
|
+
January February March April May June July August September October November December May 1926 1927 1928 1929 1930 1931 1932 1933 1934 1935 1936 1937 1938 1939 1940 1941 1942 1943 1944 1945 1946 1947 1948 1949 1950 1951 1952 1953 1954 1955 1956 1957 1958 1959 1960 1961 1962 1963 1964 1965 1966 1967 1968 1969 1970 1971 1972 1973 1974 1975 1976 1977 1978 1979 1980 1981 1982 1983 1984 1985 1986 1987 1988 1989 1990 1991 1992 1993 1994 1995 1996 1997 1998 1999 2000 2001 2002 2003 2004 2005 2006 2007 2008 2009 2010 2011 2012 2013 2014 2015 2016 2017 2018 2019 2020 2021 2022 2023 2024 2025 2026 2026 May 2026 Mo Tu We Th Fr Sa Su
|
|
464
464
|
|
|
465
|
-
30 31 1 2 3 4 5
|
|
466
|
-
6 7 8 9 10 11 12
|
|
467
|
-
13 14 15 16 17 18 19
|
|
468
|
-
20 21 22 23 24 25 26
|
|
469
465
|
27 28 29 30 1 2 3
|
|
470
466
|
4 5 6 7 8 9 10
|
|
467
|
+
11 12 13 14 15 16 17
|
|
468
|
+
18 19 20 21 22 23 24
|
|
469
|
+
25 26 27 28 29 30 31
|
|
470
|
+
1 2 3 4 5 6 7
|
|
471
471
|
|
|
472
472
|
#### React (tsx)
|
|
473
473
|
|
|
@@ -575,7 +575,7 @@ export default DayPickerCalendarSizesExample;
|
|
|
575
575
|
<option value="10">November</option>
|
|
576
576
|
<option value="11">December</option>
|
|
577
577
|
</select>
|
|
578
|
-
<span class="rdp-caption_label" aria-hidden="true">
|
|
578
|
+
<span class="rdp-caption_label" aria-hidden="true">May<svg class="rdp-chevron" width="18" height="18" viewBox="0 0 24 24">
|
|
579
579
|
<polygon points="6.77 8 12.5 13.57 18.24 8 20 9.72 12.5 17 5 9.72">
|
|
580
580
|
</polygon>
|
|
581
581
|
</svg>
|
|
@@ -691,7 +691,7 @@ export default DayPickerCalendarSizesExample;
|
|
|
691
691
|
</svg>
|
|
692
692
|
</span>
|
|
693
693
|
</span>
|
|
694
|
-
<span role="status" aria-live="polite" style="border: 0px; clip: rect(0px, 0px, 0px, 0px); height: 1px; margin: -1px; overflow: hidden; padding: 0px; position: absolute; width: 1px; white-space: nowrap; overflow-wrap: normal;">
|
|
694
|
+
<span role="status" aria-live="polite" style="border: 0px; clip: rect(0px, 0px, 0px, 0px); height: 1px; margin: -1px; overflow: hidden; padding: 0px; position: absolute; width: 1px; white-space: nowrap; overflow-wrap: normal;">May 2026</span>
|
|
695
695
|
</div>
|
|
696
696
|
</div>
|
|
697
697
|
<button type="button" class="rdp-button_next" aria-label="Go to the Next Month" data-animated-button="true">
|
|
@@ -700,7 +700,7 @@ export default DayPickerCalendarSizesExample;
|
|
|
700
700
|
</polygon>
|
|
701
701
|
</svg>
|
|
702
702
|
</button>
|
|
703
|
-
<table role="grid" aria-multiselectable="true" aria-label="
|
|
703
|
+
<table role="grid" aria-multiselectable="true" aria-label="May 2026" class="rdp-month_grid">
|
|
704
704
|
<thead aria-hidden="true">
|
|
705
705
|
<tr data-animated-weekdays="true" class="rdp-weekdays">
|
|
706
706
|
<th aria-label="Monday" class="rdp-weekday" scope="col">Mo</th>
|
|
@@ -714,141 +714,141 @@ export default DayPickerCalendarSizesExample;
|
|
|
714
714
|
</thead>
|
|
715
715
|
<tbody data-animated-weeks="true" class="rdp-weeks">
|
|
716
716
|
<tr class="rdp-week">
|
|
717
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-
|
|
718
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday,
|
|
717
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-04-27" data-month="2026-04" data-outside="true">
|
|
718
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday, 27 April 2026">27</button>
|
|
719
719
|
</td>
|
|
720
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-
|
|
721
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday,
|
|
720
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-04-28" data-month="2026-04" data-outside="true">
|
|
721
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday, 28 April 2026">28</button>
|
|
722
722
|
</td>
|
|
723
|
-
<td class="rdp-day" role="gridcell" data-day="2026-04-
|
|
724
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday,
|
|
723
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-04-29" data-month="2026-04" data-outside="true">
|
|
724
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday, 29 April 2026">29</button>
|
|
725
725
|
</td>
|
|
726
|
-
<td class="rdp-day" role="gridcell" data-day="2026-04-
|
|
727
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday,
|
|
726
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-04-30" data-month="2026-04" data-outside="true">
|
|
727
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday, 30 April 2026">30</button>
|
|
728
728
|
</td>
|
|
729
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
730
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday,
|
|
729
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-01">
|
|
730
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday, 1 May 2026">1</button>
|
|
731
731
|
</td>
|
|
732
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
733
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday,
|
|
732
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-02">
|
|
733
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday, 2 May 2026">2</button>
|
|
734
734
|
</td>
|
|
735
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
736
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday,
|
|
735
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-03">
|
|
736
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday, 3 May 2026">3</button>
|
|
737
737
|
</td>
|
|
738
738
|
</tr>
|
|
739
739
|
<tr class="rdp-week">
|
|
740
|
-
<td class="rdp-day" role="gridcell" data-day="2026-04
|
|
741
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday,
|
|
740
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-04">
|
|
741
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday, 4 May 2026">4</button>
|
|
742
742
|
</td>
|
|
743
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
744
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday,
|
|
743
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-05">
|
|
744
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday, 5 May 2026">5</button>
|
|
745
745
|
</td>
|
|
746
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
747
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday,
|
|
746
|
+
<td class="rdp-day rdp-today" role="gridcell" data-day="2026-05-06" data-today="true">
|
|
747
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Today, Wednesday, 6 May 2026">6</button>
|
|
748
748
|
</td>
|
|
749
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
750
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday,
|
|
749
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-07">
|
|
750
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday, 7 May 2026">7</button>
|
|
751
751
|
</td>
|
|
752
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
753
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday,
|
|
752
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-08">
|
|
753
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday, 8 May 2026">8</button>
|
|
754
754
|
</td>
|
|
755
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
756
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday,
|
|
755
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-09">
|
|
756
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday, 9 May 2026">9</button>
|
|
757
757
|
</td>
|
|
758
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
759
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday,
|
|
758
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-10">
|
|
759
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday, 10 May 2026">10</button>
|
|
760
760
|
</td>
|
|
761
761
|
</tr>
|
|
762
762
|
<tr class="rdp-week">
|
|
763
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
764
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday,
|
|
763
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-11">
|
|
764
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday, 11 May 2026">11</button>
|
|
765
765
|
</td>
|
|
766
|
-
<td class="rdp-day
|
|
767
|
-
<button class="rdp-day_button" type="button" tabindex="
|
|
766
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-12">
|
|
767
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday, 12 May 2026">12</button>
|
|
768
768
|
</td>
|
|
769
|
-
<td class="rdp-day
|
|
770
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday,
|
|
769
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-13">
|
|
770
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday, 13 May 2026">13</button>
|
|
771
771
|
</td>
|
|
772
|
-
<td class="rdp-day
|
|
773
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday,
|
|
772
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-14">
|
|
773
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday, 14 May 2026">14</button>
|
|
774
774
|
</td>
|
|
775
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
776
|
-
<button class="rdp-day_button" type="button" tabindex="
|
|
775
|
+
<td class="rdp-day rdp-selected rdp-range_start" role="gridcell" aria-selected="true" data-day="2026-05-15" data-selected="true">
|
|
776
|
+
<button class="rdp-day_button" type="button" tabindex="0" aria-label="Friday, 15 May 2026, selected">15</button>
|
|
777
777
|
</td>
|
|
778
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
779
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday,
|
|
778
|
+
<td class="rdp-day rdp-selected rdp-range_middle" role="gridcell" aria-selected="true" data-day="2026-05-16" data-selected="true">
|
|
779
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday, 16 May 2026, selected">16</button>
|
|
780
780
|
</td>
|
|
781
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
782
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday,
|
|
781
|
+
<td class="rdp-day rdp-selected rdp-range_end" role="gridcell" aria-selected="true" data-day="2026-05-17" data-selected="true">
|
|
782
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday, 17 May 2026, selected">17</button>
|
|
783
783
|
</td>
|
|
784
784
|
</tr>
|
|
785
785
|
<tr class="rdp-week">
|
|
786
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
787
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday,
|
|
786
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-18">
|
|
787
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday, 18 May 2026">18</button>
|
|
788
788
|
</td>
|
|
789
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
790
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday,
|
|
789
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-19">
|
|
790
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday, 19 May 2026">19</button>
|
|
791
791
|
</td>
|
|
792
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
793
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday,
|
|
792
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-20">
|
|
793
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday, 20 May 2026">20</button>
|
|
794
794
|
</td>
|
|
795
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
796
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday,
|
|
795
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-21">
|
|
796
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday, 21 May 2026">21</button>
|
|
797
797
|
</td>
|
|
798
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
799
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday,
|
|
798
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-22">
|
|
799
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday, 22 May 2026">22</button>
|
|
800
800
|
</td>
|
|
801
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
802
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday,
|
|
801
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-23">
|
|
802
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday, 23 May 2026">23</button>
|
|
803
803
|
</td>
|
|
804
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
805
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday,
|
|
804
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-24">
|
|
805
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday, 24 May 2026">24</button>
|
|
806
806
|
</td>
|
|
807
807
|
</tr>
|
|
808
808
|
<tr class="rdp-week">
|
|
809
|
-
<td class="rdp-day
|
|
810
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="
|
|
809
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-25">
|
|
810
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday, 25 May 2026">25</button>
|
|
811
811
|
</td>
|
|
812
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
813
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday,
|
|
812
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-26">
|
|
813
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday, 26 May 2026">26</button>
|
|
814
814
|
</td>
|
|
815
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
816
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday,
|
|
815
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-27">
|
|
816
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday, 27 May 2026">27</button>
|
|
817
817
|
</td>
|
|
818
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
819
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday,
|
|
818
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-28">
|
|
819
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday, 28 May 2026">28</button>
|
|
820
820
|
</td>
|
|
821
|
-
<td class="rdp-day
|
|
822
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday,
|
|
821
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-29">
|
|
822
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday, 29 May 2026">29</button>
|
|
823
823
|
</td>
|
|
824
|
-
<td class="rdp-day
|
|
825
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday,
|
|
824
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-30">
|
|
825
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday, 30 May 2026">30</button>
|
|
826
826
|
</td>
|
|
827
|
-
<td class="rdp-day
|
|
828
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday,
|
|
827
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-31">
|
|
828
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday, 31 May 2026">31</button>
|
|
829
829
|
</td>
|
|
830
830
|
</tr>
|
|
831
831
|
<tr class="rdp-week">
|
|
832
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-
|
|
833
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday,
|
|
832
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-06-01" data-month="2026-06" data-outside="true">
|
|
833
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday, 1 June 2026">1</button>
|
|
834
834
|
</td>
|
|
835
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-
|
|
836
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday,
|
|
835
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-06-02" data-month="2026-06" data-outside="true">
|
|
836
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday, 2 June 2026">2</button>
|
|
837
837
|
</td>
|
|
838
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-
|
|
839
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday,
|
|
838
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-06-03" data-month="2026-06" data-outside="true">
|
|
839
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday, 3 June 2026">3</button>
|
|
840
840
|
</td>
|
|
841
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-
|
|
842
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday,
|
|
841
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-06-04" data-month="2026-06" data-outside="true">
|
|
842
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday, 4 June 2026">4</button>
|
|
843
843
|
</td>
|
|
844
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-05
|
|
845
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday,
|
|
844
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-06-05" data-month="2026-06" data-outside="true">
|
|
845
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday, 5 June 2026">5</button>
|
|
846
846
|
</td>
|
|
847
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-
|
|
848
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday,
|
|
847
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-06-06" data-month="2026-06" data-outside="true">
|
|
848
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday, 6 June 2026">6</button>
|
|
849
849
|
</td>
|
|
850
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-
|
|
851
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday,
|
|
850
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-06-07" data-month="2026-06" data-outside="true">
|
|
851
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday, 7 June 2026">7</button>
|
|
852
852
|
</td>
|
|
853
853
|
</tr>
|
|
854
854
|
</tbody>
|
|
@@ -885,7 +885,7 @@ export default DayPickerCalendarSizesExample;
|
|
|
885
885
|
<option value="10">November</option>
|
|
886
886
|
<option value="11">December</option>
|
|
887
887
|
</select>
|
|
888
|
-
<span class="rdp-caption_label" aria-hidden="true">
|
|
888
|
+
<span class="rdp-caption_label" aria-hidden="true">May<svg class="rdp-chevron" width="18" height="18" viewBox="0 0 24 24">
|
|
889
889
|
<polygon points="6.77 8 12.5 13.57 18.24 8 20 9.72 12.5 17 5 9.72">
|
|
890
890
|
</polygon>
|
|
891
891
|
</svg>
|
|
@@ -1001,7 +1001,7 @@ export default DayPickerCalendarSizesExample;
|
|
|
1001
1001
|
</svg>
|
|
1002
1002
|
</span>
|
|
1003
1003
|
</span>
|
|
1004
|
-
<span role="status" aria-live="polite" style="border: 0px; clip: rect(0px, 0px, 0px, 0px); height: 1px; margin: -1px; overflow: hidden; padding: 0px; position: absolute; width: 1px; white-space: nowrap; overflow-wrap: normal;">
|
|
1004
|
+
<span role="status" aria-live="polite" style="border: 0px; clip: rect(0px, 0px, 0px, 0px); height: 1px; margin: -1px; overflow: hidden; padding: 0px; position: absolute; width: 1px; white-space: nowrap; overflow-wrap: normal;">May 2026</span>
|
|
1005
1005
|
</div>
|
|
1006
1006
|
</div>
|
|
1007
1007
|
<button type="button" class="rdp-button_next" aria-label="Go to the Next Month" data-animated-button="true">
|
|
@@ -1010,7 +1010,7 @@ export default DayPickerCalendarSizesExample;
|
|
|
1010
1010
|
</polygon>
|
|
1011
1011
|
</svg>
|
|
1012
1012
|
</button>
|
|
1013
|
-
<table role="grid" aria-multiselectable="true" aria-label="
|
|
1013
|
+
<table role="grid" aria-multiselectable="true" aria-label="May 2026" class="rdp-month_grid">
|
|
1014
1014
|
<thead aria-hidden="true">
|
|
1015
1015
|
<tr data-animated-weekdays="true" class="rdp-weekdays">
|
|
1016
1016
|
<th aria-label="Monday" class="rdp-weekday" scope="col">Mo</th>
|
|
@@ -1024,141 +1024,141 @@ export default DayPickerCalendarSizesExample;
|
|
|
1024
1024
|
</thead>
|
|
1025
1025
|
<tbody data-animated-weeks="true" class="rdp-weeks">
|
|
1026
1026
|
<tr class="rdp-week">
|
|
1027
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-
|
|
1028
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday,
|
|
1027
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-04-27" data-month="2026-04" data-outside="true">
|
|
1028
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday, 27 April 2026">27</button>
|
|
1029
1029
|
</td>
|
|
1030
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-
|
|
1031
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday,
|
|
1030
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-04-28" data-month="2026-04" data-outside="true">
|
|
1031
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday, 28 April 2026">28</button>
|
|
1032
1032
|
</td>
|
|
1033
|
-
<td class="rdp-day" role="gridcell" data-day="2026-04-
|
|
1034
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday,
|
|
1033
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-04-29" data-month="2026-04" data-outside="true">
|
|
1034
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday, 29 April 2026">29</button>
|
|
1035
1035
|
</td>
|
|
1036
|
-
<td class="rdp-day" role="gridcell" data-day="2026-04-
|
|
1037
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday,
|
|
1036
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-04-30" data-month="2026-04" data-outside="true">
|
|
1037
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday, 30 April 2026">30</button>
|
|
1038
1038
|
</td>
|
|
1039
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1040
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday,
|
|
1039
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-01">
|
|
1040
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday, 1 May 2026">1</button>
|
|
1041
1041
|
</td>
|
|
1042
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1043
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday,
|
|
1042
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-02">
|
|
1043
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday, 2 May 2026">2</button>
|
|
1044
1044
|
</td>
|
|
1045
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1046
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday,
|
|
1045
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-03">
|
|
1046
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday, 3 May 2026">3</button>
|
|
1047
1047
|
</td>
|
|
1048
1048
|
</tr>
|
|
1049
1049
|
<tr class="rdp-week">
|
|
1050
|
-
<td class="rdp-day" role="gridcell" data-day="2026-04
|
|
1051
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday,
|
|
1050
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-04">
|
|
1051
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday, 4 May 2026">4</button>
|
|
1052
1052
|
</td>
|
|
1053
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1054
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday,
|
|
1053
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-05">
|
|
1054
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday, 5 May 2026">5</button>
|
|
1055
1055
|
</td>
|
|
1056
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1057
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday,
|
|
1056
|
+
<td class="rdp-day rdp-today" role="gridcell" data-day="2026-05-06" data-today="true">
|
|
1057
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Today, Wednesday, 6 May 2026">6</button>
|
|
1058
1058
|
</td>
|
|
1059
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1060
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday,
|
|
1059
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-07">
|
|
1060
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday, 7 May 2026">7</button>
|
|
1061
1061
|
</td>
|
|
1062
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1063
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday,
|
|
1062
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-08">
|
|
1063
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday, 8 May 2026">8</button>
|
|
1064
1064
|
</td>
|
|
1065
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1066
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday,
|
|
1065
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-09">
|
|
1066
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday, 9 May 2026">9</button>
|
|
1067
1067
|
</td>
|
|
1068
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1069
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday,
|
|
1068
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-10">
|
|
1069
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday, 10 May 2026">10</button>
|
|
1070
1070
|
</td>
|
|
1071
1071
|
</tr>
|
|
1072
1072
|
<tr class="rdp-week">
|
|
1073
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1074
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday,
|
|
1073
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-11">
|
|
1074
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday, 11 May 2026">11</button>
|
|
1075
1075
|
</td>
|
|
1076
|
-
<td class="rdp-day
|
|
1077
|
-
<button class="rdp-day_button" type="button" tabindex="
|
|
1076
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-12">
|
|
1077
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday, 12 May 2026">12</button>
|
|
1078
1078
|
</td>
|
|
1079
|
-
<td class="rdp-day
|
|
1080
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday,
|
|
1079
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-13">
|
|
1080
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday, 13 May 2026">13</button>
|
|
1081
1081
|
</td>
|
|
1082
|
-
<td class="rdp-day
|
|
1083
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday,
|
|
1082
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-14">
|
|
1083
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday, 14 May 2026">14</button>
|
|
1084
1084
|
</td>
|
|
1085
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1086
|
-
<button class="rdp-day_button" type="button" tabindex="
|
|
1085
|
+
<td class="rdp-day rdp-selected rdp-range_start" role="gridcell" aria-selected="true" data-day="2026-05-15" data-selected="true">
|
|
1086
|
+
<button class="rdp-day_button" type="button" tabindex="0" aria-label="Friday, 15 May 2026, selected">15</button>
|
|
1087
1087
|
</td>
|
|
1088
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1089
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday,
|
|
1088
|
+
<td class="rdp-day rdp-selected rdp-range_middle" role="gridcell" aria-selected="true" data-day="2026-05-16" data-selected="true">
|
|
1089
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday, 16 May 2026, selected">16</button>
|
|
1090
1090
|
</td>
|
|
1091
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1092
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday,
|
|
1091
|
+
<td class="rdp-day rdp-selected rdp-range_end" role="gridcell" aria-selected="true" data-day="2026-05-17" data-selected="true">
|
|
1092
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday, 17 May 2026, selected">17</button>
|
|
1093
1093
|
</td>
|
|
1094
1094
|
</tr>
|
|
1095
1095
|
<tr class="rdp-week">
|
|
1096
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1097
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday,
|
|
1096
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-18">
|
|
1097
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday, 18 May 2026">18</button>
|
|
1098
1098
|
</td>
|
|
1099
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1100
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday,
|
|
1099
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-19">
|
|
1100
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday, 19 May 2026">19</button>
|
|
1101
1101
|
</td>
|
|
1102
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1103
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday,
|
|
1102
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-20">
|
|
1103
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday, 20 May 2026">20</button>
|
|
1104
1104
|
</td>
|
|
1105
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1106
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday,
|
|
1105
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-21">
|
|
1106
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday, 21 May 2026">21</button>
|
|
1107
1107
|
</td>
|
|
1108
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1109
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday,
|
|
1108
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-22">
|
|
1109
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday, 22 May 2026">22</button>
|
|
1110
1110
|
</td>
|
|
1111
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1112
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday,
|
|
1111
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-23">
|
|
1112
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday, 23 May 2026">23</button>
|
|
1113
1113
|
</td>
|
|
1114
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1115
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday,
|
|
1114
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-24">
|
|
1115
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday, 24 May 2026">24</button>
|
|
1116
1116
|
</td>
|
|
1117
1117
|
</tr>
|
|
1118
1118
|
<tr class="rdp-week">
|
|
1119
|
-
<td class="rdp-day
|
|
1120
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="
|
|
1119
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-25">
|
|
1120
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday, 25 May 2026">25</button>
|
|
1121
1121
|
</td>
|
|
1122
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1123
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday,
|
|
1122
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-26">
|
|
1123
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday, 26 May 2026">26</button>
|
|
1124
1124
|
</td>
|
|
1125
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1126
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday,
|
|
1125
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-27">
|
|
1126
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday, 27 May 2026">27</button>
|
|
1127
1127
|
</td>
|
|
1128
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1129
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday,
|
|
1128
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-28">
|
|
1129
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday, 28 May 2026">28</button>
|
|
1130
1130
|
</td>
|
|
1131
|
-
<td class="rdp-day
|
|
1132
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday,
|
|
1131
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-29">
|
|
1132
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday, 29 May 2026">29</button>
|
|
1133
1133
|
</td>
|
|
1134
|
-
<td class="rdp-day
|
|
1135
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday,
|
|
1134
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-30">
|
|
1135
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday, 30 May 2026">30</button>
|
|
1136
1136
|
</td>
|
|
1137
|
-
<td class="rdp-day
|
|
1138
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday,
|
|
1137
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-31">
|
|
1138
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday, 31 May 2026">31</button>
|
|
1139
1139
|
</td>
|
|
1140
1140
|
</tr>
|
|
1141
1141
|
<tr class="rdp-week">
|
|
1142
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-
|
|
1143
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday,
|
|
1142
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-06-01" data-month="2026-06" data-outside="true">
|
|
1143
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday, 1 June 2026">1</button>
|
|
1144
1144
|
</td>
|
|
1145
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-
|
|
1146
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday,
|
|
1145
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-06-02" data-month="2026-06" data-outside="true">
|
|
1146
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday, 2 June 2026">2</button>
|
|
1147
1147
|
</td>
|
|
1148
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-
|
|
1149
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday,
|
|
1148
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-06-03" data-month="2026-06" data-outside="true">
|
|
1149
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday, 3 June 2026">3</button>
|
|
1150
1150
|
</td>
|
|
1151
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-
|
|
1152
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday,
|
|
1151
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-06-04" data-month="2026-06" data-outside="true">
|
|
1152
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday, 4 June 2026">4</button>
|
|
1153
1153
|
</td>
|
|
1154
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-05
|
|
1155
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday,
|
|
1154
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-06-05" data-month="2026-06" data-outside="true">
|
|
1155
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday, 5 June 2026">5</button>
|
|
1156
1156
|
</td>
|
|
1157
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-
|
|
1158
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday,
|
|
1157
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-06-06" data-month="2026-06" data-outside="true">
|
|
1158
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday, 6 June 2026">6</button>
|
|
1159
1159
|
</td>
|
|
1160
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-
|
|
1161
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday,
|
|
1160
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-06-07" data-month="2026-06" data-outside="true">
|
|
1161
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday, 7 June 2026">7</button>
|
|
1162
1162
|
</td>
|
|
1163
1163
|
</tr>
|
|
1164
1164
|
</tbody>
|
|
@@ -1195,7 +1195,7 @@ export default DayPickerCalendarSizesExample;
|
|
|
1195
1195
|
<option value="10">November</option>
|
|
1196
1196
|
<option value="11">December</option>
|
|
1197
1197
|
</select>
|
|
1198
|
-
<span class="rdp-caption_label" aria-hidden="true">
|
|
1198
|
+
<span class="rdp-caption_label" aria-hidden="true">May<svg class="rdp-chevron" width="18" height="18" viewBox="0 0 24 24">
|
|
1199
1199
|
<polygon points="6.77 8 12.5 13.57 18.24 8 20 9.72 12.5 17 5 9.72">
|
|
1200
1200
|
</polygon>
|
|
1201
1201
|
</svg>
|
|
@@ -1311,7 +1311,7 @@ export default DayPickerCalendarSizesExample;
|
|
|
1311
1311
|
</svg>
|
|
1312
1312
|
</span>
|
|
1313
1313
|
</span>
|
|
1314
|
-
<span role="status" aria-live="polite" style="border: 0px; clip: rect(0px, 0px, 0px, 0px); height: 1px; margin: -1px; overflow: hidden; padding: 0px; position: absolute; width: 1px; white-space: nowrap; overflow-wrap: normal;">
|
|
1314
|
+
<span role="status" aria-live="polite" style="border: 0px; clip: rect(0px, 0px, 0px, 0px); height: 1px; margin: -1px; overflow: hidden; padding: 0px; position: absolute; width: 1px; white-space: nowrap; overflow-wrap: normal;">May 2026</span>
|
|
1315
1315
|
</div>
|
|
1316
1316
|
</div>
|
|
1317
1317
|
<button type="button" class="rdp-button_next" aria-label="Go to the Next Month" data-animated-button="true">
|
|
@@ -1320,7 +1320,7 @@ export default DayPickerCalendarSizesExample;
|
|
|
1320
1320
|
</polygon>
|
|
1321
1321
|
</svg>
|
|
1322
1322
|
</button>
|
|
1323
|
-
<table role="grid" aria-multiselectable="true" aria-label="
|
|
1323
|
+
<table role="grid" aria-multiselectable="true" aria-label="May 2026" class="rdp-month_grid">
|
|
1324
1324
|
<thead aria-hidden="true">
|
|
1325
1325
|
<tr data-animated-weekdays="true" class="rdp-weekdays">
|
|
1326
1326
|
<th aria-label="Monday" class="rdp-weekday" scope="col">Mo</th>
|
|
@@ -1334,141 +1334,141 @@ export default DayPickerCalendarSizesExample;
|
|
|
1334
1334
|
</thead>
|
|
1335
1335
|
<tbody data-animated-weeks="true" class="rdp-weeks">
|
|
1336
1336
|
<tr class="rdp-week">
|
|
1337
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-
|
|
1338
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday,
|
|
1337
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-04-27" data-month="2026-04" data-outside="true">
|
|
1338
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday, 27 April 2026">27</button>
|
|
1339
1339
|
</td>
|
|
1340
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-
|
|
1341
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday,
|
|
1340
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-04-28" data-month="2026-04" data-outside="true">
|
|
1341
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday, 28 April 2026">28</button>
|
|
1342
1342
|
</td>
|
|
1343
|
-
<td class="rdp-day" role="gridcell" data-day="2026-04-
|
|
1344
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday,
|
|
1343
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-04-29" data-month="2026-04" data-outside="true">
|
|
1344
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday, 29 April 2026">29</button>
|
|
1345
1345
|
</td>
|
|
1346
|
-
<td class="rdp-day" role="gridcell" data-day="2026-04-
|
|
1347
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday,
|
|
1346
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-04-30" data-month="2026-04" data-outside="true">
|
|
1347
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday, 30 April 2026">30</button>
|
|
1348
1348
|
</td>
|
|
1349
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1350
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday,
|
|
1349
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-01">
|
|
1350
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday, 1 May 2026">1</button>
|
|
1351
1351
|
</td>
|
|
1352
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1353
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday,
|
|
1352
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-02">
|
|
1353
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday, 2 May 2026">2</button>
|
|
1354
1354
|
</td>
|
|
1355
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1356
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday,
|
|
1355
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-03">
|
|
1356
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday, 3 May 2026">3</button>
|
|
1357
1357
|
</td>
|
|
1358
1358
|
</tr>
|
|
1359
1359
|
<tr class="rdp-week">
|
|
1360
|
-
<td class="rdp-day" role="gridcell" data-day="2026-04
|
|
1361
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday,
|
|
1360
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-04">
|
|
1361
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday, 4 May 2026">4</button>
|
|
1362
1362
|
</td>
|
|
1363
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1364
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday,
|
|
1363
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-05">
|
|
1364
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday, 5 May 2026">5</button>
|
|
1365
1365
|
</td>
|
|
1366
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1367
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday,
|
|
1366
|
+
<td class="rdp-day rdp-today" role="gridcell" data-day="2026-05-06" data-today="true">
|
|
1367
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Today, Wednesday, 6 May 2026">6</button>
|
|
1368
1368
|
</td>
|
|
1369
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1370
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday,
|
|
1369
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-07">
|
|
1370
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday, 7 May 2026">7</button>
|
|
1371
1371
|
</td>
|
|
1372
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1373
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday,
|
|
1372
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-08">
|
|
1373
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday, 8 May 2026">8</button>
|
|
1374
1374
|
</td>
|
|
1375
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1376
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday,
|
|
1375
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-09">
|
|
1376
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday, 9 May 2026">9</button>
|
|
1377
1377
|
</td>
|
|
1378
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1379
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday,
|
|
1378
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-10">
|
|
1379
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday, 10 May 2026">10</button>
|
|
1380
1380
|
</td>
|
|
1381
1381
|
</tr>
|
|
1382
1382
|
<tr class="rdp-week">
|
|
1383
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1384
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday,
|
|
1383
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-11">
|
|
1384
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday, 11 May 2026">11</button>
|
|
1385
1385
|
</td>
|
|
1386
|
-
<td class="rdp-day
|
|
1387
|
-
<button class="rdp-day_button" type="button" tabindex="
|
|
1386
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-12">
|
|
1387
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday, 12 May 2026">12</button>
|
|
1388
1388
|
</td>
|
|
1389
|
-
<td class="rdp-day
|
|
1390
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday,
|
|
1389
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-13">
|
|
1390
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday, 13 May 2026">13</button>
|
|
1391
1391
|
</td>
|
|
1392
|
-
<td class="rdp-day
|
|
1393
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday,
|
|
1392
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-14">
|
|
1393
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday, 14 May 2026">14</button>
|
|
1394
1394
|
</td>
|
|
1395
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1396
|
-
<button class="rdp-day_button" type="button" tabindex="
|
|
1395
|
+
<td class="rdp-day rdp-selected rdp-range_start" role="gridcell" aria-selected="true" data-day="2026-05-15" data-selected="true">
|
|
1396
|
+
<button class="rdp-day_button" type="button" tabindex="0" aria-label="Friday, 15 May 2026, selected">15</button>
|
|
1397
1397
|
</td>
|
|
1398
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1399
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday,
|
|
1398
|
+
<td class="rdp-day rdp-selected rdp-range_middle" role="gridcell" aria-selected="true" data-day="2026-05-16" data-selected="true">
|
|
1399
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday, 16 May 2026, selected">16</button>
|
|
1400
1400
|
</td>
|
|
1401
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1402
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday,
|
|
1401
|
+
<td class="rdp-day rdp-selected rdp-range_end" role="gridcell" aria-selected="true" data-day="2026-05-17" data-selected="true">
|
|
1402
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday, 17 May 2026, selected">17</button>
|
|
1403
1403
|
</td>
|
|
1404
1404
|
</tr>
|
|
1405
1405
|
<tr class="rdp-week">
|
|
1406
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1407
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday,
|
|
1406
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-18">
|
|
1407
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday, 18 May 2026">18</button>
|
|
1408
1408
|
</td>
|
|
1409
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1410
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday,
|
|
1409
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-19">
|
|
1410
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday, 19 May 2026">19</button>
|
|
1411
1411
|
</td>
|
|
1412
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1413
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday,
|
|
1412
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-20">
|
|
1413
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday, 20 May 2026">20</button>
|
|
1414
1414
|
</td>
|
|
1415
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1416
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday,
|
|
1415
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-21">
|
|
1416
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday, 21 May 2026">21</button>
|
|
1417
1417
|
</td>
|
|
1418
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1419
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday,
|
|
1418
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-22">
|
|
1419
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday, 22 May 2026">22</button>
|
|
1420
1420
|
</td>
|
|
1421
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1422
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday,
|
|
1421
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-23">
|
|
1422
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday, 23 May 2026">23</button>
|
|
1423
1423
|
</td>
|
|
1424
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1425
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday,
|
|
1424
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-24">
|
|
1425
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday, 24 May 2026">24</button>
|
|
1426
1426
|
</td>
|
|
1427
1427
|
</tr>
|
|
1428
1428
|
<tr class="rdp-week">
|
|
1429
|
-
<td class="rdp-day
|
|
1430
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="
|
|
1429
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-25">
|
|
1430
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday, 25 May 2026">25</button>
|
|
1431
1431
|
</td>
|
|
1432
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1433
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday,
|
|
1432
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-26">
|
|
1433
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday, 26 May 2026">26</button>
|
|
1434
1434
|
</td>
|
|
1435
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1436
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday,
|
|
1435
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-27">
|
|
1436
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday, 27 May 2026">27</button>
|
|
1437
1437
|
</td>
|
|
1438
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
1439
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday,
|
|
1438
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-28">
|
|
1439
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday, 28 May 2026">28</button>
|
|
1440
1440
|
</td>
|
|
1441
|
-
<td class="rdp-day
|
|
1442
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday,
|
|
1441
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-29">
|
|
1442
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday, 29 May 2026">29</button>
|
|
1443
1443
|
</td>
|
|
1444
|
-
<td class="rdp-day
|
|
1445
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday,
|
|
1444
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-30">
|
|
1445
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday, 30 May 2026">30</button>
|
|
1446
1446
|
</td>
|
|
1447
|
-
<td class="rdp-day
|
|
1448
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday,
|
|
1447
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-31">
|
|
1448
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday, 31 May 2026">31</button>
|
|
1449
1449
|
</td>
|
|
1450
1450
|
</tr>
|
|
1451
1451
|
<tr class="rdp-week">
|
|
1452
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-
|
|
1453
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday,
|
|
1452
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-06-01" data-month="2026-06" data-outside="true">
|
|
1453
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday, 1 June 2026">1</button>
|
|
1454
1454
|
</td>
|
|
1455
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-
|
|
1456
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday,
|
|
1455
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-06-02" data-month="2026-06" data-outside="true">
|
|
1456
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday, 2 June 2026">2</button>
|
|
1457
1457
|
</td>
|
|
1458
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-
|
|
1459
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday,
|
|
1458
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-06-03" data-month="2026-06" data-outside="true">
|
|
1459
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday, 3 June 2026">3</button>
|
|
1460
1460
|
</td>
|
|
1461
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-
|
|
1462
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday,
|
|
1461
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-06-04" data-month="2026-06" data-outside="true">
|
|
1462
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday, 4 June 2026">4</button>
|
|
1463
1463
|
</td>
|
|
1464
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-05
|
|
1465
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday,
|
|
1464
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-06-05" data-month="2026-06" data-outside="true">
|
|
1465
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday, 5 June 2026">5</button>
|
|
1466
1466
|
</td>
|
|
1467
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-
|
|
1468
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday,
|
|
1467
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-06-06" data-month="2026-06" data-outside="true">
|
|
1468
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday, 6 June 2026">6</button>
|
|
1469
1469
|
</td>
|
|
1470
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-
|
|
1471
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday,
|
|
1470
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-06-07" data-month="2026-06" data-outside="true">
|
|
1471
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday, 7 June 2026">7</button>
|
|
1472
1472
|
</td>
|
|
1473
1473
|
</tr>
|
|
1474
1474
|
</tbody>
|
|
@@ -2082,7 +2082,7 @@ The calendar wrapper also works well inside larger dialog layouts, where the sel
|
|
|
2082
2082
|
|
|
2083
2083
|
### Example: Example 4
|
|
2084
2084
|
|
|
2085
|
-
Open event calendar dialog Scheduled delivery slot: 15.
|
|
2085
|
+
Open event calendar dialog Scheduled delivery slot: 15.05.2026 09:00 - 21.05.2026 09:00
|
|
2086
2086
|
|
|
2087
2087
|
#### React (tsx)
|
|
2088
2088
|
|
|
@@ -2454,7 +2454,7 @@ export default DayPickerCalendarDialogExample;
|
|
|
2454
2454
|
<div>
|
|
2455
2455
|
<button type="button" class="btn btn-primary btn-component" tabindex="0">Open event calendar dialog</button>
|
|
2456
2456
|
<div class="padding-top-10">
|
|
2457
|
-
<b>Scheduled delivery slot:</b> 15.
|
|
2457
|
+
<b>Scheduled delivery slot:</b> 15.05.2026 09:00 - 21.05.2026 09:00
|
|
2458
2458
|
</div>
|
|
2459
2459
|
</div>
|
|
2460
2460
|
```
|
|
@@ -2526,16 +2526,16 @@ Multiple mode is useful for scenarios like booking, planning, or marking several
|
|
|
2526
2526
|
### Example: Multiple dates
|
|
2527
2527
|
|
|
2528
2528
|
Multiple dates
|
|
2529
|
-
January February March April May June July August September October November December
|
|
2529
|
+
January February March April May June July August September October November December May 1926 1927 1928 1929 1930 1931 1932 1933 1934 1935 1936 1937 1938 1939 1940 1941 1942 1943 1944 1945 1946 1947 1948 1949 1950 1951 1952 1953 1954 1955 1956 1957 1958 1959 1960 1961 1962 1963 1964 1965 1966 1967 1968 1969 1970 1971 1972 1973 1974 1975 1976 1977 1978 1979 1980 1981 1982 1983 1984 1985 1986 1987 1988 1989 1990 1991 1992 1993 1994 1995 1996 1997 1998 1999 2000 2001 2002 2003 2004 2005 2006 2007 2008 2009 2010 2011 2012 2013 2014 2015 2016 2017 2018 2019 2020 2021 2022 2023 2024 2025 2026 2026 May 2026 Mo Tu We Th Fr Sa Su
|
|
2530
2530
|
|
|
2531
|
-
30 31 1 2 3 4 5
|
|
2532
|
-
6 7 8 9 10 11 12
|
|
2533
|
-
13 14 15 16 17 18 19
|
|
2534
|
-
20 21 22 23 24 25 26
|
|
2535
2531
|
27 28 29 30 1 2 3
|
|
2536
2532
|
4 5 6 7 8 9 10
|
|
2533
|
+
11 12 13 14 15 16 17
|
|
2534
|
+
18 19 20 21 22 23 24
|
|
2535
|
+
25 26 27 28 29 30 31
|
|
2536
|
+
1 2 3 4 5 6 7
|
|
2537
2537
|
|
|
2538
|
-
You picked:
|
|
2538
|
+
You picked: 06/05/2026
|
|
2539
2539
|
|
|
2540
2540
|
#### React (tsx)
|
|
2541
2541
|
|
|
@@ -2598,7 +2598,7 @@ export default DayPickerMultipleSelectionExample;
|
|
|
2598
2598
|
<option value="10">November</option>
|
|
2599
2599
|
<option value="11">December</option>
|
|
2600
2600
|
</select>
|
|
2601
|
-
<span class="rdp-caption_label" aria-hidden="true">
|
|
2601
|
+
<span class="rdp-caption_label" aria-hidden="true">May<svg class="rdp-chevron" width="18" height="18" viewBox="0 0 24 24">
|
|
2602
2602
|
<polygon points="6.77 8 12.5 13.57 18.24 8 20 9.72 12.5 17 5 9.72">
|
|
2603
2603
|
</polygon>
|
|
2604
2604
|
</svg>
|
|
@@ -2714,7 +2714,7 @@ export default DayPickerMultipleSelectionExample;
|
|
|
2714
2714
|
</svg>
|
|
2715
2715
|
</span>
|
|
2716
2716
|
</span>
|
|
2717
|
-
<span role="status" aria-live="polite" style="border: 0px; clip: rect(0px, 0px, 0px, 0px); height: 1px; margin: -1px; overflow: hidden; padding: 0px; position: absolute; width: 1px; white-space: nowrap; overflow-wrap: normal;">
|
|
2717
|
+
<span role="status" aria-live="polite" style="border: 0px; clip: rect(0px, 0px, 0px, 0px); height: 1px; margin: -1px; overflow: hidden; padding: 0px; position: absolute; width: 1px; white-space: nowrap; overflow-wrap: normal;">May 2026</span>
|
|
2718
2718
|
</div>
|
|
2719
2719
|
</div>
|
|
2720
2720
|
<button type="button" class="rdp-button_next" aria-label="Go to the Next Month" data-animated-button="true">
|
|
@@ -2723,7 +2723,7 @@ export default DayPickerMultipleSelectionExample;
|
|
|
2723
2723
|
</polygon>
|
|
2724
2724
|
</svg>
|
|
2725
2725
|
</button>
|
|
2726
|
-
<table role="grid" aria-multiselectable="true" aria-label="
|
|
2726
|
+
<table role="grid" aria-multiselectable="true" aria-label="May 2026" class="rdp-month_grid">
|
|
2727
2727
|
<thead aria-hidden="true">
|
|
2728
2728
|
<tr data-animated-weekdays="true" class="rdp-weekdays">
|
|
2729
2729
|
<th aria-label="Monday" class="rdp-weekday" scope="col">Mo</th>
|
|
@@ -2737,141 +2737,141 @@ export default DayPickerMultipleSelectionExample;
|
|
|
2737
2737
|
</thead>
|
|
2738
2738
|
<tbody data-animated-weeks="true" class="rdp-weeks">
|
|
2739
2739
|
<tr class="rdp-week">
|
|
2740
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-
|
|
2741
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday,
|
|
2740
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-04-27" data-month="2026-04" data-outside="true">
|
|
2741
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday, 27 April 2026">27</button>
|
|
2742
2742
|
</td>
|
|
2743
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-
|
|
2744
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday,
|
|
2743
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-04-28" data-month="2026-04" data-outside="true">
|
|
2744
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday, 28 April 2026">28</button>
|
|
2745
2745
|
</td>
|
|
2746
|
-
<td class="rdp-day" role="gridcell" data-day="2026-04-
|
|
2747
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday,
|
|
2746
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-04-29" data-month="2026-04" data-outside="true">
|
|
2747
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday, 29 April 2026">29</button>
|
|
2748
2748
|
</td>
|
|
2749
|
-
<td class="rdp-day" role="gridcell" data-day="2026-04-
|
|
2750
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday,
|
|
2749
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-04-30" data-month="2026-04" data-outside="true">
|
|
2750
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday, 30 April 2026">30</button>
|
|
2751
2751
|
</td>
|
|
2752
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
2753
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday,
|
|
2752
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-01">
|
|
2753
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday, 1 May 2026">1</button>
|
|
2754
2754
|
</td>
|
|
2755
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
2756
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday,
|
|
2755
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-02">
|
|
2756
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday, 2 May 2026">2</button>
|
|
2757
2757
|
</td>
|
|
2758
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
2759
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday,
|
|
2758
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-03">
|
|
2759
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday, 3 May 2026">3</button>
|
|
2760
2760
|
</td>
|
|
2761
2761
|
</tr>
|
|
2762
2762
|
<tr class="rdp-week">
|
|
2763
|
-
<td class="rdp-day" role="gridcell" data-day="2026-04
|
|
2764
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday,
|
|
2763
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-04">
|
|
2764
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday, 4 May 2026">4</button>
|
|
2765
2765
|
</td>
|
|
2766
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
2767
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday,
|
|
2766
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-05">
|
|
2767
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday, 5 May 2026">5</button>
|
|
2768
2768
|
</td>
|
|
2769
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
2770
|
-
<button class="rdp-day_button" type="button" tabindex="
|
|
2769
|
+
<td class="rdp-day rdp-today rdp-selected" role="gridcell" aria-selected="true" data-day="2026-05-06" data-selected="true" data-today="true">
|
|
2770
|
+
<button class="rdp-day_button" type="button" tabindex="0" aria-label="Today, Wednesday, 6 May 2026, selected">6</button>
|
|
2771
2771
|
</td>
|
|
2772
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
2773
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday,
|
|
2772
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-07">
|
|
2773
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday, 7 May 2026">7</button>
|
|
2774
2774
|
</td>
|
|
2775
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
2776
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday,
|
|
2775
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-08">
|
|
2776
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday, 8 May 2026">8</button>
|
|
2777
2777
|
</td>
|
|
2778
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
2779
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday,
|
|
2778
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-09">
|
|
2779
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday, 9 May 2026">9</button>
|
|
2780
2780
|
</td>
|
|
2781
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
2782
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday,
|
|
2781
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-10">
|
|
2782
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday, 10 May 2026">10</button>
|
|
2783
2783
|
</td>
|
|
2784
2784
|
</tr>
|
|
2785
2785
|
<tr class="rdp-week">
|
|
2786
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
2787
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday,
|
|
2786
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-11">
|
|
2787
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday, 11 May 2026">11</button>
|
|
2788
2788
|
</td>
|
|
2789
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
2790
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday,
|
|
2789
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-12">
|
|
2790
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday, 12 May 2026">12</button>
|
|
2791
2791
|
</td>
|
|
2792
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
2793
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday,
|
|
2792
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-13">
|
|
2793
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday, 13 May 2026">13</button>
|
|
2794
2794
|
</td>
|
|
2795
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
2796
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday,
|
|
2795
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-14">
|
|
2796
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday, 14 May 2026">14</button>
|
|
2797
2797
|
</td>
|
|
2798
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
2799
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday,
|
|
2798
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-15">
|
|
2799
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday, 15 May 2026">15</button>
|
|
2800
2800
|
</td>
|
|
2801
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
2802
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday,
|
|
2801
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-16">
|
|
2802
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday, 16 May 2026">16</button>
|
|
2803
2803
|
</td>
|
|
2804
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
2805
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday,
|
|
2804
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-17">
|
|
2805
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday, 17 May 2026">17</button>
|
|
2806
2806
|
</td>
|
|
2807
2807
|
</tr>
|
|
2808
2808
|
<tr class="rdp-week">
|
|
2809
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
2810
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday,
|
|
2809
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-18">
|
|
2810
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday, 18 May 2026">18</button>
|
|
2811
2811
|
</td>
|
|
2812
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
2813
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday,
|
|
2812
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-19">
|
|
2813
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday, 19 May 2026">19</button>
|
|
2814
2814
|
</td>
|
|
2815
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
2816
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday,
|
|
2815
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-20">
|
|
2816
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday, 20 May 2026">20</button>
|
|
2817
2817
|
</td>
|
|
2818
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
2819
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday,
|
|
2818
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-21">
|
|
2819
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday, 21 May 2026">21</button>
|
|
2820
2820
|
</td>
|
|
2821
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
2822
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday,
|
|
2821
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-22">
|
|
2822
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday, 22 May 2026">22</button>
|
|
2823
2823
|
</td>
|
|
2824
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
2825
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday,
|
|
2824
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-23">
|
|
2825
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday, 23 May 2026">23</button>
|
|
2826
2826
|
</td>
|
|
2827
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
2828
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday,
|
|
2827
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-24">
|
|
2828
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday, 24 May 2026">24</button>
|
|
2829
2829
|
</td>
|
|
2830
2830
|
</tr>
|
|
2831
2831
|
<tr class="rdp-week">
|
|
2832
|
-
<td class="rdp-day
|
|
2833
|
-
<button class="rdp-day_button" type="button" tabindex="
|
|
2832
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-25">
|
|
2833
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday, 25 May 2026">25</button>
|
|
2834
2834
|
</td>
|
|
2835
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
2836
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday,
|
|
2835
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-26">
|
|
2836
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday, 26 May 2026">26</button>
|
|
2837
2837
|
</td>
|
|
2838
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
2839
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday,
|
|
2838
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-27">
|
|
2839
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday, 27 May 2026">27</button>
|
|
2840
2840
|
</td>
|
|
2841
|
-
<td class="rdp-day" role="gridcell" data-day="2026-
|
|
2842
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday,
|
|
2841
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-28">
|
|
2842
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday, 28 May 2026">28</button>
|
|
2843
2843
|
</td>
|
|
2844
|
-
<td class="rdp-day
|
|
2845
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday,
|
|
2844
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-29">
|
|
2845
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday, 29 May 2026">29</button>
|
|
2846
2846
|
</td>
|
|
2847
|
-
<td class="rdp-day
|
|
2848
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday,
|
|
2847
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-30">
|
|
2848
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday, 30 May 2026">30</button>
|
|
2849
2849
|
</td>
|
|
2850
|
-
<td class="rdp-day
|
|
2851
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday,
|
|
2850
|
+
<td class="rdp-day" role="gridcell" data-day="2026-05-31">
|
|
2851
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday, 31 May 2026">31</button>
|
|
2852
2852
|
</td>
|
|
2853
2853
|
</tr>
|
|
2854
2854
|
<tr class="rdp-week">
|
|
2855
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-
|
|
2856
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday,
|
|
2855
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-06-01" data-month="2026-06" data-outside="true">
|
|
2856
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday, 1 June 2026">1</button>
|
|
2857
2857
|
</td>
|
|
2858
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-
|
|
2859
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday,
|
|
2858
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-06-02" data-month="2026-06" data-outside="true">
|
|
2859
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday, 2 June 2026">2</button>
|
|
2860
2860
|
</td>
|
|
2861
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-
|
|
2862
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday,
|
|
2861
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-06-03" data-month="2026-06" data-outside="true">
|
|
2862
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Wednesday, 3 June 2026">3</button>
|
|
2863
2863
|
</td>
|
|
2864
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-
|
|
2865
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday,
|
|
2864
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-06-04" data-month="2026-06" data-outside="true">
|
|
2865
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday, 4 June 2026">4</button>
|
|
2866
2866
|
</td>
|
|
2867
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-05
|
|
2868
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday,
|
|
2867
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-06-05" data-month="2026-06" data-outside="true">
|
|
2868
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday, 5 June 2026">5</button>
|
|
2869
2869
|
</td>
|
|
2870
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-
|
|
2871
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday,
|
|
2870
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-06-06" data-month="2026-06" data-outside="true">
|
|
2871
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday, 6 June 2026">6</button>
|
|
2872
2872
|
</td>
|
|
2873
|
-
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-
|
|
2874
|
-
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday,
|
|
2873
|
+
<td class="rdp-day rdp-outside" role="gridcell" data-day="2026-06-07" data-month="2026-06" data-outside="true">
|
|
2874
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Sunday, 7 June 2026">7</button>
|
|
2875
2875
|
</td>
|
|
2876
2876
|
</tr>
|
|
2877
2877
|
</tbody>
|
|
@@ -2884,7 +2884,7 @@ export default DayPickerMultipleSelectionExample;
|
|
|
2884
2884
|
</div>
|
|
2885
2885
|
</div>
|
|
2886
2886
|
<div class="padding-top-15">
|
|
2887
|
-
<b>You picked:</b>
|
|
2887
|
+
<b>You picked:</b> 06/05/2026
|
|
2888
2888
|
</div>
|
|
2889
2889
|
</div>
|
|
2890
2890
|
```
|
|
@@ -4050,7 +4050,7 @@ export default DayPickerCalendarHiddenDaysExample;
|
|
|
4050
4050
|
</thead>
|
|
4051
4051
|
<tbody data-animated-weeks="true" class="rdp-weeks">
|
|
4052
4052
|
<tr class="rdp-week">
|
|
4053
|
-
<td class="rdp-day rdp-hidden rdp-outside
|
|
4053
|
+
<td class="rdp-day rdp-hidden rdp-outside" role="gridcell" data-day="2026-04-27" data-month="2026-04" data-hidden="true" data-outside="true">
|
|
4054
4054
|
</td>
|
|
4055
4055
|
<td class="rdp-day rdp-hidden rdp-outside" role="gridcell" data-day="2026-04-28" data-month="2026-04" data-hidden="true" data-outside="true">
|
|
4056
4056
|
</td>
|
|
@@ -4059,7 +4059,7 @@ export default DayPickerCalendarHiddenDaysExample;
|
|
|
4059
4059
|
<td class="rdp-day rdp-hidden rdp-outside" role="gridcell" data-day="2026-04-30" data-month="2026-04" data-hidden="true" data-outside="true">
|
|
4060
4060
|
</td>
|
|
4061
4061
|
<td class="rdp-day" role="gridcell" data-day="2026-05-01">
|
|
4062
|
-
<button class="rdp-day_button" type="button" tabindex="
|
|
4062
|
+
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Friday, 1 May 2026">1</button>
|
|
4063
4063
|
</td>
|
|
4064
4064
|
<td class="rdp-day" role="gridcell" data-day="2026-05-02">
|
|
4065
4065
|
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Saturday, 2 May 2026">2</button>
|
|
@@ -4075,8 +4075,8 @@ export default DayPickerCalendarHiddenDaysExample;
|
|
|
4075
4075
|
<td class="rdp-day" role="gridcell" data-day="2026-05-05">
|
|
4076
4076
|
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday, 5 May 2026">5</button>
|
|
4077
4077
|
</td>
|
|
4078
|
-
<td class="rdp-day" role="gridcell" data-day="2026-05-06">
|
|
4079
|
-
<button class="rdp-day_button" type="button" tabindex="
|
|
4078
|
+
<td class="rdp-day rdp-today" role="gridcell" data-day="2026-05-06" data-today="true">
|
|
4079
|
+
<button class="rdp-day_button" type="button" tabindex="0" aria-label="Today, Wednesday, 6 May 2026">6</button>
|
|
4080
4080
|
</td>
|
|
4081
4081
|
<td class="rdp-day" role="gridcell" data-day="2026-05-07">
|
|
4082
4082
|
<button class="rdp-day_button" type="button" tabindex="-1" aria-label="Thursday, 7 May 2026">7</button>
|