@uxf/datepicker 11.99.1 → 11.106.0
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/hooks/use-date-picker-navigation.js +5 -3
- package/hooks/use-date-range-picker.js +7 -4
- package/hooks/use-day.js +6 -5
- package/package.json +1 -1
- package/utils/can-select-range.d.ts +1 -1
- package/utils/can-select-range.js +9 -3
- package/utils/is-date-blocked.d.ts +1 -1
- package/utils/is-date-blocked.js +1 -1
- package/utils/is-date-hovered.d.ts +1 -1
- package/utils/is-date-hovered.js +9 -0
|
@@ -59,12 +59,14 @@ function useDatePickerNavigation({ activeMonths, setActiveMonths, setFocusedDate
|
|
|
59
59
|
: true;
|
|
60
60
|
const canGoToPrevYear = minBookingDate
|
|
61
61
|
? !(0, dayjs_utils_1.dayjsEnWithTz)((_d = (_c = activeMonths.at(0)) === null || _c === void 0 ? void 0 : _c.date) !== null && _d !== void 0 ? _d : new Date())
|
|
62
|
-
.
|
|
63
|
-
.
|
|
62
|
+
.subtract(1, "year")
|
|
63
|
+
.endOf("year")
|
|
64
|
+
.isBefore((0, dayjs_utils_1.dayjsEnRaw)(minBookingDate))
|
|
64
65
|
: true;
|
|
65
66
|
const canGoToNextYear = maxBookingDate
|
|
66
67
|
? !(0, dayjs_utils_1.dayjsEnWithTz)(activeMonths[activeMonths.length - 1].date)
|
|
67
|
-
.
|
|
68
|
+
.add(1, "year")
|
|
69
|
+
.startOf("year")
|
|
68
70
|
.isAfter((0, dayjs_utils_1.dayjsEnWithTz)(maxBookingDate))
|
|
69
71
|
: true;
|
|
70
72
|
const canGoTo = (0, react_1.useCallback)((month, type) => {
|
|
@@ -16,7 +16,7 @@ const is_start_date_1 = require("../utils/is-start-date");
|
|
|
16
16
|
const use_date_picker_navigation_1 = require("./use-date-picker-navigation");
|
|
17
17
|
exports.START_DATE = "startDate";
|
|
18
18
|
exports.END_DATE = "endDate";
|
|
19
|
-
function useDateRangePicker({ changeActiveMonthOnSelect = false, datesConfig = [], endDate, exactMinBookingDays = false, firstDayOfWeek = 0, focusedInput, initialVisibleMonth, isDateBlocked: isDateBlockedProps
|
|
19
|
+
function useDateRangePicker({ changeActiveMonthOnSelect = false, datesConfig = [], endDate, exactMinBookingDays = false, firstDayOfWeek = 0, focusedInput, initialVisibleMonth, isDateBlocked: isDateBlockedProps, maxBookingDate, minBookingDate, minBookingDays = 1, numberOfMonths = 2, onDatesChange, startDate, unavailableDates = [], }) {
|
|
20
20
|
const disabledDatesFromConfig = datesConfig.filter((config) => config.isDisabled).flatMap((config) => config.dates);
|
|
21
21
|
const disabledDates = [...unavailableDates, ...disabledDatesFromConfig];
|
|
22
22
|
const [activeMonths, setActiveMonths] = (0, react_1.useState)(() => startDate
|
|
@@ -24,9 +24,12 @@ function useDateRangePicker({ changeActiveMonthOnSelect = false, datesConfig = [
|
|
|
24
24
|
: (0, get_initial_months_1.getInitialMonths)(numberOfMonths, initialVisibleMonth || null));
|
|
25
25
|
const [hoveredDate, setHoveredDate] = (0, react_1.useState)(null);
|
|
26
26
|
const [focusedDate, setFocusedDate] = (0, react_1.useState)(startDate);
|
|
27
|
-
const disabledDatesByUser =
|
|
28
|
-
|
|
29
|
-
|
|
27
|
+
const disabledDatesByUser = isDateBlockedProps || disabledDates.length > 0
|
|
28
|
+
? (date) => {
|
|
29
|
+
var _a;
|
|
30
|
+
return (0, is_in_unavailable_dates_1.isInUnavailableDates)(disabledDates, date) || ((_a = isDateBlockedProps === null || isDateBlockedProps === void 0 ? void 0 : isDateBlockedProps(date)) !== null && _a !== void 0 ? _a : false);
|
|
31
|
+
}
|
|
32
|
+
: null;
|
|
30
33
|
const onDateFocus = (0, react_1.useCallback)((date) => {
|
|
31
34
|
setFocusedDate(date);
|
|
32
35
|
if (!focusedDate || !activeMonths.map((m) => m.month).includes((0, dayjs_utils_1.dayjsEnRaw)(date).month())) {
|
package/hooks/use-day.js
CHANGED
|
@@ -12,7 +12,6 @@ function useDay({ date, datesConfig, dayRef, focusedDate, isDateBlocked, isDateF
|
|
|
12
12
|
const disabledDates = [...unavailableDates, ...disabledDatesFromConfig].filter((day, index, self) => index === self.findIndex((d) => d.getTime() === day.getTime()));
|
|
13
13
|
const onClick = (0, react_1.useCallback)(() => onDateSelect(date), [date, onDateSelect]);
|
|
14
14
|
const onMouseEnter = (0, react_1.useCallback)(() => onDateHover(date), [date, onDateHover]);
|
|
15
|
-
const disabled = isDateBlocked(date) && !isDateHovered(date);
|
|
16
15
|
const isToday = (0, dayjs_utils_1.dayjsEnWithTz)().isSame(date, "day");
|
|
17
16
|
(0, react_1.useEffect)(() => {
|
|
18
17
|
if (dayRef && dayRef.current && isDateFocused(date)) {
|
|
@@ -60,17 +59,19 @@ function useDay({ date, datesConfig, dayRef, focusedDate, isDateBlocked, isDateF
|
|
|
60
59
|
});
|
|
61
60
|
return acc;
|
|
62
61
|
}, []);
|
|
62
|
+
const isHovered = isDateHovered(date);
|
|
63
|
+
const isDisabled = isDateBlocked(date) && !isHovered;
|
|
63
64
|
return {
|
|
64
65
|
flags: flags !== null && flags !== void 0 ? flags : empty_array_1.EMPTY_ARRAY,
|
|
65
|
-
disabledDate:
|
|
66
|
+
disabledDate: isDisabled,
|
|
66
67
|
isFirstDisabled: _isFirstUnavailableDate(),
|
|
67
|
-
isHovered:
|
|
68
|
+
isHovered: isHovered,
|
|
68
69
|
isInsideRange: isDateInsideRange ? isDateInsideRange(date) : false,
|
|
69
70
|
isLastDisabled: _isLastUnavailableDate(),
|
|
70
71
|
isSelected: isDateSelected(date),
|
|
71
72
|
isToday,
|
|
72
|
-
isWithinHoverRange:
|
|
73
|
-
onClick: !
|
|
73
|
+
isWithinHoverRange: isHovered,
|
|
74
|
+
onClick: !isDisabled ? onClick : undefined,
|
|
74
75
|
onKeyDown,
|
|
75
76
|
onMouseEnter,
|
|
76
77
|
tabIndex: focusedDate === null || isDateFocused(date) ? 0 : -1,
|
package/package.json
CHANGED
|
@@ -21,15 +21,18 @@ function canSelectRange({ startDate, endDate, isDateBlocked, minBookingDays, exa
|
|
|
21
21
|
if (!isStartDateAfterOrEqualMinDate || !isStartDateBeforeOrEqualMaxDate || !isEndDatBeforeOrEqualMaxDate) {
|
|
22
22
|
return false;
|
|
23
23
|
}
|
|
24
|
-
if (minBookingDays === 1 && !endDate && !isDateBlocked(startDate)) {
|
|
24
|
+
if (minBookingDays === 1 && !endDate && !(isDateBlocked === null || isDateBlocked === void 0 ? void 0 : isDateBlocked(startDate))) {
|
|
25
25
|
return true;
|
|
26
26
|
}
|
|
27
27
|
else if ((minBookingDays > 1 && !endDate && !exactMinBookingDays) ||
|
|
28
28
|
(minBookingDays > 0 && exactMinBookingDays) ||
|
|
29
29
|
(minBookingDays > 0 && exactMinBookingDays && !minBookingDate && !maxBookingDate)) {
|
|
30
|
+
if (!isDateBlocked) {
|
|
31
|
+
return true;
|
|
32
|
+
}
|
|
30
33
|
return !(0, get_each_1.getEach)(startDate, (0, dayjs_utils_1.dayjsEnRaw)(startDate)
|
|
31
34
|
.add(minBookingDays - 1, "day")
|
|
32
|
-
.toDate(), "day").some(
|
|
35
|
+
.toDate(), "day").some(isDateBlocked);
|
|
33
36
|
}
|
|
34
37
|
else if (endDate && !exactMinBookingDays) {
|
|
35
38
|
const minBookingDaysDate = (0, dayjs_utils_1.dayjsEnRaw)(startDate)
|
|
@@ -38,7 +41,10 @@ function canSelectRange({ startDate, endDate, isDateBlocked, minBookingDays, exa
|
|
|
38
41
|
if ((0, dayjs_utils_1.dayjsEnRaw)(endDate).isBefore(minBookingDaysDate)) {
|
|
39
42
|
return false;
|
|
40
43
|
}
|
|
41
|
-
|
|
44
|
+
if (!isDateBlocked) {
|
|
45
|
+
return true;
|
|
46
|
+
}
|
|
47
|
+
return !(0, get_each_1.getEach)(startDate, endDate, "day").some(isDateBlocked);
|
|
42
48
|
}
|
|
43
49
|
return false;
|
|
44
50
|
}
|
|
@@ -5,7 +5,7 @@ interface IsDateBlockedProps {
|
|
|
5
5
|
minBookingDays?: number;
|
|
6
6
|
minBookingDate?: Date;
|
|
7
7
|
maxBookingDate?: Date;
|
|
8
|
-
isDateBlockedFn?: (date: Date) => boolean;
|
|
8
|
+
isDateBlockedFn?: ((date: Date) => boolean) | null;
|
|
9
9
|
unavailableDates?: Date[];
|
|
10
10
|
}
|
|
11
11
|
export declare function isDateBlocked({ date, minBookingDate, maxBookingDate, isDateBlockedFn, startDate, endDate, minBookingDays, unavailableDates, }: IsDateBlockedProps): boolean;
|
package/utils/is-date-blocked.js
CHANGED
|
@@ -16,6 +16,6 @@ function isDateBlocked({ date, minBookingDate, maxBookingDate, isDateBlockedFn,
|
|
|
16
16
|
(startDate &&
|
|
17
17
|
!endDate &&
|
|
18
18
|
minBookingDays > 1 &&
|
|
19
|
-
(0, dayjs_utils_1.dayjsEnRaw)(date).isBetween(startDate, (0, dayjs_utils_1.dayjsEnRaw)(startDate).add(minBookingDays -
|
|
19
|
+
(0, dayjs_utils_1.dayjsEnRaw)(date).isBetween(startDate, (0, dayjs_utils_1.dayjsEnRaw)(startDate).add(minBookingDays - 1, "day"))) ||
|
|
20
20
|
(isDateBlockedFn && isDateBlockedFn(date)));
|
|
21
21
|
}
|
|
@@ -2,7 +2,7 @@ export interface IsDateHoveredProps {
|
|
|
2
2
|
startDate: Date | null;
|
|
3
3
|
endDate: Date | null;
|
|
4
4
|
date: Date;
|
|
5
|
-
isDateBlocked(date: Date)
|
|
5
|
+
isDateBlocked: ((date: Date) => boolean) | null;
|
|
6
6
|
hoveredDate: Date | null;
|
|
7
7
|
minBookingDays: number;
|
|
8
8
|
exactMinBookingDays: boolean;
|
package/utils/is-date-hovered.js
CHANGED
|
@@ -10,6 +10,9 @@ function isDateHovered({ date, startDate, endDate, isDateBlocked, hoveredDate, m
|
|
|
10
10
|
minBookingDays > 1 &&
|
|
11
11
|
exactMinBookingDays &&
|
|
12
12
|
(0, dayjs_utils_1.dayjsEnRaw)(date).isBetween(hoveredDate, (0, dayjs_utils_1.dayjsEnRaw)(hoveredDate).add(minBookingDays - 1, "day"))) {
|
|
13
|
+
if (!isDateBlocked) {
|
|
14
|
+
return true;
|
|
15
|
+
}
|
|
13
16
|
return !(0, get_each_1.getEach)(hoveredDate, (0, dayjs_utils_1.dayjsEnRaw)(hoveredDate)
|
|
14
17
|
.add(minBookingDays - 1, "day")
|
|
15
18
|
.toDate(), "day").some((d) => isDateBlocked(d));
|
|
@@ -22,6 +25,9 @@ function isDateHovered({ date, startDate, endDate, isDateBlocked, hoveredDate, m
|
|
|
22
25
|
(0, dayjs_utils_1.dayjsEnRaw)(date).isBetween(startDate, (0, dayjs_utils_1.dayjsEnRaw)(startDate).add(minBookingDays - 1, "day")) &&
|
|
23
26
|
(0, dayjs_utils_1.dayjsEnRaw)(startDate).isSame(hoveredDate, "days") &&
|
|
24
27
|
minBookingDays > 1) {
|
|
28
|
+
if (!isDateBlocked) {
|
|
29
|
+
return true;
|
|
30
|
+
}
|
|
25
31
|
return !(0, get_each_1.getEach)(startDate, (0, dayjs_utils_1.dayjsEnRaw)(startDate)
|
|
26
32
|
.add(minBookingDays - 1, "day")
|
|
27
33
|
.toDate(), "day").some((d) => isDateBlocked(d));
|
|
@@ -33,6 +39,9 @@ function isDateHovered({ date, startDate, endDate, isDateBlocked, hoveredDate, m
|
|
|
33
39
|
hoveredDate &&
|
|
34
40
|
!(0, dayjs_utils_1.dayjsEnRaw)(hoveredDate).isBefore(startDate) &&
|
|
35
41
|
(0, dayjs_utils_1.dayjsEnRaw)(date).isBetween(startDate, hoveredDate)) {
|
|
42
|
+
if (!isDateBlocked) {
|
|
43
|
+
return true;
|
|
44
|
+
}
|
|
36
45
|
return !(0, get_each_1.getEach)(startDate, hoveredDate, "day").some((d) => isDateBlocked(d));
|
|
37
46
|
}
|
|
38
47
|
return false;
|