@salt-ds/lab 1.0.0-alpha.89 → 1.0.0-alpha.90
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/CHANGELOG.md +103 -0
- package/css/salt-lab.css +120 -643
- package/dist-cjs/calendar/index.js +61 -0
- package/dist-cjs/calendar/index.js.map +1 -0
- package/dist-cjs/content-status/ContentStatus.js +1 -1
- package/dist-cjs/content-status/ContentStatus.js.map +1 -1
- package/dist-cjs/date-input/index.js +23 -0
- package/dist-cjs/date-input/index.js.map +1 -0
- package/dist-cjs/date-picker/index.js +106 -0
- package/dist-cjs/date-picker/index.js.map +1 -0
- package/dist-cjs/index.js +58 -56
- package/dist-cjs/index.js.map +1 -1
- package/dist-cjs/localization-provider/index.js +26 -0
- package/dist-cjs/localization-provider/index.js.map +1 -0
- package/dist-cjs/rating/Rating.css.js +1 -1
- package/dist-cjs/rating/Rating.js +11 -16
- package/dist-cjs/rating/Rating.js.map +1 -1
- package/dist-cjs/side-panel/SidePanel.css.js +6 -0
- package/dist-cjs/side-panel/SidePanel.css.js.map +1 -0
- package/dist-cjs/side-panel/SidePanel.js +156 -0
- package/dist-cjs/side-panel/SidePanel.js.map +1 -0
- package/dist-cjs/side-panel/SidePanelContent.css.js +6 -0
- package/dist-cjs/side-panel/SidePanelContent.css.js.map +1 -0
- package/dist-cjs/side-panel/SidePanelContent.js +86 -0
- package/dist-cjs/side-panel/SidePanelContent.js.map +1 -0
- package/dist-cjs/side-panel/SidePanelHeader.css.js +6 -0
- package/dist-cjs/side-panel/SidePanelHeader.css.js.map +1 -0
- package/dist-cjs/side-panel/SidePanelHeader.js +26 -0
- package/dist-cjs/side-panel/SidePanelHeader.js.map +1 -0
- package/dist-cjs/side-panel/SidePanelProvider.js +71 -0
- package/dist-cjs/side-panel/SidePanelProvider.js.map +1 -0
- package/dist-cjs/side-panel/SidePanelTitle.css.js +6 -0
- package/dist-cjs/side-panel/SidePanelTitle.css.js.map +1 -0
- package/dist-cjs/side-panel/SidePanelTitle.js +47 -0
- package/dist-cjs/side-panel/SidePanelTitle.js.map +1 -0
- package/dist-cjs/side-panel/SidePanelTrigger.js +37 -0
- package/dist-cjs/side-panel/SidePanelTrigger.js.map +1 -0
- package/dist-cjs/side-panel/internal/SidePanelContext.js +31 -0
- package/dist-cjs/side-panel/internal/SidePanelContext.js.map +1 -0
- package/dist-cjs/side-panel/useSidePanel.js +41 -0
- package/dist-cjs/side-panel/useSidePanel.js.map +1 -0
- package/dist-cjs/utils/deprecatedExport.js +30 -0
- package/dist-cjs/utils/deprecatedExport.js.map +1 -0
- package/dist-es/calendar/index.js +50 -0
- package/dist-es/calendar/index.js.map +1 -0
- package/dist-es/content-status/ContentStatus.js +1 -1
- package/dist-es/content-status/ContentStatus.js.map +1 -1
- package/dist-es/date-input/index.js +20 -0
- package/dist-es/date-input/index.js.map +1 -0
- package/dist-es/date-picker/index.js +85 -0
- package/dist-es/date-picker/index.js.map +1 -0
- package/dist-es/index.js +12 -23
- package/dist-es/index.js.map +1 -1
- package/dist-es/localization-provider/index.js +20 -0
- package/dist-es/localization-provider/index.js.map +1 -0
- package/dist-es/rating/Rating.css.js +1 -1
- package/dist-es/rating/Rating.js +13 -18
- package/dist-es/rating/Rating.js.map +1 -1
- package/dist-es/side-panel/SidePanel.css.js +4 -0
- package/dist-es/side-panel/SidePanel.css.js.map +1 -0
- package/dist-es/side-panel/SidePanel.js +154 -0
- package/dist-es/side-panel/SidePanel.js.map +1 -0
- package/dist-es/side-panel/SidePanelContent.css.js +4 -0
- package/dist-es/side-panel/SidePanelContent.css.js.map +1 -0
- package/dist-es/side-panel/SidePanelContent.js +84 -0
- package/dist-es/side-panel/SidePanelContent.js.map +1 -0
- package/dist-es/side-panel/SidePanelHeader.css.js +4 -0
- package/dist-es/side-panel/SidePanelHeader.css.js.map +1 -0
- package/dist-es/side-panel/SidePanelHeader.js +24 -0
- package/dist-es/side-panel/SidePanelHeader.js.map +1 -0
- package/dist-es/side-panel/SidePanelProvider.js +69 -0
- package/dist-es/side-panel/SidePanelProvider.js.map +1 -0
- package/dist-es/side-panel/SidePanelTitle.css.js +4 -0
- package/dist-es/side-panel/SidePanelTitle.css.js.map +1 -0
- package/dist-es/side-panel/SidePanelTitle.js +45 -0
- package/dist-es/side-panel/SidePanelTitle.js.map +1 -0
- package/dist-es/side-panel/SidePanelTrigger.js +35 -0
- package/dist-es/side-panel/SidePanelTrigger.js.map +1 -0
- package/dist-es/side-panel/internal/SidePanelContext.js +28 -0
- package/dist-es/side-panel/internal/SidePanelContext.js.map +1 -0
- package/dist-es/side-panel/useSidePanel.js +39 -0
- package/dist-es/side-panel/useSidePanel.js.map +1 -0
- package/dist-es/utils/deprecatedExport.js +27 -0
- package/dist-es/utils/deprecatedExport.js.map +1 -0
- package/dist-types/calendar/index.d.ts +13 -8
- package/dist-types/date-input/index.d.ts +3 -2
- package/dist-types/index.d.ts +1 -0
- package/dist-types/localization-provider/index.d.ts +9 -1
- package/dist-types/rating/Rating.d.ts +1 -2
- package/dist-types/side-panel/SidePanel.d.ts +27 -0
- package/dist-types/side-panel/SidePanelContent.d.ts +4 -0
- package/dist-types/side-panel/SidePanelHeader.d.ts +4 -0
- package/dist-types/side-panel/SidePanelProvider.d.ts +20 -0
- package/dist-types/side-panel/SidePanelTitle.d.ts +4 -0
- package/dist-types/side-panel/SidePanelTrigger.d.ts +5 -0
- package/dist-types/side-panel/index.d.ts +7 -0
- package/dist-types/side-panel/internal/SidePanelContext.d.ts +48 -0
- package/dist-types/side-panel/internal/index.d.ts +1 -0
- package/dist-types/side-panel/useSidePanel.d.ts +32 -0
- package/dist-types/utils/deprecatedExport.d.ts +11 -0
- package/package.json +5 -12
- package/dist-cjs/calendar/Calendar.css.js +0 -6
- package/dist-cjs/calendar/Calendar.css.js.map +0 -1
- package/dist-cjs/calendar/Calendar.js +0 -152
- package/dist-cjs/calendar/Calendar.js.map +0 -1
- package/dist-cjs/calendar/CalendarGrid.js +0 -85
- package/dist-cjs/calendar/CalendarGrid.js.map +0 -1
- package/dist-cjs/calendar/CalendarMonthHeader.css.js +0 -6
- package/dist-cjs/calendar/CalendarMonthHeader.css.js.map +0 -1
- package/dist-cjs/calendar/CalendarMonthHeader.js +0 -48
- package/dist-cjs/calendar/CalendarMonthHeader.js.map +0 -1
- package/dist-cjs/calendar/CalendarNavigation.css.js +0 -6
- package/dist-cjs/calendar/CalendarNavigation.css.js.map +0 -1
- package/dist-cjs/calendar/CalendarNavigation.js +0 -337
- package/dist-cjs/calendar/CalendarNavigation.js.map +0 -1
- package/dist-cjs/calendar/CalendarWeekHeader.css.js +0 -6
- package/dist-cjs/calendar/CalendarWeekHeader.css.js.map +0 -1
- package/dist-cjs/calendar/CalendarWeekHeader.js +0 -46
- package/dist-cjs/calendar/CalendarWeekHeader.js.map +0 -1
- package/dist-cjs/calendar/internal/CalendarContext.js +0 -25
- package/dist-cjs/calendar/internal/CalendarContext.js.map +0 -1
- package/dist-cjs/calendar/internal/CalendarDay.css.js +0 -6
- package/dist-cjs/calendar/internal/CalendarDay.css.js.map +0 -1
- package/dist-cjs/calendar/internal/CalendarDay.js +0 -97
- package/dist-cjs/calendar/internal/CalendarDay.js.map +0 -1
- package/dist-cjs/calendar/internal/CalendarMonth.css.js +0 -6
- package/dist-cjs/calendar/internal/CalendarMonth.css.js.map +0 -1
- package/dist-cjs/calendar/internal/CalendarMonth.js +0 -76
- package/dist-cjs/calendar/internal/CalendarMonth.js.map +0 -1
- package/dist-cjs/calendar/internal/useFocusManagement.js +0 -68
- package/dist-cjs/calendar/internal/useFocusManagement.js.map +0 -1
- package/dist-cjs/calendar/internal/utils.js +0 -50
- package/dist-cjs/calendar/internal/utils.js.map +0 -1
- package/dist-cjs/calendar/useCalendar.js +0 -183
- package/dist-cjs/calendar/useCalendar.js.map +0 -1
- package/dist-cjs/calendar/useCalendarDay.js +0 -85
- package/dist-cjs/calendar/useCalendarDay.js.map +0 -1
- package/dist-cjs/calendar/useCalendarSelection.js +0 -604
- package/dist-cjs/calendar/useCalendarSelection.js.map +0 -1
- package/dist-cjs/date-input/DateInput.css.js +0 -6
- package/dist-cjs/date-input/DateInput.css.js.map +0 -1
- package/dist-cjs/date-input/DateInputRange.js +0 -352
- package/dist-cjs/date-input/DateInputRange.js.map +0 -1
- package/dist-cjs/date-input/DateInputSingle.js +0 -234
- package/dist-cjs/date-input/DateInputSingle.js.map +0 -1
- package/dist-cjs/date-picker/DatePicker.js +0 -75
- package/dist-cjs/date-picker/DatePicker.js.map +0 -1
- package/dist-cjs/date-picker/DatePickerActions.css.js +0 -6
- package/dist-cjs/date-picker/DatePickerActions.css.js.map +0 -1
- package/dist-cjs/date-picker/DatePickerActions.js +0 -91
- package/dist-cjs/date-picker/DatePickerActions.js.map +0 -1
- package/dist-cjs/date-picker/DatePickerContext.js +0 -36
- package/dist-cjs/date-picker/DatePickerContext.js.map +0 -1
- package/dist-cjs/date-picker/DatePickerHelperText.css.js +0 -6
- package/dist-cjs/date-picker/DatePickerHelperText.css.js.map +0 -1
- package/dist-cjs/date-picker/DatePickerHelperText.js +0 -36
- package/dist-cjs/date-picker/DatePickerHelperText.js.map +0 -1
- package/dist-cjs/date-picker/DatePickerOverlay.css.js +0 -6
- package/dist-cjs/date-picker/DatePickerOverlay.css.js.map +0 -1
- package/dist-cjs/date-picker/DatePickerOverlay.js +0 -48
- package/dist-cjs/date-picker/DatePickerOverlay.js.map +0 -1
- package/dist-cjs/date-picker/DatePickerOverlayProvider.js +0 -166
- package/dist-cjs/date-picker/DatePickerOverlayProvider.js.map +0 -1
- package/dist-cjs/date-picker/DatePickerPanel.css.js +0 -6
- package/dist-cjs/date-picker/DatePickerPanel.css.js.map +0 -1
- package/dist-cjs/date-picker/DatePickerRangeGridPanel.js +0 -246
- package/dist-cjs/date-picker/DatePickerRangeGridPanel.js.map +0 -1
- package/dist-cjs/date-picker/DatePickerRangeInput.js +0 -202
- package/dist-cjs/date-picker/DatePickerRangeInput.js.map +0 -1
- package/dist-cjs/date-picker/DatePickerRangePanel.js +0 -355
- package/dist-cjs/date-picker/DatePickerRangePanel.js.map +0 -1
- package/dist-cjs/date-picker/DatePickerSingleGridPanel.js +0 -253
- package/dist-cjs/date-picker/DatePickerSingleGridPanel.js.map +0 -1
- package/dist-cjs/date-picker/DatePickerSingleInput.js +0 -148
- package/dist-cjs/date-picker/DatePickerSingleInput.js.map +0 -1
- package/dist-cjs/date-picker/DatePickerSinglePanel.js +0 -20
- package/dist-cjs/date-picker/DatePickerSinglePanel.js.map +0 -1
- package/dist-cjs/date-picker/DatePickerTrigger.js +0 -32
- package/dist-cjs/date-picker/DatePickerTrigger.js.map +0 -1
- package/dist-cjs/date-picker/useDatePicker.js +0 -201
- package/dist-cjs/date-picker/useDatePicker.js.map +0 -1
- package/dist-cjs/date-picker/useFocusOut.js +0 -43
- package/dist-cjs/date-picker/useFocusOut.js.map +0 -1
- package/dist-cjs/date-picker/useKeyboard.js +0 -22
- package/dist-cjs/date-picker/useKeyboard.js.map +0 -1
- package/dist-cjs/localization-provider/LocalizationProvider.js +0 -51
- package/dist-cjs/localization-provider/LocalizationProvider.js.map +0 -1
- package/dist-es/calendar/Calendar.css.js +0 -4
- package/dist-es/calendar/Calendar.css.js.map +0 -1
- package/dist-es/calendar/Calendar.js +0 -150
- package/dist-es/calendar/Calendar.js.map +0 -1
- package/dist-es/calendar/CalendarGrid.js +0 -83
- package/dist-es/calendar/CalendarGrid.js.map +0 -1
- package/dist-es/calendar/CalendarMonthHeader.css.js +0 -4
- package/dist-es/calendar/CalendarMonthHeader.css.js.map +0 -1
- package/dist-es/calendar/CalendarMonthHeader.js +0 -46
- package/dist-es/calendar/CalendarMonthHeader.js.map +0 -1
- package/dist-es/calendar/CalendarNavigation.css.js +0 -4
- package/dist-es/calendar/CalendarNavigation.css.js.map +0 -1
- package/dist-es/calendar/CalendarNavigation.js +0 -335
- package/dist-es/calendar/CalendarNavigation.js.map +0 -1
- package/dist-es/calendar/CalendarWeekHeader.css.js +0 -4
- package/dist-es/calendar/CalendarWeekHeader.css.js.map +0 -1
- package/dist-es/calendar/CalendarWeekHeader.js +0 -44
- package/dist-es/calendar/CalendarWeekHeader.js.map +0 -1
- package/dist-es/calendar/internal/CalendarContext.js +0 -22
- package/dist-es/calendar/internal/CalendarContext.js.map +0 -1
- package/dist-es/calendar/internal/CalendarDay.css.js +0 -4
- package/dist-es/calendar/internal/CalendarDay.css.js.map +0 -1
- package/dist-es/calendar/internal/CalendarDay.js +0 -95
- package/dist-es/calendar/internal/CalendarDay.js.map +0 -1
- package/dist-es/calendar/internal/CalendarMonth.css.js +0 -4
- package/dist-es/calendar/internal/CalendarMonth.css.js.map +0 -1
- package/dist-es/calendar/internal/CalendarMonth.js +0 -74
- package/dist-es/calendar/internal/CalendarMonth.js.map +0 -1
- package/dist-es/calendar/internal/useFocusManagement.js +0 -66
- package/dist-es/calendar/internal/useFocusManagement.js.map +0 -1
- package/dist-es/calendar/internal/utils.js +0 -44
- package/dist-es/calendar/internal/utils.js.map +0 -1
- package/dist-es/calendar/useCalendar.js +0 -181
- package/dist-es/calendar/useCalendar.js.map +0 -1
- package/dist-es/calendar/useCalendarDay.js +0 -83
- package/dist-es/calendar/useCalendarDay.js.map +0 -1
- package/dist-es/calendar/useCalendarSelection.js +0 -600
- package/dist-es/calendar/useCalendarSelection.js.map +0 -1
- package/dist-es/date-input/DateInput.css.js +0 -4
- package/dist-es/date-input/DateInput.css.js.map +0 -1
- package/dist-es/date-input/DateInputRange.js +0 -349
- package/dist-es/date-input/DateInputRange.js.map +0 -1
- package/dist-es/date-input/DateInputSingle.js +0 -232
- package/dist-es/date-input/DateInputSingle.js.map +0 -1
- package/dist-es/date-picker/DatePicker.js +0 -72
- package/dist-es/date-picker/DatePicker.js.map +0 -1
- package/dist-es/date-picker/DatePickerActions.css.js +0 -4
- package/dist-es/date-picker/DatePickerActions.css.js.map +0 -1
- package/dist-es/date-picker/DatePickerActions.js +0 -89
- package/dist-es/date-picker/DatePickerActions.js.map +0 -1
- package/dist-es/date-picker/DatePickerContext.js +0 -32
- package/dist-es/date-picker/DatePickerContext.js.map +0 -1
- package/dist-es/date-picker/DatePickerHelperText.css.js +0 -4
- package/dist-es/date-picker/DatePickerHelperText.css.js.map +0 -1
- package/dist-es/date-picker/DatePickerHelperText.js +0 -34
- package/dist-es/date-picker/DatePickerHelperText.js.map +0 -1
- package/dist-es/date-picker/DatePickerOverlay.css.js +0 -4
- package/dist-es/date-picker/DatePickerOverlay.css.js.map +0 -1
- package/dist-es/date-picker/DatePickerOverlay.js +0 -46
- package/dist-es/date-picker/DatePickerOverlay.js.map +0 -1
- package/dist-es/date-picker/DatePickerOverlayProvider.js +0 -163
- package/dist-es/date-picker/DatePickerOverlayProvider.js.map +0 -1
- package/dist-es/date-picker/DatePickerPanel.css.js +0 -4
- package/dist-es/date-picker/DatePickerPanel.css.js.map +0 -1
- package/dist-es/date-picker/DatePickerRangeGridPanel.js +0 -244
- package/dist-es/date-picker/DatePickerRangeGridPanel.js.map +0 -1
- package/dist-es/date-picker/DatePickerRangeInput.js +0 -199
- package/dist-es/date-picker/DatePickerRangeInput.js.map +0 -1
- package/dist-es/date-picker/DatePickerRangePanel.js +0 -353
- package/dist-es/date-picker/DatePickerRangePanel.js.map +0 -1
- package/dist-es/date-picker/DatePickerSingleGridPanel.js +0 -251
- package/dist-es/date-picker/DatePickerSingleGridPanel.js.map +0 -1
- package/dist-es/date-picker/DatePickerSingleInput.js +0 -146
- package/dist-es/date-picker/DatePickerSingleInput.js.map +0 -1
- package/dist-es/date-picker/DatePickerSinglePanel.js +0 -18
- package/dist-es/date-picker/DatePickerSinglePanel.js.map +0 -1
- package/dist-es/date-picker/DatePickerTrigger.js +0 -30
- package/dist-es/date-picker/DatePickerTrigger.js.map +0 -1
- package/dist-es/date-picker/useDatePicker.js +0 -199
- package/dist-es/date-picker/useDatePicker.js.map +0 -1
- package/dist-es/date-picker/useFocusOut.js +0 -41
- package/dist-es/date-picker/useFocusOut.js.map +0 -1
- package/dist-es/date-picker/useKeyboard.js +0 -20
- package/dist-es/date-picker/useKeyboard.js.map +0 -1
- package/dist-es/localization-provider/LocalizationProvider.js +0 -47
- package/dist-es/localization-provider/LocalizationProvider.js.map +0 -1
- package/dist-types/calendar/Calendar.d.ts +0 -116
- package/dist-types/calendar/CalendarGrid.d.ts +0 -29
- package/dist-types/calendar/CalendarMonthHeader.d.ts +0 -18
- package/dist-types/calendar/CalendarNavigation.d.ts +0 -64
- package/dist-types/calendar/CalendarWeekHeader.d.ts +0 -6
- package/dist-types/calendar/internal/CalendarContext.d.ts +0 -7
- package/dist-types/calendar/internal/CalendarDay.d.ts +0 -32
- package/dist-types/calendar/internal/CalendarMonth.d.ts +0 -13
- package/dist-types/calendar/internal/useFocusManagement.d.ts +0 -9
- package/dist-types/calendar/internal/utils.d.ts +0 -6
- package/dist-types/calendar/useCalendar.d.ts +0 -294
- package/dist-types/calendar/useCalendarDay.d.ts +0 -56
- package/dist-types/calendar/useCalendarSelection.d.ts +0 -365
- package/dist-types/date-input/DateInputRange.d.ts +0 -136
- package/dist-types/date-input/DateInputSingle.d.ts +0 -104
- package/dist-types/date-picker/DatePicker.d.ts +0 -55
- package/dist-types/date-picker/DatePickerActions.d.ts +0 -81
- package/dist-types/date-picker/DatePickerContext.d.ts +0 -188
- package/dist-types/date-picker/DatePickerHelperText.d.ts +0 -4
- package/dist-types/date-picker/DatePickerOverlay.d.ts +0 -11
- package/dist-types/date-picker/DatePickerOverlayProvider.d.ts +0 -102
- package/dist-types/date-picker/DatePickerRangeGridPanel.d.ts +0 -16
- package/dist-types/date-picker/DatePickerRangeInput.d.ts +0 -18
- package/dist-types/date-picker/DatePickerRangePanel.d.ts +0 -84
- package/dist-types/date-picker/DatePickerSingleGridPanel.d.ts +0 -64
- package/dist-types/date-picker/DatePickerSingleInput.d.ts +0 -17
- package/dist-types/date-picker/DatePickerSinglePanel.d.ts +0 -8
- package/dist-types/date-picker/DatePickerTrigger.d.ts +0 -9
- package/dist-types/date-picker/index.d.ts +0 -13
- package/dist-types/date-picker/useDatePicker.d.ts +0 -119
- package/dist-types/date-picker/useFocusOut.d.ts +0 -9
- package/dist-types/date-picker/useKeyboard.d.ts +0 -20
- package/dist-types/localization-provider/LocalizationProvider.d.ts +0 -62
|
@@ -1,83 +0,0 @@
|
|
|
1
|
-
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
2
|
-
import { useForkRef, GridLayout, GridItem } from '@salt-ds/core';
|
|
3
|
-
import { forwardRef, useRef, useMemo } from 'react';
|
|
4
|
-
import { useLocalization } from '../localization-provider/LocalizationProvider.js';
|
|
5
|
-
import { CalendarMonthHeader } from './CalendarMonthHeader.js';
|
|
6
|
-
import { CalendarWeekHeader } from './CalendarWeekHeader.js';
|
|
7
|
-
import { useCalendarContext } from './internal/CalendarContext.js';
|
|
8
|
-
import { CalendarMonth } from './internal/CalendarMonth.js';
|
|
9
|
-
|
|
10
|
-
const CalendarGrid = forwardRef(
|
|
11
|
-
(props, ref) => {
|
|
12
|
-
const {
|
|
13
|
-
CalendarDayProps,
|
|
14
|
-
CalendarWeekHeaderProps,
|
|
15
|
-
CalendarMonthHeaderProps,
|
|
16
|
-
columns = 1,
|
|
17
|
-
onBlur,
|
|
18
|
-
...rest
|
|
19
|
-
} = props;
|
|
20
|
-
const { dateAdapter } = useLocalization();
|
|
21
|
-
const {
|
|
22
|
-
helpers: { setFocusedDate, setHoveredDate },
|
|
23
|
-
state: { visibleMonth, numberOfVisibleMonths = 1 }
|
|
24
|
-
} = useCalendarContext();
|
|
25
|
-
const calendarGridRef = useRef(null);
|
|
26
|
-
const containerRef = useForkRef(ref, calendarGridRef);
|
|
27
|
-
const handleCalendarGridBlur = (event) => {
|
|
28
|
-
event.stopPropagation();
|
|
29
|
-
const relatedTarget = event.relatedTarget;
|
|
30
|
-
if (calendarGridRef.current && relatedTarget && calendarGridRef.current.contains(relatedTarget)) {
|
|
31
|
-
return;
|
|
32
|
-
}
|
|
33
|
-
setFocusedDate(event, null);
|
|
34
|
-
setHoveredDate(event, null);
|
|
35
|
-
onBlur == null ? void 0 : onBlur(event);
|
|
36
|
-
};
|
|
37
|
-
const visibleMonths = useMemo(
|
|
38
|
-
() => Array.from({ length: numberOfVisibleMonths }, (_value, index) => {
|
|
39
|
-
const gridItemVisibleMonth = dateAdapter.add(visibleMonth, {
|
|
40
|
-
months: index
|
|
41
|
-
});
|
|
42
|
-
return gridItemVisibleMonth;
|
|
43
|
-
}),
|
|
44
|
-
[dateAdapter, numberOfVisibleMonths, visibleMonth]
|
|
45
|
-
);
|
|
46
|
-
return /* @__PURE__ */ jsx(
|
|
47
|
-
GridLayout,
|
|
48
|
-
{
|
|
49
|
-
columns,
|
|
50
|
-
gap: 1,
|
|
51
|
-
ref: containerRef,
|
|
52
|
-
onBlur: handleCalendarGridBlur,
|
|
53
|
-
...rest,
|
|
54
|
-
children: visibleMonths.map((gridItemVisibleMonth) => /* @__PURE__ */ jsxs(
|
|
55
|
-
GridItem,
|
|
56
|
-
{
|
|
57
|
-
children: [
|
|
58
|
-
numberOfVisibleMonths > 1 ? /* @__PURE__ */ jsx(
|
|
59
|
-
CalendarMonthHeader,
|
|
60
|
-
{
|
|
61
|
-
...CalendarMonthHeaderProps,
|
|
62
|
-
month: gridItemVisibleMonth
|
|
63
|
-
}
|
|
64
|
-
) : null,
|
|
65
|
-
/* @__PURE__ */ jsx(CalendarWeekHeader, { ...CalendarWeekHeaderProps }),
|
|
66
|
-
/* @__PURE__ */ jsx(
|
|
67
|
-
CalendarMonth,
|
|
68
|
-
{
|
|
69
|
-
date: gridItemVisibleMonth,
|
|
70
|
-
CalendarDayProps
|
|
71
|
-
}
|
|
72
|
-
)
|
|
73
|
-
]
|
|
74
|
-
},
|
|
75
|
-
`calendar-grid-item-${dateAdapter.format(gridItemVisibleMonth, "MMMM YYYY")}`
|
|
76
|
-
))
|
|
77
|
-
}
|
|
78
|
-
);
|
|
79
|
-
}
|
|
80
|
-
);
|
|
81
|
-
|
|
82
|
-
export { CalendarGrid };
|
|
83
|
-
//# sourceMappingURL=CalendarGrid.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"CalendarGrid.js","sources":["../src/calendar/CalendarGrid.tsx"],"sourcesContent":["import {\n GridItem,\n GridLayout,\n type ResponsiveProp,\n useForkRef,\n} from \"@salt-ds/core\";\nimport type { DateFrameworkType } from \"@salt-ds/date-adapters\";\nimport {\n type ComponentPropsWithoutRef,\n type FocusEventHandler,\n forwardRef,\n useMemo,\n useRef,\n} from \"react\";\nimport { useLocalization } from \"../localization-provider\";\nimport {\n CalendarMonthHeader,\n type CalendarMonthHeaderProps,\n} from \"./CalendarMonthHeader\";\nimport {\n CalendarWeekHeader,\n type CalendarWeekHeaderProps,\n} from \"./CalendarWeekHeader\";\nimport { useCalendarContext } from \"./internal/CalendarContext\";\nimport type { CalendarDayProps } from \"./internal/CalendarDay\";\nimport { CalendarMonth } from \"./internal/CalendarMonth\";\n\n/**\n * Props for the CalendarGrid component.\n * @template TDate - The type of the date object.\n */\nexport interface CalendarGridProps<TDate extends DateFrameworkType>\n extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * Number of columns\n */\n columns?: ResponsiveProp<number | string>;\n /**\n * Props for `CalendarWeekHeader`\n */\n CalendarWeekHeaderProps?: Partial<CalendarWeekHeaderProps>;\n /**\n * Props for `CalendarMonthHeader`\n */\n CalendarMonthHeaderProps?: Partial<CalendarMonthHeaderProps<TDate>>;\n /**\n * Props for `CalendarDay`\n */\n CalendarDayProps?: Partial<CalendarDayProps<TDate>>;\n}\n\nexport const CalendarGrid = forwardRef<\n HTMLDivElement,\n CalendarGridProps<DateFrameworkType>\n>(\n <TDate extends DateFrameworkType>(\n props: CalendarGridProps<TDate>,\n ref: React.Ref<HTMLDivElement>,\n ) => {\n const {\n CalendarDayProps,\n CalendarWeekHeaderProps,\n CalendarMonthHeaderProps,\n columns = 1,\n onBlur,\n ...rest\n } = props;\n\n const { dateAdapter } = useLocalization<TDate>();\n\n const {\n helpers: { setFocusedDate, setHoveredDate },\n state: { visibleMonth, numberOfVisibleMonths = 1 },\n } = useCalendarContext<TDate>();\n const calendarGridRef = useRef<HTMLDivElement>(null);\n const containerRef = useForkRef(ref, calendarGridRef);\n\n const handleCalendarGridBlur: FocusEventHandler<HTMLDivElement> = (\n event,\n ) => {\n event.stopPropagation();\n const relatedTarget = event.relatedTarget as HTMLElement;\n if (\n calendarGridRef.current &&\n relatedTarget &&\n calendarGridRef.current.contains(relatedTarget)\n ) {\n return;\n }\n setFocusedDate(event, null);\n setHoveredDate(event, null);\n onBlur?.(event);\n };\n\n const visibleMonths = useMemo(\n () =>\n Array.from({ length: numberOfVisibleMonths }, (_value, index) => {\n const gridItemVisibleMonth: TDate = dateAdapter.add(visibleMonth, {\n months: index,\n });\n return gridItemVisibleMonth;\n }),\n [dateAdapter, numberOfVisibleMonths, visibleMonth],\n );\n\n return (\n <GridLayout\n columns={columns}\n gap={1}\n ref={containerRef}\n onBlur={handleCalendarGridBlur}\n {...rest}\n >\n {visibleMonths.map((gridItemVisibleMonth) => (\n <GridItem\n key={`calendar-grid-item-${dateAdapter.format(gridItemVisibleMonth, \"MMMM YYYY\")}`}\n >\n {numberOfVisibleMonths > 1 ? (\n <CalendarMonthHeader\n {...CalendarMonthHeaderProps}\n month={gridItemVisibleMonth}\n />\n ) : null}\n <CalendarWeekHeader {...CalendarWeekHeaderProps} />\n <CalendarMonth\n date={gridItemVisibleMonth}\n CalendarDayProps={CalendarDayProps}\n />\n </GridItem>\n ))}\n </GridLayout>\n );\n },\n);\n"],"names":[],"mappings":";;;;;;;;;AAmDO,MAAM,YAAA,GAAe,UAAA;AAAA,EAI1B,CACE,OACA,GAAA,KACG;AACH,IAAA,MAAM;AAAA,MACJ,gBAAA;AAAA,MACA,uBAAA;AAAA,MACA,wBAAA;AAAA,MACA,OAAA,GAAU,CAAA;AAAA,MACV,MAAA;AAAA,MACA,GAAG;AAAA,KACL,GAAI,KAAA;AAEJ,IAAA,MAAM,EAAE,WAAA,EAAY,GAAI,eAAA,EAAuB;AAE/C,IAAA,MAAM;AAAA,MACJ,OAAA,EAAS,EAAE,cAAA,EAAgB,cAAA,EAAe;AAAA,MAC1C,KAAA,EAAO,EAAE,YAAA,EAAc,qBAAA,GAAwB,CAAA;AAAE,QAC/C,kBAAA,EAA0B;AAC9B,IAAA,MAAM,eAAA,GAAkB,OAAuB,IAAI,CAAA;AACnD,IAAA,MAAM,YAAA,GAAe,UAAA,CAAW,GAAA,EAAK,eAAe,CAAA;AAEpD,IAAA,MAAM,sBAAA,GAA4D,CAChE,KAAA,KACG;AACH,MAAA,KAAA,CAAM,eAAA,EAAgB;AACtB,MAAA,MAAM,gBAAgB,KAAA,CAAM,aAAA;AAC5B,MAAA,IACE,gBAAgB,OAAA,IAChB,aAAA,IACA,gBAAgB,OAAA,CAAQ,QAAA,CAAS,aAAa,CAAA,EAC9C;AACA,QAAA;AAAA,MACF;AACA,MAAA,cAAA,CAAe,OAAO,IAAI,CAAA;AAC1B,MAAA,cAAA,CAAe,OAAO,IAAI,CAAA;AAC1B,MAAA,MAAA,IAAA,IAAA,GAAA,MAAA,GAAA,MAAA,CAAS,KAAA,CAAA;AAAA,IACX,CAAA;AAEA,IAAA,MAAM,aAAA,GAAgB,OAAA;AAAA,MACpB,MACE,MAAM,IAAA,CAAK,EAAE,QAAQ,qBAAA,EAAsB,EAAG,CAAC,MAAA,EAAQ,KAAA,KAAU;AAC/D,QAAA,MAAM,oBAAA,GAA8B,WAAA,CAAY,GAAA,CAAI,YAAA,EAAc;AAAA,UAChE,MAAA,EAAQ;AAAA,SACT,CAAA;AACD,QAAA,OAAO,oBAAA;AAAA,MACT,CAAC,CAAA;AAAA,MACH,CAAC,WAAA,EAAa,qBAAA,EAAuB,YAAY;AAAA,KACnD;AAEA,IAAA,uBACE,GAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACC,OAAA;AAAA,QACA,GAAA,EAAK,CAAA;AAAA,QACL,GAAA,EAAK,YAAA;AAAA,QACL,MAAA,EAAQ,sBAAA;AAAA,QACP,GAAG,IAAA;AAAA,QAEH,QAAA,EAAA,aAAA,CAAc,GAAA,CAAI,CAAC,oBAAA,qBAClB,IAAA;AAAA,UAAC,QAAA;AAAA,UAAA;AAAA,YAGE,QAAA,EAAA;AAAA,cAAA,qBAAA,GAAwB,CAAA,mBACvB,GAAA;AAAA,gBAAC,mBAAA;AAAA,gBAAA;AAAA,kBACE,GAAG,wBAAA;AAAA,kBACJ,KAAA,EAAO;AAAA;AAAA,eACT,GACE,IAAA;AAAA,8BACJ,GAAA,CAAC,kBAAA,EAAA,EAAoB,GAAG,uBAAA,EAAyB,CAAA;AAAA,8BACjD,GAAA;AAAA,gBAAC,aAAA;AAAA,gBAAA;AAAA,kBACC,IAAA,EAAM,oBAAA;AAAA,kBACN;AAAA;AAAA;AACF;AAAA,WAAA;AAAA,UAZK,CAAA,mBAAA,EAAsB,WAAA,CAAY,MAAA,CAAO,oBAAA,EAAsB,WAAW,CAAC,CAAA;AAAA,SAcnF;AAAA;AAAA,KACH;AAAA,EAEJ;AACF;;;;"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"CalendarMonthHeader.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
|
|
@@ -1,46 +0,0 @@
|
|
|
1
|
-
import { jsx } from 'react/jsx-runtime';
|
|
2
|
-
import { makePrefixer, Text } from '@salt-ds/core';
|
|
3
|
-
import { useComponentCssInjection } from '@salt-ds/styles';
|
|
4
|
-
import { useWindow } from '@salt-ds/window';
|
|
5
|
-
import { clsx } from 'clsx';
|
|
6
|
-
import { forwardRef, useCallback } from 'react';
|
|
7
|
-
import { useLocalization } from '../localization-provider/LocalizationProvider.js';
|
|
8
|
-
import css_248z from './CalendarMonthHeader.css.js';
|
|
9
|
-
|
|
10
|
-
const withBaseName = makePrefixer("saltCalendarMonthHeader");
|
|
11
|
-
const CalendarMonthHeader = forwardRef(
|
|
12
|
-
(props, ref) => {
|
|
13
|
-
const {
|
|
14
|
-
className,
|
|
15
|
-
format: formatMonthProp = "MMMM",
|
|
16
|
-
month,
|
|
17
|
-
...rest
|
|
18
|
-
} = props;
|
|
19
|
-
const { dateAdapter } = useLocalization();
|
|
20
|
-
const targetWindow = useWindow();
|
|
21
|
-
useComponentCssInjection({
|
|
22
|
-
testId: "salt-calendar-month-header",
|
|
23
|
-
css: css_248z,
|
|
24
|
-
window: targetWindow
|
|
25
|
-
});
|
|
26
|
-
const formatMonth = useCallback(
|
|
27
|
-
(date) => {
|
|
28
|
-
return dateAdapter.format(date, formatMonthProp);
|
|
29
|
-
},
|
|
30
|
-
[dateAdapter, formatMonthProp]
|
|
31
|
-
);
|
|
32
|
-
return /* @__PURE__ */ jsx(
|
|
33
|
-
"div",
|
|
34
|
-
{
|
|
35
|
-
"data-testid": "CalendarMonthHeader",
|
|
36
|
-
className: clsx(withBaseName(), className),
|
|
37
|
-
ref,
|
|
38
|
-
...rest,
|
|
39
|
-
children: /* @__PURE__ */ jsx(Text, { children: formatMonth(month) })
|
|
40
|
-
}
|
|
41
|
-
);
|
|
42
|
-
}
|
|
43
|
-
);
|
|
44
|
-
|
|
45
|
-
export { CalendarMonthHeader };
|
|
46
|
-
//# sourceMappingURL=CalendarMonthHeader.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"CalendarMonthHeader.js","sources":["../src/calendar/CalendarMonthHeader.tsx"],"sourcesContent":["import { makePrefixer, Text } from \"@salt-ds/core\";\nimport type { DateFrameworkType } from \"@salt-ds/date-adapters\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { type ComponentPropsWithRef, forwardRef, useCallback } from \"react\";\nimport { useLocalization } from \"../localization-provider\";\nimport calendarMonthHeaderCss from \"./CalendarMonthHeader.css\";\n\n/**\n * Props for the CalendarMonthHeader component.\n * @template TDate - The type of the date object.\n */\nexport interface CalendarMonthHeaderProps<TDate extends DateFrameworkType>\n extends ComponentPropsWithRef<\"div\"> {\n /**\n * Month value\n */\n month: TDate;\n /**\n * Format the month value\n * @param date\n */\n format?: string;\n}\n\nconst withBaseName = makePrefixer(\"saltCalendarMonthHeader\");\n\nexport const CalendarMonthHeader = forwardRef<\n HTMLDivElement,\n CalendarMonthHeaderProps<DateFrameworkType>\n>(\n <TDate extends DateFrameworkType>(\n props: CalendarMonthHeaderProps<TDate>,\n ref: React.Ref<HTMLDivElement>,\n ) => {\n const {\n className,\n format: formatMonthProp = \"MMMM\",\n month,\n ...rest\n } = props;\n const { dateAdapter } = useLocalization<TDate>();\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-calendar-month-header\",\n css: calendarMonthHeaderCss,\n window: targetWindow,\n });\n\n const formatMonth = useCallback(\n (date?: TDate) => {\n return dateAdapter.format(date, formatMonthProp);\n },\n [dateAdapter, formatMonthProp],\n );\n\n return (\n <div\n data-testid=\"CalendarMonthHeader\"\n className={clsx(withBaseName(), className)}\n ref={ref}\n {...rest}\n >\n <Text>{formatMonth(month)}</Text>\n </div>\n );\n },\n);\n"],"names":["calendarMonthHeaderCss"],"mappings":";;;;;;;;;AA0BA,MAAM,YAAA,GAAe,aAAa,yBAAyB,CAAA;AAEpD,MAAM,mBAAA,GAAsB,UAAA;AAAA,EAIjC,CACE,OACA,GAAA,KACG;AACH,IAAA,MAAM;AAAA,MACJ,SAAA;AAAA,MACA,QAAQ,eAAA,GAAkB,MAAA;AAAA,MAC1B,KAAA;AAAA,MACA,GAAG;AAAA,KACL,GAAI,KAAA;AACJ,IAAA,MAAM,EAAE,WAAA,EAAY,GAAI,eAAA,EAAuB;AAE/C,IAAA,MAAM,eAAe,SAAA,EAAU;AAC/B,IAAA,wBAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,4BAAA;AAAA,MACR,GAAA,EAAKA,QAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,MAAM,WAAA,GAAc,WAAA;AAAA,MAClB,CAAC,IAAA,KAAiB;AAChB,QAAA,OAAO,WAAA,CAAY,MAAA,CAAO,IAAA,EAAM,eAAe,CAAA;AAAA,MACjD,CAAA;AAAA,MACA,CAAC,aAAa,eAAe;AAAA,KAC/B;AAEA,IAAA,uBACE,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,aAAA,EAAY,qBAAA;AAAA,QACZ,SAAA,EAAW,IAAA,CAAK,YAAA,EAAa,EAAG,SAAS,CAAA;AAAA,QACzC,GAAA;AAAA,QACC,GAAG,IAAA;AAAA,QAEJ,QAAA,kBAAA,GAAA,CAAC,IAAA,EAAA,EAAM,QAAA,EAAA,WAAA,CAAY,KAAK,CAAA,EAAE;AAAA;AAAA,KAC5B;AAAA,EAEJ;AACF;;;;"}
|
|
@@ -1,4 +0,0 @@
|
|
|
1
|
-
var css_248z = ".saltCalendarNavigation {\n display: grid;\n grid-template-columns: min-content auto min-content;\n padding-bottom: var(--salt-spacing-100);\n grid-gap: var(--salt-spacing-25);\n align-items: center;\n box-sizing: border-box;\n}\n\n.saltCalendarNavigation-yearDropdown {\n min-width: 4.3em;\n}\n\n.saltCalendarNavigation-hideYearDropdown {\n grid-template-columns: min-content auto min-content;\n grid-gap: var(--salt-spacing-300);\n}\n\n.saltCalendarNavigation-dropdowns {\n display: grid;\n grid-template-columns: 1fr 1fr;\n grid-gap: var(--salt-spacing-100);\n}\n";
|
|
2
|
-
|
|
3
|
-
export { css_248z as default };
|
|
4
|
-
//# sourceMappingURL=CalendarNavigation.css.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"CalendarNavigation.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
|
|
@@ -1,335 +0,0 @@
|
|
|
1
|
-
import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
|
|
2
|
-
import { makePrefixer, useIcon, Button, Dropdown, Option, Tooltip, useListControlContext } from '@salt-ds/core';
|
|
3
|
-
import { useComponentCssInjection } from '@salt-ds/styles';
|
|
4
|
-
import { useWindow } from '@salt-ds/window';
|
|
5
|
-
import { clsx } from 'clsx';
|
|
6
|
-
import { forwardRef, useCallback, useMemo } from 'react';
|
|
7
|
-
import { useLocalization } from '../localization-provider/LocalizationProvider.js';
|
|
8
|
-
import css_248z from './CalendarNavigation.css.js';
|
|
9
|
-
import { useCalendarContext } from './internal/CalendarContext.js';
|
|
10
|
-
import { generateMonthsForYear, monthDiff } from './internal/utils.js';
|
|
11
|
-
|
|
12
|
-
const withBaseName = makePrefixer("saltCalendarNavigation");
|
|
13
|
-
const ConditionalTooltip = ({
|
|
14
|
-
children,
|
|
15
|
-
disabled = true,
|
|
16
|
-
...rest
|
|
17
|
-
}) => {
|
|
18
|
-
if (disabled) {
|
|
19
|
-
return /* @__PURE__ */ jsx(Fragment, { children });
|
|
20
|
-
}
|
|
21
|
-
return /* @__PURE__ */ jsx(Tooltip, { ...rest, children });
|
|
22
|
-
};
|
|
23
|
-
function generateYearsBetweenRange(dateAdapter, minYear, maxYear, timezone = "default") {
|
|
24
|
-
const years = [];
|
|
25
|
-
let startOfYear = dateAdapter.today(timezone);
|
|
26
|
-
for (let year = minYear; year <= maxYear; year++) {
|
|
27
|
-
startOfYear = dateAdapter.set(startOfYear, { day: 1, month: 1, year });
|
|
28
|
-
years.push(startOfYear);
|
|
29
|
-
}
|
|
30
|
-
return years;
|
|
31
|
-
}
|
|
32
|
-
function useCalendarNavigation() {
|
|
33
|
-
const {
|
|
34
|
-
state: { visibleMonth, timezone, minDate, maxDate },
|
|
35
|
-
helpers: { setVisibleMonth, isDayVisible, isOutsideAllowedMonths }
|
|
36
|
-
} = useCalendarContext();
|
|
37
|
-
const { dateAdapter } = useLocalization();
|
|
38
|
-
const moveToNextMonth = useCallback(
|
|
39
|
-
(event, step = 1) => {
|
|
40
|
-
setVisibleMonth(event, dateAdapter.add(visibleMonth, { months: step }));
|
|
41
|
-
},
|
|
42
|
-
[dateAdapter, setVisibleMonth, visibleMonth]
|
|
43
|
-
);
|
|
44
|
-
const moveToPreviousMonth = useCallback(
|
|
45
|
-
(event, step = 1) => {
|
|
46
|
-
setVisibleMonth(
|
|
47
|
-
event,
|
|
48
|
-
dateAdapter.subtract(visibleMonth, { months: step })
|
|
49
|
-
);
|
|
50
|
-
},
|
|
51
|
-
[dateAdapter, setVisibleMonth, visibleMonth]
|
|
52
|
-
);
|
|
53
|
-
const moveToMonth = useCallback(
|
|
54
|
-
(event, month) => {
|
|
55
|
-
let newMonth = month;
|
|
56
|
-
if (isOutsideAllowedMonths(newMonth)) {
|
|
57
|
-
const navigableMonths = generateMonthsForYear(
|
|
58
|
-
dateAdapter,
|
|
59
|
-
visibleMonth
|
|
60
|
-
).filter((n) => !isOutsideAllowedMonths(n));
|
|
61
|
-
newMonth = navigableMonths.reduce(
|
|
62
|
-
(closestMonth, currentMonth) => Math.abs(monthDiff(dateAdapter, currentMonth, newMonth)) < Math.abs(monthDiff(dateAdapter, closestMonth, newMonth)) ? currentMonth : closestMonth
|
|
63
|
-
);
|
|
64
|
-
}
|
|
65
|
-
setVisibleMonth(event, newMonth);
|
|
66
|
-
},
|
|
67
|
-
[dateAdapter, isOutsideAllowedMonths, setVisibleMonth, visibleMonth]
|
|
68
|
-
);
|
|
69
|
-
const months = useMemo(
|
|
70
|
-
() => generateMonthsForYear(dateAdapter, visibleMonth),
|
|
71
|
-
[dateAdapter, visibleMonth]
|
|
72
|
-
);
|
|
73
|
-
const years = useMemo(
|
|
74
|
-
() => generateYearsBetweenRange(
|
|
75
|
-
dateAdapter,
|
|
76
|
-
Math.min(
|
|
77
|
-
dateAdapter.getYear(minDate),
|
|
78
|
-
dateAdapter.getYear(visibleMonth)
|
|
79
|
-
),
|
|
80
|
-
Math.max(
|
|
81
|
-
dateAdapter.getYear(maxDate),
|
|
82
|
-
dateAdapter.getYear(visibleMonth)
|
|
83
|
-
),
|
|
84
|
-
timezone
|
|
85
|
-
),
|
|
86
|
-
[dateAdapter, minDate, maxDate, visibleMonth, timezone]
|
|
87
|
-
);
|
|
88
|
-
const selectedMonth = months.find(
|
|
89
|
-
(month) => dateAdapter.isSame(month, visibleMonth, "month")
|
|
90
|
-
);
|
|
91
|
-
const selectedYear = years.find(
|
|
92
|
-
(year) => dateAdapter.isSame(year, visibleMonth, "year")
|
|
93
|
-
);
|
|
94
|
-
const disableNavigatePrevious = isDayVisible(minDate);
|
|
95
|
-
const disableNavigateNext = isDayVisible(maxDate);
|
|
96
|
-
return useMemo(
|
|
97
|
-
() => ({
|
|
98
|
-
moveToNextMonth,
|
|
99
|
-
moveToPreviousMonth,
|
|
100
|
-
moveToMonth,
|
|
101
|
-
visibleMonth,
|
|
102
|
-
months,
|
|
103
|
-
years,
|
|
104
|
-
disableNavigateNext,
|
|
105
|
-
disableNavigatePrevious,
|
|
106
|
-
selectedMonth,
|
|
107
|
-
selectedYear,
|
|
108
|
-
isOutsideAllowedMonths
|
|
109
|
-
}),
|
|
110
|
-
[
|
|
111
|
-
months,
|
|
112
|
-
moveToPreviousMonth,
|
|
113
|
-
moveToNextMonth,
|
|
114
|
-
moveToMonth,
|
|
115
|
-
visibleMonth,
|
|
116
|
-
years,
|
|
117
|
-
disableNavigateNext,
|
|
118
|
-
disableNavigatePrevious,
|
|
119
|
-
selectedMonth,
|
|
120
|
-
selectedYear,
|
|
121
|
-
isOutsideAllowedMonths
|
|
122
|
-
]
|
|
123
|
-
);
|
|
124
|
-
}
|
|
125
|
-
function OptionWithTooltip({
|
|
126
|
-
value,
|
|
127
|
-
children,
|
|
128
|
-
disabled = false,
|
|
129
|
-
tooltipContent
|
|
130
|
-
}) {
|
|
131
|
-
const { activeState, openState } = useListControlContext();
|
|
132
|
-
const open = (activeState == null ? void 0 : activeState.value) === value;
|
|
133
|
-
return /* @__PURE__ */ jsx(
|
|
134
|
-
ConditionalTooltip,
|
|
135
|
-
{
|
|
136
|
-
placement: "right",
|
|
137
|
-
open: open && openState,
|
|
138
|
-
disabled: !disabled,
|
|
139
|
-
content: tooltipContent,
|
|
140
|
-
enterDelay: 0,
|
|
141
|
-
leaveDelay: 0,
|
|
142
|
-
children: /* @__PURE__ */ jsx(Option, { value, disabled, children })
|
|
143
|
-
}
|
|
144
|
-
);
|
|
145
|
-
}
|
|
146
|
-
const CalendarNavigation = forwardRef(
|
|
147
|
-
(props, ref) => {
|
|
148
|
-
const {
|
|
149
|
-
className,
|
|
150
|
-
disableNavigatePrevious: disableNavigatePreviousProp,
|
|
151
|
-
disableNavigateNext: disableNavigateNextProp,
|
|
152
|
-
formatMonth: formatMonthProp,
|
|
153
|
-
formatYear: formatYearProp,
|
|
154
|
-
MonthDropdownProps,
|
|
155
|
-
YearDropdownProps,
|
|
156
|
-
hideYearDropdown,
|
|
157
|
-
step = 1,
|
|
158
|
-
...rest
|
|
159
|
-
} = props;
|
|
160
|
-
const { dateAdapter } = useLocalization();
|
|
161
|
-
const targetWindow = useWindow();
|
|
162
|
-
useComponentCssInjection({
|
|
163
|
-
testId: "salt-calendar-navigation",
|
|
164
|
-
css: css_248z,
|
|
165
|
-
window: targetWindow
|
|
166
|
-
});
|
|
167
|
-
const { NextIcon, PreviousIcon } = useIcon();
|
|
168
|
-
const {
|
|
169
|
-
moveToPreviousMonth,
|
|
170
|
-
moveToNextMonth,
|
|
171
|
-
moveToMonth,
|
|
172
|
-
months,
|
|
173
|
-
years,
|
|
174
|
-
disableNavigateNext,
|
|
175
|
-
disableNavigatePrevious,
|
|
176
|
-
selectedMonth,
|
|
177
|
-
selectedYear,
|
|
178
|
-
isOutsideAllowedMonths,
|
|
179
|
-
visibleMonth
|
|
180
|
-
} = useCalendarNavigation();
|
|
181
|
-
const handleNavigatePrevious = useCallback(
|
|
182
|
-
(event) => {
|
|
183
|
-
moveToPreviousMonth(event, step);
|
|
184
|
-
},
|
|
185
|
-
[moveToPreviousMonth, step]
|
|
186
|
-
);
|
|
187
|
-
const handleNavigateNext = useCallback(
|
|
188
|
-
(event) => {
|
|
189
|
-
moveToNextMonth(event, step);
|
|
190
|
-
},
|
|
191
|
-
[moveToNextMonth, step]
|
|
192
|
-
);
|
|
193
|
-
const handleMonthSelect = useCallback(
|
|
194
|
-
(event, month) => {
|
|
195
|
-
moveToMonth(event, month[0]);
|
|
196
|
-
},
|
|
197
|
-
[moveToMonth]
|
|
198
|
-
);
|
|
199
|
-
const handleYearSelect = useCallback(
|
|
200
|
-
(event, year) => {
|
|
201
|
-
let newVisibleMonth = dateAdapter.clone(visibleMonth);
|
|
202
|
-
newVisibleMonth = dateAdapter.set(newVisibleMonth, {
|
|
203
|
-
year: dateAdapter.getYear(year[0])
|
|
204
|
-
});
|
|
205
|
-
moveToMonth(event, newVisibleMonth);
|
|
206
|
-
},
|
|
207
|
-
[dateAdapter, moveToMonth, visibleMonth]
|
|
208
|
-
);
|
|
209
|
-
const formatMonth = useCallback(
|
|
210
|
-
(date) => {
|
|
211
|
-
if (date && formatMonthProp) {
|
|
212
|
-
return dateAdapter.format(date, formatMonthProp);
|
|
213
|
-
}
|
|
214
|
-
return date ? dateAdapter.format(date, hideYearDropdown ? "MMMM" : "MMM") : "";
|
|
215
|
-
},
|
|
216
|
-
[dateAdapter, formatMonthProp, hideYearDropdown]
|
|
217
|
-
);
|
|
218
|
-
const formatYear = useCallback(
|
|
219
|
-
(date) => {
|
|
220
|
-
if (date && formatYearProp) {
|
|
221
|
-
return dateAdapter.format(date, formatYearProp);
|
|
222
|
-
}
|
|
223
|
-
return !date ? "" : `${dateAdapter.format(date, "YYYY")}`;
|
|
224
|
-
},
|
|
225
|
-
[dateAdapter, formatYearProp]
|
|
226
|
-
);
|
|
227
|
-
return /* @__PURE__ */ jsxs(
|
|
228
|
-
"div",
|
|
229
|
-
{
|
|
230
|
-
className: clsx(
|
|
231
|
-
withBaseName(),
|
|
232
|
-
{ [withBaseName("hideYearDropdown")]: hideYearDropdown },
|
|
233
|
-
className
|
|
234
|
-
),
|
|
235
|
-
ref,
|
|
236
|
-
...rest,
|
|
237
|
-
children: [
|
|
238
|
-
/* @__PURE__ */ jsx(
|
|
239
|
-
ConditionalTooltip,
|
|
240
|
-
{
|
|
241
|
-
placement: "top",
|
|
242
|
-
disabled: !(disableNavigatePreviousProp || disableNavigatePrevious),
|
|
243
|
-
content: "Past dates are out of range",
|
|
244
|
-
enterDelay: 0,
|
|
245
|
-
leaveDelay: 0,
|
|
246
|
-
children: /* @__PURE__ */ jsx(
|
|
247
|
-
Button,
|
|
248
|
-
{
|
|
249
|
-
"aria-label": "Previous Month",
|
|
250
|
-
disabled: disableNavigatePreviousProp || disableNavigatePrevious,
|
|
251
|
-
appearance: "transparent",
|
|
252
|
-
sentiment: "neutral",
|
|
253
|
-
onClick: handleNavigatePrevious,
|
|
254
|
-
focusableWhenDisabled: true,
|
|
255
|
-
children: /* @__PURE__ */ jsx(PreviousIcon, { "aria-hidden": true })
|
|
256
|
-
}
|
|
257
|
-
)
|
|
258
|
-
}
|
|
259
|
-
),
|
|
260
|
-
/* @__PURE__ */ jsxs(
|
|
261
|
-
"div",
|
|
262
|
-
{
|
|
263
|
-
className: clsx({ [withBaseName("dropdowns")]: !hideYearDropdown }),
|
|
264
|
-
children: [
|
|
265
|
-
/* @__PURE__ */ jsx(
|
|
266
|
-
Dropdown,
|
|
267
|
-
{
|
|
268
|
-
"aria-label": "Month Dropdown",
|
|
269
|
-
selected: selectedMonth ? [selectedMonth] : [],
|
|
270
|
-
value: formatMonth(selectedMonth),
|
|
271
|
-
onSelectionChange: handleMonthSelect,
|
|
272
|
-
...MonthDropdownProps,
|
|
273
|
-
children: months.map((month) => {
|
|
274
|
-
const outsideAllowedMonths = isOutsideAllowedMonths(month);
|
|
275
|
-
return /* @__PURE__ */ jsx(
|
|
276
|
-
OptionWithTooltip,
|
|
277
|
-
{
|
|
278
|
-
value: month,
|
|
279
|
-
disabled: outsideAllowedMonths,
|
|
280
|
-
tooltipContent: "This month is out of range",
|
|
281
|
-
children: formatMonth(month)
|
|
282
|
-
},
|
|
283
|
-
formatMonth(month)
|
|
284
|
-
);
|
|
285
|
-
})
|
|
286
|
-
}
|
|
287
|
-
),
|
|
288
|
-
!hideYearDropdown ? /* @__PURE__ */ jsx(
|
|
289
|
-
Dropdown,
|
|
290
|
-
{
|
|
291
|
-
"aria-label": "Year Dropdown",
|
|
292
|
-
selected: selectedYear ? [selectedYear] : [],
|
|
293
|
-
value: formatYear(selectedYear),
|
|
294
|
-
onSelectionChange: handleYearSelect,
|
|
295
|
-
...YearDropdownProps,
|
|
296
|
-
className: clsx(
|
|
297
|
-
withBaseName("yearDropdown"),
|
|
298
|
-
YearDropdownProps == null ? void 0 : YearDropdownProps.className
|
|
299
|
-
),
|
|
300
|
-
children: years.map((year) => /* @__PURE__ */ jsx(Option, { value: year, children: formatYear(year) }, formatYear(year)))
|
|
301
|
-
}
|
|
302
|
-
) : null
|
|
303
|
-
]
|
|
304
|
-
}
|
|
305
|
-
),
|
|
306
|
-
/* @__PURE__ */ jsx(
|
|
307
|
-
ConditionalTooltip,
|
|
308
|
-
{
|
|
309
|
-
placement: "top",
|
|
310
|
-
disabled: !(disableNavigateNextProp || disableNavigateNext),
|
|
311
|
-
content: "Future dates are out of range",
|
|
312
|
-
enterDelay: 0,
|
|
313
|
-
leaveDelay: 0,
|
|
314
|
-
children: /* @__PURE__ */ jsx(
|
|
315
|
-
Button,
|
|
316
|
-
{
|
|
317
|
-
"aria-label": "Next Month",
|
|
318
|
-
disabled: disableNavigateNextProp || disableNavigateNext,
|
|
319
|
-
appearance: "transparent",
|
|
320
|
-
sentiment: "neutral",
|
|
321
|
-
onClick: handleNavigateNext,
|
|
322
|
-
focusableWhenDisabled: true,
|
|
323
|
-
children: /* @__PURE__ */ jsx(NextIcon, { "aria-hidden": true })
|
|
324
|
-
}
|
|
325
|
-
)
|
|
326
|
-
}
|
|
327
|
-
)
|
|
328
|
-
]
|
|
329
|
-
}
|
|
330
|
-
);
|
|
331
|
-
}
|
|
332
|
-
);
|
|
333
|
-
|
|
334
|
-
export { CalendarNavigation };
|
|
335
|
-
//# sourceMappingURL=CalendarNavigation.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"CalendarNavigation.js","sources":["../src/calendar/CalendarNavigation.tsx"],"sourcesContent":["import {\n Button,\n type ButtonProps,\n Dropdown,\n type DropdownProps,\n makePrefixer,\n Option,\n type OptionProps,\n Tooltip,\n type TooltipProps,\n useIcon,\n useListControlContext,\n} from \"@salt-ds/core\";\nimport type {\n DateFrameworkType,\n SaltDateAdapter,\n Timezone,\n} from \"@salt-ds/date-adapters\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ComponentPropsWithRef,\n forwardRef,\n type MouseEventHandler,\n type SyntheticEvent,\n useCallback,\n useMemo,\n} from \"react\";\nimport { useLocalization } from \"../localization-provider\";\nimport calendarNavigationCss from \"./CalendarNavigation.css\";\nimport { useCalendarContext } from \"./internal/CalendarContext\";\nimport { generateMonthsForYear, monthDiff } from \"./internal/utils\";\n\n/**\n * Props for the CalendarNavigation component.\n * @template TDate - The type of the date object.\n */\nexport interface CalendarNavigationProps<TDate extends DateFrameworkType>\n extends ComponentPropsWithRef<\"div\"> {\n /**\n * Props for the month dropdown component.\n */\n MonthDropdownProps?: DropdownProps<TDate>;\n\n /**\n * Props for the year dropdown component.\n */\n YearDropdownProps?: DropdownProps<TDate>;\n\n /**\n * Callback fired when a month is selected.\n * @param event - The change event.\n */\n onMonthSelect?: DropdownProps<TDate>[\"onChange\"];\n\n /**\n * Callback fired when a year is selected.\n * @param event - The change event.\n */\n onYearSelect?: DropdownProps<TDate>[\"onChange\"];\n\n /**\n * Callback fired when navigating to the next month.\n * @param event - The click event.\n */\n onNavigateNext?: ButtonProps[\"onClick\"];\n\n /**\n * If `true` then navigate next button is enabled\n */\n disableNavigateNext?: boolean;\n\n /**\n * Callback fired when navigating to the previous month.\n * @param event - The click event.\n */\n onNavigatePrevious?: ButtonProps[\"onClick\"];\n\n /**\n * If `true` then navigate previous button is enabled\n */\n disableNavigatePrevious?: boolean;\n\n /**\n * If `true`, hides the year dropdown.\n */\n hideYearDropdown?: boolean;\n\n /**\n * The step value for navigation. Defaults to 1.\n */\n step?: number;\n /**\n * Format the month dropdown values\n * @param date\n */\n formatMonth?: string;\n /**\n * Format the year dropdown values\n * @param date\n */\n formatYear?: string;\n}\n\ninterface OptionWithTooltipProps<TDate> extends OptionProps {\n value: TDate;\n tooltipContent?: string;\n}\n\nconst withBaseName = makePrefixer(\"saltCalendarNavigation\");\n\nconst ConditionalTooltip: React.FC<TooltipProps> = ({\n children,\n disabled = true,\n ...rest\n}) => {\n if (disabled) {\n return <>{children}</>;\n }\n return <Tooltip {...rest}>{children}</Tooltip>;\n};\n\nfunction generateYearsBetweenRange<TDate extends DateFrameworkType>(\n dateAdapter: SaltDateAdapter<TDate>,\n minYear: number,\n maxYear: number,\n timezone: Timezone = \"default\",\n): TDate[] {\n const years: TDate[] = [];\n let startOfYear = dateAdapter.today(timezone);\n for (let year = minYear; year <= maxYear; year++) {\n startOfYear = dateAdapter.set(startOfYear, { day: 1, month: 1, year });\n years.push(startOfYear);\n }\n return years;\n}\n\nfunction useCalendarNavigation<TDate extends DateFrameworkType>() {\n const {\n state: { visibleMonth, timezone, minDate, maxDate },\n helpers: { setVisibleMonth, isDayVisible, isOutsideAllowedMonths },\n } = useCalendarContext<TDate>();\n\n const { dateAdapter } = useLocalization<TDate>();\n\n const moveToNextMonth = useCallback(\n (event: SyntheticEvent, step = 1) => {\n setVisibleMonth(event, dateAdapter.add(visibleMonth, { months: step }));\n },\n [dateAdapter, setVisibleMonth, visibleMonth],\n );\n\n const moveToPreviousMonth = useCallback(\n (event: SyntheticEvent, step = 1) => {\n setVisibleMonth(\n event,\n dateAdapter.subtract(visibleMonth, { months: step }),\n );\n },\n [dateAdapter, setVisibleMonth, visibleMonth],\n );\n\n const moveToMonth = useCallback(\n (event: SyntheticEvent, month: TDate) => {\n let newMonth = month;\n\n if (isOutsideAllowedMonths(newMonth)) {\n // If month is navigable we should move to the closest navigable month\n const navigableMonths = generateMonthsForYear(\n dateAdapter,\n visibleMonth,\n ).filter((n) => !isOutsideAllowedMonths(n));\n newMonth = navigableMonths.reduce((closestMonth, currentMonth) =>\n Math.abs(monthDiff(dateAdapter, currentMonth, newMonth)) <\n Math.abs(monthDiff(dateAdapter, closestMonth, newMonth))\n ? currentMonth\n : closestMonth,\n );\n }\n setVisibleMonth(event, newMonth);\n },\n [dateAdapter, isOutsideAllowedMonths, setVisibleMonth, visibleMonth],\n );\n\n const months: TDate[] = useMemo(\n () => generateMonthsForYear<TDate>(dateAdapter, visibleMonth),\n [dateAdapter, visibleMonth],\n );\n\n const years: TDate[] = useMemo(\n () =>\n generateYearsBetweenRange<TDate>(\n dateAdapter,\n Math.min(\n dateAdapter.getYear(minDate),\n dateAdapter.getYear(visibleMonth),\n ),\n Math.max(\n dateAdapter.getYear(maxDate),\n dateAdapter.getYear(visibleMonth),\n ),\n timezone,\n ),\n [dateAdapter, minDate, maxDate, visibleMonth, timezone],\n );\n\n const selectedMonth: TDate | undefined = months.find((month: TDate) =>\n dateAdapter.isSame(month, visibleMonth, \"month\"),\n );\n const selectedYear: TDate | undefined = years.find((year: TDate) =>\n dateAdapter.isSame(year, visibleMonth, \"year\"),\n );\n\n const disableNavigatePrevious = isDayVisible(minDate);\n const disableNavigateNext = isDayVisible(maxDate);\n\n return useMemo(\n () => ({\n moveToNextMonth,\n moveToPreviousMonth,\n moveToMonth,\n visibleMonth,\n months,\n years,\n disableNavigateNext,\n disableNavigatePrevious,\n selectedMonth,\n selectedYear,\n isOutsideAllowedMonths,\n }),\n [\n months,\n moveToPreviousMonth,\n moveToNextMonth,\n moveToMonth,\n visibleMonth,\n years,\n disableNavigateNext,\n disableNavigatePrevious,\n selectedMonth,\n selectedYear,\n isOutsideAllowedMonths,\n ],\n );\n}\n\nfunction OptionWithTooltip<TDate extends DateFrameworkType>({\n value,\n children,\n disabled = false,\n tooltipContent,\n}: OptionWithTooltipProps<TDate>) {\n const { activeState, openState } = useListControlContext();\n const open = activeState?.value === value;\n return (\n <ConditionalTooltip\n placement=\"right\"\n open={open && openState}\n disabled={!disabled}\n content={tooltipContent}\n enterDelay={0} // --salt-duration-instant\n leaveDelay={0} // --salt-duration-instant\n >\n <Option value={value} disabled={disabled}>\n {children}\n </Option>\n </ConditionalTooltip>\n );\n}\n\nexport const CalendarNavigation = forwardRef<\n HTMLDivElement,\n CalendarNavigationProps<DateFrameworkType>\n>(\n <TDate extends DateFrameworkType>(\n props: CalendarNavigationProps<TDate>,\n ref: React.Ref<HTMLDivElement>,\n ) => {\n const {\n className,\n disableNavigatePrevious: disableNavigatePreviousProp,\n disableNavigateNext: disableNavigateNextProp,\n formatMonth: formatMonthProp,\n formatYear: formatYearProp,\n MonthDropdownProps,\n YearDropdownProps,\n hideYearDropdown,\n step = 1,\n ...rest\n } = props;\n\n const { dateAdapter } = useLocalization<TDate>();\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-calendar-navigation\",\n css: calendarNavigationCss,\n window: targetWindow,\n });\n\n const { NextIcon, PreviousIcon } = useIcon();\n\n const {\n moveToPreviousMonth,\n moveToNextMonth,\n moveToMonth,\n months,\n years,\n disableNavigateNext,\n disableNavigatePrevious,\n selectedMonth,\n selectedYear,\n isOutsideAllowedMonths,\n visibleMonth,\n } = useCalendarNavigation<TDate>();\n\n const handleNavigatePrevious: MouseEventHandler<HTMLButtonElement> =\n useCallback(\n (event) => {\n moveToPreviousMonth(event, step);\n },\n [moveToPreviousMonth, step],\n );\n\n const handleNavigateNext: MouseEventHandler<HTMLButtonElement> =\n useCallback(\n (event) => {\n moveToNextMonth(event, step);\n },\n [moveToNextMonth, step],\n );\n\n const handleMonthSelect = useCallback(\n (event: SyntheticEvent, month: TDate[]) => {\n moveToMonth(event, month[0]);\n },\n [moveToMonth],\n );\n\n const handleYearSelect = useCallback(\n (event: SyntheticEvent, year: TDate[]) => {\n let newVisibleMonth = dateAdapter.clone(visibleMonth);\n newVisibleMonth = dateAdapter.set(newVisibleMonth, {\n year: dateAdapter.getYear(year[0]),\n });\n moveToMonth(event, newVisibleMonth);\n },\n [dateAdapter, moveToMonth, visibleMonth],\n );\n\n const formatMonth = useCallback(\n (date?: TDate) => {\n if (date && formatMonthProp) {\n return dateAdapter.format(date, formatMonthProp);\n }\n return date\n ? dateAdapter.format(date, hideYearDropdown ? \"MMMM\" : \"MMM\")\n : \"\";\n },\n [dateAdapter, formatMonthProp, hideYearDropdown],\n );\n\n const formatYear = useCallback(\n (date?: TDate) => {\n if (date && formatYearProp) {\n return dateAdapter.format(date, formatYearProp);\n }\n return !date ? \"\" : `${dateAdapter.format(date, \"YYYY\")}`;\n },\n [dateAdapter, formatYearProp],\n );\n\n return (\n <div\n className={clsx(\n withBaseName(),\n { [withBaseName(\"hideYearDropdown\")]: hideYearDropdown },\n className,\n )}\n ref={ref}\n {...rest}\n >\n <ConditionalTooltip\n placement=\"top\"\n disabled={!(disableNavigatePreviousProp || disableNavigatePrevious)}\n content=\"Past dates are out of range\"\n enterDelay={0} // --salt-duration-instant\n leaveDelay={0} // --salt-duration-instant\n >\n <Button\n aria-label=\"Previous Month\"\n disabled={disableNavigatePreviousProp || disableNavigatePrevious}\n appearance=\"transparent\"\n sentiment=\"neutral\"\n onClick={handleNavigatePrevious}\n focusableWhenDisabled={true}\n >\n <PreviousIcon aria-hidden />\n </Button>\n </ConditionalTooltip>\n <div\n className={clsx({ [withBaseName(\"dropdowns\")]: !hideYearDropdown })}\n >\n <Dropdown\n aria-label=\"Month Dropdown\"\n selected={selectedMonth ? [selectedMonth] : []}\n value={formatMonth(selectedMonth)}\n onSelectionChange={handleMonthSelect}\n {...MonthDropdownProps}\n >\n {months.map((month) => {\n const outsideAllowedMonths = isOutsideAllowedMonths(month);\n return (\n <OptionWithTooltip\n key={formatMonth(month)}\n value={month}\n disabled={outsideAllowedMonths}\n tooltipContent={\"This month is out of range\"}\n >\n {formatMonth(month)}\n </OptionWithTooltip>\n );\n })}\n </Dropdown>\n {!hideYearDropdown ? (\n <Dropdown\n aria-label=\"Year Dropdown\"\n selected={selectedYear ? [selectedYear] : []}\n value={formatYear(selectedYear)}\n onSelectionChange={handleYearSelect}\n {...YearDropdownProps}\n className={clsx(\n withBaseName(\"yearDropdown\"),\n YearDropdownProps?.className,\n )}\n >\n {years.map((year) => (\n <Option key={formatYear(year)} value={year}>\n {formatYear(year)}\n </Option>\n ))}\n </Dropdown>\n ) : null}\n </div>\n <ConditionalTooltip\n placement=\"top\"\n disabled={!(disableNavigateNextProp || disableNavigateNext)}\n content=\"Future dates are out of range\"\n enterDelay={0} // --salt-duration-instant\n leaveDelay={0} // --salt-duration-instant\n >\n <Button\n aria-label=\"Next Month\"\n disabled={disableNavigateNextProp || disableNavigateNext}\n appearance=\"transparent\"\n sentiment=\"neutral\"\n onClick={handleNavigateNext}\n focusableWhenDisabled={true}\n >\n <NextIcon aria-hidden />\n </Button>\n </ConditionalTooltip>\n </div>\n );\n },\n);\n"],"names":["calendarNavigationCss"],"mappings":";;;;;;;;;;;AA8GA,MAAM,YAAA,GAAe,aAAa,wBAAwB,CAAA;AAE1D,MAAM,qBAA6C,CAAC;AAAA,EAClD,QAAA;AAAA,EACA,QAAA,GAAW,IAAA;AAAA,EACX,GAAG;AACL,CAAA,KAAM;AACJ,EAAA,IAAI,QAAA,EAAU;AACZ,IAAA,uCAAU,QAAA,EAAS,CAAA;AAAA,EACrB;AACA,EAAA,uBAAO,GAAA,CAAC,OAAA,EAAA,EAAS,GAAG,IAAA,EAAO,QAAA,EAAS,CAAA;AACtC,CAAA;AAEA,SAAS,yBAAA,CACP,WAAA,EACA,OAAA,EACA,OAAA,EACA,WAAqB,SAAA,EACZ;AACT,EAAA,MAAM,QAAiB,EAAC;AACxB,EAAA,IAAI,WAAA,GAAc,WAAA,CAAY,KAAA,CAAM,QAAQ,CAAA;AAC5C,EAAA,KAAA,IAAS,IAAA,GAAO,OAAA,EAAS,IAAA,IAAQ,OAAA,EAAS,IAAA,EAAA,EAAQ;AAChD,IAAA,WAAA,GAAc,WAAA,CAAY,IAAI,WAAA,EAAa,EAAE,KAAK,CAAA,EAAG,KAAA,EAAO,CAAA,EAAG,IAAA,EAAM,CAAA;AACrE,IAAA,KAAA,CAAM,KAAK,WAAW,CAAA;AAAA,EACxB;AACA,EAAA,OAAO,KAAA;AACT;AAEA,SAAS,qBAAA,GAAyD;AAChE,EAAA,MAAM;AAAA,IACJ,KAAA,EAAO,EAAE,YAAA,EAAc,QAAA,EAAU,SAAS,OAAA,EAAQ;AAAA,IAClD,OAAA,EAAS,EAAE,eAAA,EAAiB,YAAA,EAAc,sBAAA;AAAuB,MAC/D,kBAAA,EAA0B;AAE9B,EAAA,MAAM,EAAE,WAAA,EAAY,GAAI,eAAA,EAAuB;AAE/C,EAAA,MAAM,eAAA,GAAkB,WAAA;AAAA,IACtB,CAAC,KAAA,EAAuB,IAAA,GAAO,CAAA,KAAM;AACnC,MAAA,eAAA,CAAgB,KAAA,EAAO,YAAY,GAAA,CAAI,YAAA,EAAc,EAAE,MAAA,EAAQ,IAAA,EAAM,CAAC,CAAA;AAAA,IACxE,CAAA;AAAA,IACA,CAAC,WAAA,EAAa,eAAA,EAAiB,YAAY;AAAA,GAC7C;AAEA,EAAA,MAAM,mBAAA,GAAsB,WAAA;AAAA,IAC1B,CAAC,KAAA,EAAuB,IAAA,GAAO,CAAA,KAAM;AACnC,MAAA,eAAA;AAAA,QACE,KAAA;AAAA,QACA,YAAY,QAAA,CAAS,YAAA,EAAc,EAAE,MAAA,EAAQ,MAAM;AAAA,OACrD;AAAA,IACF,CAAA;AAAA,IACA,CAAC,WAAA,EAAa,eAAA,EAAiB,YAAY;AAAA,GAC7C;AAEA,EAAA,MAAM,WAAA,GAAc,WAAA;AAAA,IAClB,CAAC,OAAuB,KAAA,KAAiB;AACvC,MAAA,IAAI,QAAA,GAAW,KAAA;AAEf,MAAA,IAAI,sBAAA,CAAuB,QAAQ,CAAA,EAAG;AAEpC,QAAA,MAAM,eAAA,GAAkB,qBAAA;AAAA,UACtB,WAAA;AAAA,UACA;AAAA,UACA,MAAA,CAAO,CAAC,MAAM,CAAC,sBAAA,CAAuB,CAAC,CAAC,CAAA;AAC1C,QAAA,QAAA,GAAW,eAAA,CAAgB,MAAA;AAAA,UAAO,CAAC,YAAA,EAAc,YAAA,KAC/C,KAAK,GAAA,CAAI,SAAA,CAAU,aAAa,YAAA,EAAc,QAAQ,CAAC,CAAA,GACvD,IAAA,CAAK,IAAI,SAAA,CAAU,WAAA,EAAa,cAAc,QAAQ,CAAC,IACnD,YAAA,GACA;AAAA,SACN;AAAA,MACF;AACA,MAAA,eAAA,CAAgB,OAAO,QAAQ,CAAA;AAAA,IACjC,CAAA;AAAA,IACA,CAAC,WAAA,EAAa,sBAAA,EAAwB,eAAA,EAAiB,YAAY;AAAA,GACrE;AAEA,EAAA,MAAM,MAAA,GAAkB,OAAA;AAAA,IACtB,MAAM,qBAAA,CAA6B,WAAA,EAAa,YAAY,CAAA;AAAA,IAC5D,CAAC,aAAa,YAAY;AAAA,GAC5B;AAEA,EAAA,MAAM,KAAA,GAAiB,OAAA;AAAA,IACrB,MACE,yBAAA;AAAA,MACE,WAAA;AAAA,MACA,IAAA,CAAK,GAAA;AAAA,QACH,WAAA,CAAY,QAAQ,OAAO,CAAA;AAAA,QAC3B,WAAA,CAAY,QAAQ,YAAY;AAAA,OAClC;AAAA,MACA,IAAA,CAAK,GAAA;AAAA,QACH,WAAA,CAAY,QAAQ,OAAO,CAAA;AAAA,QAC3B,WAAA,CAAY,QAAQ,YAAY;AAAA,OAClC;AAAA,MACA;AAAA,KACF;AAAA,IACF,CAAC,WAAA,EAAa,OAAA,EAAS,OAAA,EAAS,cAAc,QAAQ;AAAA,GACxD;AAEA,EAAA,MAAM,gBAAmC,MAAA,CAAO,IAAA;AAAA,IAAK,CAAC,KAAA,KACpD,WAAA,CAAY,MAAA,CAAO,KAAA,EAAO,cAAc,OAAO;AAAA,GACjD;AACA,EAAA,MAAM,eAAkC,KAAA,CAAM,IAAA;AAAA,IAAK,CAAC,IAAA,KAClD,WAAA,CAAY,MAAA,CAAO,IAAA,EAAM,cAAc,MAAM;AAAA,GAC/C;AAEA,EAAA,MAAM,uBAAA,GAA0B,aAAa,OAAO,CAAA;AACpD,EAAA,MAAM,mBAAA,GAAsB,aAAa,OAAO,CAAA;AAEhD,EAAA,OAAO,OAAA;AAAA,IACL,OAAO;AAAA,MACL,eAAA;AAAA,MACA,mBAAA;AAAA,MACA,WAAA;AAAA,MACA,YAAA;AAAA,MACA,MAAA;AAAA,MACA,KAAA;AAAA,MACA,mBAAA;AAAA,MACA,uBAAA;AAAA,MACA,aAAA;AAAA,MACA,YAAA;AAAA,MACA;AAAA,KACF,CAAA;AAAA,IACA;AAAA,MACE,MAAA;AAAA,MACA,mBAAA;AAAA,MACA,eAAA;AAAA,MACA,WAAA;AAAA,MACA,YAAA;AAAA,MACA,KAAA;AAAA,MACA,mBAAA;AAAA,MACA,uBAAA;AAAA,MACA,aAAA;AAAA,MACA,YAAA;AAAA,MACA;AAAA;AACF,GACF;AACF;AAEA,SAAS,iBAAA,CAAmD;AAAA,EAC1D,KAAA;AAAA,EACA,QAAA;AAAA,EACA,QAAA,GAAW,KAAA;AAAA,EACX;AACF,CAAA,EAAkC;AAChC,EAAA,MAAM,EAAE,WAAA,EAAa,SAAA,EAAU,GAAI,qBAAA,EAAsB;AACzD,EAAA,MAAM,IAAA,GAAA,CAAO,2CAAa,KAAA,MAAU,KAAA;AACpC,EAAA,uBACE,GAAA;AAAA,IAAC,kBAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAU,OAAA;AAAA,MACV,MAAM,IAAA,IAAQ,SAAA;AAAA,MACd,UAAU,CAAC,QAAA;AAAA,MACX,OAAA,EAAS,cAAA;AAAA,MACT,UAAA,EAAY,CAAA;AAAA,MACZ,UAAA,EAAY,CAAA;AAAA,MAEZ,QAAA,kBAAA,GAAA,CAAC,MAAA,EAAA,EAAO,KAAA,EAAc,QAAA,EACnB,QAAA,EACH;AAAA;AAAA,GACF;AAEJ;AAEO,MAAM,kBAAA,GAAqB,UAAA;AAAA,EAIhC,CACE,OACA,GAAA,KACG;AACH,IAAA,MAAM;AAAA,MACJ,SAAA;AAAA,MACA,uBAAA,EAAyB,2BAAA;AAAA,MACzB,mBAAA,EAAqB,uBAAA;AAAA,MACrB,WAAA,EAAa,eAAA;AAAA,MACb,UAAA,EAAY,cAAA;AAAA,MACZ,kBAAA;AAAA,MACA,iBAAA;AAAA,MACA,gBAAA;AAAA,MACA,IAAA,GAAO,CAAA;AAAA,MACP,GAAG;AAAA,KACL,GAAI,KAAA;AAEJ,IAAA,MAAM,EAAE,WAAA,EAAY,GAAI,eAAA,EAAuB;AAE/C,IAAA,MAAM,eAAe,SAAA,EAAU;AAC/B,IAAA,wBAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,0BAAA;AAAA,MACR,GAAA,EAAKA,QAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,MAAM,EAAE,QAAA,EAAU,YAAA,EAAa,GAAI,OAAA,EAAQ;AAE3C,IAAA,MAAM;AAAA,MACJ,mBAAA;AAAA,MACA,eAAA;AAAA,MACA,WAAA;AAAA,MACA,MAAA;AAAA,MACA,KAAA;AAAA,MACA,mBAAA;AAAA,MACA,uBAAA;AAAA,MACA,aAAA;AAAA,MACA,YAAA;AAAA,MACA,sBAAA;AAAA,MACA;AAAA,QACE,qBAAA,EAA6B;AAEjC,IAAA,MAAM,sBAAA,GACJ,WAAA;AAAA,MACE,CAAC,KAAA,KAAU;AACT,QAAA,mBAAA,CAAoB,OAAO,IAAI,CAAA;AAAA,MACjC,CAAA;AAAA,MACA,CAAC,qBAAqB,IAAI;AAAA,KAC5B;AAEF,IAAA,MAAM,kBAAA,GACJ,WAAA;AAAA,MACE,CAAC,KAAA,KAAU;AACT,QAAA,eAAA,CAAgB,OAAO,IAAI,CAAA;AAAA,MAC7B,CAAA;AAAA,MACA,CAAC,iBAAiB,IAAI;AAAA,KACxB;AAEF,IAAA,MAAM,iBAAA,GAAoB,WAAA;AAAA,MACxB,CAAC,OAAuB,KAAA,KAAmB;AACzC,QAAA,WAAA,CAAY,KAAA,EAAO,KAAA,CAAM,CAAC,CAAC,CAAA;AAAA,MAC7B,CAAA;AAAA,MACA,CAAC,WAAW;AAAA,KACd;AAEA,IAAA,MAAM,gBAAA,GAAmB,WAAA;AAAA,MACvB,CAAC,OAAuB,IAAA,KAAkB;AACxC,QAAA,IAAI,eAAA,GAAkB,WAAA,CAAY,KAAA,CAAM,YAAY,CAAA;AACpD,QAAA,eAAA,GAAkB,WAAA,CAAY,IAAI,eAAA,EAAiB;AAAA,UACjD,IAAA,EAAM,WAAA,CAAY,OAAA,CAAQ,IAAA,CAAK,CAAC,CAAC;AAAA,SAClC,CAAA;AACD,QAAA,WAAA,CAAY,OAAO,eAAe,CAAA;AAAA,MACpC,CAAA;AAAA,MACA,CAAC,WAAA,EAAa,WAAA,EAAa,YAAY;AAAA,KACzC;AAEA,IAAA,MAAM,WAAA,GAAc,WAAA;AAAA,MAClB,CAAC,IAAA,KAAiB;AAChB,QAAA,IAAI,QAAQ,eAAA,EAAiB;AAC3B,UAAA,OAAO,WAAA,CAAY,MAAA,CAAO,IAAA,EAAM,eAAe,CAAA;AAAA,QACjD;AACA,QAAA,OAAO,OACH,WAAA,CAAY,MAAA,CAAO,MAAM,gBAAA,GAAmB,MAAA,GAAS,KAAK,CAAA,GAC1D,EAAA;AAAA,MACN,CAAA;AAAA,MACA,CAAC,WAAA,EAAa,eAAA,EAAiB,gBAAgB;AAAA,KACjD;AAEA,IAAA,MAAM,UAAA,GAAa,WAAA;AAAA,MACjB,CAAC,IAAA,KAAiB;AAChB,QAAA,IAAI,QAAQ,cAAA,EAAgB;AAC1B,UAAA,OAAO,WAAA,CAAY,MAAA,CAAO,IAAA,EAAM,cAAc,CAAA;AAAA,QAChD;AACA,QAAA,OAAO,CAAC,OAAO,EAAA,GAAK,CAAA,EAAG,YAAY,MAAA,CAAO,IAAA,EAAM,MAAM,CAAC,CAAA,CAAA;AAAA,MACzD,CAAA;AAAA,MACA,CAAC,aAAa,cAAc;AAAA,KAC9B;AAEA,IAAA,uBACE,IAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,IAAA;AAAA,UACT,YAAA,EAAa;AAAA,UACb,EAAE,CAAC,YAAA,CAAa,kBAAkB,CAAC,GAAG,gBAAA,EAAiB;AAAA,UACvD;AAAA,SACF;AAAA,QACA,GAAA;AAAA,QACC,GAAG,IAAA;AAAA,QAEJ,QAAA,EAAA;AAAA,0BAAA,GAAA;AAAA,YAAC,kBAAA;AAAA,YAAA;AAAA,cACC,SAAA,EAAU,KAAA;AAAA,cACV,QAAA,EAAU,EAAE,2BAAA,IAA+B,uBAAA,CAAA;AAAA,cAC3C,OAAA,EAAQ,6BAAA;AAAA,cACR,UAAA,EAAY,CAAA;AAAA,cACZ,UAAA,EAAY,CAAA;AAAA,cAEZ,QAAA,kBAAA,GAAA;AAAA,gBAAC,MAAA;AAAA,gBAAA;AAAA,kBACC,YAAA,EAAW,gBAAA;AAAA,kBACX,UAAU,2BAAA,IAA+B,uBAAA;AAAA,kBACzC,UAAA,EAAW,aAAA;AAAA,kBACX,SAAA,EAAU,SAAA;AAAA,kBACV,OAAA,EAAS,sBAAA;AAAA,kBACT,qBAAA,EAAuB,IAAA;AAAA,kBAEvB,QAAA,kBAAA,GAAA,CAAC,YAAA,EAAA,EAAa,aAAA,EAAW,IAAA,EAAC;AAAA;AAAA;AAC5B;AAAA,WACF;AAAA,0BACA,IAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cACC,SAAA,EAAW,IAAA,CAAK,EAAE,CAAC,YAAA,CAAa,WAAW,CAAC,GAAG,CAAC,gBAAA,EAAkB,CAAA;AAAA,cAElE,QAAA,EAAA;AAAA,gCAAA,GAAA;AAAA,kBAAC,QAAA;AAAA,kBAAA;AAAA,oBACC,YAAA,EAAW,gBAAA;AAAA,oBACX,QAAA,EAAU,aAAA,GAAgB,CAAC,aAAa,IAAI,EAAC;AAAA,oBAC7C,KAAA,EAAO,YAAY,aAAa,CAAA;AAAA,oBAChC,iBAAA,EAAmB,iBAAA;AAAA,oBAClB,GAAG,kBAAA;AAAA,oBAEH,QAAA,EAAA,MAAA,CAAO,GAAA,CAAI,CAAC,KAAA,KAAU;AACrB,sBAAA,MAAM,oBAAA,GAAuB,uBAAuB,KAAK,CAAA;AACzD,sBAAA,uBACE,GAAA;AAAA,wBAAC,iBAAA;AAAA,wBAAA;AAAA,0BAEC,KAAA,EAAO,KAAA;AAAA,0BACP,QAAA,EAAU,oBAAA;AAAA,0BACV,cAAA,EAAgB,4BAAA;AAAA,0BAEf,sBAAY,KAAK;AAAA,yBAAA;AAAA,wBALb,YAAY,KAAK;AAAA,uBAMxB;AAAA,oBAEJ,CAAC;AAAA;AAAA,iBACH;AAAA,gBACC,CAAC,gBAAA,mBACA,GAAA;AAAA,kBAAC,QAAA;AAAA,kBAAA;AAAA,oBACC,YAAA,EAAW,eAAA;AAAA,oBACX,QAAA,EAAU,YAAA,GAAe,CAAC,YAAY,IAAI,EAAC;AAAA,oBAC3C,KAAA,EAAO,WAAW,YAAY,CAAA;AAAA,oBAC9B,iBAAA,EAAmB,gBAAA;AAAA,oBAClB,GAAG,iBAAA;AAAA,oBACJ,SAAA,EAAW,IAAA;AAAA,sBACT,aAAa,cAAc,CAAA;AAAA,sBAC3B,iBAAA,IAAA,IAAA,GAAA,MAAA,GAAA,iBAAA,CAAmB;AAAA,qBACrB;AAAA,oBAEC,QAAA,EAAA,KAAA,CAAM,GAAA,CAAI,CAAC,IAAA,yBACT,MAAA,EAAA,EAA8B,KAAA,EAAO,IAAA,EACnC,QAAA,EAAA,UAAA,CAAW,IAAI,CAAA,EAAA,EADL,UAAA,CAAW,IAAI,CAE5B,CACD;AAAA;AAAA,iBACH,GACE;AAAA;AAAA;AAAA,WACN;AAAA,0BACA,GAAA;AAAA,YAAC,kBAAA;AAAA,YAAA;AAAA,cACC,SAAA,EAAU,KAAA;AAAA,cACV,QAAA,EAAU,EAAE,uBAAA,IAA2B,mBAAA,CAAA;AAAA,cACvC,OAAA,EAAQ,+BAAA;AAAA,cACR,UAAA,EAAY,CAAA;AAAA,cACZ,UAAA,EAAY,CAAA;AAAA,cAEZ,QAAA,kBAAA,GAAA;AAAA,gBAAC,MAAA;AAAA,gBAAA;AAAA,kBACC,YAAA,EAAW,YAAA;AAAA,kBACX,UAAU,uBAAA,IAA2B,mBAAA;AAAA,kBACrC,UAAA,EAAW,aAAA;AAAA,kBACX,SAAA,EAAU,SAAA;AAAA,kBACV,OAAA,EAAS,kBAAA;AAAA,kBACT,qBAAA,EAAuB,IAAA;AAAA,kBAEvB,QAAA,kBAAA,GAAA,CAAC,QAAA,EAAA,EAAS,aAAA,EAAW,IAAA,EAAC;AAAA;AAAA;AACxB;AAAA;AACF;AAAA;AAAA,KACF;AAAA,EAEJ;AACF;;;;"}
|
|
@@ -1,4 +0,0 @@
|
|
|
1
|
-
var css_248z = ".saltCalendarWeekHeader {\n display: flex;\n text-align: center;\n align-items: center;\n height: var(--salt-size-base);\n gap: var(--calendar-gap);\n}\n\n.saltCalendarWeekHeader-dayOfWeek {\n width: var(--calendar-day-size);\n color: var(--salt-content-secondary-foreground);\n font-family: var(--salt-text-fontFamily);\n font-weight: var(--salt-text-fontWeight);\n font-size: var(--salt-text-fontSize);\n line-height: var(--salt-text-lineHeight);\n}\n";
|
|
2
|
-
|
|
3
|
-
export { css_248z as default };
|
|
4
|
-
//# sourceMappingURL=CalendarWeekHeader.css.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"CalendarWeekHeader.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
|
|
@@ -1,44 +0,0 @@
|
|
|
1
|
-
import { jsx } from 'react/jsx-runtime';
|
|
2
|
-
import { makePrefixer, Text } from '@salt-ds/core';
|
|
3
|
-
import { useComponentCssInjection } from '@salt-ds/styles';
|
|
4
|
-
import { useWindow } from '@salt-ds/window';
|
|
5
|
-
import { clsx } from 'clsx';
|
|
6
|
-
import { forwardRef } from 'react';
|
|
7
|
-
import { useLocalization } from '../localization-provider/LocalizationProvider.js';
|
|
8
|
-
import css_248z from './CalendarWeekHeader.css.js';
|
|
9
|
-
import { daysOfWeek } from './internal/utils.js';
|
|
10
|
-
|
|
11
|
-
const withBaseName = makePrefixer("saltCalendarWeekHeader");
|
|
12
|
-
const CalendarWeekHeader = forwardRef(function CalendarWeekHeader2(props, ref) {
|
|
13
|
-
const { className, ...rest } = props;
|
|
14
|
-
const { dateAdapter } = useLocalization();
|
|
15
|
-
const weekdaysShort = daysOfWeek(dateAdapter, "narrow");
|
|
16
|
-
const weekdaysLong = daysOfWeek(dateAdapter, "long");
|
|
17
|
-
const targetWindow = useWindow();
|
|
18
|
-
useComponentCssInjection({
|
|
19
|
-
testId: "salt-calendar-week-header",
|
|
20
|
-
css: css_248z,
|
|
21
|
-
window: targetWindow
|
|
22
|
-
});
|
|
23
|
-
return /* @__PURE__ */ jsx(
|
|
24
|
-
"div",
|
|
25
|
-
{
|
|
26
|
-
"data-testid": "CalendarWeekHeader",
|
|
27
|
-
className: clsx(withBaseName(), className),
|
|
28
|
-
ref,
|
|
29
|
-
...rest,
|
|
30
|
-
children: weekdaysShort.map((day, index) => /* @__PURE__ */ jsx(
|
|
31
|
-
Text,
|
|
32
|
-
{
|
|
33
|
-
"aria-hidden": true,
|
|
34
|
-
className: withBaseName("dayOfWeek"),
|
|
35
|
-
children: day
|
|
36
|
-
},
|
|
37
|
-
weekdaysLong[index]
|
|
38
|
-
))
|
|
39
|
-
}
|
|
40
|
-
);
|
|
41
|
-
});
|
|
42
|
-
|
|
43
|
-
export { CalendarWeekHeader };
|
|
44
|
-
//# sourceMappingURL=CalendarWeekHeader.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"CalendarWeekHeader.js","sources":["../src/calendar/CalendarWeekHeader.tsx"],"sourcesContent":["import { makePrefixer, Text } from \"@salt-ds/core\";\nimport type { DateFrameworkType } from \"@salt-ds/date-adapters\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { type ComponentPropsWithRef, forwardRef } from \"react\";\nimport { useLocalization } from \"../localization-provider\";\nimport calendarWeekHeaderCss from \"./CalendarWeekHeader.css\";\nimport { daysOfWeek } from \"./internal/utils\";\n\n/**\n * Props for the CalendarWeekHeader component.\n */\nexport type CalendarWeekHeaderProps = ComponentPropsWithRef<\"div\"> & {};\n\nconst withBaseName = makePrefixer(\"saltCalendarWeekHeader\");\n\nexport const CalendarWeekHeader = forwardRef(function CalendarWeekHeader<\n TDate extends DateFrameworkType,\n>(props: CalendarWeekHeaderProps, ref: React.Ref<HTMLDivElement>) {\n const { className, ...rest } = props;\n const { dateAdapter } = useLocalization<TDate>();\n\n const weekdaysShort = daysOfWeek(dateAdapter, \"narrow\");\n const weekdaysLong = daysOfWeek(dateAdapter, \"long\");\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-calendar-week-header\",\n css: calendarWeekHeaderCss,\n window: targetWindow,\n });\n\n return (\n <div\n data-testid=\"CalendarWeekHeader\"\n className={clsx(withBaseName(), className)}\n ref={ref}\n {...rest}\n >\n {weekdaysShort.map((day, index) => (\n <Text\n aria-hidden\n key={weekdaysLong[index]}\n className={withBaseName(\"dayOfWeek\")}\n >\n {day}\n </Text>\n ))}\n </div>\n );\n});\n"],"names":["CalendarWeekHeader","calendarWeekHeaderCss"],"mappings":";;;;;;;;;;AAeA,MAAM,YAAA,GAAe,aAAa,wBAAwB,CAAA;AAEnD,MAAM,kBAAA,GAAqB,UAAA,CAAW,SAASA,mBAAAA,CAEpD,OAAgC,GAAA,EAAgC;AAChE,EAAA,MAAM,EAAE,SAAA,EAAW,GAAG,IAAA,EAAK,GAAI,KAAA;AAC/B,EAAA,MAAM,EAAE,WAAA,EAAY,GAAI,eAAA,EAAuB;AAE/C,EAAA,MAAM,aAAA,GAAgB,UAAA,CAAW,WAAA,EAAa,QAAQ,CAAA;AACtD,EAAA,MAAM,YAAA,GAAe,UAAA,CAAW,WAAA,EAAa,MAAM,CAAA;AAEnD,EAAA,MAAM,eAAe,SAAA,EAAU;AAC/B,EAAA,wBAAA,CAAyB;AAAA,IACvB,MAAA,EAAQ,2BAAA;AAAA,IACR,GAAA,EAAKC,QAAA;AAAA,IACL,MAAA,EAAQ;AAAA,GACT,CAAA;AAED,EAAA,uBACE,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,aAAA,EAAY,oBAAA;AAAA,MACZ,SAAA,EAAW,IAAA,CAAK,YAAA,EAAa,EAAG,SAAS,CAAA;AAAA,MACzC,GAAA;AAAA,MACC,GAAG,IAAA;AAAA,MAEH,QAAA,EAAA,aAAA,CAAc,GAAA,CAAI,CAAC,GAAA,EAAK,KAAA,qBACvB,GAAA;AAAA,QAAC,IAAA;AAAA,QAAA;AAAA,UACC,aAAA,EAAW,IAAA;AAAA,UAEX,SAAA,EAAW,aAAa,WAAW,CAAA;AAAA,UAElC,QAAA,EAAA;AAAA,SAAA;AAAA,QAHI,aAAa,KAAK;AAAA,OAK1B;AAAA;AAAA,GACH;AAEJ,CAAC;;;;"}
|
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
import { createContext, useContext } from 'react';
|
|
2
|
-
|
|
3
|
-
const CalendarContext = createContext(
|
|
4
|
-
null
|
|
5
|
-
);
|
|
6
|
-
if (process.env.NODE_ENV !== "production") {
|
|
7
|
-
CalendarContext.displayName = "CalendarContext";
|
|
8
|
-
}
|
|
9
|
-
function useCalendarContext() {
|
|
10
|
-
const context = useContext(
|
|
11
|
-
CalendarContext
|
|
12
|
-
);
|
|
13
|
-
if (!context) {
|
|
14
|
-
throw new Error(
|
|
15
|
-
"useCalendarContext should be called inside CalendarContext.Provider"
|
|
16
|
-
);
|
|
17
|
-
}
|
|
18
|
-
return context;
|
|
19
|
-
}
|
|
20
|
-
|
|
21
|
-
export { CalendarContext, useCalendarContext };
|
|
22
|
-
//# sourceMappingURL=CalendarContext.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"CalendarContext.js","sources":["../src/calendar/internal/CalendarContext.tsx"],"sourcesContent":["import type { DateFrameworkType } from \"@salt-ds/date-adapters\";\nimport { createContext, useContext } from \"react\";\nimport type { UseCalendarReturn } from \"../useCalendar\";\n\ninterface CalendarState<TDate extends DateFrameworkType>\n extends UseCalendarReturn<TDate> {}\n\nconst CalendarContext = createContext<CalendarState<DateFrameworkType> | null>(\n null,\n);\n\nif (process.env.NODE_ENV !== \"production\") {\n CalendarContext.displayName = \"CalendarContext\";\n}\n\nfunction useCalendarContext<\n TDate extends DateFrameworkType,\n>(): CalendarState<TDate> {\n const context = useContext(\n CalendarContext as React.Context<CalendarState<TDate> | null>,\n );\n if (!context) {\n throw new Error(\n \"useCalendarContext should be called inside CalendarContext.Provider\",\n );\n }\n\n return context;\n}\n\nexport { CalendarContext, useCalendarContext };\n"],"names":[],"mappings":";;AAOA,MAAM,eAAA,GAAkB,aAAA;AAAA,EACtB;AACF;AAEA,IAAI,OAAA,CAAQ,GAAA,CAAI,QAAA,KAAa,YAAA,EAAc;AACzC,EAAA,eAAA,CAAgB,WAAA,GAAc,iBAAA;AAChC;AAEA,SAAS,kBAAA,GAEiB;AACxB,EAAA,MAAM,OAAA,GAAU,UAAA;AAAA,IACd;AAAA,GACF;AACA,EAAA,IAAI,CAAC,OAAA,EAAS;AACZ,IAAA,MAAM,IAAI,KAAA;AAAA,MACR;AAAA,KACF;AAAA,EACF;AAEA,EAAA,OAAO,OAAA;AACT;;;;"}
|