willba-component-library 0.2.94 → 0.2.95
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/lib/assets/IconsSvg.d.ts +1 -1
- package/lib/components/FilterBar/FilterBarTypes.d.ts +1 -1
- package/lib/components/FilterBar/components/guests/Guests.d.ts +1 -1
- package/lib/components/FilterCalendar/hooks/useFilterCalendar.d.ts +0 -1
- package/lib/core/components/calendar/utils/calendarSelectionRules.d.ts +2 -3
- package/lib/core/components/calendar/utils/handleCalendarModifiers.d.ts +1 -9
- package/lib/core/components/calendar/utils/handleRangeContextDisabledDates.d.ts +1 -1
- package/lib/index.esm.js +77 -95
- package/lib/index.esm.js.map +1 -1
- package/lib/index.js +77 -95
- package/lib/index.js.map +1 -1
- package/lib/index.umd.js +77 -95
- package/lib/index.umd.js.map +1 -1
- package/package.json +1 -1
- package/src/assets/IconsSvg.tsx +1 -0
- package/src/components/FilterBar/FilterBarTypes.ts +1 -1
- package/src/components/FilterBar/components/guests/GuestCount/GuestCount.tsx +5 -5
- package/src/components/FilterBar/components/guests/Guests.tsx +3 -7
- package/src/components/FilterCalendar/FilterCalendar.stories.tsx +275 -275
- package/src/components/FilterCalendar/FilterCalendar.tsx +0 -2
- package/src/components/FilterCalendar/hooks/useFilterCalendar.ts +0 -1
- package/src/core/components/calendar/Calendar.tsx +46 -35
- package/src/core/components/calendar/hooks/useUpdateDisabledDates.tsx +3 -3
- package/src/core/components/calendar/utils/calendarSelectionRules.tsx +0 -48
- package/src/core/components/calendar/utils/handleCalendarModifiers.tsx +1 -30
- package/src/core/components/calendar/utils/handleRangeContextDisabledDates.tsx +3 -3
package/lib/index.umd.js
CHANGED
|
@@ -11002,26 +11002,6 @@
|
|
|
11002
11002
|
|
|
11003
11003
|
var reactResponsiveExports = reactResponsive.exports;
|
|
11004
11004
|
|
|
11005
|
-
var IconsSvg = function (_a) {
|
|
11006
|
-
var fill = _a.fill, size = _a.size, icon = _a.icon;
|
|
11007
|
-
switch (icon) {
|
|
11008
|
-
case 'spinner':
|
|
11009
|
-
return (React__default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "".concat(size || 25), height: "".concat(size || 25), viewBox: "0 0 24 24" },
|
|
11010
|
-
React__default.createElement("style", null, "\n .spinner_z9k8 {\n transform-origin: center;\n animation: spinner_StKS .75s infinite linear;\n }\n @keyframes spinner_StKS {\n 100% {\n transform: rotate(360deg);\n }\n }\n "),
|
|
11011
|
-
React__default.createElement("path", { d: "M12,1A11,11,0,1,0,23,12,11,11,0,0,0,12,1Zm0,19a8,8,0,1,1,8-8A8,8,0,0,1,12,20Z", opacity: ".25", fill: fill }),
|
|
11012
|
-
React__default.createElement("path", { d: "M12,4a8,8,0,0,1,7.89,6.7A1.53,1.53,0,0,0,21.38,12h0a1.5,1.5,0,0,0,1.48-1.75,11,11,0,0,0-21.72,0A1.5,1.5,0,0,0,2.62,12h0a1.53,1.53,0,0,0,1.49-1.3A8,8,0,0,1,12,4Z", className: "spinner_z9k8", fill: fill })));
|
|
11013
|
-
case 'warning':
|
|
11014
|
-
return (React__default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "".concat(size || 25), height: "".concat(size || 25), className: "svg-icon", style: {
|
|
11015
|
-
verticalAlign: 'middle',
|
|
11016
|
-
fill: fill,
|
|
11017
|
-
overflow: 'hidden',
|
|
11018
|
-
minWidth: '25px',
|
|
11019
|
-
minHeight: '25px',
|
|
11020
|
-
}, viewBox: "0 0 1024 1024", version: "1.1" },
|
|
11021
|
-
React__default.createElement("path", { d: "M42.666667 896h938.666666L512 85.333333 42.666667 896z m512-128h-85.333334v-85.333333h85.333334v85.333333z m0-170.666667h-85.333334v-170.666666h85.333334v170.666666z" })));
|
|
11022
|
-
}
|
|
11023
|
-
};
|
|
11024
|
-
|
|
11025
11005
|
var parseDates = function (_a) {
|
|
11026
11006
|
var calendarRange = _a.calendarRange;
|
|
11027
11007
|
return (calendarRange === null || calendarRange === void 0 ? void 0 : calendarRange.to) && (calendarRange === null || calendarRange === void 0 ? void 0 : calendarRange.from)
|
|
@@ -11047,7 +11027,7 @@
|
|
|
11047
11027
|
|
|
11048
11028
|
var calendarSelectionRules = function (_a) {
|
|
11049
11029
|
var _b;
|
|
11050
|
-
var range = _a.range, newDisableCalendarDates = _a.newDisableCalendarDates, setCalendarRange = _a.setCalendarRange,
|
|
11030
|
+
var range = _a.range, newDisableCalendarDates = _a.newDisableCalendarDates, setCalendarRange = _a.setCalendarRange, calendarRange = _a.calendarRange, overlappingDate = _a.overlappingDate, setCalendarHasError = _a.setCalendarHasError, rangeContext = _a.rangeContext;
|
|
11051
11031
|
// Get and parse needed data
|
|
11052
11032
|
var rangeFrom = (range === null || range === void 0 ? void 0 : range.from) ? endOfDay(range.from) : null;
|
|
11053
11033
|
var rangeTo = (range === null || range === void 0 ? void 0 : range.to) ? endOfDay(range.to) : null;
|
|
@@ -11084,13 +11064,6 @@
|
|
|
11084
11064
|
: false;
|
|
11085
11065
|
})
|
|
11086
11066
|
: null;
|
|
11087
|
-
// On check-in, disable future dates that are unavailable for checkout
|
|
11088
|
-
disableFutureDates({
|
|
11089
|
-
rangeFrom: rangeFrom,
|
|
11090
|
-
checkOutRange: checkOutRange,
|
|
11091
|
-
setDisabledDates: setDisabledDates,
|
|
11092
|
-
newDisableCalendarDates: newDisableCalendarDates,
|
|
11093
|
-
});
|
|
11094
11067
|
// Calendar selection rules: The cases are handled sequentially, starting from simple selections to more complex contextual selections.
|
|
11095
11068
|
// The rules are processed in a specific order, so one case is handled before another.
|
|
11096
11069
|
// Changing the order will cause the rules to break or not work properly.
|
|
@@ -11185,22 +11158,6 @@
|
|
|
11185
11158
|
}
|
|
11186
11159
|
setCalendarRange(range);
|
|
11187
11160
|
};
|
|
11188
|
-
/////////
|
|
11189
|
-
var disableFutureDates = function (_a) {
|
|
11190
|
-
var rangeFrom = _a.rangeFrom, checkOutRange = _a.checkOutRange, setDisabledDates = _a.setDisabledDates, newDisableCalendarDates = _a.newDisableCalendarDates;
|
|
11191
|
-
if (rangeFrom && checkOutRange && setDisabledDates) {
|
|
11192
|
-
// Get parse data
|
|
11193
|
-
var checkIn = addDays(checkOutRange.checkIn, 1);
|
|
11194
|
-
var firstCheckOut = addDays(checkOutRange.firstCheckOut, -1);
|
|
11195
|
-
var noDatesRange = isEqual(checkIn, checkOutRange.firstCheckOut);
|
|
11196
|
-
setDisabledDates(__spreadArray$1(__spreadArray$1([], __read(((newDisableCalendarDates === null || newDisableCalendarDates === void 0 ? void 0 : newDisableCalendarDates.disabledDates) || [])), false), [
|
|
11197
|
-
{
|
|
11198
|
-
from: noDatesRange ? undefined : checkIn,
|
|
11199
|
-
to: noDatesRange ? undefined : firstCheckOut,
|
|
11200
|
-
},
|
|
11201
|
-
], false));
|
|
11202
|
-
}
|
|
11203
|
-
};
|
|
11204
11161
|
|
|
11205
11162
|
var disabledDatesByPage = function (_a) {
|
|
11206
11163
|
var _b, _c, _d;
|
|
@@ -11221,8 +11178,7 @@
|
|
|
11221
11178
|
};
|
|
11222
11179
|
|
|
11223
11180
|
var handleCalendarModifiers = function (_a) {
|
|
11224
|
-
var
|
|
11225
|
-
var newDisableCalendarDates = _a.newDisableCalendarDates, calendarRange = _a.calendarRange, disabledDatesByPage = _a.disabledDatesByPage, disabledDates = _a.disabledDates, overlappingDate = _a.overlappingDate, rangeContext = _a.rangeContext, firstPossibleRangeContextCheckIn = _a.firstPossibleRangeContextCheckIn, lastPossibleRangeContextCheckOut = _a.lastPossibleRangeContextCheckOut, findFirstPossibleRangeContextCheckIn = _a.findFirstPossibleRangeContextCheckIn, findLastPossibleRangeContextCheckOut = _a.findLastPossibleRangeContextCheckOut, currentSelectionLastCheckoutDate = _a.currentSelectionLastCheckoutDate, lastPossibleCheckout = _a.lastPossibleCheckout;
|
|
11181
|
+
var calendarRange = _a.calendarRange, disabledDates = _a.disabledDates, overlappingDate = _a.overlappingDate, rangeContext = _a.rangeContext, findFirstPossibleRangeContextCheckIn = _a.findFirstPossibleRangeContextCheckIn, findLastPossibleRangeContextCheckOut = _a.findLastPossibleRangeContextCheckOut, currentSelectionLastCheckoutDate = _a.currentSelectionLastCheckoutDate;
|
|
11226
11182
|
// Parse data
|
|
11227
11183
|
var calendarRangeFrom = (calendarRange === null || calendarRange === void 0 ? void 0 : calendarRange.from) && endOfDay(calendarRange.from);
|
|
11228
11184
|
var calendarRangeTo = (calendarRange === null || calendarRange === void 0 ? void 0 : calendarRange.to) && endOfDay(calendarRange.to);
|
|
@@ -11243,15 +11199,7 @@
|
|
|
11243
11199
|
.map(function (date) { return ({ from: date.from }); })
|
|
11244
11200
|
: [];
|
|
11245
11201
|
return {
|
|
11246
|
-
booked:
|
|
11247
|
-
? disabledDatesByPage
|
|
11248
|
-
: (disabledDates === null || disabledDates === void 0 ? void 0 : disabledDates.length)
|
|
11249
|
-
? __spreadArray$1(__spreadArray$1(__spreadArray$1([
|
|
11250
|
-
lastPossibleCheckout || []
|
|
11251
|
-
], __read(disabledDates), false), __read(firstPossibleRangeContextCheckIn), false), __read(lastPossibleRangeContextCheckOut), false) : ((_b = newDisableCalendarDates === null || newDisableCalendarDates === void 0 ? void 0 : newDisableCalendarDates.disabledDates) === null || _b === void 0 ? void 0 : _b.length)
|
|
11252
|
-
? __spreadArray$1(__spreadArray$1(__spreadArray$1([
|
|
11253
|
-
lastPossibleCheckout || []
|
|
11254
|
-
], __read(newDisableCalendarDates === null || newDisableCalendarDates === void 0 ? void 0 : newDisableCalendarDates.disabledDates), false), __read(firstPossibleRangeContextCheckIn), false), __read(lastPossibleRangeContextCheckOut), false) : [],
|
|
11202
|
+
booked: disabledDates || [],
|
|
11255
11203
|
disabledAfterCheckIn: calendarRangeFrom
|
|
11256
11204
|
? [{ after: calendarRangeFrom }]
|
|
11257
11205
|
: [],
|
|
@@ -11329,8 +11277,8 @@
|
|
|
11329
11277
|
});
|
|
11330
11278
|
}
|
|
11331
11279
|
}
|
|
11332
|
-
// Get
|
|
11333
|
-
var
|
|
11280
|
+
// Get possible check-out dates for current check-in
|
|
11281
|
+
var currentSelectionAvailability = availableDates === null || availableDates === void 0 ? void 0 : availableDates.find(function (date) {
|
|
11334
11282
|
return calendarRangeFrom
|
|
11335
11283
|
? isEqual(endOfDay(date.checkIn), calendarRangeFrom)
|
|
11336
11284
|
: false;
|
|
@@ -11340,7 +11288,7 @@
|
|
|
11340
11288
|
findLastPossibleRangeContextCheckOut: findLastPossibleRangeContextCheckOut,
|
|
11341
11289
|
firstPossibleRangeContextCheckIn: firstPossibleRangeContextCheckIn,
|
|
11342
11290
|
lastPossibleRangeContextCheckOut: lastPossibleRangeContextCheckOut,
|
|
11343
|
-
|
|
11291
|
+
currentSelectionAvailability: currentSelectionAvailability,
|
|
11344
11292
|
};
|
|
11345
11293
|
};
|
|
11346
11294
|
|
|
@@ -11515,9 +11463,9 @@
|
|
|
11515
11463
|
return acc;
|
|
11516
11464
|
}, { updatedDisabledDates: [], newOverlappingDates: [] }), updatedDisabledDates = _b.updatedDisabledDates, newOverlappingDates = _b.newOverlappingDates;
|
|
11517
11465
|
// Find last possible checkout ( disable all dates after the last possible checkout )
|
|
11518
|
-
var
|
|
11519
|
-
if (
|
|
11520
|
-
setLatsPossibleCheckout({ after:
|
|
11466
|
+
var lastPossibleCheckoutDate = (_a = disableCalendarDates.availableDates.at(-1)) === null || _a === void 0 ? void 0 : _a.lastCheckOut;
|
|
11467
|
+
if (lastPossibleCheckoutDate) {
|
|
11468
|
+
setLatsPossibleCheckout({ after: lastPossibleCheckoutDate });
|
|
11521
11469
|
}
|
|
11522
11470
|
// Extract overlapping dates ( dates that are only available for checkout )
|
|
11523
11471
|
if (newOverlappingDates.length) {
|
|
@@ -11542,9 +11490,31 @@
|
|
|
11542
11490
|
var css_248z$8 = ".will-calendar-filter-container {\n display: flex;\n justify-content: center;\n user-select: none;\n}\n\n/* Calendar overrides */\n\n.will-calendar-filter-container .DayPicker {\n font-size: 25px;\n}\n\n.will-calendar-filter-container .rdp-month {\n position: relative;\n}\n\n.will-calendar-filter-container .rdp-month.rdp-caption_start {\n padding-left: 70px;\n}\n\n.will-calendar-filter-container .rdp-month.rdp-caption_end {\n padding-right: 70px;\n}\n\n.will-calendar-filter-container .rdp-month .rdp-nav {\n border: 1px solid var(--will-primary);\n border-radius: 50%;\n}\n\n.will-calendar-filter-container .rdp-month .rdp-nav svg {\n color: var(--will-primary);\n}\n\n\n.will-calendar-filter-container .rdp-month .rdp-caption {\n position: initial;\n}\n\n.will-calendar-filter-container .rdp-month .rdp-caption > .rdp-caption_label,\n.will-calendar-filter-container .rdp-table .rdp-head {\n opacity: .6;\n}\n\n.will-calendar-filter-container .rdp-table {\n border-collapse: separate;\n border-spacing: 0px 2px;\n}\n\n.will-calendar-filter-container .rdp-button_reset.rdp-button.rdp-day.rdp-day_selected {\n background-color: var(--will-primary);\n opacity: 1;\n color: var(--will-white)\n}\n\n.will-calendar-filter-container .my-today:not(.rdp-day_selected) { \n font-weight: 700;\n opacity: 1;\n color: var(--will-primary);\n}\n\n.will-calendar-filter-container .rdp-cell {\n position: relative;\n}\n\n.will-calendar-filter-container .rdp-cell button {\n font-weight: 500;\n}\n\n.will-calendar-filter-container .rdp-cell button.booked {\n font-weight: 400;\n cursor: not-allowed;\n}\n\n.will-calendar-filter-container .rdp-cell .rdp-button[disabled] {\n color: var(--will-transparent-black);\n opacity: 1\n}\n\n@media (max-width: 960px) {\n .will-calendar-filter-container .rdp-month .rdp-nav {\n border: none;\n border-radius: initial;\n }\n\n .will-calendar-filter-container .rdp-month.rdp-caption_start {\n padding-left: 10px;\n }\n \n .will-calendar-filter-container .rdp-month.rdp-caption_end {\n padding-right: 10px;\n }\n}\n\n/* Tooltips */\n.will-root .will-calendar-filter-container .will-calendar-tooltip,\n.will-root .will-calendar-filter-container .will-calendar-tooltip-check-out,\n.will-root .will-calendar-filter-container .will-calendar-tooltip-overlapping-date,\n.will-root .will-calendar-filter-container .will-calendar-tooltip-check-out-only,\n.will-root .will-calendar-filter-container .will-calendar-tooltip-check-in-only {\n position: absolute;\n top: -42px;\n transform: translateX(calc(-50% + 20px));\n display: none;\n white-space: nowrap;\n z-index: 2;\n}\n\n.will-root .will-calendar-filter-container .will-calendar-tooltip > div,\n.will-root .will-calendar-filter-container .will-calendar-tooltip-check-out > div,\n.will-root .will-calendar-filter-container .will-calendar-tooltip-overlapping-date > div,\n.will-root .will-calendar-filter-container .will-calendar-tooltip-check-out-only > div,\n.will-root .will-calendar-filter-container .will-calendar-tooltip-check-in-only > div {\n background-color: white;\n position: relative;\n padding: 5px 10px;\n border: 1px solid var(--will-primary);\n border-radius: 5px;\n}\n\n.will-root .will-calendar-filter-container .will-calendar-tooltip::before,\n.will-root .will-calendar-filter-container .will-calendar-tooltip-check-out::before,\n.will-root .will-calendar-filter-container .will-calendar-tooltip-overlapping-date::before,\n.will-root .will-calendar-filter-container .will-calendar-tooltip-check-out-only::before,\n.will-root .will-calendar-filter-container .will-calendar-tooltip-check-in-only::before {\n content: \"\";\n width: 10px;\n height: 10px;\n border: 1px solid var(--will-primary);\n position: absolute;\n bottom: -4px;\n left:calc(50% - 5.555px);\n rotate: 45deg;\n z-index: 0;\n background-color: var(--will-white);\n}\n\n.will-root .will-calendar-filter-container .rdp-cell:hover .will-calendar-tooltip,\n.will-root .will-calendar-filter-container .rdp-cell:hover .will-calendar-tooltip-check-out,\n.will-root .will-calendar-filter-container .rdp-cell:hover .will-calendar-tooltip-overlapping-date,\n.will-root .will-calendar-filter-container .rdp-cell:hover .will-calendar-tooltip-check-out-only,\n.will-root .will-calendar-filter-container .rdp-cell:hover .will-calendar-tooltip-check-in-only {\n display: block;\n}\n\n/* Loading spinner */\n\n.will-root .will-calendar-filter-container .rdp-months {\n position: relative;\n}\n\n.will-root .will-calendar-filter-container .will-calendar-spinner {\n position: absolute;\n top:0;\n bottom:0;\n left: 0;\n right: 0;\n background-color: var(--will-white-transparent);\n z-index: 3;\n display: none;\n justify-content: center;\n align-items: center;\n font-weight: 600;\n}\n\n/* No active selection */\n\n.will-root .will-calendar-filter-container .no-active-selection-start,\n.will-root .will-calendar-filter-container .no-active-selection-mid,\n.will-root .will-calendar-filter-container .no-active-selection-end { \n position: initial;\n}\n\n.will-root .will-calendar-filter-container .no-active-selection-start::before,\n.will-root .will-calendar-filter-container .no-active-selection-mid::before,\n.will-root .will-calendar-filter-container .no-active-selection-end::before { \n content: \"\";\n position: absolute;\n width: 100%;\n height: 100%;\n border: 2px solid var(--will-light-grey);\n box-sizing: border-box;\n}\n\n.will-root .will-calendar-filter-container .no-active-selection-start::before {\n border-right: none;\n border-top-left-radius: 50%;\n border-bottom-left-radius: 50%;\n}\n\n.will-root .will-calendar-filter-container .no-active-selection-mid::before {\n border-right: none;\n border-left: none;\n}\n\n.will-root .will-calendar-filter-container .no-active-selection-end::before {\n border-left: none;\n border-top-right-radius: 50%;\n border-bottom-right-radius: 50%;\n}\n\n.will-root .will-calendar-filter-container .rdp-day_selected.rdp-day_range_middle.checkout-option {\n background-color: var(--will-primary-lightest);\n color: inherit;\n}\n\n/* Overlapping date */\n\n.will-root .will-calendar-filter-container .overlapping-date {\n user-select: none;\n pointer-events: none;\n}\n\n.will-root .will-calendar-filter-container .overlapping-date:hover {\n cursor: not-allowed;\n}\n\n@media (max-width: 600px) {\n /* Tooltips */\n.will-root .will-calendar-filter-container .will-calendar-tooltip,\n.will-root .will-calendar-filter-container .will-calendar-tooltip-check-out,\n.will-root .will-calendar-filter-container .will-calendar-tooltip-overlapping-date,\n.will-root .will-calendar-filter-container .will-calendar-tooltip-check-out-only,\n.will-root .will-calendar-filter-container .will-calendar-tooltip-check-in-only {\n top: -70px;\n white-space: wrap;\n max-width: 120px;\n}\n}\n\n\n";
|
|
11543
11491
|
styleInject(css_248z$8);
|
|
11544
11492
|
|
|
11493
|
+
var IconsSvg = function (_a) {
|
|
11494
|
+
var fill = _a.fill, size = _a.size, icon = _a.icon;
|
|
11495
|
+
switch (icon) {
|
|
11496
|
+
case 'spinner':
|
|
11497
|
+
return (React__default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "".concat(size || 25), height: "".concat(size || 25), viewBox: "0 0 24 24" },
|
|
11498
|
+
React__default.createElement("style", null, "\n .spinner_z9k8 {\n transform-origin: center;\n animation: spinner_StKS .75s infinite linear;\n }\n @keyframes spinner_StKS {\n 100% {\n transform: rotate(360deg);\n }\n }\n "),
|
|
11499
|
+
React__default.createElement("path", { d: "M12,1A11,11,0,1,0,23,12,11,11,0,0,0,12,1Zm0,19a8,8,0,1,1,8-8A8,8,0,0,1,12,20Z", opacity: ".25", fill: fill }),
|
|
11500
|
+
React__default.createElement("path", { d: "M12,4a8,8,0,0,1,7.89,6.7A1.53,1.53,0,0,0,21.38,12h0a1.5,1.5,0,0,0,1.48-1.75,11,11,0,0,0-21.72,0A1.5,1.5,0,0,0,2.62,12h0a1.53,1.53,0,0,0,1.49-1.3A8,8,0,0,1,12,4Z", className: "spinner_z9k8", fill: fill })));
|
|
11501
|
+
case 'warning':
|
|
11502
|
+
return (React__default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "".concat(size || 25), height: "".concat(size || 25), className: "svg-icon", style: {
|
|
11503
|
+
verticalAlign: 'middle',
|
|
11504
|
+
fill: fill,
|
|
11505
|
+
overflow: 'hidden',
|
|
11506
|
+
minWidth: '25px',
|
|
11507
|
+
minHeight: '25px',
|
|
11508
|
+
}, viewBox: "0 0 1024 1024", version: "1.1" },
|
|
11509
|
+
React__default.createElement("path", { d: "M42.666667 896h938.666666L512 85.333333 42.666667 896z m512-128h-85.333334v-85.333333h85.333334v85.333333z m0-170.666667h-85.333334v-170.666666h85.333334v170.666666z" })));
|
|
11510
|
+
default:
|
|
11511
|
+
return null;
|
|
11512
|
+
}
|
|
11513
|
+
};
|
|
11514
|
+
|
|
11545
11515
|
var Calendar = React__default.forwardRef(function (_a, ref) {
|
|
11546
|
-
var _b
|
|
11547
|
-
var selectedPath = _a.selectedPath, calendarRange = _a.calendarRange, setCalendarRange = _a.setCalendarRange, language = _a.language, disableCalendarDates = _a.disableCalendarDates, requestDates = _a.requestDates, disabledDates = _a.disabledDates,
|
|
11516
|
+
var _b;
|
|
11517
|
+
var selectedPath = _a.selectedPath, calendarRange = _a.calendarRange, setCalendarRange = _a.setCalendarRange, language = _a.language, disableCalendarDates = _a.disableCalendarDates, requestDates = _a.requestDates, disabledDates = _a.disabledDates, updateCalendarMonthNavigation = _a.updateCalendarMonthNavigation, setUpdateCalendarMonthNavigation = _a.setUpdateCalendarMonthNavigation, updateCalendarDefaultMonth = _a.updateCalendarDefaultMonth, loadingData = _a.loadingData, showFeedback = _a.showFeedback, palette = _a.palette, setCalendarHasError = _a.setCalendarHasError, setUpdatedForSubmit = _a.setUpdatedForSubmit, rangeContext = _a.rangeContext, calendarHasError = _a.calendarHasError;
|
|
11548
11518
|
// Translations
|
|
11549
11519
|
var t = useTranslation('common').t;
|
|
11550
11520
|
var isTablet = reactResponsiveExports.useMediaQuery({ maxWidth: 960 });
|
|
@@ -11552,12 +11522,12 @@
|
|
|
11552
11522
|
var selectedStartDate = calendarRange === null || calendarRange === void 0 ? void 0 : calendarRange.from;
|
|
11553
11523
|
var rangeContextStartDate = rangeContext === null || rangeContext === void 0 ? void 0 : rangeContext.from;
|
|
11554
11524
|
// Handle initial disable dates including overlapping availableDates.lastCheckOut and disabledDates.start
|
|
11555
|
-
var
|
|
11525
|
+
var _c = useUpdateDisabledDates({
|
|
11556
11526
|
disableCalendarDates: disableCalendarDates,
|
|
11557
11527
|
calendarRange: calendarRange,
|
|
11558
11528
|
updateCalendarMonthNavigation: updateCalendarMonthNavigation,
|
|
11559
11529
|
updateCalendarDefaultMonth: updateCalendarDefaultMonth,
|
|
11560
|
-
}), newDisableCalendarDates =
|
|
11530
|
+
}), newDisableCalendarDates = _c.newDisableCalendarDates, overlappingDate = _c.overlappingDate, lastPossibleCheckout = _c.lastPossibleCheckout;
|
|
11561
11531
|
// Handle disable dates by page
|
|
11562
11532
|
var disabledDatesByPage$1 = disabledDatesByPage({
|
|
11563
11533
|
today: today,
|
|
@@ -11579,7 +11549,6 @@
|
|
|
11579
11549
|
range: range,
|
|
11580
11550
|
newDisableCalendarDates: newDisableCalendarDates,
|
|
11581
11551
|
setCalendarRange: setCalendarRange,
|
|
11582
|
-
setDisabledDates: setDisabledDates,
|
|
11583
11552
|
calendarRange: calendarRange,
|
|
11584
11553
|
overlappingDate: overlappingDate,
|
|
11585
11554
|
setCalendarHasError: setCalendarHasError,
|
|
@@ -11588,11 +11557,11 @@
|
|
|
11588
11557
|
setUpdatedForSubmit && setUpdatedForSubmit(true);
|
|
11589
11558
|
};
|
|
11590
11559
|
// Handle disabled dates for range context
|
|
11591
|
-
var
|
|
11560
|
+
var _d = handleRangeContextDisabledDates({
|
|
11592
11561
|
rangeContext: rangeContext,
|
|
11593
11562
|
availableDates: newDisableCalendarDates === null || newDisableCalendarDates === void 0 ? void 0 : newDisableCalendarDates.availableDates,
|
|
11594
11563
|
calendarRange: calendarRange,
|
|
11595
|
-
}), findFirstPossibleRangeContextCheckIn =
|
|
11564
|
+
}), findFirstPossibleRangeContextCheckIn = _d.findFirstPossibleRangeContextCheckIn, findLastPossibleRangeContextCheckOut = _d.findLastPossibleRangeContextCheckOut, firstPossibleRangeContextCheckIn = _d.firstPossibleRangeContextCheckIn, lastPossibleRangeContextCheckOut = _d.lastPossibleRangeContextCheckOut, currentSelectionAvailability = _d.currentSelectionAvailability;
|
|
11596
11565
|
// Handle check for continuous selection in the range context
|
|
11597
11566
|
checkForContinuousSelection({
|
|
11598
11567
|
setCalendarHasError: setCalendarHasError,
|
|
@@ -11601,6 +11570,35 @@
|
|
|
11601
11570
|
calendarHasError: calendarHasError,
|
|
11602
11571
|
disabledDates: newDisableCalendarDates === null || newDisableCalendarDates === void 0 ? void 0 : newDisableCalendarDates.disabledDates,
|
|
11603
11572
|
});
|
|
11573
|
+
var disabledInsideSelectableRange = function () {
|
|
11574
|
+
if (
|
|
11575
|
+
// Range end already selected
|
|
11576
|
+
(calendarRange === null || calendarRange === void 0 ? void 0 : calendarRange.to) ||
|
|
11577
|
+
// No current check-in availability
|
|
11578
|
+
!currentSelectionAvailability ||
|
|
11579
|
+
// No gap between check-in and first possible check-out, nothing to disable
|
|
11580
|
+
addDays(currentSelectionAvailability.checkIn, 1) >=
|
|
11581
|
+
currentSelectionAvailability.firstCheckOut) {
|
|
11582
|
+
return [];
|
|
11583
|
+
}
|
|
11584
|
+
// Disable dates between current check-in and first possible check-out
|
|
11585
|
+
return [
|
|
11586
|
+
{
|
|
11587
|
+
from: addDays(currentSelectionAvailability.checkIn, 1),
|
|
11588
|
+
to: addDays(currentSelectionAvailability.firstCheckOut, -1),
|
|
11589
|
+
},
|
|
11590
|
+
];
|
|
11591
|
+
};
|
|
11592
|
+
var base = disabledDatesByPage$1.length
|
|
11593
|
+
? disabledDatesByPage$1
|
|
11594
|
+
: (disabledDates === null || disabledDates === void 0 ? void 0 : disabledDates.length)
|
|
11595
|
+
? disabledDates
|
|
11596
|
+
: (newDisableCalendarDates === null || newDisableCalendarDates === void 0 ? void 0 : newDisableCalendarDates.disabledDates) || [];
|
|
11597
|
+
var disabled = disabledDatesByPage$1.length
|
|
11598
|
+
? base
|
|
11599
|
+
: __spreadArray$1(__spreadArray$1(__spreadArray$1(__spreadArray$1([
|
|
11600
|
+
lastPossibleCheckout
|
|
11601
|
+
], __read(base), false), __read(firstPossibleRangeContextCheckIn), false), __read(lastPossibleRangeContextCheckOut), false), __read(disabledInsideSelectableRange()), false);
|
|
11604
11602
|
return (React__default.createElement("div", { className: "will-filter-bar-calendar", ref: ref },
|
|
11605
11603
|
React__default.createElement("div", { className: "will-calendar-filter-container" },
|
|
11606
11604
|
React__default.createElement(DayPicker, { key: updateCalendarDefaultMonth, id: "will-calendar", mode: "range", locale: language === 'en' ? enUS : fi, numberOfMonths: !isTablet ? 2 : 1, weekStartsOn: 1, selected: calendarRange, onSelect: function (range) { return handleOnSelect(range); }, captionLayout: "dropdown-buttons", defaultMonth: (calendarRange === null || calendarRange === void 0 ? void 0 : calendarRange.from) ||
|
|
@@ -11608,19 +11606,9 @@
|
|
|
11608
11606
|
rangeContextStartDate ||
|
|
11609
11607
|
(((_b = newDisableCalendarDates === null || newDisableCalendarDates === void 0 ? void 0 : newDisableCalendarDates.disabledDates) === null || _b === void 0 ? void 0 : _b.length)
|
|
11610
11608
|
? newDisableCalendarDates.disabledDates[0].from
|
|
11611
|
-
: today), disabled:
|
|
11612
|
-
?
|
|
11613
|
-
|
|
11614
|
-
? __spreadArray$1(__spreadArray$1(__spreadArray$1([
|
|
11615
|
-
lastPossibleCheckout && lastPossibleCheckout
|
|
11616
|
-
], __read(disabledDates), false), __read(firstPossibleRangeContextCheckIn), false), __read(lastPossibleRangeContextCheckOut), false) : ((_c = newDisableCalendarDates === null || newDisableCalendarDates === void 0 ? void 0 : newDisableCalendarDates.disabledDates) === null || _c === void 0 ? void 0 : _c.length)
|
|
11617
|
-
? __spreadArray$1(__spreadArray$1(__spreadArray$1([
|
|
11618
|
-
lastPossibleCheckout && lastPossibleCheckout
|
|
11619
|
-
], __read(newDisableCalendarDates.disabledDates), false), __read(firstPossibleRangeContextCheckIn), false), __read(lastPossibleRangeContextCheckOut), false) : [], fromMonth: today, onMonthChange: function (val) {
|
|
11620
|
-
requestDates && setUpdateCalendarMonthNavigation
|
|
11621
|
-
? (requestDates(val),
|
|
11622
|
-
setUpdateCalendarMonthNavigation(function (prev) { return !prev; }))
|
|
11623
|
-
: null;
|
|
11609
|
+
: today), disabled: disabled, fromMonth: today, onMonthChange: function (val) {
|
|
11610
|
+
requestDates === null || requestDates === void 0 ? void 0 : requestDates(val);
|
|
11611
|
+
setUpdateCalendarMonthNavigation === null || setUpdateCalendarMonthNavigation === void 0 ? void 0 : setUpdateCalendarMonthNavigation(function (prev) { return !prev; });
|
|
11624
11612
|
}, classNames: {
|
|
11625
11613
|
day_range_start: (calendarRange === null || calendarRange === void 0 ? void 0 : calendarRange.from) ? 'rdp-day_range_start' : '',
|
|
11626
11614
|
day_range_end: (calendarRange === null || calendarRange === void 0 ? void 0 : calendarRange.to) ? 'rdp-day_range_end' : '',
|
|
@@ -11638,18 +11626,13 @@
|
|
|
11638
11626
|
}, modifiers:
|
|
11639
11627
|
// This function handles conditions for applying the modifiersClassNames
|
|
11640
11628
|
handleCalendarModifiers({
|
|
11641
|
-
newDisableCalendarDates: newDisableCalendarDates,
|
|
11642
11629
|
calendarRange: calendarRange,
|
|
11643
|
-
|
|
11644
|
-
disabledDates: disabledDates,
|
|
11630
|
+
disabledDates: disabled,
|
|
11645
11631
|
overlappingDate: overlappingDate,
|
|
11646
11632
|
rangeContext: rangeContext,
|
|
11647
|
-
lastPossibleCheckout: lastPossibleCheckout,
|
|
11648
11633
|
findFirstPossibleRangeContextCheckIn: findFirstPossibleRangeContextCheckIn,
|
|
11649
11634
|
findLastPossibleRangeContextCheckOut: findLastPossibleRangeContextCheckOut,
|
|
11650
|
-
|
|
11651
|
-
lastPossibleRangeContextCheckOut: lastPossibleRangeContextCheckOut,
|
|
11652
|
-
currentSelectionLastCheckoutDate: currentSelectionLastCheckoutDate,
|
|
11635
|
+
currentSelectionLastCheckoutDate: currentSelectionAvailability,
|
|
11653
11636
|
}) }),
|
|
11654
11637
|
React__default.createElement("div", { className: 'will-calendar-tooltip' },
|
|
11655
11638
|
React__default.createElement("div", null, t('noCheckIn'))),
|
|
@@ -11901,17 +11884,17 @@
|
|
|
11901
11884
|
return (React__default.createElement("div", { className: "will-guests-filter-inner", style: { order: "".concat(sortOrder) } },
|
|
11902
11885
|
React__default.createElement("p", { className: "will-guests-filter-label" }, label),
|
|
11903
11886
|
React__default.createElement("div", { className: "will-guests-filter-counter" },
|
|
11904
|
-
React__default.createElement("button", { className: "will-guests-filter-counter-button", onClick: handleDecrement, disabled: (minVal && count <= minVal) || !count
|
|
11887
|
+
React__default.createElement("button", { className: "will-guests-filter-counter-button", onClick: handleDecrement, disabled: (minVal && count <= minVal) || !count, style: {
|
|
11905
11888
|
cursor: (minVal && count <= minVal) || !count ? 'initial' : 'pointer',
|
|
11906
11889
|
paddingBottom: '4px',
|
|
11907
11890
|
opacity: (minVal && count <= minVal) || !count ? 0.4 : 1,
|
|
11908
11891
|
} },
|
|
11909
11892
|
React__default.createElement("svg", { width: "10", height: "10", viewBox: "0 0 15 15", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
|
|
11910
|
-
React__default.createElement("path", { d: "M4 10H16", stroke: "currentColor",
|
|
11893
|
+
React__default.createElement("path", { d: "M4 10H16", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round" }))),
|
|
11911
11894
|
React__default.createElement("span", { className: "will-guests-filter-count" }, count),
|
|
11912
11895
|
React__default.createElement("button", { className: "will-guests-filter-counter-button", onClick: handleIncrement },
|
|
11913
11896
|
React__default.createElement("svg", { width: "15", height: "15", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
|
|
11914
|
-
React__default.createElement("path", { d: "M10 4V16M4 10H16", stroke: "currentColor",
|
|
11897
|
+
React__default.createElement("path", { d: "M10 4V16M4 10H16", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round" }))))));
|
|
11915
11898
|
}
|
|
11916
11899
|
|
|
11917
11900
|
var css_248z$4 = ".will-filter-bar-guests {\n text-align: initial;\n}\n\n.will-guests-filter-title {\n font-size: 22px;\n margin: 10px 0;\n}\n\n.will-guests-filter-subtitle {\n font-size: 15px;\n font-weight: 500;\n color:var(--will-text)\n}\n\n\n.will-guests-filter-container {\n display: flex;\n flex-direction: column;\n min-width: 400px;\n}\n\n\n@media (max-width: 960px) {\n .will-guests-filter-title {\n font-size: 18px;\n }\n\n .will-guests-filter-container {\n margin-top: 15px;\n min-width: 100%;\n }\n}";
|
|
@@ -11922,7 +11905,7 @@
|
|
|
11922
11905
|
var t = useTranslation('filterBar').t;
|
|
11923
11906
|
return (React__default.createElement("div", { className: "will-filter-bar-guests", ref: ref },
|
|
11924
11907
|
React__default.createElement("h3", { className: "will-guests-filter-title" }, t('guests.title')),
|
|
11925
|
-
React__default.createElement("div", { className: "will-guests-filter-container" }, ageCategories === null || ageCategories === void 0 ? void 0 : ageCategories.map(function (category) { return (React__default.createElement(GuestCount, { key: category.id, id:
|
|
11908
|
+
React__default.createElement("div", { className: "will-guests-filter-container" }, ageCategories === null || ageCategories === void 0 ? void 0 : ageCategories.map(function (category) { return (React__default.createElement(GuestCount, { key: category.id, id: category.id, label: category.name, minVal: category.minVal, sortOrder: category.sortOrder, updateGuestsCount: updateGuestsCount, count: ageCategoryCounts["guests-".concat(category.id)] || 0 })); }))));
|
|
11926
11909
|
});
|
|
11927
11910
|
|
|
11928
11911
|
var css_248z$3 = ".will-filter-bar-divider {\n width: 1px;\n margin: 0 10px;\n background-color: var(--will-charcoal-blue);\n}\n\n@media (max-width: 960px) {\n .will-filter-bar-divider {\n width: auto;\n margin: 0 10px;\n height: 1px;\n background-color: var(--will-charcoal-blue);\n }\n}";
|
|
@@ -12129,7 +12112,6 @@
|
|
|
12129
12112
|
handleSubmit: handleSubmit,
|
|
12130
12113
|
handleClearDates: handleClearDates,
|
|
12131
12114
|
setCalendarRange: setCalendarRange,
|
|
12132
|
-
setDisabledDates: setDisabledDates,
|
|
12133
12115
|
setUpdateCalendarMonthNavigation: setUpdateCalendarMonthNavigation,
|
|
12134
12116
|
calendarRange: calendarRange,
|
|
12135
12117
|
disabledDates: disabledDates,
|
|
@@ -12198,7 +12180,7 @@
|
|
|
12198
12180
|
toggleCalendar: toggleCalendar,
|
|
12199
12181
|
outerRangeContext: outerRangeContext,
|
|
12200
12182
|
outerDisableCalendarDates: outerDisableCalendarDates,
|
|
12201
|
-
}), setCalendarRange = _b.setCalendarRange, handleClearDates = _b.handleClearDates, calendarRange = _b.calendarRange, disabledDates = _b.disabledDates,
|
|
12183
|
+
}), setCalendarRange = _b.setCalendarRange, handleClearDates = _b.handleClearDates, calendarRange = _b.calendarRange, disabledDates = _b.disabledDates, updateCalendarMonthNavigation = _b.updateCalendarMonthNavigation, updateCalendarDefaultMonth = _b.updateCalendarDefaultMonth, setUpdateCalendarMonthNavigation = _b.setUpdateCalendarMonthNavigation, calendarHasError = _b.calendarHasError, setCalendarHasError = _b.setCalendarHasError, setUpdatedForSubmit = _b.setUpdatedForSubmit, rangeContext = _b.rangeContext, disableCalendarDates = _b.disableCalendarDates;
|
|
12202
12184
|
// Display component after fully loaded
|
|
12203
12185
|
useAwaitRender();
|
|
12204
12186
|
// Handle close filter section
|
|
@@ -12210,7 +12192,7 @@
|
|
|
12210
12192
|
React__default.createElement("h2", null, t('filterBar:calendar.title')),
|
|
12211
12193
|
React__default.createElement(CloseButton, { handleClose: function () { return setToggleCalendar(false); } })),
|
|
12212
12194
|
React__default.createElement("div", { className: "will-calendar-main" },
|
|
12213
|
-
React__default.createElement(Calendar, { calendarRange: calendarRange, setCalendarRange: setCalendarRange, calendarOffset: calendarOffset, selectedPath: '/rooms', language: language, disableCalendarDates: disableCalendarDates, requestDates: requestDates, disabledDates: disabledDates,
|
|
12195
|
+
React__default.createElement(Calendar, { calendarRange: calendarRange, setCalendarRange: setCalendarRange, calendarOffset: calendarOffset, selectedPath: '/rooms', language: language, disableCalendarDates: disableCalendarDates, requestDates: requestDates, disabledDates: disabledDates, updateCalendarMonthNavigation: updateCalendarMonthNavigation, setUpdateCalendarMonthNavigation: setUpdateCalendarMonthNavigation, updateCalendarDefaultMonth: updateCalendarDefaultMonth, loadingData: loadingData, showFeedback: showFeedback, noActiveSelection: noActiveSelection, palette: palette, setCalendarHasError: setCalendarHasError, setUpdatedForSubmit: setUpdatedForSubmit, rangeContext: rangeContext, calendarHasError: calendarHasError })),
|
|
12214
12196
|
React__default.createElement("div", { className: "will-calendar-footer" },
|
|
12215
12197
|
React__default.createElement(Footer, { calendarHasError: calendarHasError, calendarRange: calendarRange, handleClearDates: handleClearDates, language: language, palette: palette }))))));
|
|
12216
12198
|
}
|