@stenajs-webui/calendar 17.4.1 → 17.7.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.
Files changed (104) hide show
  1. package/CHANGELOG.md +26 -0
  2. package/dist/components/calendar/Calendar.d.ts +3 -3
  3. package/dist/components/calendar/CalendarMonth.d.ts +16 -16
  4. package/dist/components/calendar/CalendarMonthWithMonthTextHeader.d.ts +6 -6
  5. package/dist/components/calendar/CalendarTheme.d.ts +57 -57
  6. package/dist/components/calendar/CalendarWeek.d.ts +18 -18
  7. package/dist/components/calendar/DisabledDayWrapper.d.ts +7 -7
  8. package/dist/components/calendar/renderers/CalendarDay.d.ts +3 -3
  9. package/dist/components/calendar/renderers/WeekDayCell.d.ts +10 -10
  10. package/dist/components/calendar/renderers/WeekNumberCell.d.ts +13 -13
  11. package/dist/components/calendar-types/date-range-calendar/DateRangeCalendar.d.ts +11 -11
  12. package/dist/components/calendar-types/date-range-calendar/hooks/UseDateRangeCalendarState.d.ts +10 -10
  13. package/dist/components/calendar-types/date-range-calendar/hooks/UseDateRangeSelection.d.ts +3 -3
  14. package/dist/components/calendar-types/date-range-exclusion-calendar/DateRangeExclusionCalendar.d.ts +7 -7
  15. package/dist/components/calendar-types/date-range-exclusion-calendar/UseDateRangeExclusionSelection.d.ts +3 -3
  16. package/dist/components/calendar-types/multi-date-calendar/MultiDateCalendar.d.ts +8 -8
  17. package/dist/components/calendar-types/multi-date-calendar/UseMultiDateSelection.d.ts +3 -3
  18. package/dist/components/calendar-types/single-date-calendar/SingleDateCalendar.d.ts +7 -7
  19. package/dist/components/calendar-types/single-date-calendar/UseSingleDateSelection.d.ts +3 -3
  20. package/dist/components/calendar-types/single-week-calendar/SingleWeekCalendar.d.ts +8 -8
  21. package/dist/components/calendar-types/single-week-calendar/UseSingleWeekSelection.d.ts +3 -3
  22. package/dist/components/input-types/date-input/DateInput.d.ts +52 -52
  23. package/dist/components/input-types/date-input/UseDateInput.d.ts +6 -6
  24. package/dist/components/input-types/date-range-dual-text-input/DateRangeDualTextInput.d.ts +15 -15
  25. package/dist/components/input-types/date-range-dual-text-input/hooks/UseDateRangeEffects.d.ts +2 -2
  26. package/dist/components/input-types/date-range-dual-text-input/hooks/UseDateRangeHandlers.d.ts +11 -11
  27. package/dist/components/input-types/date-range-dual-text-input/hooks/UseInputStates.d.ts +17 -17
  28. package/dist/components/input-types/date-range-dual-text-input/hooks/UseUserInputHandlers.d.ts +13 -13
  29. package/dist/components/input-types/date-range-input/DateRangeInput.d.ts +51 -51
  30. package/dist/components/input-types/date-range-input/hooks/UseDateRangeInput.d.ts +16 -16
  31. package/dist/components/input-types/date-text-input/DateTextInput.d.ts +28 -28
  32. package/dist/components/input-types/date-time-input/DateTimeInput.d.ts +12 -12
  33. package/dist/components/input-types/date-time-input/hooks/UseDateRangeEffects.d.ts +2 -2
  34. package/dist/components/input-types/date-time-input/hooks/UseDateRangeHandlers.d.ts +11 -11
  35. package/dist/components/input-types/date-time-input/hooks/UseInputStates.d.ts +22 -22
  36. package/dist/components/input-types/date-time-input/hooks/UseUserInputHandlers.d.ts +12 -12
  37. package/dist/components/input-types/time-text-input/TimeTextInput.d.ts +15 -15
  38. package/dist/config/DefaultMaxDate.d.ts +1 -1
  39. package/dist/config/DefaultPopoverPlacement.d.ts +2 -2
  40. package/dist/features/calendar-with-month-year-pickers/CalendarPanelType.d.ts +1 -1
  41. package/dist/features/calendar-with-month-year-pickers/CalendarWithMonthYearPickers.d.ts +13 -13
  42. package/dist/features/date-range/hooks/UseDateRangeOnClickDayHandler.d.ts +4 -4
  43. package/dist/features/dual-text-input/DualTextInput.d.ts +44 -44
  44. package/dist/features/internal-panel-state/UseCalendarPopoverUpdater.d.ts +4 -4
  45. package/dist/features/internal-panel-state/UseInternalPanelState.d.ts +9 -9
  46. package/dist/features/month-picker/MonthPicker.d.ts +6 -6
  47. package/dist/features/month-picker/MonthPickerCell.d.ts +8 -8
  48. package/dist/features/month-switcher/CalendarWithMonthSwitcher.d.ts +15 -15
  49. package/dist/features/month-switcher/MonthSwitcherBelow.d.ts +12 -12
  50. package/dist/features/month-switcher/hooks/UseSelectedMonthStepperLogic.d.ts +6 -6
  51. package/dist/features/preset-picker/CalendarPreset.d.ts +14 -14
  52. package/dist/features/preset-picker/PresetFactory.d.ts +2 -2
  53. package/dist/features/preset-picker/PresetPicker.d.ts +6 -6
  54. package/dist/features/time-picker/TimePicker.d.ts +5 -5
  55. package/dist/features/time-picker/TimePickerCell.d.ts +10 -10
  56. package/dist/features/time-picker/TimePickerColumn.d.ts +10 -10
  57. package/dist/features/today-state/UseHighlightToday.d.ts +2 -2
  58. package/dist/features/year-picker/YearPicker.d.ts +6 -6
  59. package/dist/features/year-picker/YearPickerCell.d.ts +7 -7
  60. package/dist/index.d.ts +32 -32
  61. package/dist/index.es.js +2866 -2065
  62. package/dist/index.es.js.map +1 -1
  63. package/dist/index.js +1 -2155
  64. package/dist/index.js.map +1 -1
  65. package/dist/types/CalendarTypes.d.ts +133 -133
  66. package/dist/types/DateRange.d.ts +16 -16
  67. package/dist/types/InternalPanelAndFocusStateProps.d.ts +3 -3
  68. package/dist/util/calendar/CalendarDataFactory.d.ts +64 -64
  69. package/dist/util/calendar/StateHelper.d.ts +3 -3
  70. package/dist/util/calendar/StateModifier.d.ts +11 -11
  71. package/dist/util/date/DateFormats.d.ts +11 -11
  72. package/dist/util/date/DateListTools.d.ts +3 -3
  73. package/dist/util/date/DateMinMaxValidator.d.ts +1 -1
  74. package/dist/util/date-range/DateRangeTransformer.d.ts +3 -3
  75. package/dist/util/date-range/DateRangeValidator.d.ts +4 -4
  76. package/dist/util/time/OverlappingTimesValidator.d.ts +11 -11
  77. package/dist/util/time/TimeStringFormatValidator.d.ts +8 -8
  78. package/dist/util/time/TimeTransformer.d.ts +8 -8
  79. package/package.json +10 -11
  80. package/dist/components/calendar-types/date-range-calendar/DateRangeCalendar.stories.d.ts +0 -20
  81. package/dist/components/calendar-types/date-range-exclusion-calendar/DateRangeExclusionCalendar.stories.d.ts +0 -17
  82. package/dist/components/calendar-types/multi-date-calendar/MultiDateCalendar.stories.d.ts +0 -15
  83. package/dist/components/calendar-types/multi-date-calendar/__tests__/UseMultiDateSelection.test.d.ts +0 -1
  84. package/dist/components/calendar-types/single-date-calendar/SingleDateCalendar.stories.d.ts +0 -17
  85. package/dist/components/calendar-types/single-week-calendar/SingleWeekCalendar.stories.d.ts +0 -8
  86. package/dist/components/input-types/date-input/DateInput.stories.d.ts +0 -19
  87. package/dist/components/input-types/date-range-dual-text-input/DateRangeDualTextInput.stories.d.ts +0 -18
  88. package/dist/components/input-types/date-range-input/DateRangeInput.stories.d.ts +0 -17
  89. package/dist/components/input-types/date-text-input/DateTextInput.stories.d.ts +0 -19
  90. package/dist/components/input-types/date-time-input/DateTimeInput.stories.d.ts +0 -14
  91. package/dist/components/input-types/time-text-input/TimeTextInput.stories.d.ts +0 -15
  92. package/dist/features/month-picker/MonthPicker.stories.d.ts +0 -7
  93. package/dist/features/preset-picker/PresetPicker.stories.d.ts +0 -7
  94. package/dist/features/time-picker/TimePicker.stories.d.ts +0 -7
  95. package/dist/features/year-picker/YearPicker.stories.d.ts +0 -12
  96. package/dist/util/calendar/__tests__/CalendarDataFactory.test.d.ts +0 -1
  97. package/dist/util/calendar/__tests__/StateHelper.test.d.ts +0 -1
  98. package/dist/util/calendar/__tests__/StateModifier.test.d.ts +0 -1
  99. package/dist/util/date/__tests__/DateListTools.test.d.ts +0 -1
  100. package/dist/util/date/__tests__/DateMinMaxValidator.test.d.ts +0 -1
  101. package/dist/util/date-range/__tests__/DateRangeValidator.test.d.ts +0 -1
  102. package/dist/util/time/__tests__/OverlappingTimesValidator.test.d.ts +0 -1
  103. package/dist/util/time/__tests__/TimeStringFormatValidator.test.d.ts +0 -1
  104. package/dist/util/time/__tests__/TimeTransformer.test.d.ts +0 -1
package/dist/index.js CHANGED
@@ -1,2156 +1,2 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var React = require('react');
6
- var elements = require('@stenajs-webui/elements');
7
- var core = require('@stenajs-webui/core');
8
- var dateFns = require('date-fns');
9
- var lodash = require('lodash');
10
- var styled = require('@emotion/styled');
11
- var faAngleLeft = require('@fortawesome/free-solid-svg-icons/faAngleLeft');
12
- var faAngleRight = require('@fortawesome/free-solid-svg-icons/faAngleRight');
13
- var faAngleDoubleLeft = require('@fortawesome/free-solid-svg-icons/faAngleDoubleLeft');
14
- var faAngleDoubleRight = require('@fortawesome/free-solid-svg-icons/faAngleDoubleRight');
15
- var faCaretLeft = require('@fortawesome/free-solid-svg-icons/faCaretLeft');
16
- var faCaretRight = require('@fortawesome/free-solid-svg-icons/faCaretRight');
17
- var faCalendarAlt = require('@fortawesome/free-regular-svg-icons/faCalendarAlt');
18
- var forms = require('@stenajs-webui/forms');
19
- var tooltip = require('@stenajs-webui/tooltip');
20
- var faCalendarAlt$1 = require('@fortawesome/free-solid-svg-icons/faCalendarAlt');
21
- var theme = require('@stenajs-webui/theme');
22
- var faLongArrowAltRight = require('@fortawesome/free-solid-svg-icons/faLongArrowAltRight');
23
- var faClock = require('@fortawesome/free-solid-svg-icons/faClock');
24
- var faClock$1 = require('@fortawesome/free-regular-svg-icons/faClock');
25
- var faAngleDown = require('@fortawesome/free-solid-svg-icons/faAngleDown');
26
-
27
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
28
-
29
- function _interopNamespace(e) {
30
- if (e && e.__esModule) return e;
31
- var n = Object.create(null);
32
- if (e) {
33
- Object.keys(e).forEach(function (k) {
34
- if (k !== 'default') {
35
- var d = Object.getOwnPropertyDescriptor(e, k);
36
- Object.defineProperty(n, k, d.get ? d : {
37
- enumerable: true,
38
- get: function () { return e[k]; }
39
- });
40
- }
41
- });
42
- }
43
- n["default"] = e;
44
- return Object.freeze(n);
45
- }
46
-
47
- var React__namespace = /*#__PURE__*/_interopNamespace(React);
48
- var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
49
-
50
- /*! *****************************************************************************
51
- Copyright (c) Microsoft Corporation.
52
-
53
- Permission to use, copy, modify, and/or distribute this software for any
54
- purpose with or without fee is hereby granted.
55
-
56
- THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
57
- REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
58
- AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
59
- INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
60
- LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
61
- OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
62
- PERFORMANCE OF THIS SOFTWARE.
63
- ***************************************************************************** */
64
-
65
- var __assign = function() {
66
- __assign = Object.assign || function __assign(t) {
67
- for (var s, i = 1, n = arguments.length; i < n; i++) {
68
- s = arguments[i];
69
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
70
- }
71
- return t;
72
- };
73
- return __assign.apply(this, arguments);
74
- };
75
-
76
- function __rest(s, e) {
77
- var t = {};
78
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
79
- t[p] = s[p];
80
- if (s != null && typeof Object.getOwnPropertySymbols === "function")
81
- for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
82
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
83
- t[p[i]] = s[p[i]];
84
- }
85
- return t;
86
- }
87
-
88
- function __spreadArray(to, from, pack) {
89
- if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
90
- if (ar || !(i in from)) {
91
- if (!ar) ar = Array.prototype.slice.call(from, 0, i);
92
- ar[i] = from[i];
93
- }
94
- }
95
- return to.concat(ar || Array.prototype.slice.call(from));
96
- }
97
-
98
- var DateFormats = {
99
- yearAndMonth: "yyyy-MM",
100
- fullDate: "yyyy-MM-dd",
101
- fullMonthName: "LLLL",
102
- fullDateAndTime: "yyyy-MM-dd HH:mm",
103
- fullDateAndTimeSystem: "yyyy-MM-ddTHH:MM",
104
- weekDayName: "EEEE",
105
- weekDayNameShort: "EEE",
106
- dateAndMonth: "d MMM",
107
- monthAndDate: "MMM do", // Jan 2nd
108
- };
109
-
110
- var buildDayStateForDateRange = function (statePerMonth, start, end) {
111
- if (statePerMonth === void 0) { statePerMonth = {}; }
112
- if (start && end && dateFns.isAfter(end, start)) {
113
- return dateFns.eachDayOfInterval({ start: start, end: end }).reduce(function (result, date) {
114
- var isFirstInRange = dateFns.isSameDay(date, start);
115
- var isLastInRange = dateFns.isSameDay(date, end);
116
- var highlights = isFirstInRange
117
- ? ["selected", "selectedStart", "range"]
118
- : isLastInRange
119
- ? ["selected", "selectedEnd", "range"]
120
- : ["range"];
121
- return addDayStateHighlights(result, date, highlights);
122
- }, statePerMonth);
123
- }
124
- var state = statePerMonth;
125
- if (start) {
126
- state = addDayStateHighlights(state, start, ["selected", "singleSelected"]);
127
- }
128
- if (end) {
129
- state = addDayStateHighlights(state, end, ["selected", "singleSelected"]);
130
- }
131
- return state;
132
- };
133
- var buildDayStateForSingleMonth = function (statePerMonth, start, end, dateInFocus) {
134
- if (statePerMonth === void 0) { statePerMonth = {}; }
135
- return buildDayStateForRange(statePerMonth, start, end, dateFns.startOfMonth(dateInFocus), dateFns.endOfMonth(dateInFocus));
136
- };
137
- var buildDayStateForRange = function (statePerMonth, start, end, startLimit, endLimit) {
138
- if (statePerMonth === void 0) { statePerMonth = {}; }
139
- if (start && end) {
140
- return buildDayStateForDateRange(statePerMonth, dateFns.max([start, dateFns.subDays(startLimit, 1)]), dateFns.min([end, dateFns.addDays(endLimit, 1)]));
141
- }
142
- else {
143
- return buildDayStateForDateRange(statePerMonth, start, end);
144
- }
145
- };
146
- var setDayStateValue = function (state, date, values) {
147
- var _a, _b, _c;
148
- var monthString = dateFns.format(date, DateFormats.yearAndMonth);
149
- var weekNumber = dateFns.getISOWeek(date);
150
- var dayInMonth = dateFns.getDate(date);
151
- return __assign(__assign({}, state), (_a = {}, _a[monthString] = __assign(__assign({}, (state && state[monthString])), (_b = {}, _b[weekNumber] = __assign(__assign({}, (state && state[monthString] && state[monthString][weekNumber])), (_c = {}, _c[dayInMonth] = __assign(__assign({}, (state &&
152
- state[monthString] &&
153
- state[monthString][weekNumber] &&
154
- state[monthString][weekNumber][dayInMonth])), values), _c)), _b)), _a));
155
- };
156
- var setDayStateValueFunction = function (state, date, setter) {
157
- var _a, _b, _c;
158
- var monthString = dateFns.format(date, DateFormats.yearAndMonth);
159
- var weekNumber = dateFns.getISOWeek(date);
160
- var dayInMonth = dateFns.getDate(date);
161
- return __assign(__assign({}, state), (_a = {}, _a[monthString] = __assign(__assign({}, (state && state[monthString])), (_b = {}, _b[weekNumber] = __assign(__assign({}, (state && state[monthString] && state[monthString][weekNumber])), (_c = {}, _c[dayInMonth] = __assign(__assign({}, (state &&
162
- state[monthString] &&
163
- state[monthString][weekNumber] &&
164
- state[monthString][weekNumber][dayInMonth])), setter(state &&
165
- state[monthString] &&
166
- state[monthString][weekNumber] &&
167
- state[monthString][weekNumber][dayInMonth])), _c)), _b)), _a));
168
- };
169
- var addDayStateHighlights = function (calendarState, date, highlights) {
170
- var _a, _b, _c;
171
- var month = date.getMonth() + 1;
172
- var monthString = "".concat(date.getFullYear(), "-").concat(month < 10 ? "0" : "").concat(month);
173
- var weekNumber = dateFns.getISOWeek(date);
174
- var dayInMonth = dateFns.getDate(date);
175
- var dayState = calendarState &&
176
- calendarState[monthString] &&
177
- calendarState[monthString][weekNumber] &&
178
- calendarState[monthString][weekNumber][dayInMonth];
179
- return __assign(__assign({}, calendarState), (_a = {}, _a[monthString] = __assign(__assign({}, (calendarState && calendarState[monthString])), (_b = {}, _b[weekNumber] = __assign(__assign({}, (calendarState &&
180
- calendarState[monthString] &&
181
- calendarState[monthString][weekNumber])), (_c = {}, _c[dayInMonth] = addDayStateHighlightsOnSingleDay(dayState, highlights), _c)), _b)), _a));
182
- };
183
- var addDayStateHighlightsOnSingleDay = function (dayState, highlights) {
184
- var _a;
185
- return __assign(__assign({}, dayState), { highlights: __spreadArray(__spreadArray([], ((_a = dayState === null || dayState === void 0 ? void 0 : dayState.highlights) !== null && _a !== void 0 ? _a : []), true), highlights, true) });
186
- };
187
- var addWeekStateHighlights = function (calendarState, week, highlights) {
188
- var _a, _b;
189
- var date = week.days[0].date;
190
- var month = date.getMonth() + 1;
191
- var monthString = "".concat(date.getFullYear(), "-").concat(month < 10 ? "0" : "").concat(month);
192
- var weekNumber = week.weekNumber;
193
- var state = calendarState;
194
- week.days.forEach(function (day) {
195
- state = addDayStateHighlights(state, day.date, highlights);
196
- });
197
- var weekState = state && state[monthString] ? state[monthString][weekNumber] : undefined;
198
- var newHighlights = weekState && weekState.highlights
199
- ? __spreadArray(__spreadArray([], weekState.highlights, true), highlights, true) : highlights;
200
- var newWeekState = __assign(__assign({}, weekState), { highlights: newHighlights });
201
- return __assign(__assign({}, state), (_a = {}, _a[monthString] = __assign(__assign({}, (calendarState && calendarState[monthString])), (_b = {}, _b[weekNumber] = newWeekState, _b)), _a));
202
- };
203
- var addWeekRangeHighlights = function (calendarState, week) {
204
- var _a;
205
- if (!week.days.length) {
206
- return __assign({}, calendarState);
207
- }
208
- var startDate = week.days[0].date;
209
- var endDate = (_a = lodash.last(week.days)) === null || _a === void 0 ? void 0 : _a.date;
210
- return __assign({}, buildDayStateForDateRange(calendarState, startDate, endDate));
211
- };
212
-
213
- var useHighlightToday = function (enabled, statePerMonth) {
214
- return React.useMemo(function () {
215
- return enabled
216
- ? addDayStateHighlights(statePerMonth, new Date(), ["today"])
217
- : statePerMonth;
218
- }, [enabled, statePerMonth]);
219
- };
220
-
221
- exports.Month = void 0;
222
- (function (Month) {
223
- Month[Month["JANUARY"] = 0] = "JANUARY";
224
- Month[Month["FEBRUARY"] = 1] = "FEBRUARY";
225
- Month[Month["MARCH"] = 2] = "MARCH";
226
- Month[Month["APRIL"] = 3] = "APRIL";
227
- Month[Month["MAY"] = 4] = "MAY";
228
- Month[Month["JUNE"] = 5] = "JUNE";
229
- Month[Month["JULY"] = 6] = "JULY";
230
- Month[Month["AUGUST"] = 7] = "AUGUST";
231
- Month[Month["SEPTEMBER"] = 8] = "SEPTEMBER";
232
- Month[Month["OCTOBER"] = 9] = "OCTOBER";
233
- Month[Month["NOVEMBER"] = 10] = "NOVEMBER";
234
- Month[Month["DECEMBER"] = 11] = "DECEMBER";
235
- })(exports.Month || (exports.Month = {}));
236
- exports.WeekDay = void 0;
237
- (function (WeekDay) {
238
- WeekDay[WeekDay["SUNDAY"] = 0] = "SUNDAY";
239
- WeekDay[WeekDay["MONDAY"] = 1] = "MONDAY";
240
- WeekDay[WeekDay["TUESDAY"] = 2] = "TUESDAY";
241
- WeekDay[WeekDay["WEDNESDAY"] = 3] = "WEDNESDAY";
242
- WeekDay[WeekDay["THURSDAY"] = 4] = "THURSDAY";
243
- WeekDay[WeekDay["FRIDAY"] = 5] = "FRIDAY";
244
- WeekDay[WeekDay["SATURDAY"] = 6] = "SATURDAY";
245
- })(exports.WeekDay || (exports.WeekDay = {}));
246
- var getMonthsInYear = function (year, startMonth, numMonths) {
247
- var months = [];
248
- for (var i = 0; i < numMonths; i++) {
249
- months.push(getMonthInYear(year, startMonth + i));
250
- }
251
- return months;
252
- };
253
- var getMonthInYear = function (year, month) {
254
- var yearToUse = year + Math.floor(month / 12);
255
- var monthToUse = month % 12;
256
- var firstDayOfMonth = new Date(yearToUse, monthToUse, 1);
257
- return {
258
- monthString: dateFns.format(firstDayOfMonth, DateFormats.yearAndMonth),
259
- name: dateFns.format(firstDayOfMonth, DateFormats.fullMonthName),
260
- year: yearToUse,
261
- monthInYear: monthToUse,
262
- weeks: getWeeksForMonth(yearToUse, monthToUse),
263
- };
264
- };
265
- var getWeeksForMonth = function (year, month, forceSixWeeks) {
266
- if (forceSixWeeks === void 0) { forceSixWeeks = true; }
267
- var firstDayOfMonth = new Date(year, month, 1);
268
- var firstDayOfFirstWeek = dateFns.startOfISOWeek(firstDayOfMonth);
269
- var weeks = [];
270
- for (var i = 0; i < 6; i++) {
271
- var week = getWeekForDate(dateFns.addWeeks(firstDayOfFirstWeek, i));
272
- if (i > 0 && week.startMonth !== month && !forceSixWeeks) {
273
- return weeks;
274
- }
275
- weeks.push(week);
276
- }
277
- return weeks;
278
- };
279
- var getWeekForDate = function (firstDayOfWeek) {
280
- var isLastWeekOfMonth = dateFns.getMonth(dateFns.addDays(firstDayOfWeek, 7)) !== dateFns.getMonth(firstDayOfWeek);
281
- return {
282
- weekNumber: dateFns.getISOWeek(firstDayOfWeek),
283
- startMonth: dateFns.getMonth(firstDayOfWeek),
284
- startYear: dateFns.getYear(firstDayOfWeek),
285
- endMonth: dateFns.getMonth(dateFns.addDays(firstDayOfWeek, 6)),
286
- endYear: dateFns.getYear(dateFns.addDays(firstDayOfWeek, 6)),
287
- days: getDaysForWeekForDate(firstDayOfWeek),
288
- isLastWeekOfMonth: isLastWeekOfMonth,
289
- };
290
- };
291
- var createDay = function (date) {
292
- var dayOfWeek = dateFns.getISODay(date);
293
- return {
294
- date: date,
295
- name: dateFns.format(date, "EEE"),
296
- dateString: dateFns.format(dateFns.addHours(date, 12), DateFormats.fullDate),
297
- weekNumber: dateFns.getISOWeek(date),
298
- year: dateFns.getYear(date),
299
- month: dateFns.getMonth(date),
300
- dayOfMonth: dateFns.getDate(date),
301
- dayOfWeek: dayOfWeek,
302
- isFirstDayOfWeek: dayOfWeek === 1,
303
- isLastDayOfWeek: dayOfWeek === 7,
304
- isFirstDayOfMonth: dateFns.isSameDay(dateFns.startOfMonth(date), date),
305
- isLastDayOfMonth: dateFns.isSameDay(dateFns.endOfMonth(date), date),
306
- };
307
- };
308
- var getDaysForWeekForDate = function (firstDayOfWeek) {
309
- return dateFns.eachDayOfInterval({
310
- start: firstDayOfWeek,
311
- end: dateFns.addDays(firstDayOfWeek, 6),
312
- }).map(createDay);
313
- };
314
- var getStartDateOfISOWeek = function (weekNumber, year) {
315
- var simple = new Date(year, 0, 1 + (weekNumber - 1) * 7);
316
- var dayOfWeek = simple.getDay();
317
- var isoWeekStart = simple;
318
- if (dayOfWeek <= 4) {
319
- isoWeekStart.setDate(simple.getDate() - simple.getDay() + 1);
320
- }
321
- else {
322
- isoWeekStart.setDate(simple.getDate() + 8 - simple.getDay());
323
- }
324
- return isoWeekStart;
325
- };
326
- var calculateOverflowingMonth = function (year, month) {
327
- if (month > exports.Month.DECEMBER) {
328
- return { year: year + Math.floor(month / 12), month: month % 12 };
329
- }
330
- if (month < exports.Month.JANUARY) {
331
- return { year: year + Math.floor(month / 12), month: 12 + (month % 12) };
332
- }
333
- return { year: year, month: month };
334
- };
335
-
336
- var dayHasHighlight = function (dayState, defaultHighlights, highlight) {
337
- if (defaultHighlights && defaultHighlights.indexOf(highlight) >= 0) {
338
- return true;
339
- }
340
- if (dayState &&
341
- dayState.highlights &&
342
- dayState.highlights.indexOf(highlight) >= 0) {
343
- return true;
344
- }
345
- return false;
346
- };
347
- var dayHighlightSelect = function (dayState, defaultHighlights, highlightsOrBoolean, returnValues, fallbackValue) {
348
- if (highlightsOrBoolean.length !== returnValues.length) {
349
- throw new Error("Select highlight failed, number of values do not equal number of highlights.");
350
- }
351
- if (highlightsOrBoolean.length === 0) {
352
- return fallbackValue;
353
- }
354
- for (var i = 0; i < highlightsOrBoolean.length; i++) {
355
- if (typeof highlightsOrBoolean[i] === "boolean" && highlightsOrBoolean[i]) {
356
- return returnValues[i];
357
- }
358
- if (typeof highlightsOrBoolean[i] === "string" &&
359
- dayHasHighlight(dayState, defaultHighlights, highlightsOrBoolean[i])) {
360
- return returnValues[i];
361
- }
362
- }
363
- return fallbackValue;
364
- };
365
-
366
- var defaultWrapperStyleProvider = function (_a) {
367
- var selectedBackground = _a.selectedBackground, todayBackground = _a.todayBackground, rangeBackground = _a.rangeBackground, _b = _a.borderColor, borderColor = _b === void 0 ? "transparent" : _b;
368
- return function (defaultHighlights, dayState, day, _, month) {
369
- var style = {};
370
- var backgroundColor = dayHighlightSelect(dayState, defaultHighlights, ["selected", "range", "today", day.month === month.monthInYear], [selectedBackground, rangeBackground, todayBackground, "#fff"], "transparent");
371
- return __assign(__assign({}, style), { backgroundColor: backgroundColor, borderTopLeftRadius: dayHighlightSelect(dayState, defaultHighlights, ["selectedStart", "singleSelected"], [
372
- "var(--swui-calendar-day-border-radius)",
373
- "var(--swui-calendar-day-border-radius)",
374
- ], borderColor), borderBottomLeftRadius: dayHighlightSelect(dayState, defaultHighlights, ["selectedStart", "singleSelected"], [
375
- "var(--swui-calendar-day-border-radius)",
376
- "var(--swui-calendar-day-border-radius)",
377
- ], borderColor), borderTopRightRadius: dayHighlightSelect(dayState, defaultHighlights, ["selectedEnd", "singleSelected"], [
378
- "var(--swui-calendar-day-border-radius)",
379
- "var(--swui-calendar-day-border-radius)",
380
- ], borderColor), borderBottomRightRadius: dayHighlightSelect(dayState, defaultHighlights, ["selectedEnd", "singleSelected"], [
381
- "var(--swui-calendar-day-border-radius)",
382
- "var(--swui-calendar-day-border-radius)",
383
- ], borderColor), boxSizing: "border-box" });
384
- };
385
- };
386
- var defaultTextPropsProvider = function (_a) {
387
- var selectedColor = _a.selectedColor, disabledColor = _a.disabledColor, inOtherMonthColor = _a.inOtherMonthColor, rangeTextColor = _a.rangeTextColor;
388
- return function (defaultHighlights, dayState, day, _, month) {
389
- var isOtherMonth = day.month !== month.monthInYear;
390
- var color = dayHighlightSelect(dayState, defaultHighlights, [isOtherMonth, "selected", "range", "enabled", "disabled"], [
391
- inOtherMonthColor,
392
- selectedColor,
393
- rangeTextColor,
394
- undefined,
395
- disabledColor,
396
- ]);
397
- return {
398
- color: color,
399
- };
400
- };
401
- };
402
- var defaultCalendarTheme = {
403
- width: "var(--swui-calendar-day-width)",
404
- height: "var(--swui-calendar-day-height)",
405
- WeekNumber: {
406
- backgroundColor: "var(--swui-calendar-week-number-bg-color)",
407
- textColor: "var(--swui-calendar-week-number-text-color)",
408
- clickableTextColor: "var(--swui-calendar-week-number-clickable-text-color)",
409
- show: true,
410
- },
411
- WeekDay: {
412
- textColor: "var(--swui-calendar-week-day-text-color)",
413
- clickableTextColor: "var(--swui-calendar-week-day-clickable-text-color)",
414
- },
415
- CalendarDay: {
416
- tdStyle: defaultWrapperStyleProvider({
417
- selectedBackground: "var(--swui-calendar-wrapper-selected-background)",
418
- rangeBackground: "var(--swui-calendar-wrapper-range-background)",
419
- todayBackground: "var(--swui-calendar-wrapper-today-background)",
420
- }),
421
- textProps: defaultTextPropsProvider({
422
- selectedColor: "var(--swui-calendar-text-selected-color)",
423
- disabledColor: "var(--swui-calendar-text-disabled-color)",
424
- inOtherMonthColor: "var(--swui-calendar-text-in-other-month-color)",
425
- }),
426
- },
427
- CalendarMonth: {
428
- headerTextColor: "var(--swui-calendar-week-day-text-color)",
429
- },
430
- };
431
- var extranetCalendarTheme = __assign(__assign({}, defaultCalendarTheme), { width: "37px", height: "37px" });
432
-
433
- var isDateInMinMaxRange = function (date, min, max) {
434
- if (min && dateFns.isBefore(date, min)) {
435
- return dateFns.isSameDay(date, min);
436
- }
437
- if (max && dateFns.isAfter(date, max)) {
438
- return dateFns.isSameDay(date, max);
439
- }
440
- return true;
441
- };
442
-
443
- var DisabledDayWrapper = function DisabledDayWrapper(_a) {
444
- var DayComponent = _a.dayComponent, minDate = _a.minDate, maxDate = _a.maxDate, dayState = _a.dayState, day = _a.day, props = __rest(_a, ["dayComponent", "minDate", "maxDate", "dayState", "day"]);
445
- var activeDayState = React.useMemo(function () {
446
- return !isDateInMinMaxRange(day.date, minDate, maxDate)
447
- ? addDayStateHighlightsOnSingleDay(dayState, ["disabled"])
448
- : dayState;
449
- }, [day.date, dayState, maxDate, minDate]);
450
- return React__namespace.createElement(DayComponent, __assign({ day: day }, props, { dayState: activeDayState }));
451
- };
452
-
453
- var WeekNumberCell = function (_a) {
454
- var onClickWeek = _a.onClickWeek, theme = _a.theme, week = _a.week, background = _a.background, backgroundColor = _a.backgroundColor, prefix = _a.prefix;
455
- var content = (React__namespace.createElement(core.Box, { width: theme.width, height: theme.height, justifyContent: "center", alignItems: "center" },
456
- background && React__namespace.createElement(core.Box, { position: "absolute" }, background),
457
- React__namespace.createElement(core.Box, { position: "absolute" },
458
- React__namespace.createElement(core.Text, { color: onClickWeek
459
- ? theme.WeekNumber.clickableTextColor
460
- : theme.WeekNumber.textColor },
461
- prefix,
462
- week.weekNumber))));
463
- return (React__namespace.createElement(core.Box, { background: backgroundColor || theme.WeekNumber.backgroundColor, position: "relative" }, onClickWeek ? (React__namespace.createElement(core.Clickable, { borderRadius: "var(--swui-calendar-day-border-radius)", onClick: function (ev) { return onClickWeek(week, ev); }, disableFocusHighlight: !onClickWeek }, content)) : (content)));
464
- };
465
-
466
- function CalendarWeek(_a) {
467
- var week = _a.week, month = _a.month, dayComponent = _a.dayComponent, statePerWeekDay = _a.statePerWeekDay, userDataPerWeekDay = _a.userDataPerWeekDay, minDate = _a.minDate, maxDate = _a.maxDate, onClickWeek = _a.onClickWeek, onClickDay = _a.onClickDay, theme = _a.theme, renderWeekNumber = _a.renderWeekNumber, extraDayContent = _a.extraDayContent, defaultHighlights = _a.defaultHighlights;
468
- return (React__namespace.createElement("tr", { key: week.weekNumber },
469
- theme.WeekNumber.show && (React__namespace.createElement("td", null, renderWeekNumber ? (renderWeekNumber(week, theme, onClickWeek)) : (React__namespace.createElement(WeekNumberCell, { week: week, onClickWeek: onClickWeek, theme: theme })))),
470
- week.days.map(function (day) { return (React__namespace.createElement(DisabledDayWrapper, { dayComponent: dayComponent, key: day.dateString, day: day, week: week, month: month, dayState: statePerWeekDay && statePerWeekDay[day.dayOfMonth], userData: userDataPerWeekDay && userDataPerWeekDay[day.dayOfMonth], onClickDay: onClickDay, theme: theme, extraDayContent: extraDayContent, defaultHighlights: defaultHighlights, minDate: minDate, maxDate: maxDate })); })));
471
- }
472
-
473
- var WeekDayCell = function (_a) {
474
- var onClickWeekDay = _a.onClickWeekDay, day = _a.day, theme = _a.theme;
475
- var content = (React__namespace.createElement(core.Box, { width: theme.width, height: theme.height, justifyContent: "center", alignItems: "center" },
476
- React__namespace.createElement(core.Text, { size: "small", color: onClickWeekDay
477
- ? theme.WeekDay.clickableTextColor
478
- : theme.WeekDay.textColor }, day.name)));
479
- if (onClickWeekDay) {
480
- return (React__namespace.createElement(core.Clickable, { borderRadius: "var(--swui-calendar-day-border-radius)", onClick: function (ev) { return onClickWeekDay(day.dayOfWeek, ev); }, disableFocusHighlight: !onClickWeekDay }, content));
481
- }
482
- return content;
483
- };
484
-
485
- var CalendarDay = function CalendarDay(_a) {
486
- var day = _a.day, week = _a.week, month = _a.month, dayState = _a.dayState, userData = _a.userData, onClickDay = _a.onClickDay, theme = _a.theme, ExtraDayContent = _a.extraDayContent, defaultHighlights = _a.defaultHighlights;
487
- var content = (React__namespace.createElement(core.Box, { width: "100%", height: "100%", justifyContent: "center", alignItems: "center" },
488
- React__namespace.createElement(core.Text, __assign({}, (theme.CalendarDay.textProps &&
489
- theme.CalendarDay.textProps(defaultHighlights, dayState, day, week, month, userData))), day.dayOfMonth)));
490
- var WrapperTd = styled__default["default"].td(__assign({}, (theme.CalendarDay.tdStyle &&
491
- theme.CalendarDay.tdStyle(defaultHighlights, dayState, day, week, month, userData))));
492
- var InnerWrapperDiv = styled__default["default"].div(__assign(__assign({}, (theme.CalendarDay.innerWrapperStyle &&
493
- theme.CalendarDay.innerWrapperStyle(defaultHighlights, dayState, day, week, month, userData))), { width: "100%", height: "100%" }));
494
- var CellWrapperDiv = styled__default["default"].div(__assign(__assign({}, (theme.CalendarDay.cellWrapperStyle &&
495
- theme.CalendarDay.cellWrapperStyle(defaultHighlights, dayState, day, week, month, userData))), { width: "100%", height: "100%", position: "relative" }));
496
- return (React__namespace.createElement(WrapperTd, null,
497
- React__namespace.createElement(InnerWrapperDiv, null,
498
- React__namespace.createElement(CellWrapperDiv, null, day.month === month.monthInYear && (React__namespace.createElement(React__namespace.Fragment, null,
499
- ExtraDayContent && (React__namespace.createElement(ExtraDayContent, { week: week, month: month, day: day, dayState: dayState, theme: theme, userData: userData })),
500
- onClickDay && isClickable(defaultHighlights, dayState) ? (React__namespace.createElement(core.Clickable, { onClick: function (ev) { return onClickDay(day, userData, ev); }, style: { width: "100%", height: "100%" }, borderRadius: "var(--swui-calendar-day-border-radius)" }, content)) : (React__namespace.createElement(React__namespace.Fragment, null, content))))))));
501
- };
502
- var isClickable = function (defaultHighlights, dayState) {
503
- return !!dayHighlightSelect(dayState, defaultHighlights, ["enabled", "disabled"], [true, false], true);
504
- };
505
-
506
- function CalendarMonth(_a) {
507
- var month = _a.month, _b = _a.dayComponent, dayComponent = _b === void 0 ? CalendarDay : _b, statePerWeek = _a.statePerWeek, userDataPerWeek = _a.userDataPerWeek, minDate = _a.minDate, maxDate = _a.maxDate, onClickDay = _a.onClickDay, onClickWeek = _a.onClickWeek, onClickWeekDay = _a.onClickWeekDay, onClickMonth = _a.onClickMonth, onClickYear = _a.onClickYear, renderWeekNumber = _a.renderWeekNumber, renderWeekDay = _a.renderWeekDay, headerLeftContent = _a.headerLeftContent, headerRightContent = _a.headerRightContent, _c = _a.theme, theme = _c === void 0 ? defaultCalendarTheme : _c, extraDayContent = _a.extraDayContent, defaultHighlights = _a.defaultHighlights;
508
- var showWeekNumber = theme.WeekNumber.show;
509
- return (React__namespace.createElement(React__namespace.Fragment, null,
510
- React__namespace.createElement(core.Box, { alignItems: "stretch" },
511
- React__namespace.createElement(core.Row, { justifyContent: "space-between", alignItems: "center", height: "32px" },
512
- React__namespace.createElement(core.Box, { alignItems: "center" }, headerLeftContent),
513
- React__namespace.createElement(core.Row, { alignItems: "center" },
514
- React__namespace.createElement(core.Row, { width: "104px", justifyContent: "center" }, onClickMonth ? (React__namespace.createElement(elements.FlatButton, { onClick: function () { return onClickMonth(month); }, label: month.name })) : (React__namespace.createElement(core.Text, null, month.name))),
515
- React__namespace.createElement(core.Space, null),
516
- React__namespace.createElement(core.Row, { width: "64px", justifyContent: "center" }, onClickYear ? (React__namespace.createElement(elements.FlatButton, { onClick: function () { return onClickYear(month.year); }, label: String(month.year) })) : (React__namespace.createElement(core.Text, null, month.year)))),
517
- React__namespace.createElement(core.Box, { alignItems: "center" }, headerRightContent)),
518
- React__namespace.createElement("table", null,
519
- React__namespace.createElement("tbody", null,
520
- React__namespace.createElement("tr", null,
521
- showWeekNumber && (React__namespace.createElement("td", null,
522
- React__namespace.createElement(core.Box, { width: theme.width, height: theme.height, justifyContent: "center", alignItems: "center" },
523
- React__namespace.createElement(core.Text, { size: "small", color: theme.CalendarMonth.headerTextColor }, "W")))),
524
- month.weeks[0].days.map(function (day) { return (React__namespace.createElement("td", { key: day.name }, renderWeekDay ? (renderWeekDay(day.name, theme, onClickWeekDay)) : (React__namespace.createElement(WeekDayCell, { day: day, onClickWeekDay: onClickWeekDay, theme: theme })))); })),
525
- month.weeks.map(function (week) { return (React__namespace.createElement(CalendarWeek, { key: week.weekNumber, month: month, week: week, dayComponent: dayComponent, statePerWeekDay: statePerWeek && statePerWeek[week.weekNumber], userDataPerWeekDay: userDataPerWeek && userDataPerWeek[week.weekNumber], onClickDay: onClickDay, onClickWeek: onClickWeek, theme: theme, renderWeekNumber: renderWeekNumber, extraDayContent: extraDayContent, defaultHighlights: defaultHighlights, minDate: minDate, maxDate: maxDate })); }))))));
526
- }
527
-
528
- function styleInject(css, ref) {
529
- if ( ref === void 0 ) ref = {};
530
- var insertAt = ref.insertAt;
531
-
532
- if (!css || typeof document === 'undefined') { return; }
533
-
534
- var head = document.head || document.getElementsByTagName('head')[0];
535
- var style = document.createElement('style');
536
- style.type = 'text/css';
537
-
538
- if (insertAt === 'top') {
539
- if (head.firstChild) {
540
- head.insertBefore(style, head.firstChild);
541
- } else {
542
- head.appendChild(style);
543
- }
544
- } else {
545
- head.appendChild(style);
546
- }
547
-
548
- if (style.styleSheet) {
549
- style.styleSheet.cssText = css;
550
- } else {
551
- style.appendChild(document.createTextNode(css));
552
- }
553
- }
554
-
555
- var css_248z$1 = ".Calendar-module_calendar__Ztvgm {\n --swui-calendar-day-width: 40px;\n --swui-calendar-day-height: 38px;\n --swui-calendar-day-border-radius: 4px;\n\n /* Week number */\n\n --swui-calendar-week-number-bg-color: transparent;\n --swui-calendar-week-number-text-color: var(--lhds-color-ui-500);\n --swui-calendar-week-number-clickable-text-color: var(--lhds-color-ui-500);\n\n /* Week day */\n\n --swui-calendar-week-day-text-color: var(--lhds-color-ui-500);\n --swui-calendar-week-day-clickable-text-color: var(--lhds-color-ui-500);\n\n /* Wrapper */\n\n --swui-calendar-wrapper-selected-border: var(--swui-primary-action-color);\n --swui-calendar-wrapper-selected-background: var(--swui-primary-action-color);\n --swui-calendar-wrapper-range-border: var(--lhds-color-blue-100);\n --swui-calendar-wrapper-range-background: var(--lhds-color-blue-100);\n --swui-calendar-wrapper-today-border: var(--lhds-color-ui-200);\n --swui-calendar-wrapper-today-background: var(--lhds-color-ui-200);\n\n /* Text */\n\n --swui-calendar-text-selected-color: #fff;\n --swui-calendar-text-disabled-color: var(--swui-text-disabled-color);\n --swui-calendar-text-in-other-month-color: var(--swui-text-disabled-color);\n}\n\n .Calendar-module_calendar__Ztvgm table {\n border-spacing: 0 4px;\n }\n\n .Calendar-module_calendar__Ztvgm span {\n line-height: 100%;\n }\n\n .Calendar-module_calendar__Ztvgm tr td:last-child {\n border-top-right-radius: var(--swui-calendar-day-border-radius);\n border-bottom-right-radius: var(--swui-calendar-day-border-radius);\n }\n\n .Calendar-module_calendar__Ztvgm tr td:nth-child(2) {\n border-top-left-radius: var(--swui-calendar-day-border-radius);\n border-bottom-left-radius: var(--swui-calendar-day-border-radius);\n }\n\n .Calendar-module_calendar__Ztvgm td {\n padding: 0;\n width: var(--swui-calendar-day-width);\n height: var(--swui-calendar-day-height);\n }\n";
556
- var styles$1 = {"calendar":"Calendar-module_calendar__Ztvgm"};
557
- styleInject(css_248z$1);
558
-
559
- function CalendarPanel(_a) {
560
- var monthRows = _a.monthRows, _b = _a.dayComponent, dayComponent = _b === void 0 ? CalendarDay : _b, userDataPerMonth = _a.userDataPerMonth, statePerMonth = _a.statePerMonth, minDate = _a.minDate, maxDate = _a.maxDate, onClickDay = _a.onClickDay, onClickWeekDay = _a.onClickWeekDay, onClickWeek = _a.onClickWeek, onClickMonth = _a.onClickMonth, onClickYear = _a.onClickYear, renderWeekDay = _a.renderWeekDay, renderWeekNumber = _a.renderWeekNumber, headerLeftContent = _a.headerLeftContent, headerRightContent = _a.headerRightContent, extraDayContent = _a.extraDayContent, defaultHighlights = _a.defaultHighlights, _c = _a.theme, theme = _c === void 0 ? defaultCalendarTheme : _c;
561
- var minDateObj = React.useMemo(function () { return (minDate ? dateFns.parse(minDate, "yyyy-MM-dd", new Date()) : undefined); }, [minDate]);
562
- var maxDateObj = React.useMemo(function () { return (maxDate ? dateFns.parse(maxDate, "yyyy-MM-dd", new Date()) : undefined); }, [maxDate]);
563
- return (React__namespace.createElement("div", { className: styles$1.calendar }, monthRows.map(function (monthRow, rowIndex) { return (React__namespace.createElement(core.Spacing, { key: rowIndex },
564
- React__namespace.createElement(core.Row, null, monthRow.map(function (month, index) { return (React__namespace.createElement(React__namespace.Fragment, { key: month.name },
565
- index > 0 && React__namespace.createElement(core.Space, null),
566
- React__namespace.createElement(CalendarMonth, { month: month, dayComponent: dayComponent, userDataPerWeek: userDataPerMonth && userDataPerMonth[month.monthString], statePerWeek: statePerMonth && statePerMonth[month.monthString], onClickDay: onClickDay, onClickWeekDay: onClickWeekDay, onClickWeek: onClickWeek, onClickMonth: onClickMonth, onClickYear: onClickYear, theme: theme, renderWeekNumber: renderWeekNumber, renderWeekDay: renderWeekDay, headerLeftContent: headerLeftContent, headerRightContent: headerRightContent, extraDayContent: extraDayContent, defaultHighlights: defaultHighlights, minDate: minDateObj, maxDate: maxDateObj }))); })))); })));
567
- }
568
- function Calendar(props) {
569
- var initialDate = getInitialDate(props.year, props.month, props.date);
570
- var _a = calculateOverflowingMonth(initialDate.year, initialDate.month), year = _a.year, month = _a.month;
571
- var monthRows = getMonthRows(year, month, props.numMonths, props.monthsPerRow);
572
- var statePerMonth = useHighlightToday(props.highlightToday, props.statePerMonth);
573
- return (React__namespace.createElement(CalendarPanel, __assign({ year: year, month: month, monthRows: monthRows }, props, { statePerMonth: statePerMonth })));
574
- }
575
- var getInitialDate = function (year, month, date) {
576
- if (month && year) {
577
- return {
578
- month: month,
579
- year: year,
580
- };
581
- }
582
- if (date) {
583
- return {
584
- month: dateFns.getMonth(date),
585
- year: dateFns.getYear(date),
586
- };
587
- }
588
- var now = new Date();
589
- return {
590
- month: dateFns.getMonth(now),
591
- year: dateFns.getYear(now),
592
- };
593
- };
594
- var getMonthRows = function (year, month, numMonths, monthsPerRow) {
595
- if (numMonths == null) {
596
- return [[getMonthInYear(year, month)]];
597
- }
598
- if (monthsPerRow == null) {
599
- return [getMonthsInYear(year, month, numMonths)];
600
- }
601
- return lodash.chunk(getMonthsInYear(year, month, numMonths), monthsPerRow);
602
- };
603
-
604
- var useSelectedMonthStepperLogic = function (dateInFocus, setDateInFocus, monthsPerRow, numMonths) {
605
- var nextMonth = React.useCallback(function () {
606
- var _a;
607
- var d = dateFns.addMonths(dateInFocus, (_a = monthsPerRow !== null && monthsPerRow !== void 0 ? monthsPerRow : numMonths) !== null && _a !== void 0 ? _a : 1);
608
- setDateInFocus === null || setDateInFocus === void 0 ? void 0 : setDateInFocus(d);
609
- }, [setDateInFocus, dateInFocus, monthsPerRow, numMonths]);
610
- var nextYear = React.useCallback(function () {
611
- var d = dateFns.addYears(dateInFocus, 1);
612
- setDateInFocus === null || setDateInFocus === void 0 ? void 0 : setDateInFocus(d);
613
- }, [setDateInFocus, dateInFocus]);
614
- var prevMonth = React.useCallback(function () {
615
- var _a;
616
- var d = dateFns.subMonths(dateInFocus, (_a = monthsPerRow !== null && monthsPerRow !== void 0 ? monthsPerRow : numMonths) !== null && _a !== void 0 ? _a : 1);
617
- setDateInFocus === null || setDateInFocus === void 0 ? void 0 : setDateInFocus(d);
618
- }, [setDateInFocus, dateInFocus, monthsPerRow, numMonths]);
619
- var prevYear = React.useCallback(function () {
620
- var d = dateFns.subYears(dateInFocus, 1);
621
- setDateInFocus === null || setDateInFocus === void 0 ? void 0 : setDateInFocus(d);
622
- }, [setDateInFocus, dateInFocus]);
623
- return {
624
- nextMonth: nextMonth,
625
- prevMonth: prevMonth,
626
- nextYear: nextYear,
627
- prevYear: prevYear,
628
- };
629
- };
630
-
631
- var WithMonthSwitcherBelow = function (_a) {
632
- var children = _a.children, prevMonth = _a.prevMonth, nextMonth = _a.nextMonth, prevYear = _a.prevYear, nextYear = _a.nextYear;
633
- return (React__namespace.createElement("div", null,
634
- children,
635
- React__namespace.createElement(core.Indent, null,
636
- React__namespace.createElement(core.Row, null,
637
- React__namespace.createElement(elements.FlatButton, { onClick: prevYear, leftIcon: faAngleDoubleLeft.faAngleDoubleLeft }),
638
- React__namespace.createElement(core.Space, null),
639
- React__namespace.createElement(elements.FlatButton, { onClick: prevMonth, leftIcon: faAngleLeft.faAngleLeft }),
640
- React__namespace.createElement(core.Indent, { num: 2 }),
641
- React__namespace.createElement(elements.FlatButton, { onClick: nextMonth, leftIcon: faAngleRight.faAngleRight }),
642
- React__namespace.createElement(core.Space, null),
643
- React__namespace.createElement(elements.FlatButton, { onClick: nextYear, leftIcon: faAngleDoubleRight.faAngleDoubleRight }))),
644
- React__namespace.createElement(core.Space, null)));
645
- };
646
-
647
- var MonthPickerCell = function (_a) {
648
- var value = _a.value, onValueChange = _a.onValueChange, month = _a.month;
649
- var label = React.useMemo(function () {
650
- var now = new Date(2000, month, 1);
651
- return dateFns.format(now, "MMM");
652
- }, [month]);
653
- return (React__namespace.createElement(core.Row, { width: "64px", justifyContent: "center", spacing: 0.5, indent: 0.5 }, value === month ? (React__namespace.createElement(elements.PrimaryButton, { label: label, onClick: function () { return onValueChange && onValueChange(month); } })) : (React__namespace.createElement(elements.FlatButton, { label: label, onClick: function () { return onValueChange && onValueChange(month); } }))));
654
- };
655
-
656
- var monthMatrix = [
657
- [exports.Month.JANUARY, exports.Month.FEBRUARY, exports.Month.MARCH],
658
- [exports.Month.APRIL, exports.Month.MAY, exports.Month.JUNE],
659
- [exports.Month.JULY, exports.Month.AUGUST, exports.Month.SEPTEMBER],
660
- [exports.Month.OCTOBER, exports.Month.NOVEMBER, exports.Month.DECEMBER],
661
- ];
662
- var MonthPicker = function (_a) {
663
- var value = _a.value, onValueChange = _a.onValueChange;
664
- return (React__namespace.createElement(core.Column, null, monthMatrix.map(function (monthRow) { return (React__namespace.createElement(core.Row, { key: monthRow[0] }, monthRow.map(function (month) { return (React__namespace.createElement(MonthPickerCell, { key: month, month: month, onValueChange: onValueChange, value: value })); }))); })));
665
- };
666
-
667
- var createStandardDateRangePresets = function (now) { return [
668
- {
669
- label: "Past",
670
- presets: [
671
- { label: "Last 3 days", startDate: now, endDate: dateFns.subDays(now, 2) },
672
- { label: "Last 7 days", startDate: now, endDate: dateFns.subDays(now, 6) },
673
- { label: "Last 30 days", startDate: now, endDate: dateFns.subDays(now, 29) },
674
- { label: "Last 45 days", startDate: now, endDate: dateFns.subDays(now, 44) },
675
- ],
676
- },
677
- {
678
- label: "Future",
679
- presets: [
680
- { label: "Next 3 days", startDate: now, endDate: dateFns.addDays(now, 2) },
681
- { label: "Next 7 days", startDate: now, endDate: dateFns.addDays(now, 6) },
682
- { label: "Next 30 days", startDate: now, endDate: dateFns.addDays(now, 29) },
683
- { label: "Next 45 days", startDate: now, endDate: dateFns.addDays(now, 44) },
684
- ],
685
- },
686
- ]; };
687
-
688
- var PresetPicker = function (_a) {
689
- var _b;
690
- var onClickPreset = _a.onClickPreset;
691
- var _c = React.useState(0), pageIndex = _c[0], setPageIndex = _c[1];
692
- var pages = React.useMemo(function () { return createStandardDateRangePresets(new Date()); }, []);
693
- var currentPage = (_b = pages[pageIndex]) !== null && _b !== void 0 ? _b : pages[0];
694
- return (React__namespace.createElement(core.Column, null,
695
- React__namespace.createElement(core.Row, { justifyContent: "space-between", alignItems: "center", width: "200px" },
696
- React__namespace.createElement(elements.FlatButton, { size: "small", leftIcon: faAngleLeft.faAngleLeft, disabled: pageIndex === 0, onClick: function () { return setPageIndex(pageIndex - 1); } }),
697
- React__namespace.createElement(core.Text, null, currentPage.label),
698
- React__namespace.createElement(elements.FlatButton, { size: "small", leftIcon: faAngleRight.faAngleRight, disabled: pageIndex === pages.length - 1, onClick: function () { return setPageIndex(pageIndex + 1); } })),
699
- React__namespace.createElement(core.Space, null),
700
- React__namespace.createElement(core.Column, { alignItems: "center" }, currentPage.presets.map(function (preset) { return (React__namespace.createElement(React__namespace.Fragment, { key: preset.label },
701
- React__namespace.createElement(elements.PrimaryButton, { label: preset.label, onClick: function () { return onClickPreset(preset); } }),
702
- React__namespace.createElement(core.Space, null))); }))));
703
- };
704
-
705
- var YearPickerCell = function (_a) {
706
- var value = _a.value, onValueChange = _a.onValueChange, year = _a.year;
707
- var label = String(year);
708
- return (React__namespace.createElement(core.Row, { width: "64px", justifyContent: "center", spacing: 0.5, indent: 0.5 }, value === year ? (React__namespace.createElement(elements.PrimaryButton, { label: label, onClick: function () { return onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange(year); } })) : (React__namespace.createElement(elements.FlatButton, { label: label, onClick: function () { return onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange(year); } }))));
709
- };
710
-
711
- var YearPicker = function (_a) {
712
- var value = _a.value, onValueChange = _a.onValueChange, initialLastYear = _a.initialLastYear;
713
- var _b = React.useState(function () {
714
- if (value) {
715
- return value + 4;
716
- }
717
- return initialLastYear !== null && initialLastYear !== void 0 ? initialLastYear : new Date().getFullYear() + 4;
718
- }), lastYear = _b[0], setLastYear = _b[1];
719
- var yearRows = React.useMemo(function () {
720
- var startYear = lastYear - 11;
721
- return lodash.chunk(lodash.range(startYear, lastYear + 1), 3);
722
- }, [lastYear]);
723
- React.useEffect(function () {
724
- setLastYear(function (prev) { return calculateLastYearInFocus(value, prev); });
725
- }, [value]);
726
- return (React__namespace.createElement(core.Row, null,
727
- React__namespace.createElement(core.Column, { justifyContent: "center" },
728
- React__namespace.createElement(elements.FlatButton, { leftIcon: faCaretLeft.faCaretLeft, onClick: function () { return setLastYear(lastYear - 3); } })),
729
- React__namespace.createElement(core.Column, null, yearRows.map(function (yearRow) { return (React__namespace.createElement(core.Row, { key: yearRow[0] }, yearRow.map(function (year) { return (React__namespace.createElement(YearPickerCell, { key: year, year: year, onValueChange: onValueChange, value: value })); }))); })),
730
- React__namespace.createElement(core.Column, { justifyContent: "center" },
731
- React__namespace.createElement(elements.FlatButton, { leftIcon: faCaretRight.faCaretRight, onClick: function () { return setLastYear(lastYear + 3); } }))));
732
- };
733
- var calculateLastYearInFocus = function (value, lastYear) {
734
- if (value == null) {
735
- return lastYear;
736
- }
737
- if (value > lastYear) {
738
- var yearDiff = value - lastYear;
739
- var remaining = yearDiff % 3;
740
- var yearsToAdd = yearDiff - remaining + 3;
741
- return lastYear + yearsToAdd;
742
- }
743
- var startYear = lastYear - 11;
744
- if (value < startYear) {
745
- var yearDiff = startYear - value;
746
- var remaining = yearDiff % 3;
747
- var yearsToSubtract = yearDiff - remaining + 3;
748
- return lastYear - yearsToSubtract;
749
- }
750
- return lastYear;
751
- };
752
-
753
- var CalendarWithMonthYearPickers = function CalendarWithMonthYearPickers(_a) {
754
- var dateInFocus = _a.dateInFocus, setDateInFocus = _a.setDateInFocus, currentPanel = _a.currentPanel, setCurrentPanel = _a.setCurrentPanel, props = __rest(_a, ["dateInFocus", "setDateInFocus", "currentPanel", "setCurrentPanel"]);
755
- var onChangeSelectedMonth = React.useCallback(function (selectedMonth) {
756
- var newDate = dateInFocus ? new Date(dateInFocus) : new Date();
757
- newDate.setMonth(selectedMonth);
758
- if (setDateInFocus) {
759
- setDateInFocus(newDate);
760
- }
761
- setCurrentPanel("calendar");
762
- }, [dateInFocus, setDateInFocus, setCurrentPanel]);
763
- var onChangeSelectedYear = React.useCallback(function (selectedYear) {
764
- var newDate = dateInFocus ? new Date(dateInFocus) : new Date();
765
- newDate.setFullYear(selectedYear);
766
- if (setDateInFocus) {
767
- setDateInFocus(newDate);
768
- }
769
- setCurrentPanel("calendar");
770
- }, [dateInFocus, setDateInFocus, setCurrentPanel]);
771
- var onClickYear = React.useCallback(function () {
772
- setCurrentPanel("year");
773
- }, [setCurrentPanel]);
774
- var onClickMonth = React.useCallback(function () {
775
- setCurrentPanel("month");
776
- }, [setCurrentPanel]);
777
- switch (currentPanel) {
778
- case "calendar":
779
- return (React__namespace.createElement(React__namespace.Fragment, null,
780
- React__namespace.createElement(Calendar, __assign({}, props, { date: dateInFocus, onClickYear: onClickYear, onClickMonth: onClickMonth }))));
781
- case "month":
782
- return (React__namespace.createElement(MonthPicker, { value: dateInFocus.getMonth(), onValueChange: onChangeSelectedMonth }));
783
- case "year":
784
- return (React__namespace.createElement(YearPicker, { value: dateInFocus.getFullYear(), onValueChange: onChangeSelectedYear }));
785
- case "presets":
786
- return React__namespace.createElement(PresetPicker, { onClickPreset: function () { } });
787
- default:
788
- return (React__namespace.createElement(core.Box, null,
789
- React__namespace.createElement(elements.PrimaryButton, { label: "Show calendar", onClick: function () { return setCurrentPanel("calendar"); } })));
790
- }
791
- };
792
-
793
- var noop = function () { };
794
- function CalendarWithMonthSwitcher(_a) {
795
- var monthSwitcherPlacement = _a.monthSwitcherPlacement, _b = _a.theme, theme = _b === void 0 ? defaultCalendarTheme : _b, dateInFocus = _a.dateInFocus, setDateInFocus = _a.setDateInFocus, currentPanel = _a.currentPanel, setCurrentPanel = _a.setCurrentPanel, _c = _a.onSelectPreset, onSelectPreset = _c === void 0 ? noop : _c, _d = _a.hideYearPagination, hideYearPagination = _d === void 0 ? false : _d, calendarProps = __rest(_a, ["monthSwitcherPlacement", "theme", "dateInFocus", "setDateInFocus", "currentPanel", "setCurrentPanel", "onSelectPreset", "hideYearPagination"]);
796
- var _e = useSelectedMonthStepperLogic(dateInFocus, setDateInFocus, calendarProps.monthsPerRow, calendarProps.numMonths), nextMonth = _e.nextMonth, prevMonth = _e.prevMonth, nextYear = _e.nextYear, prevYear = _e.prevYear;
797
- var placement = fallbackIfNoPlacement(monthSwitcherPlacement, calendarProps.numMonths);
798
- switch (placement) {
799
- case "below": {
800
- return (React__namespace.createElement(WithMonthSwitcherBelow, { theme: theme, nextMonth: nextMonth, prevMonth: prevMonth, nextYear: nextYear, prevYear: prevYear },
801
- React__namespace.createElement(Calendar, __assign({}, calendarProps, { theme: theme, date: dateInFocus }))));
802
- }
803
- case "header": {
804
- return (React__namespace.createElement(core.Column, null,
805
- React__namespace.createElement(CalendarWithMonthYearPickers, __assign({}, calendarProps, { theme: theme, dateInFocus: dateInFocus, setDateInFocus: setDateInFocus, currentPanel: currentPanel, setCurrentPanel: setCurrentPanel, onSelectPreset: onSelectPreset, headerLeftContent: React__namespace.createElement(core.Row, { alignItems: "center" },
806
- !hideYearPagination && (React__namespace.createElement(elements.FlatButton, { size: "small", onClick: prevYear, leftIcon: faAngleDoubleLeft.faAngleDoubleLeft })),
807
- React__namespace.createElement(core.Space, null),
808
- React__namespace.createElement(elements.FlatButton, { size: "small", onClick: prevMonth, leftIcon: faAngleLeft.faAngleLeft })), headerRightContent: React__namespace.createElement(core.Row, { alignItems: "center" },
809
- React__namespace.createElement(elements.FlatButton, { size: "small", onClick: nextMonth, leftIcon: faAngleRight.faAngleRight }),
810
- React__namespace.createElement(core.Space, null),
811
- !hideYearPagination && (React__namespace.createElement(elements.FlatButton, { size: "small", onClick: nextYear, leftIcon: faAngleDoubleRight.faAngleDoubleRight }))) }))));
812
- }
813
- default: {
814
- return (React__namespace.createElement(Calendar, __assign({}, calendarProps, { theme: theme, date: dateInFocus })));
815
- }
816
- }
817
- }
818
- var fallbackIfNoPlacement = function (monthSwitcherPlacement, numMonths) {
819
- return monthSwitcherPlacement || (numMonths || 1) > 1 ? "below" : "header";
820
- };
821
-
822
- var dateRangeToStrings = function (dateRange) { return ({
823
- startDate: dateRange.startDate
824
- ? dateFns.format(dateRange.startDate, "yyyy-MM-dd")
825
- : undefined,
826
- endDate: dateRange.endDate
827
- ? dateFns.format(dateRange.endDate, "yyyy-MM-dd")
828
- : undefined,
829
- }); };
830
- var stringsToDateRange = function (_a) {
831
- var startDate = _a.startDate, endDate = _a.endDate;
832
- var now = new Date();
833
- return {
834
- startDate: startDate ? dateFns.parse(startDate, "yyyy-MM-dd", now) : undefined,
835
- endDate: endDate ? dateFns.parse(endDate, "yyyy-MM-dd", now) : undefined,
836
- };
837
- };
838
-
839
- var isDateRangeInvalid = function (_a) {
840
- var startDate = _a.startDate, endDate = _a.endDate;
841
- return Boolean(startDate &&
842
- endDate &&
843
- !dateFns.isSameDay(startDate, endDate) &&
844
- dateFns.isAfter(startDate, endDate));
845
- };
846
- var toggleDatesIfEndIsEarlierThanStart = function (dateRange) {
847
- if (isDateRangeInvalid(dateRange)) {
848
- return {
849
- startDate: dateRange.endDate,
850
- endDate: dateRange.startDate,
851
- };
852
- }
853
- return dateRange;
854
- };
855
- var toggleDateStringsIfEndIsEarlierThanStart = function (dateRange) {
856
- if (dateRange.startDate && dateRange.endDate) {
857
- return dateRangeToStrings(toggleDatesIfEndIsEarlierThanStart(stringsToDateRange(dateRange)));
858
- }
859
- return dateRange;
860
- };
861
-
862
- var useDateRangeOnClickDayHandler = function (value, onValueChange, focusedInput, setFocusedInput) {
863
- return React.useCallback(function (day) {
864
- var dateRange = {
865
- startDate: focusedInput === "startDate" ? day.date : value === null || value === void 0 ? void 0 : value.startDate,
866
- endDate: focusedInput === "endDate" ? day.date : value === null || value === void 0 ? void 0 : value.endDate,
867
- };
868
- if (!isDateRangeInvalid(dateRange)) {
869
- setFocusedInput(focusedInput === "startDate" ? "endDate" : "startDate");
870
- }
871
- onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange(toggleDatesIfEndIsEarlierThanStart(dateRange));
872
- }, [
873
- focusedInput,
874
- onValueChange,
875
- setFocusedInput,
876
- value === null || value === void 0 ? void 0 : value.endDate,
877
- value === null || value === void 0 ? void 0 : value.startDate,
878
- ]);
879
- };
880
-
881
- var useInternalPanelState = function (onChangePanel) {
882
- var _a = React.useState("calendar"), currentPanel = _a[0], _setCurrentPanel = _a[1];
883
- var setCurrentPanel = React.useCallback(function (currentPanel) {
884
- _setCurrentPanel(currentPanel);
885
- onChangePanel === null || onChangePanel === void 0 ? void 0 : onChangePanel(currentPanel);
886
- }, [onChangePanel]);
887
- return {
888
- currentPanel: currentPanel,
889
- setCurrentPanel: setCurrentPanel,
890
- };
891
- };
892
-
893
- var useDateRangeSelection = function (_a) {
894
- var focusedInput = _a.focusedInput, value = _a.value, onValueChange = _a.onValueChange, setFocusedInput = _a.setFocusedInput, statePerMonth = _a.statePerMonth, onChangePanel = _a.onChangePanel;
895
- var _b = useInternalPanelState(onChangePanel), currentPanel = _b.currentPanel, setCurrentPanel = _b.setCurrentPanel;
896
- var _c = React.useState(function () { return new Date(); }), dateInFocus = _c[0], setDateInFocus = _c[1];
897
- var onClickDay = useDateRangeOnClickDayHandler(value, onValueChange, focusedInput, setFocusedInput);
898
- var statePerMonthWithSelection = React.useMemo(function () {
899
- return buildDayStateForDateRange(statePerMonth, value === null || value === void 0 ? void 0 : value.startDate, value === null || value === void 0 ? void 0 : value.endDate);
900
- }, [statePerMonth, value === null || value === void 0 ? void 0 : value.endDate, value === null || value === void 0 ? void 0 : value.startDate]);
901
- return {
902
- onClickDay: onClickDay,
903
- statePerMonth: statePerMonthWithSelection,
904
- currentPanel: currentPanel,
905
- setCurrentPanel: setCurrentPanel,
906
- setDateInFocus: setDateInFocus,
907
- dateInFocus: dateInFocus,
908
- };
909
- };
910
-
911
- function DateRangeCalendar(props) {
912
- var dateRangeSelectionProps = useDateRangeSelection(props);
913
- return (React__namespace.createElement(CalendarWithMonthSwitcher, __assign({}, props, dateRangeSelectionProps)));
914
- }
915
-
916
- var useDateRangeCalendarState = function () {
917
- var _a = React.useState(), startDate = _a[0], setStartDate = _a[1];
918
- var _b = React.useState(), endDate = _b[0], setEndDate = _b[1];
919
- var _c = React.useState("startDate"), focusedInput = _c[0], setFocusedInput = _c[1];
920
- return {
921
- startDate: startDate,
922
- setStartDate: setStartDate,
923
- endDate: endDate,
924
- setEndDate: setEndDate,
925
- focusedInput: focusedInput,
926
- setFocusedInput: setFocusedInput,
927
- };
928
- };
929
-
930
- var useSingleDateSelection = function (_a) {
931
- var onChange = _a.onChange, value = _a.value, statePerMonth = _a.statePerMonth, onChangePanel = _a.onChangePanel;
932
- var _b = useInternalPanelState(onChangePanel), currentPanel = _b.currentPanel, setCurrentPanel = _b.setCurrentPanel;
933
- var _c = React.useState(function () { return value !== null && value !== void 0 ? value : new Date(); }), dateInFocus = _c[0], setDateInFocus = _c[1];
934
- var onClickDay = React.useCallback(function (day) {
935
- if (onChange) {
936
- onChange(day.date);
937
- }
938
- }, [onChange]);
939
- var statePerMonthWithSelectedDate = React.useMemo(function () {
940
- return value
941
- ? addDayStateHighlights(statePerMonth, value, [
942
- "selected",
943
- "singleSelected",
944
- ])
945
- : statePerMonth;
946
- }, [statePerMonth, value]);
947
- return {
948
- onClickDay: onClickDay,
949
- statePerMonth: statePerMonthWithSelectedDate,
950
- date: value,
951
- currentPanel: currentPanel,
952
- setCurrentPanel: setCurrentPanel,
953
- dateInFocus: dateInFocus,
954
- setDateInFocus: setDateInFocus,
955
- };
956
- };
957
-
958
- function SingleDateCalendar(props) {
959
- var singleDateSelectionProps = useSingleDateSelection(props);
960
- return (React__namespace.createElement(CalendarWithMonthSwitcher, __assign({}, props, singleDateSelectionProps)));
961
- }
962
-
963
- var useMultiDateSelection = function (_a) {
964
- var onChange = _a.onChange, value = _a.value, statePerMonth = _a.statePerMonth, onChangePanel = _a.onChangePanel;
965
- var _b = useInternalPanelState(onChangePanel), currentPanel = _b.currentPanel, setCurrentPanel = _b.setCurrentPanel;
966
- var _c = React.useState(function () { return new Date(); }), dateInFocus = _c[0], setDateInFocus = _c[1];
967
- var onClickDay = React.useCallback(function (day) {
968
- if (!onChange) {
969
- return;
970
- }
971
- var isSelected = value && value.find(function (d) { return dateFns.isSameDay(d, day.date); });
972
- if (value && isSelected) {
973
- onChange(value.filter(function (v) { return !dateFns.isSameDay(v, day.date); }));
974
- }
975
- else {
976
- onChange(__spreadArray(__spreadArray([], (value || []), true), [day.date], false));
977
- }
978
- }, [onChange, value]);
979
- var statePerMonthWithSelectedDate = React.useMemo(function () {
980
- if (!value) {
981
- return statePerMonth;
982
- }
983
- return value.reduce(function (stateSum, date) { return addDayStateHighlights(stateSum, date, ["selected"]); }, statePerMonth);
984
- }, [statePerMonth, value]);
985
- return {
986
- onClickDay: onClickDay,
987
- statePerMonth: statePerMonthWithSelectedDate,
988
- currentPanel: currentPanel,
989
- setCurrentPanel: setCurrentPanel,
990
- dateInFocus: dateInFocus,
991
- setDateInFocus: setDateInFocus,
992
- };
993
- };
994
-
995
- function MultiDateCalendar(props) {
996
- var selectionProps = useMultiDateSelection(props);
997
- return React__namespace.createElement(CalendarWithMonthSwitcher, __assign({}, props, selectionProps));
998
- }
999
-
1000
- var useSingleWeekSelection = function (_a) {
1001
- var onChange = _a.onChange, value = _a.value, statePerMonth = _a.statePerMonth, onChangePanel = _a.onChangePanel;
1002
- var _b = React.useState(function () {
1003
- var week = getWeekDataFromWeekString(value);
1004
- if (!week) {
1005
- return new Date();
1006
- }
1007
- return week.days[0].date;
1008
- }), dateInFocus = _b[0], setDateInFocus = _b[1];
1009
- var _c = useInternalPanelState(onChangePanel), currentPanel = _c.currentPanel, setCurrentPanel = _c.setCurrentPanel;
1010
- var onClickDay = React.useCallback(function (day) {
1011
- if (onChange) {
1012
- onChange(getWeekStringFromWeekData(getWeekForDate(day.date)));
1013
- }
1014
- }, [onChange]);
1015
- var onClickWeek = React.useCallback(function (week) {
1016
- if (onChange) {
1017
- onChange(getWeekStringFromWeekData(week));
1018
- }
1019
- }, [onChange]);
1020
- var statePerMonthWithSelection = React.useMemo(function () {
1021
- var weekData = getWeekDataFromWeekString(value);
1022
- return weekData
1023
- ? addWeekRangeHighlights(statePerMonth, weekData)
1024
- : statePerMonth;
1025
- }, [value, statePerMonth]);
1026
- var date = React.useMemo(function () {
1027
- var week = getWeekDataFromWeekString(value);
1028
- if (!week) {
1029
- return new Date();
1030
- }
1031
- return week.days[0].date;
1032
- }, [value]);
1033
- return {
1034
- statePerMonth: statePerMonthWithSelection,
1035
- date: date,
1036
- dateInFocus: dateInFocus,
1037
- setDateInFocus: setDateInFocus,
1038
- onClickDay: onClickDay,
1039
- onClickWeek: onClickWeek,
1040
- currentPanel: currentPanel,
1041
- setCurrentPanel: setCurrentPanel,
1042
- };
1043
- };
1044
- var getWeekStringFromWeekData = function (week) {
1045
- if (!week) {
1046
- return undefined;
1047
- }
1048
- return "".concat(week.endYear, "-").concat(week.weekNumber);
1049
- };
1050
- var getWeekDataFromWeekString = function (week) {
1051
- if (!week) {
1052
- return undefined;
1053
- }
1054
- var parts = week.split("-");
1055
- var weekNumber = parseInt(parts[1], 10);
1056
- var year = parseInt(parts[0], 10);
1057
- return getWeekForDate(getStartDateOfISOWeek(weekNumber, year));
1058
- };
1059
-
1060
- function SingleWeekCalendar(props) {
1061
- var singleWeekSelectionProps = useSingleWeekSelection(props);
1062
- return (React__namespace.createElement(CalendarWithMonthSwitcher, __assign({}, props, singleWeekSelectionProps)));
1063
- }
1064
-
1065
- var removeDateIfExist = function (list, date) {
1066
- return list.filter(function (item) { return !dateFns.isSameDay(item, date); });
1067
- };
1068
- var listContainsDate = function (list, date) {
1069
- return !!list.find(function (item) { return dateFns.isSameDay(item, date); });
1070
- };
1071
-
1072
- var useDateRangeExclusionSelection = function (_a) {
1073
- var value = _a.value, onValueChange = _a.onValueChange, statePerMonth = _a.statePerMonth, onChangePanel = _a.onChangePanel;
1074
- var _b = React.useState(), dateRange = _b[0], setDateRange = _b[1];
1075
- var _c = React.useState("startDate"), focusedInput = _c[0], setFocusedInput = _c[1];
1076
- var _d = useInternalPanelState(onChangePanel), currentPanel = _d.currentPanel, setCurrentPanel = _d.setCurrentPanel;
1077
- var _e = React.useState(function () { var _a; return (_a = (focusedInput && (value === null || value === void 0 ? void 0 : value[focusedInput]))) !== null && _a !== void 0 ? _a : new Date(); }), dateInFocus = _e[0], setDateInFocus = _e[1];
1078
- var onChangeHandler = React.useCallback(function (value) {
1079
- setDateRange(value);
1080
- var startDate = value.startDate, endDate = value.endDate;
1081
- if (onValueChange) {
1082
- if (startDate && endDate) {
1083
- var dates = dateFns.eachDayOfInterval({ start: startDate, end: endDate });
1084
- onValueChange(dates);
1085
- }
1086
- else if (startDate) {
1087
- onValueChange([startDate]);
1088
- }
1089
- else if (endDate) {
1090
- onValueChange([endDate]);
1091
- }
1092
- }
1093
- }, [onValueChange]);
1094
- var onClickDayRange = useDateRangeOnClickDayHandler(dateRange, onChangeHandler, focusedInput, setFocusedInput);
1095
- var onClickDay = React.useCallback(function (day, userData, ev) {
1096
- if (onValueChange) {
1097
- if (ev.ctrlKey || ev.metaKey) {
1098
- if (!value) {
1099
- onValueChange([day.date]);
1100
- }
1101
- else if (listContainsDate(value, day.date)) {
1102
- onValueChange(removeDateIfExist(value, day.date));
1103
- }
1104
- else {
1105
- onValueChange(__spreadArray(__spreadArray([], value, true), [day.date], false));
1106
- }
1107
- }
1108
- else {
1109
- onClickDayRange(day, userData, ev);
1110
- }
1111
- }
1112
- }, [onValueChange, onClickDayRange, value]);
1113
- var statePerMonthWithSelectedDate = React.useMemo(function () {
1114
- return addHighlighting(statePerMonth, value);
1115
- }, [statePerMonth, value]);
1116
- return {
1117
- onClickDay: onClickDay,
1118
- statePerMonth: statePerMonthWithSelectedDate,
1119
- currentPanel: currentPanel,
1120
- setCurrentPanel: setCurrentPanel,
1121
- dateInFocus: dateInFocus,
1122
- setDateInFocus: setDateInFocus,
1123
- };
1124
- };
1125
- var addHighlighting = function (statePerMonth, dateList) {
1126
- if (!dateList) {
1127
- return statePerMonth;
1128
- }
1129
- return dateList.reduce(function (statePerMonth, date) {
1130
- return addDayStateHighlights(statePerMonth, date, ["selected"]);
1131
- }, statePerMonth);
1132
- };
1133
-
1134
- function DateRangeExclusionCalendar(props) {
1135
- var selectionProps = useDateRangeExclusionSelection(props);
1136
- return React__namespace.createElement(CalendarWithMonthSwitcher, __assign({}, props, selectionProps));
1137
- }
1138
-
1139
- var defaultPopoverPlacement = "bottom";
1140
-
1141
- var useCalendarPopoverUpdater = function () {
1142
- var _a = tooltip.useTippyInstance(), tippyRef = _a[0], tippyInstanceRef = _a[1];
1143
- var onChangePanel = React.useCallback(function () {
1144
- var _a, _b;
1145
- (_b = (_a = tippyInstanceRef.current) === null || _a === void 0 ? void 0 : _a.popperInstance) === null || _b === void 0 ? void 0 : _b.update();
1146
- }, [tippyInstanceRef]);
1147
- return {
1148
- onChangePanel: onChangePanel,
1149
- tippyRef: tippyRef,
1150
- };
1151
- };
1152
-
1153
- var useDateInput = function (onChange, onClose, openOnMount) {
1154
- var _a = React.useState(openOnMount || false), showingCalendar = _a[0], setShowingCalendar = _a[1];
1155
- var showCalendar = React.useCallback(function () {
1156
- setShowingCalendar(true);
1157
- return true;
1158
- }, [setShowingCalendar]);
1159
- var hideCalendar = React.useCallback(function () {
1160
- setShowingCalendar(false);
1161
- if (onClose) {
1162
- onClose();
1163
- }
1164
- }, [setShowingCalendar, onClose]);
1165
- var onSelectDate = React.useCallback(function (date) {
1166
- if (onChange) {
1167
- onChange(date);
1168
- }
1169
- setTimeout(hideCalendar, 150);
1170
- }, [onChange, hideCalendar]);
1171
- return {
1172
- showCalendar: showCalendar,
1173
- hideCalendar: hideCalendar,
1174
- showingCalendar: showingCalendar,
1175
- onSelectDate: onSelectDate,
1176
- };
1177
- };
1178
-
1179
- var defaultMaxDate = "2999-12-31";
1180
-
1181
- var DateInput = function (_a) {
1182
- var _b = _a.displayFormat, displayFormat = _b === void 0 ? DateFormats.fullDate : _b, _c = _a.placeholder, placeholder = _c === void 0 ? "Enter date" : _c, value = _a.value, _d = _a.zIndex, zIndex = _d === void 0 ? 100 : _d, _e = _a.calendarTheme, calendarTheme = _e === void 0 ? defaultCalendarTheme : _e, calendarProps = _a.calendarProps, openOnMount = _a.openOnMount, onClose = _a.onClose, onChange = _a.onChange, portalTarget = _a.portalTarget, variant = _a.variant, width = _a.width, minDate = _a.minDate, _f = _a.maxDate, maxDate = _f === void 0 ? defaultMaxDate : _f, disabled = _a.disabled;
1183
- var _g = useDateInput(onChange, onClose, openOnMount), hideCalendar = _g.hideCalendar, showingCalendar = _g.showingCalendar, onSelectDate = _g.onSelectDate, showCalendar = _g.showCalendar;
1184
- var _h = useCalendarPopoverUpdater(), tippyRef = _h.tippyRef, onChangePanel = _h.onChangePanel;
1185
- return (React__namespace.createElement(core.Box, { width: width },
1186
- React__namespace.createElement(tooltip.Popover, { arrow: false, lazy: true, visible: showingCalendar, onClickOutside: hideCalendar, placement: defaultPopoverPlacement, zIndex: zIndex, appendTo: portalTarget !== null && portalTarget !== void 0 ? portalTarget : "parent", tippyRef: tippyRef, disabled: disabled, content: React__namespace.createElement(SingleDateCalendar, __assign({}, calendarProps, { onChange: onSelectDate, value: value, theme: calendarTheme, onChangePanel: onChangePanel, minDate: minDate, maxDate: maxDate })) },
1187
- React__namespace.createElement(forms.TextInput, { type: "date", contentRight: React__namespace.createElement(core.Row, { alignItems: "center" },
1188
- React__namespace.createElement(elements.FlatButton, { size: "small", disabled: disabled, leftIcon: faCalendarAlt.faCalendarAlt, onClick: showCalendar })), onFocus: showCalendar, onClickRight: showCalendar, value: value ? dateFns.format(value, displayFormat) : "", placeholder: placeholder, size: 9, disabled: disabled, autoFocus: openOnMount, variant: variant, min: minDate, max: maxDate }))));
1189
- };
1190
-
1191
- var useDateRangeInput = function (value, onValueChange) {
1192
- var startDateInputRef = React.useRef(null);
1193
- var endDateInputRef = React.useRef(null);
1194
- var _a = React.useState(false), showingCalendar = _a[0], setShowingCalendar = _a[1];
1195
- var _b = React.useState(undefined), focusedInput = _b[0], setFocusedInput = _b[1];
1196
- var showCalendarStartDate = React.useCallback(function () {
1197
- setFocusedInput("startDate");
1198
- setShowingCalendar(true);
1199
- return true;
1200
- }, [setFocusedInput, setShowingCalendar]);
1201
- var showCalendarEndDate = React.useCallback(function () {
1202
- setFocusedInput("endDate");
1203
- setShowingCalendar(true);
1204
- return true;
1205
- }, [setFocusedInput, setShowingCalendar]);
1206
- var hideCalendar = React.useCallback(function () {
1207
- setShowingCalendar(false);
1208
- }, [setShowingCalendar]);
1209
- var onClickDay = React.useCallback(function (day) {
1210
- if (focusedInput === "startDate") {
1211
- onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange({
1212
- startDate: day.date,
1213
- endDate: value === null || value === void 0 ? void 0 : value.endDate,
1214
- });
1215
- if (!(value === null || value === void 0 ? void 0 : value.endDate)) {
1216
- setFocusedInput("endDate");
1217
- endDateInputRef.current && endDateInputRef.current.focus();
1218
- }
1219
- else {
1220
- setTimeout(hideCalendar, 150);
1221
- }
1222
- }
1223
- else if (focusedInput === "endDate") {
1224
- onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange({
1225
- startDate: value === null || value === void 0 ? void 0 : value.startDate,
1226
- endDate: day.date,
1227
- });
1228
- if (!(value === null || value === void 0 ? void 0 : value.startDate)) {
1229
- setFocusedInput("startDate");
1230
- startDateInputRef.current && startDateInputRef.current.focus();
1231
- }
1232
- else {
1233
- setTimeout(hideCalendar, 150);
1234
- }
1235
- }
1236
- }, [focusedInput, onValueChange, setFocusedInput, hideCalendar, value]);
1237
- var startDateIsAfterEnd = React.useMemo(function () {
1238
- return (value === null || value === void 0 ? void 0 : value.startDate) &&
1239
- (value === null || value === void 0 ? void 0 : value.endDate) &&
1240
- dateFns.isAfter(value.startDate, value.endDate);
1241
- }, [value === null || value === void 0 ? void 0 : value.startDate, value === null || value === void 0 ? void 0 : value.endDate]);
1242
- return {
1243
- showingCalendar: showingCalendar,
1244
- hideCalendar: hideCalendar,
1245
- showCalendarEndDate: showCalendarEndDate,
1246
- showCalendarStartDate: showCalendarStartDate,
1247
- focusedInput: focusedInput,
1248
- setFocusedInput: setFocusedInput,
1249
- startDateInputRef: startDateInputRef,
1250
- endDateInputRef: endDateInputRef,
1251
- onClickDay: onClickDay,
1252
- startDateIsAfterEnd: startDateIsAfterEnd,
1253
- };
1254
- };
1255
-
1256
- /**
1257
- * @deprecated Please use DateRangeDualTextInput instead.
1258
- */
1259
- var DateRangeInput = function (_a) {
1260
- var _b = _a.displayFormat, displayFormat = _b === void 0 ? DateFormats.fullDate : _b, _c = _a.placeholderStartDate, placeholderStartDate = _c === void 0 ? "Start date" : _c, _d = _a.placeholderEndDate, placeholderEndDate = _d === void 0 ? "End date" : _d, portalTarget = _a.portalTarget, value = _a.value, onValueChange = _a.onValueChange, _e = _a.zIndex, zIndex = _e === void 0 ? 100 : _e, width = _a.width, _f = _a.calendarTheme, calendarTheme = _f === void 0 ? defaultCalendarTheme : _f, calendarProps = _a.calendarProps, minDate = _a.minDate, _g = _a.maxDate, maxDate = _g === void 0 ? defaultMaxDate : _g, disabled = _a.disabled;
1261
- var _h = React.useState(function () { var _a; return (_a = (focusedInput && (value === null || value === void 0 ? void 0 : value[focusedInput]))) !== null && _a !== void 0 ? _a : new Date(); }), dateInFocus = _h[0], setDateInFocus = _h[1];
1262
- var _j = React.useState("calendar"), currentPanel = _j[0], setCurrentPanel = _j[1];
1263
- var _k = useDateRangeInput(value, onValueChange), hideCalendar = _k.hideCalendar, showCalendarEndDate = _k.showCalendarEndDate, showCalendarStartDate = _k.showCalendarStartDate, showingCalendar = _k.showingCalendar, focusedInput = _k.focusedInput, startDateInputRef = _k.startDateInputRef, endDateInputRef = _k.endDateInputRef, onClickDay = _k.onClickDay, startDateIsAfterEnd = _k.startDateIsAfterEnd;
1264
- var statePerMonth = React.useMemo(function () {
1265
- return buildDayStateForDateRange(undefined, value === null || value === void 0 ? void 0 : value.startDate, value === null || value === void 0 ? void 0 : value.endDate);
1266
- }, [value]);
1267
- return (React__namespace.createElement(tooltip.Popover, { arrow: false, lazy: true, disabled: disabled, visible: showingCalendar, zIndex: zIndex, placement: defaultPopoverPlacement, appendTo: portalTarget !== null && portalTarget !== void 0 ? portalTarget : "parent", onClickOutside: hideCalendar, content: React__namespace.createElement(CalendarWithMonthSwitcher, __assign({}, calendarProps, { dateInFocus: dateInFocus, setDateInFocus: setDateInFocus, statePerMonth: statePerMonth, theme: calendarTheme, onClickDay: onClickDay, currentPanel: currentPanel, setCurrentPanel: setCurrentPanel, minDate: minDate, maxDate: maxDate })) },
1268
- React__namespace.createElement(core.Row, { alignItems: "center" },
1269
- React__namespace.createElement(forms.TextInput, { iconLeft: faCalendarAlt$1.faCalendarAlt, onFocus: showCalendarStartDate, value: (value === null || value === void 0 ? void 0 : value.startDate) ? dateFns.format(value.startDate, displayFormat) : "", placeholder: placeholderStartDate, width: width, disabled: disabled, inputRef: startDateInputRef, size: 9, variant: startDateIsAfterEnd ? "error" : undefined }),
1270
- React__namespace.createElement(core.Space, null),
1271
- React__namespace.createElement(elements.Icon, { icon: faLongArrowAltRight.faLongArrowAltRight, color: theme.cssColor("--lhds-color-ui-500"), size: 14 }),
1272
- React__namespace.createElement(core.Space, null),
1273
- React__namespace.createElement(forms.TextInput, { iconLeft: faCalendarAlt$1.faCalendarAlt, onFocus: showCalendarEndDate, value: (value === null || value === void 0 ? void 0 : value.endDate) ? dateFns.format(value.endDate, displayFormat) : "", placeholder: placeholderEndDate, width: width, disabled: disabled, inputRef: endDateInputRef, size: 9, variant: startDateIsAfterEnd ? "error" : undefined }))));
1274
- };
1275
-
1276
- var DateTextInput = function (_a) {
1277
- var calendarProps = _a.calendarProps, _b = _a.closeOnCalendarSelectDate, closeOnCalendarSelectDate = _b === void 0 ? true : _b, _c = _a.dateFormat, dateFormat = _c === void 0 ? DateFormats.fullDate : _c; _a.disableCalender; var onValueChange = _a.onValueChange, _e = _a.placeholder, placeholder = _e === void 0 ? "yyyy-mm-dd" : _e, portalTarget = _a.portalTarget, value = _a.value, _f = _a.width, width = _f === void 0 ? "130px" : _f, _g = _a.zIndex, zIndex = _g === void 0 ? 100 : _g, _h = _a.calendarTheme, calendarTheme = _h === void 0 ? defaultCalendarTheme : _h, _j = _a.hideCalenderIcon, hideCalenderIcon = _j === void 0 ? false : _j, minDate = _a.minDate, _k = _a.maxDate, maxDate = _k === void 0 ? defaultMaxDate : _k, variant = _a.variant, props = __rest(_a, ["calendarProps", "closeOnCalendarSelectDate", "dateFormat", "disableCalender", "onValueChange", "placeholder", "portalTarget", "value", "width", "zIndex", "calendarTheme", "hideCalenderIcon", "minDate", "maxDate", "variant"]);
1278
- var _l = React.useState(false), open = _l[0], setOpen = _l[1];
1279
- var _m = useCalendarPopoverUpdater(), tippyRef = _m.tippyRef, onChangePanel = _m.onChangePanel;
1280
- var toggleCalendar = React.useCallback(function () {
1281
- setOpen(!open);
1282
- }, [setOpen, open]);
1283
- var hideCalendar = React.useCallback(function () {
1284
- setOpen(false);
1285
- }, [setOpen]);
1286
- var onValueChangeHandler = React.useCallback(function (value) {
1287
- if (onValueChange) {
1288
- onValueChange(value);
1289
- }
1290
- }, [onValueChange]);
1291
- var onCalendarSelectDate = React.useCallback(function (date) {
1292
- if (date) {
1293
- onValueChangeHandler(dateFns.format(date, dateFormat));
1294
- if (closeOnCalendarSelectDate) {
1295
- setTimeout(function () { return setOpen(!open); }, 200);
1296
- }
1297
- }
1298
- }, [onValueChangeHandler, dateFormat, closeOnCalendarSelectDate, setOpen, open]);
1299
- var inValidInput = !!value && !/^[-/\\.0-9]+$/.test(value);
1300
- var dateIsValid = !!value && dateFns.isValid(dateFns.parse(value, dateFormat, new Date()));
1301
- var userInputCorrectLength = !!value && value.length >= dateFormat.length;
1302
- var invalid = (userInputCorrectLength && !dateIsValid) || inValidInput;
1303
- return (React__namespace.createElement(core.Box, { width: width },
1304
- React__namespace.createElement(tooltip.Popover, { arrow: false, lazy: true, visible: open, zIndex: zIndex, appendTo: portalTarget !== null && portalTarget !== void 0 ? portalTarget : "parent", placement: defaultPopoverPlacement, onClickOutside: hideCalendar, tippyRef: tippyRef, content: React__namespace.createElement(SingleDateCalendar, __assign({}, calendarProps, { onChange: onCalendarSelectDate, onChangePanel: onChangePanel, value: value && dateIsValid
1305
- ? dateFns.parse(value, dateFormat, new Date())
1306
- : undefined, minDate: minDate, maxDate: maxDate, theme: calendarTheme })) },
1307
- React__namespace.createElement(forms.TextInput, __assign({}, props, { variant: invalid ? "error" : variant, disableContentPaddingRight: true, contentRight: !hideCalenderIcon ? (React__namespace.createElement(core.Row, { alignItems: "center", indent: 0.5 },
1308
- React__namespace.createElement(elements.FlatButton, { size: "small", disabled: props.disabled, leftIcon: faCalendarAlt$1.faCalendarAlt, onClick: toggleCalendar }))) : undefined, onValueChange: onValueChangeHandler, placeholder: placeholder, value: value || "", min: minDate, max: maxDate, size: 10 })))));
1309
- };
1310
-
1311
- var formatHours = function (hours) {
1312
- if (hours === "") {
1313
- return "00";
1314
- }
1315
- var h = parseInt(hours, 10);
1316
- if (isNaN(h)) {
1317
- throw new Error("Hours is not a number");
1318
- }
1319
- if (h < 0 || h > 23) {
1320
- throw new Error("Hours is an invalid number");
1321
- }
1322
- switch (hours.length) {
1323
- case 1:
1324
- return "0".concat(h);
1325
- case 2:
1326
- return hours;
1327
- default:
1328
- throw new Error("Invalid hour string");
1329
- }
1330
- };
1331
- var formatMinutes = function (minutes) {
1332
- if (minutes === "") {
1333
- return "00";
1334
- }
1335
- var m = parseInt(minutes, 10);
1336
- if (isNaN(m)) {
1337
- throw new Error("Minutes is not a number");
1338
- }
1339
- if (m < 0 || m > 59) {
1340
- throw new Error("Minutes is an invalid number");
1341
- }
1342
- switch (minutes.length) {
1343
- case 1:
1344
- return "0".concat(m);
1345
- case 2:
1346
- return minutes;
1347
- default:
1348
- throw new Error("Invalid minute string");
1349
- }
1350
- };
1351
- var formatTimeString = function (time) {
1352
- if (!validUserInput(time)) {
1353
- return { time: time, success: false };
1354
- }
1355
- var arr = time && time.split(/-|:|,|;|[/]|[.]| /); // consider all these chars as user input separator
1356
- if (arr && arr.length === 2) {
1357
- try {
1358
- var hours = formatHours(arr[0]);
1359
- var minutes = formatMinutes(arr[1]);
1360
- return { time: "".concat(hours, ":").concat(minutes), success: true };
1361
- }
1362
- catch (_a) {
1363
- return { time: time, success: false };
1364
- }
1365
- }
1366
- else if (arr && arr.length === 1) {
1367
- var hours = 0;
1368
- var minutes = 0;
1369
- switch (time.length) {
1370
- case 1:
1371
- return { time: "0".concat(time, ":00"), success: true };
1372
- case 2:
1373
- var timeNumber = parseInt(arr[0], 10);
1374
- if (timeNumber >= 0 && timeNumber < 24) {
1375
- return { time: "".concat(time, ":00"), success: true };
1376
- }
1377
- else if (timeNumber >= 24 && timeNumber < 59) {
1378
- return { time: "00:".concat(time), success: true };
1379
- }
1380
- return { time: time, success: false };
1381
- case 3:
1382
- minutes = parseInt(time.substr(1, 2), 10);
1383
- if (minutes >= 0 && minutes <= 59) {
1384
- return {
1385
- time: "0".concat(time.substr(0, 1), ":").concat(time.substr(1, 2)),
1386
- success: true,
1387
- };
1388
- }
1389
- return { time: time, success: false };
1390
- case 4:
1391
- hours = parseInt(time.substr(0, 2), 10);
1392
- minutes = parseInt(time.substr(2, 2), 10);
1393
- if (hours < 0 || hours > 23) {
1394
- return { time: time, success: false };
1395
- }
1396
- if (minutes < 0 || minutes > 59) {
1397
- return { time: time, success: false };
1398
- }
1399
- return {
1400
- time: "".concat(time.substr(0, 2), ":").concat(time.substr(2, 2)),
1401
- success: true,
1402
- };
1403
- default:
1404
- return { time: time, success: false };
1405
- }
1406
- }
1407
- return { time: time, success: false };
1408
- };
1409
- var validUserInput = function (input) {
1410
- if (input) {
1411
- return /^[-:.,/; 0-9]+$/.test(input);
1412
- }
1413
- return true;
1414
- };
1415
-
1416
- /**
1417
- * @deprecated
1418
- */
1419
- var TimeTextInput = function (_a) {
1420
- var onValueChange = _a.onValueChange, _b = _a.showPlaceholder, showPlaceholder = _b === void 0 ? true : _b, _c = _a.useIcon, useIcon = _c === void 0 ? true : _c, value = _a.value, _d = _a.width, width = _d === void 0 ? "85px" : _d, variant = _a.variant, props = __rest(_a, ["onValueChange", "showPlaceholder", "useIcon", "value", "width", "variant"]);
1421
- var _e = React.useState(function () { return validUserInput(value); }), valid = _e[0], setValid = _e[1];
1422
- var timeFormat = "hh:mm";
1423
- var onBlur = React.useCallback(function () {
1424
- if (value) {
1425
- var formattedResult = formatTimeString(value);
1426
- setValid(formattedResult.success);
1427
- if (formattedResult.success) {
1428
- if (onValueChange) {
1429
- onValueChange(formattedResult.time);
1430
- }
1431
- }
1432
- }
1433
- }, [value, onValueChange, setValid]);
1434
- var onChangeHandler = React.useCallback(function (ev) {
1435
- var time = ev.target.value;
1436
- var validInput = validUserInput(time);
1437
- setValid(validInput && time.length <= timeFormat.length);
1438
- if (onValueChange) {
1439
- onValueChange(time);
1440
- }
1441
- }, [onValueChange, setValid]);
1442
- return (React__namespace.createElement(forms.TextInput, __assign({}, props, { type: "time", variant: !valid ? "error" : variant, iconLeft: useIcon ? faClock.faClock : undefined, value: value, placeholder: showPlaceholder ? timeFormat : undefined, onChange: onChangeHandler, onBlur: onBlur, width: width })));
1443
- };
1444
-
1445
- var DualTextInput = function (_a) {
1446
- var autoFocusLeft = _a.autoFocusLeft, autoFocusRight = _a.autoFocusRight, onEsc = _a.onEsc, onEnter = _a.onEnter, onValueChangeLeft = _a.onValueChangeLeft, onValueChangeRight = _a.onValueChangeRight, separatorIcon = _a.separatorIcon, placeholderLeft = _a.placeholderLeft, placeholderRight = _a.placeholderRight, typeLeft = _a.typeLeft, typeRight = _a.typeRight, onChangeLeft = _a.onChangeLeft, onChangeRight = _a.onChangeRight, valueLeft = _a.valueLeft, valueRight = _a.valueRight, minLeft = _a.minLeft, maxLeft = _a.maxLeft, minRight = _a.minRight, maxRight = _a.maxRight, onClickLeft = _a.onClickLeft, onClickRight = _a.onClickRight, onClickCalendar = _a.onClickCalendar, onClickArrowDown = _a.onClickArrowDown, onBlurLeft = _a.onBlurLeft, onBlurRight = _a.onBlurRight, onFocusLeft = _a.onFocusLeft, onFocusRight = _a.onFocusRight, inputRefLeft = _a.inputRefLeft, inputRefRight = _a.inputRefRight, variant = _a.variant, variantLeft = _a.variantLeft, variantRight = _a.variantRight, onBlur = _a.onBlur, showPresets = _a.showPresets, widthLeft = _a.widthLeft, widthRight = _a.widthRight, disabled = _a.disabled;
1447
- var focusCounter = React.useRef(0);
1448
- var tryTriggerOnBlur = React.useMemo(function () {
1449
- return lodash.debounce(function (focusCounter) {
1450
- if (focusCounter === 0) {
1451
- onBlur === null || onBlur === void 0 ? void 0 : onBlur();
1452
- }
1453
- }, 10);
1454
- }, [onBlur]);
1455
- var focusLeftHandler = React.useCallback(function (ev) {
1456
- focusCounter.current++;
1457
- tryTriggerOnBlur(focusCounter.current);
1458
- if (onFocusLeft) {
1459
- onFocusLeft(ev);
1460
- }
1461
- }, [onFocusLeft, focusCounter, tryTriggerOnBlur]);
1462
- var focusRightHandler = React.useCallback(function (ev) {
1463
- focusCounter.current++;
1464
- tryTriggerOnBlur(focusCounter.current);
1465
- if (onFocusRight) {
1466
- onFocusRight(ev);
1467
- }
1468
- }, [onFocusRight, focusCounter, tryTriggerOnBlur]);
1469
- var blurLeftHandler = React.useCallback(function (ev) {
1470
- focusCounter.current--;
1471
- tryTriggerOnBlur(focusCounter.current);
1472
- if (onBlurLeft) {
1473
- onBlurLeft(ev);
1474
- }
1475
- }, [onBlurLeft, focusCounter, tryTriggerOnBlur]);
1476
- var blurRightHandler = React.useCallback(function (ev) {
1477
- focusCounter.current--;
1478
- tryTriggerOnBlur(focusCounter.current);
1479
- if (onBlurRight) {
1480
- onBlurRight(ev);
1481
- }
1482
- }, [onBlurRight, focusCounter, tryTriggerOnBlur]);
1483
- return (React__namespace.createElement(core.Box, null,
1484
- React__namespace.createElement(forms.TextInputBox, { disableContentPaddingRight: true, disabled: disabled, variant: variant, contentRight: React__namespace.createElement(core.Row, { alignItems: "center" },
1485
- React__namespace.createElement(core.Indent, { num: 0.5 },
1486
- React__namespace.createElement(elements.FlatButton, { leftIcon: faCalendarAlt.faCalendarAlt, onClick: onClickCalendar, disabled: disabled, size: "small" })),
1487
- showPresets ? (React__namespace.createElement(React__namespace.Fragment, null,
1488
- React__namespace.createElement(core.Row, { height: "22px" },
1489
- React__namespace.createElement(core.SeparatorLine, { vertical: true })),
1490
- React__namespace.createElement(core.Indent, { num: 0.5 },
1491
- React__namespace.createElement(elements.FlatButton, { leftIcon: faAngleDown.faAngleDown, onClick: onClickArrowDown, disabled: disabled, size: "small" })))) : null) },
1492
- React__namespace.createElement(core.Box, { width: widthLeft },
1493
- React__namespace.createElement(forms.TextInput, { onEsc: onEsc, onEnter: onEnter, onClick: onClickLeft, disabled: disabled, hideBorder: true, placeholder: placeholderLeft, value: valueLeft, onValueChange: onValueChangeLeft, onChange: onChangeLeft, onBlur: blurLeftHandler, onFocus: focusLeftHandler, inputRef: inputRefLeft, variant: variantLeft, type: typeLeft, autoFocus: autoFocusLeft, min: minLeft, max: maxLeft })),
1494
- React__namespace.createElement(core.Row, { indent: 0.5, alignItems: "center", justifyContent: "center" },
1495
- React__namespace.createElement(elements.Icon, { icon: separatorIcon, size: 12, color: theme.cssColor("--lhds-color-ui-500") })),
1496
- React__namespace.createElement(core.Box, { width: widthRight },
1497
- React__namespace.createElement(forms.TextInput, { onEsc: onEsc, onEnter: onEnter, onClick: onClickRight, disabled: disabled, hideBorder: true, placeholder: placeholderRight, value: valueRight, onValueChange: onValueChangeRight, onChange: onChangeRight, onBlur: blurRightHandler, onFocus: focusRightHandler, inputRef: inputRefRight, variant: variantRight, type: typeRight, autoFocus: autoFocusRight, min: minRight, max: maxRight })))));
1498
- };
1499
-
1500
- var transformTimeStringToNumber = function (time) {
1501
- if (time == null) {
1502
- throw new Error("Time is not set.");
1503
- }
1504
- if (time === "") {
1505
- throw new Error("Time is empty.");
1506
- }
1507
- var parts = time.split(":");
1508
- if (parts.length !== 2) {
1509
- throw new Error("Invalid time.");
1510
- }
1511
- if (parts[1].length !== 2) {
1512
- throw new Error("Invalid time.");
1513
- }
1514
- if (parts[0].length < 1 || parts[0].length > 2) {
1515
- throw new Error("Invalid time.");
1516
- }
1517
- var hours = parseInt(parts[0], 10);
1518
- var minutes = parseInt(parts[1], 10);
1519
- if (isNaN(hours)) {
1520
- throw new Error("Invalid time.");
1521
- }
1522
- if (isNaN(minutes)) {
1523
- throw new Error("Invalid time.");
1524
- }
1525
- if (hours < 0 || hours > 23) {
1526
- throw new Error("Invalid time.");
1527
- }
1528
- if (minutes < 0 || minutes > 59) {
1529
- throw new Error("Invalid time.");
1530
- }
1531
- return hours * 100 + minutes;
1532
- };
1533
- var isValidTimeString = function (time) {
1534
- try {
1535
- transformTimeStringToNumber(time);
1536
- return true;
1537
- }
1538
- catch (e) {
1539
- return false;
1540
- }
1541
- };
1542
- var getHoursAndMinutesFromTimeString = function (value) {
1543
- if (value && isValidTimeString(value)) {
1544
- var p = value.split(":");
1545
- return {
1546
- hour: core.parseIntElseUndefined(p[0]),
1547
- minute: core.parseIntElseUndefined(p[1]),
1548
- };
1549
- }
1550
- return {
1551
- hour: undefined,
1552
- minute: undefined,
1553
- };
1554
- };
1555
- var transformTimeInDateToTimeString = function (date) {
1556
- return "".concat(formatHours(String(date.getHours())), ":").concat(formatMinutes(String(date.getMinutes())));
1557
- };
1558
-
1559
- var css_248z = ".TimePicker-module_timePicker__1ElGu {\n overflow: hidden;\n width: 180px;\n}\n\n.TimePicker-module_timePickerColumn__2vfuE {\n overflow-y: hidden;\n flex: 1;\n}\n\n.TimePicker-module_timePickerColumn__2vfuE:hover {\n overflow-y: scroll;\n }\n";
1560
- var styles = {"timePicker":"TimePicker-module_timePicker__1ElGu","timePickerColumn":"TimePicker-module_timePickerColumn__2vfuE"};
1561
- styleInject(css_248z);
1562
-
1563
- var TimePickerCell = function (_a) {
1564
- var onClick = _a.onClick, item = _a.item, selected = _a.selected, columnRef = _a.columnRef, canScrollRef = _a.canScrollRef;
1565
- var ref = React.useRef(null);
1566
- React.useEffect(function scrollToSelectedItem() {
1567
- if (selected &&
1568
- columnRef.current &&
1569
- ref.current &&
1570
- canScrollRef.current) {
1571
- var targetScroll = ref.current.scrollHeight * Math.max(item - 2, 0);
1572
- columnRef.current.scrollTo(0, targetScroll);
1573
- canScrollRef.current = false;
1574
- }
1575
- }, [columnRef, item, selected, canScrollRef]);
1576
- return (React__namespace.createElement(core.Row, { width: "64px", justifyContent: "center", spacing: 0.5, indent: 0.5, ref: ref }, selected ? (React__namespace.createElement(elements.PrimaryButton, { label: String(item), onClick: function () { return onClick && onClick(item); } })) : (React__namespace.createElement(elements.FlatButton, { label: String(item), onClick: function () { return onClick && onClick(item); } }))));
1577
- };
1578
-
1579
- var TimePickerColumn = function (_a) {
1580
- var onClick = _a.onClick, items = _a.items, selectedItem = _a.selectedItem, canScrollRef = _a.canScrollRef;
1581
- var columnRef = React.useRef(null);
1582
- return (React__namespace.createElement(core.Column, { className: styles.timePickerColumn, ref: columnRef }, items.map(function (item) { return (React__namespace.createElement(TimePickerCell, { key: item, item: item, onClick: onClick, selected: item === selectedItem, columnRef: columnRef, canScrollRef: canScrollRef })); })));
1583
- };
1584
-
1585
- var hours = lodash.range(0, 24);
1586
- var minutes = lodash.range(0, 60);
1587
- var TimePicker = function (_a) {
1588
- var value = _a.value, onValueChange = _a.onValueChange;
1589
- var canScrollRef = React.useRef(true);
1590
- var _b = React.useState(undefined), hour = _b[0], setHour = _b[1];
1591
- var _c = React.useState(undefined), minute = _c[0], setMinute = _c[1];
1592
- React.useEffect(function () {
1593
- if (value) {
1594
- var _a = getHoursAndMinutesFromTimeString(value), minute_1 = _a.minute, hour_1 = _a.hour;
1595
- setHour(hour_1);
1596
- setMinute(minute_1);
1597
- }
1598
- }, [value]);
1599
- var onClickHour = React.useCallback(function (h) {
1600
- setHour(h);
1601
- onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange("".concat(formatHours(String(h !== null && h !== void 0 ? h : 0)), ":").concat(formatMinutes(String(minute !== null && minute !== void 0 ? minute : 0))));
1602
- }, [minute, onValueChange]);
1603
- var onClickMinutes = React.useCallback(function (m) {
1604
- setMinute(m);
1605
- onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange("".concat(formatHours(String(hour !== null && hour !== void 0 ? hour : 0)), ":").concat(formatMinutes(String(m !== null && m !== void 0 ? m : 0))));
1606
- }, [hour, onValueChange]);
1607
- return (React__namespace.createElement(core.Row, { className: styles.timePicker },
1608
- React__namespace.createElement(TimePickerColumn, { items: hours, onClick: onClickHour, selectedItem: hour, canScrollRef: canScrollRef }),
1609
- React__namespace.createElement(core.Indent, null),
1610
- React__namespace.createElement(TimePickerColumn, { items: minutes, onClick: onClickMinutes, selectedItem: minute, canScrollRef: canScrollRef })));
1611
- };
1612
-
1613
- var useDateRangeEffects$1 = function (date, setDateInFocus, dateInputRef) {
1614
- React.useEffect(function moveFocusedDateWhenDateChanges() {
1615
- if (date) {
1616
- setDateInFocus(date);
1617
- }
1618
- }, [date, setDateInFocus]);
1619
- React.useEffect(function updateDateFieldWhenValueChanges() {
1620
- if (dateInputRef.current) {
1621
- if (date) {
1622
- dateInputRef.current.valueAsDate = new Date(Date.UTC(date.getFullYear(), date.getMonth(), date.getDate()));
1623
- }
1624
- else {
1625
- dateInputRef.current.valueAsDate = null;
1626
- }
1627
- }
1628
- }, [date, dateInputRef]);
1629
- };
1630
-
1631
- var useDateRangeHandlers$1 = function (date, onValueChange, _a, dateInputRef) {
1632
- var setDateInFocus = _a.setDateInFocus, showCalendarInternal = _a.showCalendarInternal, hideCalendarInternal = _a.hideCalendarInternal, setFirstFocusedInput = _a.setFirstFocusedInput, setCurrentPanel = _a.setCurrentPanel, localTime = _a.localTime, setLocalTime = _a.setLocalTime, localDate = _a.localDate, setLocalDate = _a.setLocalDate;
1633
- var onChangeDate = React.useCallback(function (incomingDate) {
1634
- if (!incomingDate) {
1635
- return;
1636
- }
1637
- var newDate = new Date(incomingDate);
1638
- if (date) {
1639
- // Full date is available
1640
- newDate.setHours(date.getHours());
1641
- newDate.setMinutes(date.getMinutes());
1642
- onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange(newDate);
1643
- setLocalDate(undefined);
1644
- }
1645
- else if (localTime) {
1646
- // Only time has been selected
1647
- var _a = getHoursAndMinutesFromTimeString(localTime), minute = _a.minute, hour = _a.hour;
1648
- newDate.setHours(hour !== null && hour !== void 0 ? hour : 0);
1649
- newDate.setMinutes(minute !== null && minute !== void 0 ? minute : 0);
1650
- onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange(newDate);
1651
- setLocalDate(undefined);
1652
- }
1653
- else {
1654
- // Nothing has been selected
1655
- setLocalDate(newDate);
1656
- }
1657
- setDateInFocus(newDate);
1658
- if (dateInputRef.current) {
1659
- dateInputRef.current.valueAsDate = newDate;
1660
- }
1661
- }, [date, dateInputRef, localTime, onValueChange, setDateInFocus, setLocalDate]);
1662
- var onChangeTime = React.useCallback(function (time) {
1663
- if (!time) {
1664
- return;
1665
- }
1666
- if (date) {
1667
- // Full date is available
1668
- var newTime = getHoursAndMinutesFromTimeString(time);
1669
- var newDate = new Date(date);
1670
- newDate.setHours(newTime.hour || 0);
1671
- newDate.setMinutes(newTime.minute || 0);
1672
- onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange(newDate);
1673
- setLocalTime(undefined);
1674
- }
1675
- else if (localDate) {
1676
- // Only date has already been selected
1677
- var newTime = getHoursAndMinutesFromTimeString(time);
1678
- var newDate = new Date(localDate);
1679
- newDate.setHours(newTime.hour || 0);
1680
- newDate.setMinutes(newTime.minute || 0);
1681
- onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange(newDate);
1682
- setLocalTime(undefined);
1683
- }
1684
- else {
1685
- // Nothing has been selected
1686
- setLocalTime(time);
1687
- }
1688
- }, [onValueChange, date, localDate, setLocalTime]);
1689
- var inputLeftChangeHandler = React.useCallback(function (ev) {
1690
- if (ev.target.value[0] !== "0") {
1691
- onChangeDate(ev.target.valueAsDate);
1692
- }
1693
- }, [onChangeDate]);
1694
- var inputRightChangeHandler = React.useCallback(function (ev) { return onChangeTime(ev.target.value); }, [onChangeTime]);
1695
- var showCalendar = React.useCallback(function () {
1696
- if (date) {
1697
- setDateInFocus(date);
1698
- }
1699
- else {
1700
- setDateInFocus(new Date());
1701
- }
1702
- setCurrentPanel("calendar");
1703
- showCalendarInternal();
1704
- }, [date, setCurrentPanel, showCalendarInternal, setDateInFocus]);
1705
- var hideCalendar = React.useCallback(function () {
1706
- setFirstFocusedInput(undefined);
1707
- hideCalendarInternal();
1708
- }, [setFirstFocusedInput, hideCalendarInternal]);
1709
- return {
1710
- inputLeftChangeHandler: inputLeftChangeHandler,
1711
- inputRightChangeHandler: inputRightChangeHandler,
1712
- hideCalendar: hideCalendar,
1713
- showCalendar: showCalendar,
1714
- onChangeTime: onChangeTime,
1715
- onChangeDate: onChangeDate,
1716
- };
1717
- };
1718
-
1719
- var useInputStates$1 = function (date) {
1720
- var _a = React.useState(undefined), localDate = _a[0], setLocalDate = _a[1];
1721
- var _b = React.useState(undefined), localTime = _b[0], setLocalTime = _b[1];
1722
- var _c = core.useBoolean(false), isCalendarVisible = _c[0], showCalendarInternal = _c[1], hideCalendarInternal = _c[2];
1723
- var _d = core.useBoolean(false), isTimePickerVisible = _d[0], showTimePicker = _d[1], hideTimePicker = _d[2];
1724
- var _e = React.useState(undefined), firstFocusedInput = _e[0], setFirstFocusedInput = _e[1];
1725
- var _f = React.useState(function () { return date !== null && date !== void 0 ? date : new Date(); }), dateInFocus = _f[0], setDateInFocus = _f[1];
1726
- var _g = React.useState("calendar"), currentPanel = _g[0], setCurrentPanel = _g[1];
1727
- return {
1728
- isCalendarVisible: isCalendarVisible,
1729
- showCalendarInternal: showCalendarInternal,
1730
- hideCalendarInternal: hideCalendarInternal,
1731
- firstFocusedInput: firstFocusedInput,
1732
- setFirstFocusedInput: setFirstFocusedInput,
1733
- dateInFocus: dateInFocus,
1734
- setDateInFocus: setDateInFocus,
1735
- currentPanel: currentPanel,
1736
- setCurrentPanel: setCurrentPanel,
1737
- isTimePickerVisible: isTimePickerVisible,
1738
- showTimePicker: showTimePicker,
1739
- hideTimePicker: hideTimePicker,
1740
- localDate: localDate,
1741
- setLocalDate: setLocalDate,
1742
- localTime: localTime,
1743
- setLocalTime: setLocalTime,
1744
- };
1745
- };
1746
-
1747
- var useUserInputHandlers$1 = function (onChangeDate, dateInputRef, showCalendar, hideCalendar, _a) {
1748
- var isCalendarVisible = _a.isCalendarVisible, setCurrentPanel = _a.setCurrentPanel, showTimePicker = _a.showTimePicker, hideTimePicker = _a.hideTimePicker;
1749
- var onFocusLeft = React.useCallback(function () {
1750
- if (!isCalendarVisible) {
1751
- showCalendar();
1752
- }
1753
- setCurrentPanel("calendar");
1754
- hideTimePicker();
1755
- }, [hideTimePicker, isCalendarVisible, setCurrentPanel, showCalendar]);
1756
- var onFocusRight = React.useCallback(function () {
1757
- hideCalendar();
1758
- showTimePicker();
1759
- }, [hideCalendar, showTimePicker]);
1760
- var onClickDay = React.useCallback(function (day) {
1761
- onChangeDate(day.date);
1762
- hideCalendar();
1763
- showTimePicker();
1764
- }, [onChangeDate, hideCalendar, showTimePicker]);
1765
- var onClickArrowButton = React.useCallback(function () {
1766
- setCurrentPanel("presets");
1767
- showCalendar();
1768
- }, [setCurrentPanel, showCalendar]);
1769
- var onClickCalendarButton = React.useCallback(function () {
1770
- var _a;
1771
- if (isCalendarVisible) {
1772
- hideCalendar();
1773
- }
1774
- else {
1775
- (_a = dateInputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
1776
- setCurrentPanel("calendar");
1777
- showCalendar();
1778
- }
1779
- }, [
1780
- isCalendarVisible,
1781
- hideCalendar,
1782
- dateInputRef,
1783
- setCurrentPanel,
1784
- showCalendar,
1785
- ]);
1786
- var onKeyDownHandler = React.useCallback(function (ev) {
1787
- if (ev.key === "Escape") {
1788
- hideCalendar();
1789
- }
1790
- }, [hideCalendar]);
1791
- return {
1792
- onFocusLeft: onFocusLeft,
1793
- onFocusRight: onFocusRight,
1794
- onClickDay: onClickDay,
1795
- onClickArrowButton: onClickArrowButton,
1796
- onClickCalendarButton: onClickCalendarButton,
1797
- onKeyDownHandler: onKeyDownHandler,
1798
- };
1799
- };
1800
-
1801
- var DateTimeInput = function (_a) {
1802
- var value = _a.value, onValueChange = _a.onValueChange, onEnter = _a.onEnter, onEsc = _a.onEsc, onBlur = _a.onBlur, autoFocus = _a.autoFocus, minDate = _a.minDate, _b = _a.widthLeft, widthLeft = _b === void 0 ? 128 : _b, _c = _a.widthRight, widthRight = _c === void 0 ? 80 : _c, _d = _a.maxDate, maxDate = _d === void 0 ? defaultMaxDate : _d, variant = _a.variant, disabled = _a.disabled;
1803
- var dateInputRef = React.useRef(null);
1804
- var timeInputRef = React.useRef(null);
1805
- var states = useInputStates$1(value);
1806
- var setCurrentPanel = states.setCurrentPanel, currentPanel = states.currentPanel, isCalendarVisible = states.isCalendarVisible, dateInFocus = states.dateInFocus, setDateInFocus = states.setDateInFocus, isTimePickerVisible = states.isTimePickerVisible, hideTimePicker = states.hideTimePicker, localTime = states.localTime, localDate = states.localDate;
1807
- var _e = useDateRangeHandlers$1(value, onValueChange, states, dateInputRef), showCalendar = _e.showCalendar, hideCalendar = _e.hideCalendar, inputLeftChangeHandler = _e.inputLeftChangeHandler, inputRightChangeHandler = _e.inputRightChangeHandler, onChangeTime = _e.onChangeTime, onChangeDate = _e.onChangeDate;
1808
- var _f = useUserInputHandlers$1(onChangeDate, dateInputRef, showCalendar, hideCalendar, states), onKeyDownHandler = _f.onKeyDownHandler, onFocusRight = _f.onFocusRight, onFocusLeft = _f.onFocusLeft, onClickDay = _f.onClickDay, onClickCalendarButton = _f.onClickCalendarButton, onClickArrowButton = _f.onClickArrowButton;
1809
- useDateRangeEffects$1(value, setDateInFocus, dateInputRef);
1810
- var statePerMonth = React.useMemo(function () {
1811
- var dateToHighlight = value || localDate;
1812
- if (!dateToHighlight) {
1813
- return {};
1814
- }
1815
- return addDayStateHighlights(undefined, dateToHighlight, [
1816
- "singleSelected",
1817
- "selected",
1818
- ]);
1819
- }, [localDate, value]);
1820
- var hideAll = React.useCallback(function () {
1821
- hideCalendar();
1822
- hideTimePicker();
1823
- }, [hideCalendar, hideTimePicker]);
1824
- var timeValue = React.useMemo(function () { return (value ? transformTimeInDateToTimeString(value) : localTime); }, [value, localTime]);
1825
- var delayedIsCalendarVisible = core.useDelayedFalse(isCalendarVisible, 300);
1826
- var delayedIsTimePickerVisible = core.useDelayedFalse(isTimePickerVisible, 300);
1827
- return (React__namespace.createElement(core.Box, { onKeyDown: onKeyDownHandler },
1828
- React__namespace.createElement(tooltip.Popover, { arrow: false, lazy: true, disabled: disabled, placement: defaultPopoverPlacement, visible: isCalendarVisible || isTimePickerVisible, onClickOutside: hideAll, content: (delayedIsCalendarVisible || delayedIsTimePickerVisible) && (React__namespace.createElement(core.Column, null, delayedIsCalendarVisible ? (React__namespace.createElement(CalendarWithMonthSwitcher, { statePerMonth: statePerMonth, onClickDay: onClickDay, dateInFocus: dateInFocus, setDateInFocus: setDateInFocus, currentPanel: currentPanel, setCurrentPanel: setCurrentPanel, minDate: minDate, maxDate: maxDate })) : delayedIsTimePickerVisible ? (React__namespace.createElement(core.Column, null,
1829
- React__namespace.createElement(core.Column, { overflow: "hidden", height: "250px" },
1830
- React__namespace.createElement(TimePicker, { value: timeValue !== null && timeValue !== void 0 ? timeValue : "", onValueChange: onChangeTime })),
1831
- React__namespace.createElement(core.Space, null),
1832
- React__namespace.createElement(core.Row, { justifyContent: "flex-end" },
1833
- React__namespace.createElement(elements.PrimaryButton, { label: "Done", onClick: hideTimePicker })))) : null)) },
1834
- React__namespace.createElement(DualTextInput, { autoFocusLeft: autoFocus, onEsc: onEsc, onEnter: onEnter, onBlur: onBlur, disabled: disabled, separatorIcon: faClock$1.faClock, typeLeft: "date", typeRight: "time", placeholderLeft: "yyyy-mm-dd", placeholderRight: "hh:mm", onChangeLeft: inputLeftChangeHandler, onChangeRight: inputRightChangeHandler, onClickArrowDown: onClickArrowButton, onClickCalendar: onClickCalendarButton, onFocusLeft: onFocusLeft, onFocusRight: onFocusRight, onClickLeft: onFocusLeft, onClickRight: onFocusRight, inputRefLeft: dateInputRef, inputRefRight: timeInputRef, valueRight: timeValue !== null && timeValue !== void 0 ? timeValue : "", widthLeft: widthLeft, widthRight: widthRight, minLeft: minDate, maxLeft: maxDate, variant: variant }))));
1835
- };
1836
-
1837
- var useDateRangeEffects = function (startDate, endDate, setDateInFocus, startDateInputRef, endDateInputRef) {
1838
- React.useEffect(function moveFocusedDateWhenStartDateChanges() {
1839
- if (startDate) {
1840
- setDateInFocus(startDate);
1841
- }
1842
- }, [startDate, setDateInFocus]);
1843
- React.useEffect(function moveFocusedDateWhenEndDateChanges() {
1844
- if (endDate) {
1845
- setDateInFocus(endDate);
1846
- }
1847
- }, [endDate, setDateInFocus]);
1848
- React.useEffect(function updateStartDateFieldWhenValueChanges() {
1849
- if (startDateInputRef.current) {
1850
- if (startDate) {
1851
- startDateInputRef.current.valueAsDate = new Date(Date.UTC(startDate.getFullYear(), startDate.getMonth(), startDate.getDate()));
1852
- }
1853
- else {
1854
- startDateInputRef.current.valueAsDate = null;
1855
- }
1856
- }
1857
- }, [startDate, startDateInputRef]);
1858
- React.useEffect(function updateEndDateFieldWhenValueChanges() {
1859
- if (endDateInputRef.current) {
1860
- if (endDate) {
1861
- endDateInputRef.current.valueAsDate = new Date(Date.UTC(endDate.getFullYear(), endDate.getMonth(), endDate.getDate()));
1862
- }
1863
- else {
1864
- endDateInputRef.current.valueAsDate = null;
1865
- }
1866
- }
1867
- }, [endDate, endDateInputRef]);
1868
- };
1869
-
1870
- var useDateRangeHandlers = function (startDate, endDate, onValueChange, _a) {
1871
- var setDateInFocus = _a.setDateInFocus, showCalendarInternal = _a.showCalendarInternal, hideCalendarInternal = _a.hideCalendarInternal, setFirstFocusedInput = _a.setFirstFocusedInput, setCurrentPanel = _a.setCurrentPanel;
1872
- var inputLeftChangeHandler = React.useCallback(function (ev) {
1873
- var _a;
1874
- if (ev.target.value[0] !== "0") {
1875
- onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange({
1876
- startDate: (_a = ev.target.valueAsDate) !== null && _a !== void 0 ? _a : undefined,
1877
- endDate: endDate,
1878
- });
1879
- }
1880
- }, [onValueChange, endDate]);
1881
- var inputRightChangeHandler = React.useCallback(function (ev) {
1882
- var _a;
1883
- if (ev.target.value[0] !== "0") {
1884
- onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange({
1885
- startDate: startDate,
1886
- endDate: (_a = ev.target.valueAsDate) !== null && _a !== void 0 ? _a : undefined,
1887
- });
1888
- }
1889
- }, [onValueChange, startDate]);
1890
- var showCalendar = React.useCallback(function () {
1891
- if (startDate) {
1892
- setDateInFocus(startDate);
1893
- }
1894
- else if (endDate) {
1895
- setDateInFocus(endDate);
1896
- }
1897
- else {
1898
- setDateInFocus(new Date());
1899
- }
1900
- setCurrentPanel("calendar");
1901
- showCalendarInternal();
1902
- }, [
1903
- startDate,
1904
- endDate,
1905
- setCurrentPanel,
1906
- showCalendarInternal,
1907
- setDateInFocus,
1908
- ]);
1909
- var hideCalendar = React.useCallback(function () {
1910
- setFirstFocusedInput(undefined);
1911
- hideCalendarInternal();
1912
- }, [setFirstFocusedInput, hideCalendarInternal]);
1913
- return {
1914
- inputLeftChangeHandler: inputLeftChangeHandler,
1915
- inputRightChangeHandler: inputRightChangeHandler,
1916
- hideCalendar: hideCalendar,
1917
- setDateInFocus: setDateInFocus,
1918
- setCurrentPanel: setCurrentPanel,
1919
- showCalendar: showCalendar,
1920
- };
1921
- };
1922
-
1923
- var useInputStates = function (startDate, endDate) {
1924
- var _a = core.useBoolean(false), isCalendarVisible = _a[0], showCalendarInternal = _a[1], hideCalendarInternal = _a[2];
1925
- var _b = React.useState(undefined), firstFocusedInput = _b[0], setFirstFocusedInput = _b[1];
1926
- var _c = React.useState("startDate"), focusedInput = _c[0], setFocusedInput = _c[1];
1927
- var _d = React.useState(function () {
1928
- var fromValue = focusedInput === "startDate"
1929
- ? startDate
1930
- : focusedInput === "endDate"
1931
- ? endDate
1932
- : undefined;
1933
- return fromValue !== null && fromValue !== void 0 ? fromValue : new Date();
1934
- }), dateInFocus = _d[0], setDateInFocus = _d[1];
1935
- var _e = React.useState("calendar"), currentPanel = _e[0], setCurrentPanel = _e[1];
1936
- return {
1937
- isCalendarVisible: isCalendarVisible,
1938
- showCalendarInternal: showCalendarInternal,
1939
- hideCalendarInternal: hideCalendarInternal,
1940
- firstFocusedInput: firstFocusedInput,
1941
- setFirstFocusedInput: setFirstFocusedInput,
1942
- focusedInput: focusedInput,
1943
- setFocusedInput: setFocusedInput,
1944
- dateInFocus: dateInFocus,
1945
- setDateInFocus: setDateInFocus,
1946
- currentPanel: currentPanel,
1947
- setCurrentPanel: setCurrentPanel,
1948
- };
1949
- };
1950
-
1951
- var useUserInputHandlers = function (startDate, endDate, onValueChange, startDateInputRef, endDateInputRef, showCalendar, hideCalendar, _a) {
1952
- var firstFocusedInput = _a.firstFocusedInput, setFirstFocusedInput = _a.setFirstFocusedInput, isCalendarVisible = _a.isCalendarVisible, setFocusedInput = _a.setFocusedInput, focusedInput = _a.focusedInput, setCurrentPanel = _a.setCurrentPanel;
1953
- var onFocusLeft = React.useCallback(function () {
1954
- if (firstFocusedInput == null) {
1955
- setFirstFocusedInput("startDate");
1956
- }
1957
- setFocusedInput("startDate");
1958
- if (!isCalendarVisible) {
1959
- showCalendar();
1960
- }
1961
- }, [
1962
- isCalendarVisible,
1963
- setFocusedInput,
1964
- showCalendar,
1965
- setFirstFocusedInput,
1966
- firstFocusedInput,
1967
- ]);
1968
- var onFocusRight = React.useCallback(function () {
1969
- if (firstFocusedInput == null) {
1970
- setFirstFocusedInput("endDate");
1971
- }
1972
- setFocusedInput("endDate");
1973
- if (!isCalendarVisible) {
1974
- showCalendar();
1975
- }
1976
- }, [
1977
- isCalendarVisible,
1978
- setFocusedInput,
1979
- showCalendar,
1980
- setFirstFocusedInput,
1981
- firstFocusedInput,
1982
- ]);
1983
- var onClickDay = React.useCallback(function (day) {
1984
- var _a, _b, _c, _d;
1985
- if (focusedInput === "startDate") {
1986
- if (endDate != null && dateFns.isAfter(day.date, endDate)) {
1987
- onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange({
1988
- startDate: day.date,
1989
- endDate: undefined,
1990
- });
1991
- setFocusedInput("endDate");
1992
- (_a = endDateInputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
1993
- }
1994
- else {
1995
- onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange({
1996
- startDate: day.date,
1997
- endDate: endDate,
1998
- });
1999
- if (firstFocusedInput === "startDate") {
2000
- setFocusedInput("endDate");
2001
- (_b = endDateInputRef.current) === null || _b === void 0 ? void 0 : _b.focus();
2002
- }
2003
- else {
2004
- setTimeout(hideCalendar, 50);
2005
- }
2006
- }
2007
- }
2008
- else if (focusedInput === "endDate") {
2009
- if (!startDate) {
2010
- onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange({
2011
- startDate: startDate,
2012
- endDate: day.date,
2013
- });
2014
- setFocusedInput("startDate");
2015
- (_c = startDateInputRef.current) === null || _c === void 0 ? void 0 : _c.focus();
2016
- }
2017
- else if (dateFns.isAfter(startDate, day.date)) {
2018
- onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange({
2019
- startDate: day.date,
2020
- endDate: undefined,
2021
- });
2022
- setFocusedInput("endDate");
2023
- (_d = endDateInputRef.current) === null || _d === void 0 ? void 0 : _d.focus();
2024
- }
2025
- else {
2026
- onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange({
2027
- startDate: startDate,
2028
- endDate: day.date,
2029
- });
2030
- setTimeout(hideCalendar, 50);
2031
- }
2032
- }
2033
- }, [
2034
- focusedInput,
2035
- onValueChange,
2036
- endDate,
2037
- firstFocusedInput,
2038
- setFocusedInput,
2039
- endDateInputRef,
2040
- hideCalendar,
2041
- startDate,
2042
- startDateInputRef,
2043
- ]);
2044
- var onClickArrowButton = React.useCallback(function () {
2045
- setCurrentPanel("presets");
2046
- showCalendar();
2047
- }, [setCurrentPanel, showCalendar]);
2048
- var onClickCalendarButton = React.useCallback(function () {
2049
- var _a;
2050
- if (isCalendarVisible) {
2051
- hideCalendar();
2052
- }
2053
- else {
2054
- setFocusedInput("startDate");
2055
- setFirstFocusedInput("startDate");
2056
- (_a = startDateInputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
2057
- setCurrentPanel("calendar");
2058
- showCalendar();
2059
- }
2060
- }, [
2061
- isCalendarVisible,
2062
- hideCalendar,
2063
- setFocusedInput,
2064
- setFirstFocusedInput,
2065
- startDateInputRef,
2066
- setCurrentPanel,
2067
- showCalendar,
2068
- ]);
2069
- var onKeyDownHandler = React.useCallback(function (ev) {
2070
- if (ev.key === "Escape") {
2071
- hideCalendar();
2072
- }
2073
- }, [hideCalendar]);
2074
- return {
2075
- onFocusLeft: onFocusLeft,
2076
- onFocusRight: onFocusRight,
2077
- onClickDay: onClickDay,
2078
- onClickArrowButton: onClickArrowButton,
2079
- onClickCalendarButton: onClickCalendarButton,
2080
- onKeyDownHandler: onKeyDownHandler,
2081
- };
2082
- };
2083
-
2084
- var DateRangeDualTextInput = function (_a) {
2085
- var value = _a.value, onValueChange = _a.onValueChange, autoFocus = _a.autoFocus, onBlur = _a.onBlur, onEnter = _a.onEnter, onEsc = _a.onEsc, minDate = _a.minDate, _b = _a.maxDate, maxDate = _b === void 0 ? defaultMaxDate : _b, calendarProps = _a.calendarProps, _c = _a.widthLeft, widthLeft = _c === void 0 ? 128 : _c, _d = _a.widthRight, widthRight = _d === void 0 ? 128 : _d, variant = _a.variant, disabled = _a.disabled;
2086
- var _e = value || {}, startDate = _e.startDate, endDate = _e.endDate;
2087
- var startDateInputRef = React.useRef(null);
2088
- var endDateInputRef = React.useRef(null);
2089
- var states = useInputStates(startDate, endDate);
2090
- var dateInFocus = states.dateInFocus, setDateInFocus = states.setDateInFocus, isCalendarVisible = states.isCalendarVisible, currentPanel = states.currentPanel, setCurrentPanel = states.setCurrentPanel;
2091
- var _f = useDateRangeHandlers(startDate, endDate, onValueChange, states), showCalendar = _f.showCalendar, hideCalendar = _f.hideCalendar, inputLeftChangeHandler = _f.inputLeftChangeHandler, inputRightChangeHandler = _f.inputRightChangeHandler;
2092
- var _g = useUserInputHandlers(startDate, endDate, onValueChange, startDateInputRef, endDateInputRef, showCalendar, hideCalendar, states), onKeyDownHandler = _g.onKeyDownHandler, onFocusRight = _g.onFocusRight, onFocusLeft = _g.onFocusLeft, onClickDay = _g.onClickDay, onClickCalendarButton = _g.onClickCalendarButton, onClickArrowButton = _g.onClickArrowButton;
2093
- useDateRangeEffects(startDate, endDate, setDateInFocus, startDateInputRef, endDateInputRef);
2094
- var startDateIsAfterEnd = React.useMemo(function () { return startDate && endDate && dateFns.isAfter(startDate, endDate); }, [startDate, endDate]);
2095
- var statePerMonth = React.useMemo(function () {
2096
- return buildDayStateForSingleMonth(calendarProps === null || calendarProps === void 0 ? void 0 : calendarProps.statePerMonth, startDate, endDate, dateInFocus);
2097
- }, [calendarProps === null || calendarProps === void 0 ? void 0 : calendarProps.statePerMonth, startDate, endDate, dateInFocus]);
2098
- var delayedIsCalendarVisible = core.useDelayedFalse(isCalendarVisible, 300);
2099
- return (React__namespace.createElement(core.Box, { onKeyDown: onKeyDownHandler },
2100
- React__namespace.createElement(tooltip.Popover, { arrow: false, lazy: true, disabled: disabled, placement: defaultPopoverPlacement, onClickOutside: hideCalendar, visible: isCalendarVisible, content: delayedIsCalendarVisible && (React__namespace.createElement(CalendarWithMonthSwitcher, __assign({ onClickDay: onClickDay, dateInFocus: dateInFocus, setDateInFocus: setDateInFocus, currentPanel: currentPanel, setCurrentPanel: setCurrentPanel, minDate: minDate, maxDate: maxDate }, calendarProps, { statePerMonth: statePerMonth }))) },
2101
- React__namespace.createElement(DualTextInput, { autoFocusLeft: autoFocus, onEsc: onEsc, onEnter: onEnter, onBlur: onBlur, disabled: disabled, separatorIcon: elements.stenaArrowRight, typeLeft: "date", typeRight: "date", placeholderLeft: "Start date", placeholderRight: "End date", onChangeLeft: inputLeftChangeHandler, onChangeRight: inputRightChangeHandler, onClickArrowDown: onClickArrowButton, onClickCalendar: onClickCalendarButton, onFocusLeft: onFocusLeft, onFocusRight: onFocusRight, onClickLeft: onFocusLeft, onClickRight: onFocusRight, inputRefLeft: startDateInputRef, inputRefRight: endDateInputRef, variant: startDateIsAfterEnd ? "error" : variant, widthLeft: widthLeft, widthRight: widthRight, minLeft: minDate, maxLeft: maxDate, minRight: minDate, maxRight: maxDate }))));
2102
- };
2103
-
2104
- exports.Calendar = Calendar;
2105
- exports.CalendarDay = CalendarDay;
2106
- exports.DateInput = DateInput;
2107
- exports.DateRangeCalendar = DateRangeCalendar;
2108
- exports.DateRangeDualTextInput = DateRangeDualTextInput;
2109
- exports.DateRangeExclusionCalendar = DateRangeExclusionCalendar;
2110
- exports.DateRangeInput = DateRangeInput;
2111
- exports.DateTextInput = DateTextInput;
2112
- exports.DateTimeInput = DateTimeInput;
2113
- exports.MonthPicker = MonthPicker;
2114
- exports.MultiDateCalendar = MultiDateCalendar;
2115
- exports.PresetPicker = PresetPicker;
2116
- exports.SingleDateCalendar = SingleDateCalendar;
2117
- exports.SingleWeekCalendar = SingleWeekCalendar;
2118
- exports.TimeTextInput = TimeTextInput;
2119
- exports.WeekDayCell = WeekDayCell;
2120
- exports.WeekNumberCell = WeekNumberCell;
2121
- exports.YearPicker = YearPicker;
2122
- exports.addDayStateHighlights = addDayStateHighlights;
2123
- exports.addDayStateHighlightsOnSingleDay = addDayStateHighlightsOnSingleDay;
2124
- exports.addWeekRangeHighlights = addWeekRangeHighlights;
2125
- exports.addWeekStateHighlights = addWeekStateHighlights;
2126
- exports.buildDayStateForDateRange = buildDayStateForDateRange;
2127
- exports.buildDayStateForRange = buildDayStateForRange;
2128
- exports.buildDayStateForSingleMonth = buildDayStateForSingleMonth;
2129
- exports.calculateOverflowingMonth = calculateOverflowingMonth;
2130
- exports.createDay = createDay;
2131
- exports.dateRangeToStrings = dateRangeToStrings;
2132
- exports.dayHasHighlight = dayHasHighlight;
2133
- exports.dayHighlightSelect = dayHighlightSelect;
2134
- exports.defaultCalendarTheme = defaultCalendarTheme;
2135
- exports.defaultTextPropsProvider = defaultTextPropsProvider;
2136
- exports.defaultWrapperStyleProvider = defaultWrapperStyleProvider;
2137
- exports.extranetCalendarTheme = extranetCalendarTheme;
2138
- exports.getDaysForWeekForDate = getDaysForWeekForDate;
2139
- exports.getMonthInYear = getMonthInYear;
2140
- exports.getMonthsInYear = getMonthsInYear;
2141
- exports.getStartDateOfISOWeek = getStartDateOfISOWeek;
2142
- exports.getWeekForDate = getWeekForDate;
2143
- exports.getWeeksForMonth = getWeeksForMonth;
2144
- exports.isDateRangeInvalid = isDateRangeInvalid;
2145
- exports.setDayStateValue = setDayStateValue;
2146
- exports.setDayStateValueFunction = setDayStateValueFunction;
2147
- exports.stringsToDateRange = stringsToDateRange;
2148
- exports.toggleDateStringsIfEndIsEarlierThanStart = toggleDateStringsIfEndIsEarlierThanStart;
2149
- exports.toggleDatesIfEndIsEarlierThanStart = toggleDatesIfEndIsEarlierThanStart;
2150
- exports.useDateRangeCalendarState = useDateRangeCalendarState;
2151
- exports.useDateRangeExclusionSelection = useDateRangeExclusionSelection;
2152
- exports.useDateRangeSelection = useDateRangeSelection;
2153
- exports.useMultiDateSelection = useMultiDateSelection;
2154
- exports.useSingleDateSelection = useSingleDateSelection;
2155
- exports.useSingleWeekSelection = useSingleWeekSelection;
1
+ (function(){ try {var elementStyle = document.createElement('style'); elementStyle.appendChild(document.createTextNode("._calendar_1w0de_1{--swui-calendar-day-width: 40px;--swui-calendar-day-height: 38px;--swui-calendar-day-border-radius: 4px;--swui-calendar-week-number-bg-color: transparent;--swui-calendar-week-number-text-color: var(--lhds-color-ui-500);--swui-calendar-week-number-clickable-text-color: var(--lhds-color-ui-500);--swui-calendar-week-day-text-color: var(--lhds-color-ui-500);--swui-calendar-week-day-clickable-text-color: var(--lhds-color-ui-500);--swui-calendar-wrapper-selected-border: var(--swui-primary-action-color);--swui-calendar-wrapper-selected-background: var(--swui-primary-action-color);--swui-calendar-wrapper-range-border: var(--lhds-color-blue-100);--swui-calendar-wrapper-range-background: var(--lhds-color-blue-100);--swui-calendar-wrapper-today-border: var(--lhds-color-ui-200);--swui-calendar-wrapper-today-background: var(--lhds-color-ui-200);--swui-calendar-text-selected-color: #fff;--swui-calendar-text-disabled-color: var(--swui-text-disabled-color);--swui-calendar-text-in-other-month-color: var(--swui-text-disabled-color)}._calendar_1w0de_1 table{border-spacing:0 4px}._calendar_1w0de_1 span{line-height:100%}._calendar_1w0de_1 tr td:last-child{border-top-right-radius:var(--swui-calendar-day-border-radius);border-bottom-right-radius:var(--swui-calendar-day-border-radius)}._calendar_1w0de_1 tr td:nth-child(2){border-top-left-radius:var(--swui-calendar-day-border-radius);border-bottom-left-radius:var(--swui-calendar-day-border-radius)}._calendar_1w0de_1 td{padding:0;width:var(--swui-calendar-day-width);height:var(--swui-calendar-day-height)}._timePicker_1w05d_1{overflow:hidden;width:180px}._timePickerColumn_1w05d_6{overflow-y:hidden;flex:1}._timePickerColumn_1w05d_6:hover{overflow-y:scroll}")); document.head.appendChild(elementStyle);} catch(e) {console.error('vite-plugin-css-injected-by-js', e);} })();"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});var j=require("@stenajs-webui/elements"),D=require("@stenajs-webui/core"),f=require("date-fns"),J=require("lodash"),o=require("react"),c=require("react/jsx-runtime"),rt=require("@emotion/styled"),pe=require("@fortawesome/free-solid-svg-icons/faAngleDoubleLeft"),Ce=require("@fortawesome/free-solid-svg-icons/faAngleDoubleRight"),st=require("@fortawesome/free-solid-svg-icons/faCaretLeft"),ct=require("@fortawesome/free-solid-svg-icons/faCaretRight"),$=require("@stenajs-webui/forms"),Q=require("@stenajs-webui/tooltip"),Me=require("@stenajs-webui/theme"),it=require("@fortawesome/free-solid-svg-icons/faLongArrowAltRight");function ot(e){return e&&typeof e=="object"&&"default"in e?e:{default:e}}function at(e){if(e&&e.__esModule)return e;var t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});return e&&Object.keys(e).forEach(function(n){if(n!=="default"){var r=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,r.get?r:{enumerable:!0,get:function(){return e[n]}})}}),t.default=e,Object.freeze(t)}var Re=at(o),fe=ot(rt);const F={yearAndMonth:"yyyy-MM",fullDate:"yyyy-MM-dd",fullMonthName:"LLLL",fullDateAndTime:"yyyy-MM-dd HH:mm",fullDateAndTimeSystem:"yyyy-MM-ddTHH:MM",weekDayName:"EEEE",weekDayNameShort:"EEE",dateAndMonth:"d MMM",monthAndDate:"MMM do"},G=(e={},t,n)=>{if(t&&n&&f.isAfter(n,t))return f.eachDayOfInterval({start:t,end:n}).reduce((s,i)=>{const l=f.isSameDay(i,t),a=f.isSameDay(i,n);return O(s,i,l?["selected","selectedStart","range"]:a?["selected","selectedEnd","range"]:["range"])},e);let r=e;return t&&(r=O(r,t,["selected","singleSelected"])),n&&(r=O(r,n,["selected","singleSelected"])),r},Ee=(e={},t,n,r)=>Te(e,t,n,f.startOfMonth(r),f.endOfMonth(r)),Te=(e={},t,n,r,s)=>t&&n?G(e,f.max([t,f.subDays(r,1)]),f.min([n,f.addDays(s,1)])):G(e,t,n),lt=(e,t,n)=>{const r=f.format(t,F.yearAndMonth),s=f.getISOWeek(t),i=f.getDate(t);return{...e,[r]:{...e&&e[r],[s]:{...e&&e[r]&&e[r][s],[i]:{...e&&e[r]&&e[r][s]&&e[r][s][i],...n}}}}},dt=(e,t,n)=>{const r=f.format(t,F.yearAndMonth),s=f.getISOWeek(t),i=f.getDate(t);return{...e,[r]:{...e&&e[r],[s]:{...e&&e[r]&&e[r][s],[i]:{...e&&e[r]&&e[r][s]&&e[r][s][i],...n(e&&e[r]&&e[r][s]&&e[r][s][i])}}}}},O=(e,t,n)=>{const r=t.getMonth()+1,s=`${t.getFullYear()}-${r<10?"0":""}${r}`,i=f.getISOWeek(t),l=f.getDate(t),a=e&&e[s]&&e[s][i]&&e[s][i][l];return{...e,[s]:{...e&&e[s],[i]:{...e&&e[s]&&e[s][i],[l]:he(a,n)}}}},he=(e,t)=>{var n;return{...e,highlights:[...(n=e==null?void 0:e.highlights)!=null?n:[],...t]}},ut=(e,t,n)=>{const r=t.days[0].date,s=r.getMonth()+1,i=`${r.getFullYear()}-${s<10?"0":""}${s}`,l=t.weekNumber;let a=e;t.days.forEach(y=>{a=O(a,y.date,n)});const d=a&&a[i]?a[i][l]:void 0,u=d&&d.highlights?[...d.highlights,...n]:n,x={...d,highlights:u};return{...a,[i]:{...e&&e[i],[l]:x}}},Ae=(e,t)=>{var s;if(!t.days.length)return{...e};const n=t.days[0].date,r=(s=J.last(t.days))==null?void 0:s.date;return{...G(e,n,r)}},ft=(e,t)=>o.useMemo(()=>e?O(t,new Date,["today"]):t,[e,t]);var B=(e=>(e[e.JANUARY=0]="JANUARY",e[e.FEBRUARY=1]="FEBRUARY",e[e.MARCH=2]="MARCH",e[e.APRIL=3]="APRIL",e[e.MAY=4]="MAY",e[e.JUNE=5]="JUNE",e[e.JULY=6]="JULY",e[e.AUGUST=7]="AUGUST",e[e.SEPTEMBER=8]="SEPTEMBER",e[e.OCTOBER=9]="OCTOBER",e[e.NOVEMBER=10]="NOVEMBER",e[e.DECEMBER=11]="DECEMBER",e))(B||{}),Ie=(e=>(e[e.SUNDAY=0]="SUNDAY",e[e.MONDAY=1]="MONDAY",e[e.TUESDAY=2]="TUESDAY",e[e.WEDNESDAY=3]="WEDNESDAY",e[e.THURSDAY=4]="THURSDAY",e[e.FRIDAY=5]="FRIDAY",e[e.SATURDAY=6]="SATURDAY",e))(Ie||{});const xe=(e,t,n)=>{const r=[];for(let s=0;s<n;s++)r.push(ye(e,t+s));return r},ye=(e,t)=>{const n=e+Math.floor(t/12),r=t%12,s=new Date(n,r,1);return{monthString:f.format(s,F.yearAndMonth),name:f.format(s,F.fullMonthName),year:n,monthInYear:r,weeks:Be(n,r)}},Be=(e,t,n=!0)=>{const r=new Date(e,t,1),s=f.startOfISOWeek(r),i=[];for(let l=0;l<6;l++){const a=ue(f.addWeeks(s,l));if(l>0&&a.startMonth!==t&&!n)return i;i.push(a)}return i},ue=e=>{const t=f.getMonth(f.addDays(e,7))!==f.getMonth(e);return{weekNumber:f.getISOWeek(e),startMonth:f.getMonth(e),startYear:f.getYear(e),endMonth:f.getMonth(f.addDays(e,6)),endYear:f.getYear(f.addDays(e,6)),days:He(e),isLastWeekOfMonth:t}},Ne=e=>{const t=f.getISODay(e);return{date:e,name:f.format(e,"EEE"),dateString:f.format(f.addHours(e,12),F.fullDate),weekNumber:f.getISOWeek(e),year:f.getYear(e),month:f.getMonth(e),dayOfMonth:f.getDate(e),dayOfWeek:t,isFirstDayOfWeek:t===1,isLastDayOfWeek:t===7,isFirstDayOfMonth:f.isSameDay(f.startOfMonth(e),e),isLastDayOfMonth:f.isSameDay(f.endOfMonth(e),e)}},He=e=>f.eachDayOfInterval({start:e,end:f.addDays(e,6)}).map(Ne),Le=(e,t)=>{const n=new Date(t,0,1+(e-1)*7),r=n.getDay(),s=n;return r<=4?s.setDate(n.getDate()-n.getDay()+1):s.setDate(n.getDate()+8-n.getDay()),s},Ye=(e,t)=>t>11?{year:e+Math.floor(t/12),month:t%12}:t<0?{year:e+Math.floor(t/12),month:12+t%12}:{year:e,month:t},Oe=(e,t,n)=>!!(t&&t.indexOf(n)>=0||e&&e.highlights&&e.highlights.indexOf(n)>=0),U=(e,t,n,r,s)=>{if(n.length!==r.length)throw new Error("Select highlight failed, number of values do not equal number of highlights.");if(n.length===0)return s;for(let i=0;i<n.length;i++)if(typeof n[i]=="boolean"&&n[i]||typeof n[i]=="string"&&Oe(e,t,n[i]))return r[i];return s},We=({selectedBackground:e,todayBackground:t,rangeBackground:n,borderColor:r="transparent"})=>(s,i,l,a,d)=>{let u={};const x=U(i,s,["selected","range","today",l.month===d.monthInYear],[e,n,t,"#fff"],"transparent");return{...u,backgroundColor:x,borderTopLeftRadius:U(i,s,["selectedStart","singleSelected"],["var(--swui-calendar-day-border-radius)","var(--swui-calendar-day-border-radius)"],r),borderBottomLeftRadius:U(i,s,["selectedStart","singleSelected"],["var(--swui-calendar-day-border-radius)","var(--swui-calendar-day-border-radius)"],r),borderTopRightRadius:U(i,s,["selectedEnd","singleSelected"],["var(--swui-calendar-day-border-radius)","var(--swui-calendar-day-border-radius)"],r),borderBottomRightRadius:U(i,s,["selectedEnd","singleSelected"],["var(--swui-calendar-day-border-radius)","var(--swui-calendar-day-border-radius)"],r),boxSizing:"border-box"}},Pe=({selectedColor:e,disabledColor:t,inOtherMonthColor:n,rangeTextColor:r})=>(s,i,l,a,d)=>{const u=l.month!==d.monthInYear;return{color:U(i,s,[u,"selected","range","enabled","disabled"],[n,e,r,void 0,t])}},z={width:"var(--swui-calendar-day-width)",height:"var(--swui-calendar-day-height)",WeekNumber:{backgroundColor:"var(--swui-calendar-week-number-bg-color)",textColor:"var(--swui-calendar-week-number-text-color)",clickableTextColor:"var(--swui-calendar-week-number-clickable-text-color)",show:!0},WeekDay:{textColor:"var(--swui-calendar-week-day-text-color)",clickableTextColor:"var(--swui-calendar-week-day-clickable-text-color)"},CalendarDay:{tdStyle:We({selectedBackground:"var(--swui-calendar-wrapper-selected-background)",rangeBackground:"var(--swui-calendar-wrapper-range-background)",todayBackground:"var(--swui-calendar-wrapper-today-background)"}),textProps:Pe({selectedColor:"var(--swui-calendar-text-selected-color)",disabledColor:"var(--swui-calendar-text-disabled-color)",inOtherMonthColor:"var(--swui-calendar-text-in-other-month-color)"})},CalendarMonth:{headerTextColor:"var(--swui-calendar-week-day-text-color)"}},Dt={...z,width:"37px",height:"37px"},xt=(e,t,n)=>t&&f.isBefore(e,t)?f.isSameDay(e,t):n&&f.isAfter(e,n)?f.isSameDay(e,n):!0,gt=function({dayComponent:t,minDate:n,maxDate:r,dayState:s,day:i,...l}){const a=o.useMemo(()=>xt(i.date,n,r)?s:he(s,["disabled"]),[i.date,s,r,n]);return c.jsx(t,{day:i,...l,dayState:a})},Ue=({onClickWeek:e,theme:t,week:n,background:r,backgroundColor:s,prefix:i})=>{const l=c.jsxs(D.Box,{width:t.width,height:t.height,justifyContent:"center",alignItems:"center",children:[r&&c.jsx(D.Box,{position:"absolute",children:r}),c.jsx(D.Box,{position:"absolute",children:c.jsxs(D.Text,{color:e?t.WeekNumber.clickableTextColor:t.WeekNumber.textColor,children:[i,n.weekNumber]})})]});return c.jsx(D.Box,{background:s||t.WeekNumber.backgroundColor,position:"relative",children:e?c.jsx(D.Clickable,{borderRadius:"var(--swui-calendar-day-border-radius)",onClick:a=>e(n,a),disableFocusHighlight:!e,children:l}):l})};function ht({week:e,month:t,dayComponent:n,statePerWeekDay:r,userDataPerWeekDay:s,minDate:i,maxDate:l,onClickWeek:a,onClickDay:d,theme:u,renderWeekNumber:x,extraDayContent:y,defaultHighlights:g}){return c.jsxs("tr",{children:[u.WeekNumber.show&&c.jsx("td",{children:x?x(e,u,a):c.jsx(Ue,{week:e,onClickWeek:a,theme:u})}),e.days.map(h=>c.jsx(gt,{dayComponent:n,day:h,week:e,month:t,dayState:r&&r[h.dayOfMonth],userData:s&&s[h.dayOfMonth],onClickDay:d,theme:u,extraDayContent:y,defaultHighlights:g,minDate:i,maxDate:l},h.dateString))]},e.weekNumber)}const $e=({onClickWeekDay:e,day:t,theme:n})=>{const r=c.jsx(D.Box,{width:n.width,height:n.height,justifyContent:"center",alignItems:"center",children:c.jsx(D.Text,{size:"small",color:e?n.WeekDay.clickableTextColor:n.WeekDay.textColor,children:t.name})});return e?c.jsx(D.Clickable,{borderRadius:"var(--swui-calendar-day-border-radius)",onClick:s=>e(t.dayOfWeek,s),disableFocusHighlight:!e,children:r}):r},be=function({day:t,week:n,month:r,dayState:s,userData:i,onClickDay:l,theme:a,extraDayContent:d,defaultHighlights:u}){const x=c.jsx(D.Box,{width:"100%",height:"100%",justifyContent:"center",alignItems:"center",children:c.jsx(D.Text,{...a.CalendarDay.textProps&&a.CalendarDay.textProps(u,s,t,n,r,i),children:t.dayOfMonth})}),y=fe.default.td({...a.CalendarDay.tdStyle&&a.CalendarDay.tdStyle(u,s,t,n,r,i)}),g=fe.default.div({...a.CalendarDay.innerWrapperStyle&&a.CalendarDay.innerWrapperStyle(u,s,t,n,r,i),width:"100%",height:"100%"}),h=fe.default.div({...a.CalendarDay.cellWrapperStyle&&a.CalendarDay.cellWrapperStyle(u,s,t,n,r,i),width:"100%",height:"100%",position:"relative"});return c.jsx(y,{children:c.jsx(g,{children:c.jsx(h,{children:t.month===r.monthInYear&&c.jsxs(c.Fragment,{children:[d&&c.jsx(d,{week:n,month:r,day:t,dayState:s,theme:a,userData:i}),l&&yt(u,s)?c.jsx(D.Clickable,{onClick:m=>l(t,i,m),style:{width:"100%",height:"100%"},borderRadius:"var(--swui-calendar-day-border-radius)",children:x}):c.jsx(c.Fragment,{children:x})]})})})})},yt=(e,t)=>!!U(t,e,["enabled","disabled"],[!0,!1],!0);function bt({month:e,dayComponent:t=be,statePerWeek:n,userDataPerWeek:r,minDate:s,maxDate:i,onClickDay:l,onClickWeek:a,onClickWeekDay:d,onClickMonth:u,onClickYear:x,renderWeekNumber:y,renderWeekDay:g,headerLeftContent:h,headerRightContent:m,theme:p=z,extraDayContent:w,defaultHighlights:S}){const k=p.WeekNumber.show;return c.jsx(c.Fragment,{children:c.jsxs(D.Box,{alignItems:"stretch",children:[c.jsxs(D.Row,{justifyContent:"space-between",alignItems:"center",height:"32px",children:[c.jsx(D.Box,{alignItems:"center",children:h}),c.jsxs(D.Row,{alignItems:"center",children:[c.jsx(D.Row,{width:"104px",justifyContent:"center",children:u?c.jsx(j.FlatButton,{onClick:()=>u(e),label:e.name}):c.jsx(D.Text,{children:e.name})}),c.jsx(D.Space,{}),c.jsx(D.Row,{width:"64px",justifyContent:"center",children:x?c.jsx(j.FlatButton,{onClick:()=>x(e.year),label:String(e.year)}):c.jsx(D.Text,{children:e.year})})]}),c.jsx(D.Box,{alignItems:"center",children:m})]}),c.jsx("table",{children:c.jsxs("tbody",{children:[c.jsxs("tr",{children:[k&&c.jsx("td",{children:c.jsx(D.Box,{width:p.width,height:p.height,justifyContent:"center",alignItems:"center",children:c.jsx(D.Text,{size:"small",color:p.CalendarMonth.headerTextColor,children:"W"})})}),e.weeks[0].days.map(b=>c.jsx("td",{children:g?g(b.name,p,d):c.jsx($e,{day:b,onClickWeekDay:d,theme:p})},b.name))]}),e.weeks.map(b=>c.jsx(ht,{month:e,week:b,dayComponent:t,statePerWeekDay:n&&n[b.weekNumber],userDataPerWeekDay:r&&r[b.weekNumber],onClickDay:l,onClickWeek:a,theme:p,renderWeekNumber:y,extraDayContent:w,defaultHighlights:S,minDate:s,maxDate:i},b.weekNumber))]})})]})})}const mt="_calendar_1w0de_1";var jt={calendar:mt};function kt({monthRows:e,dayComponent:t=be,userDataPerMonth:n,statePerMonth:r,minDate:s,maxDate:i,onClickDay:l,onClickWeekDay:a,onClickWeek:d,onClickMonth:u,onClickYear:x,renderWeekDay:y,renderWeekNumber:g,headerLeftContent:h,headerRightContent:m,extraDayContent:p,defaultHighlights:w,theme:S=z}){const k=o.useMemo(()=>s?f.parse(s,"yyyy-MM-dd",new Date):void 0,[s]),b=o.useMemo(()=>i?f.parse(i,"yyyy-MM-dd",new Date):void 0,[i]);return c.jsx("div",{className:jt.calendar,children:e.map((C,M)=>c.jsx(D.Spacing,{children:c.jsx(D.Row,{children:C.map((R,E)=>c.jsxs(Re.Fragment,{children:[E>0&&c.jsx(D.Space,{}),c.jsx(bt,{month:R,dayComponent:t,userDataPerWeek:n&&n[R.monthString],statePerWeek:r&&r[R.monthString],onClickDay:l,onClickWeekDay:a,onClickWeek:d,onClickMonth:u,onClickYear:x,theme:S,renderWeekNumber:g,renderWeekDay:y,headerLeftContent:h,headerRightContent:m,extraDayContent:p,defaultHighlights:w,minDate:k,maxDate:b})]},R.name))})},M))})}function ae(e){const t=wt(e.year,e.month,e.date),{year:n,month:r}=Ye(t.year,t.month),s=St(n,r,e.numMonths,e.monthsPerRow),i=ft(e.highlightToday,e.statePerMonth);return c.jsx(kt,{year:n,month:r,monthRows:s,...e,statePerMonth:i})}const wt=(e,t,n)=>{if(t&&e)return{month:t,year:e};if(n)return{month:f.getMonth(n),year:f.getYear(n)};const r=new Date;return{month:f.getMonth(r),year:f.getYear(r)}},St=(e,t,n,r)=>n==null?[[ye(e,t)]]:r==null?[xe(e,t,n)]:J.chunk(xe(e,t,n),r),pt=(e,t,n,r)=>{const s=o.useCallback(()=>{var u;const d=f.addMonths(e,(u=n!=null?n:r)!=null?u:1);t==null||t(d)},[t,e,n,r]),i=o.useCallback(()=>{const d=f.addYears(e,1);t==null||t(d)},[t,e]),l=o.useCallback(()=>{var u;const d=f.subMonths(e,(u=n!=null?n:r)!=null?u:1);t==null||t(d)},[t,e,n,r]),a=o.useCallback(()=>{const d=f.subYears(e,1);t==null||t(d)},[t,e]);return{nextMonth:s,prevMonth:l,nextYear:i,prevYear:a}},Ct=({children:e,prevMonth:t,nextMonth:n,prevYear:r,nextYear:s})=>c.jsxs("div",{children:[e,c.jsx(D.Indent,{children:c.jsxs(D.Row,{children:[c.jsx(j.FlatButton,{onClick:r,leftIcon:pe.faAngleDoubleLeft}),c.jsx(D.Space,{}),c.jsx(j.FlatButton,{onClick:t,leftIcon:j.stenaAngleLeft}),c.jsx(D.Indent,{num:2}),c.jsx(j.FlatButton,{onClick:n,leftIcon:j.stenaAngleRight}),c.jsx(D.Space,{}),c.jsx(j.FlatButton,{onClick:s,leftIcon:Ce.faAngleDoubleRight})]})}),c.jsx(D.Space,{})]}),Mt=({value:e,onValueChange:t,month:n})=>{const r=o.useMemo(()=>{const s=new Date(2e3,n,1);return f.format(s,"MMM")},[n]);return c.jsx(D.Row,{width:"64px",justifyContent:"center",spacing:.5,indent:.5,children:e===n?c.jsx(j.PrimaryButton,{label:r,onClick:()=>t&&t(n)}):c.jsx(j.FlatButton,{label:r,onClick:()=>t&&t(n)})})},Rt=[[B.JANUARY,B.FEBRUARY,B.MARCH],[B.APRIL,B.MAY,B.JUNE],[B.JULY,B.AUGUST,B.SEPTEMBER],[B.OCTOBER,B.NOVEMBER,B.DECEMBER]],Fe=({value:e,onValueChange:t})=>c.jsx(D.Column,{children:Rt.map(n=>c.jsx(D.Row,{children:n.map(r=>c.jsx(Mt,{month:r,onValueChange:t,value:e},r))},n[0]))}),Et=e=>[{label:"Past",presets:[{label:"Last 3 days",startDate:e,endDate:f.subDays(e,2)},{label:"Last 7 days",startDate:e,endDate:f.subDays(e,6)},{label:"Last 30 days",startDate:e,endDate:f.subDays(e,29)},{label:"Last 45 days",startDate:e,endDate:f.subDays(e,44)}]},{label:"Future",presets:[{label:"Next 3 days",startDate:e,endDate:f.addDays(e,2)},{label:"Next 7 days",startDate:e,endDate:f.addDays(e,6)},{label:"Next 30 days",startDate:e,endDate:f.addDays(e,29)},{label:"Next 45 days",startDate:e,endDate:f.addDays(e,44)}]}],ze=({onClickPreset:e})=>{var i;const[t,n]=o.useState(0),r=o.useMemo(()=>Et(new Date),[]),s=(i=r[t])!=null?i:r[0];return c.jsxs(D.Column,{children:[c.jsxs(D.Row,{justifyContent:"space-between",alignItems:"center",width:"200px",children:[c.jsx(j.FlatButton,{size:"small",leftIcon:j.stenaAngleLeft,disabled:t===0,onClick:()=>n(t-1)}),c.jsx(D.Text,{children:s.label}),c.jsx(j.FlatButton,{size:"small",leftIcon:j.stenaAngleRight,disabled:t===r.length-1,onClick:()=>n(t+1)})]}),c.jsx(D.Space,{}),c.jsx(D.Column,{alignItems:"center",children:s.presets.map(l=>c.jsxs(Re.Fragment,{children:[c.jsx(j.PrimaryButton,{label:l.label,onClick:()=>e(l)}),c.jsx(D.Space,{})]},l.label))})]})},Tt=({value:e,onValueChange:t,year:n})=>{const r=String(n);return c.jsx(D.Row,{width:"64px",justifyContent:"center",spacing:.5,indent:.5,children:e===n?c.jsx(j.PrimaryButton,{label:r,onClick:()=>t==null?void 0:t(n)}):c.jsx(j.FlatButton,{label:r,onClick:()=>t==null?void 0:t(n)})})},_e=({value:e,onValueChange:t,initialLastYear:n})=>{const[r,s]=o.useState(()=>e?e+4:n!=null?n:new Date().getFullYear()+4),i=o.useMemo(()=>{const l=r-11;return J.chunk(J.range(l,r+1),3)},[r]);return o.useEffect(()=>{s(l=>At(e,l))},[e]),c.jsxs(D.Row,{children:[c.jsx(D.Column,{justifyContent:"center",children:c.jsx(j.FlatButton,{leftIcon:st.faCaretLeft,onClick:()=>s(r-3)})}),c.jsx(D.Column,{children:i.map(l=>c.jsx(D.Row,{children:l.map(a=>c.jsx(Tt,{year:a,onValueChange:t,value:e},a))},l[0]))}),c.jsx(D.Column,{justifyContent:"center",children:c.jsx(j.FlatButton,{leftIcon:ct.faCaretRight,onClick:()=>s(r+3)})})]})},At=(e,t)=>{if(e==null)return t;if(e>t){const r=e-t,s=r%3,i=r-s+3;return t+i}const n=t-11;if(e<n){const r=n-e,s=r%3,i=r-s+3;return t-i}return t},It=function({dateInFocus:t,setDateInFocus:n,currentPanel:r,setCurrentPanel:s,...i}){const l=o.useCallback(x=>{const y=t?new Date(t):new Date;y.setMonth(x),n&&n(y),s("calendar")},[t,n,s]),a=o.useCallback(x=>{const y=t?new Date(t):new Date;y.setFullYear(x),n&&n(y),s("calendar")},[t,n,s]),d=o.useCallback(()=>{s("year")},[s]),u=o.useCallback(()=>{s("month")},[s]);switch(r){case"calendar":return c.jsx(c.Fragment,{children:c.jsx(ae,{...i,date:t,onClickYear:d,onClickMonth:u})});case"month":return c.jsx(Fe,{value:t.getMonth(),onValueChange:l});case"year":return c.jsx(_e,{value:t.getFullYear(),onValueChange:a});case"presets":return c.jsx(ze,{onClickPreset:()=>{}});default:return c.jsx(D.Box,{children:c.jsx(j.PrimaryButton,{label:"Show calendar",onClick:()=>s("calendar")})})}},Bt=()=>{};function _({monthSwitcherPlacement:e,theme:t=z,dateInFocus:n,setDateInFocus:r,currentPanel:s,setCurrentPanel:i,onSelectPreset:l=Bt,hideYearPagination:a=!1,...d}){const{nextMonth:u,prevMonth:x,nextYear:y,prevYear:g}=pt(n,r,d.monthsPerRow,d.numMonths);switch(Nt(e,d.numMonths)){case"below":return c.jsx(Ct,{theme:t,nextMonth:u,prevMonth:x,nextYear:y,prevYear:g,children:c.jsx(ae,{...d,theme:t,date:n})});case"header":return c.jsx(D.Column,{children:c.jsx(It,{...d,theme:t,dateInFocus:n,setDateInFocus:r,currentPanel:s,setCurrentPanel:i,onSelectPreset:l,headerLeftContent:c.jsxs(D.Row,{alignItems:"center",children:[!a&&c.jsx(j.FlatButton,{size:"small",onClick:g,leftIcon:pe.faAngleDoubleLeft}),c.jsx(D.Space,{}),c.jsx(j.FlatButton,{size:"small",onClick:x,leftIcon:j.stenaAngleLeft})]}),headerRightContent:c.jsxs(D.Row,{alignItems:"center",children:[c.jsx(j.FlatButton,{size:"small",onClick:u,leftIcon:j.stenaAngleRight}),c.jsx(D.Space,{}),!a&&c.jsx(j.FlatButton,{size:"small",onClick:y,leftIcon:Ce.faAngleDoubleRight})]})})});default:return c.jsx(ae,{...d,theme:t,date:n})}}const Nt=(e,t)=>e||(t||1)>1?"below":"header",qe=e=>({startDate:e.startDate?f.format(e.startDate,"yyyy-MM-dd"):void 0,endDate:e.endDate?f.format(e.endDate,"yyyy-MM-dd"):void 0}),Je=({startDate:e,endDate:t})=>{const n=new Date;return{startDate:e?f.parse(e,"yyyy-MM-dd",n):void 0,endDate:t?f.parse(t,"yyyy-MM-dd",n):void 0}},me=({startDate:e,endDate:t})=>Boolean(e&&t&&!f.isSameDay(e,t)&&f.isAfter(e,t)),je=e=>me(e)?{startDate:e.endDate,endDate:e.startDate}:e,Ht=e=>e.startDate&&e.endDate?qe(je(Je(e))):e,Ke=(e,t,n,r)=>o.useCallback(s=>{const i={startDate:n==="startDate"?s.date:e==null?void 0:e.startDate,endDate:n==="endDate"?s.date:e==null?void 0:e.endDate};me(i)||r(n==="startDate"?"endDate":"startDate"),t==null||t(je(i))},[n,t,r,e==null?void 0:e.endDate,e==null?void 0:e.startDate]),te=e=>{const[t,n]=o.useState("calendar"),r=o.useCallback(s=>{n(s),e==null||e(s)},[e]);return{currentPanel:t,setCurrentPanel:r}},ve=({focusedInput:e,value:t,onValueChange:n,setFocusedInput:r,statePerMonth:s,onChangePanel:i})=>{const{currentPanel:l,setCurrentPanel:a}=te(i),[d,u]=o.useState(()=>new Date),x=Ke(t,n,e,r),y=o.useMemo(()=>G(s,t==null?void 0:t.startDate,t==null?void 0:t.endDate),[s,t==null?void 0:t.endDate,t==null?void 0:t.startDate]);return{onClickDay:x,statePerMonth:y,currentPanel:l,setCurrentPanel:a,setDateInFocus:u,dateInFocus:d}};function Lt(e){const t=ve(e);return c.jsx(_,{...e,...t})}const Yt=()=>{const[e,t]=o.useState(),[n,r]=o.useState(),[s,i]=o.useState("startDate");return{startDate:e,setStartDate:t,endDate:n,setEndDate:r,focusedInput:s,setFocusedInput:i}},Ge=({onChange:e,value:t,statePerMonth:n,onChangePanel:r})=>{const{currentPanel:s,setCurrentPanel:i}=te(r),[l,a]=o.useState(()=>t!=null?t:new Date),d=o.useCallback(x=>{e&&e(x.date)},[e]),u=o.useMemo(()=>t?O(n,t,["selected","singleSelected"]):n,[n,t]);return{onClickDay:d,statePerMonth:u,date:t,currentPanel:s,setCurrentPanel:i,dateInFocus:l,setDateInFocus:a}};function ke(e){const t=Ge(e);return c.jsx(_,{...e,...t})}const Qe=({onChange:e,value:t,statePerMonth:n,onChangePanel:r})=>{const{currentPanel:s,setCurrentPanel:i}=te(r),[l,a]=o.useState(()=>new Date),d=o.useCallback(x=>{if(!e)return;const y=t&&t.find(g=>f.isSameDay(g,x.date));e(t&&y?t.filter(g=>!f.isSameDay(g,x.date)):[...t||[],x.date])},[e,t]),u=o.useMemo(()=>t?t.reduce((x,y)=>O(x,y,["selected"]),n):n,[n,t]);return{onClickDay:d,statePerMonth:u,currentPanel:s,setCurrentPanel:i,dateInFocus:l,setDateInFocus:a}};function Ot(e){const t=Qe(e);return c.jsx(_,{...e,...t})}const Xe=({onChange:e,value:t,statePerMonth:n,onChangePanel:r})=>{const[s,i]=o.useState(()=>{const g=De(t);return g?g.days[0].date:new Date}),{currentPanel:l,setCurrentPanel:a}=te(r),d=o.useCallback(g=>{e&&e(we(ue(g.date)))},[e]),u=o.useCallback(g=>{e&&e(we(g))},[e]),x=o.useMemo(()=>{const g=De(t);return g?Ae(n,g):n},[t,n]),y=o.useMemo(()=>{const g=De(t);return g?g.days[0].date:new Date},[t]);return{statePerMonth:x,date:y,dateInFocus:s,setDateInFocus:i,onClickDay:d,onClickWeek:u,currentPanel:l,setCurrentPanel:a}},we=e=>{if(!!e)return`${e.endYear}-${e.weekNumber}`},De=e=>{if(!e)return;const t=e.split("-"),n=parseInt(t[1],10),r=parseInt(t[0],10);return ue(Le(n,r))};function Wt(e){const t=Xe(e);return c.jsx(_,{...e,...t})}const Pt=(e,t)=>e.filter(n=>!f.isSameDay(n,t)),Ut=(e,t)=>!!e.find(n=>f.isSameDay(n,t)),Ze=({value:e,onValueChange:t,statePerMonth:n,onChangePanel:r})=>{const[s,i]=o.useState(),[l,a]=o.useState("startDate"),{currentPanel:d,setCurrentPanel:u}=te(r),[x,y]=o.useState(()=>{var w;return(w=l&&(e==null?void 0:e[l]))!=null?w:new Date}),g=o.useCallback(w=>{i(w);const{startDate:S,endDate:k}=w;if(t)if(S&&k){const b=f.eachDayOfInterval({start:S,end:k});t(b)}else S?t([S]):k&&t([k])},[t]),h=Ke(s,g,l,a),m=o.useCallback((w,S,k)=>{t&&(k.ctrlKey||k.metaKey?e?Ut(e,w.date)?t(Pt(e,w.date)):t([...e,w.date]):t([w.date]):h(w,S,k))},[t,h,e]),p=o.useMemo(()=>$t(n,e),[n,e]);return{onClickDay:m,statePerMonth:p,currentPanel:d,setCurrentPanel:u,dateInFocus:x,setDateInFocus:y}},$t=(e,t)=>t?t.reduce((n,r)=>O(n,r,["selected"]),e):e;function Ft(e){const t=Ze(e);return c.jsx(_,{...e,...t})}const ne="bottom",Ve=()=>{const[e,t]=Q.useTippyInstance();return{onChangePanel:o.useCallback(()=>{var r,s;(s=(r=t.current)==null?void 0:r.popperInstance)==null||s.update()},[t]),tippyRef:e}},zt=(e,t,n)=>{const[r,s]=o.useState(n||!1),i=o.useCallback(()=>(s(!0),!0),[s]),l=o.useCallback(()=>{s(!1),t&&t()},[s,t]),a=o.useCallback(d=>{e&&e(d),setTimeout(l,150)},[e,l]);return{showCalendar:i,hideCalendar:l,showingCalendar:r,onSelectDate:a}},re="2999-12-31",_t=({displayFormat:e=F.fullDate,placeholder:t="Enter date",value:n,zIndex:r=100,calendarTheme:s=z,calendarProps:i,openOnMount:l,onClose:a,onChange:d,portalTarget:u,variant:x,width:y,minDate:g,maxDate:h=re,disabled:m})=>{const{hideCalendar:p,showingCalendar:w,onSelectDate:S,showCalendar:k}=zt(d,a,l),{tippyRef:b,onChangePanel:C}=Ve();return c.jsx(D.Box,{width:y,children:c.jsx(Q.Popover,{arrow:!1,lazy:!0,visible:w,onClickOutside:p,placement:ne,zIndex:r,appendTo:u!=null?u:"parent",tippyRef:b,disabled:m,content:c.jsx(ke,{...i,onChange:S,value:n,theme:s,onChangePanel:C,minDate:g,maxDate:h}),children:c.jsx($.TextInput,{type:"date",contentRight:c.jsx(D.Row,{alignItems:"center",children:c.jsx(j.FlatButton,{size:"small",disabled:m,leftIcon:j.stenaCalendar,onClick:k})}),onFocus:k,onClickRight:k,value:n?f.format(n,e):"",placeholder:t,size:9,disabled:m,autoFocus:l,variant:x,min:g,max:h})})})},qt=(e,t)=>{const n=o.useRef(null),r=o.useRef(null),[s,i]=o.useState(!1),[l,a]=o.useState(void 0),d=o.useCallback(()=>(a("startDate"),i(!0),!0),[a,i]),u=o.useCallback(()=>(a("endDate"),i(!0),!0),[a,i]),x=o.useCallback(()=>{i(!1)},[i]),y=o.useCallback(h=>{l==="startDate"?(t==null||t({startDate:h.date,endDate:e==null?void 0:e.endDate}),e!=null&&e.endDate?setTimeout(x,150):(a("endDate"),r.current&&r.current.focus())):l==="endDate"&&(t==null||t({startDate:e==null?void 0:e.startDate,endDate:h.date}),e!=null&&e.startDate?setTimeout(x,150):(a("startDate"),n.current&&n.current.focus()))},[l,t,a,x,e]),g=o.useMemo(()=>(e==null?void 0:e.startDate)&&(e==null?void 0:e.endDate)&&f.isAfter(e.startDate,e.endDate),[e==null?void 0:e.startDate,e==null?void 0:e.endDate]);return{showingCalendar:s,hideCalendar:x,showCalendarEndDate:u,showCalendarStartDate:d,focusedInput:l,setFocusedInput:a,startDateInputRef:n,endDateInputRef:r,onClickDay:y,startDateIsAfterEnd:g}},Jt=({displayFormat:e=F.fullDate,placeholderStartDate:t="Start date",placeholderEndDate:n="End date",portalTarget:r,value:s,onValueChange:i,zIndex:l=100,width:a,calendarTheme:d=z,calendarProps:u,minDate:x,maxDate:y=re,disabled:g})=>{const[h,m]=o.useState(()=>{var Y;return(Y=M&&(s==null?void 0:s[M]))!=null?Y:new Date}),[p,w]=o.useState("calendar"),{hideCalendar:S,showCalendarEndDate:k,showCalendarStartDate:b,showingCalendar:C,focusedInput:M,startDateInputRef:R,endDateInputRef:E,onClickDay:N,startDateIsAfterEnd:T}=qt(s,i),L=o.useMemo(()=>G(void 0,s==null?void 0:s.startDate,s==null?void 0:s.endDate),[s]);return c.jsx(Q.Popover,{arrow:!1,lazy:!0,disabled:g,visible:C,zIndex:l,placement:ne,appendTo:r!=null?r:"parent",onClickOutside:S,content:c.jsx(_,{...u,dateInFocus:h,setDateInFocus:m,statePerMonth:L,theme:d,onClickDay:N,currentPanel:p,setCurrentPanel:w,minDate:x,maxDate:y}),children:c.jsxs(D.Row,{alignItems:"center",children:[c.jsx($.TextInput,{iconLeft:j.stenaCalendar,onFocus:b,value:s!=null&&s.startDate?f.format(s.startDate,e):"",placeholder:t,width:a,disabled:g,inputRef:R,size:9,variant:T?"error":void 0}),c.jsx(D.Space,{}),c.jsx(j.Icon,{icon:it.faLongArrowAltRight,color:Me.cssColor("--lhds-color-ui-500"),size:14}),c.jsx(D.Space,{}),c.jsx($.TextInput,{iconLeft:j.stenaCalendar,onFocus:k,value:s!=null&&s.endDate?f.format(s.endDate,e):"",placeholder:n,width:a,disabled:g,inputRef:E,size:9,variant:T?"error":void 0})]})})},Kt=({calendarProps:e,closeOnCalendarSelectDate:t=!0,dateFormat:n=F.fullDate,disableCalender:r=!1,onValueChange:s,placeholder:i="yyyy-mm-dd",portalTarget:l,value:a,width:d="130px",zIndex:u=100,calendarTheme:x=z,hideCalenderIcon:y=!1,minDate:g,maxDate:h=re,variant:m,...p})=>{const[w,S]=o.useState(!1),{tippyRef:k,onChangePanel:b}=Ve(),C=o.useCallback(()=>{S(!w)},[S,w]),M=o.useCallback(()=>{S(!1)},[S]),R=o.useCallback(H=>{s&&s(H)},[s]),E=o.useCallback(H=>{H&&(R(f.format(H,n)),t&&setTimeout(()=>S(!w),200))},[R,n,t,S,w]),N=!!a&&!/^[-/\\.0-9]+$/.test(a),T=!!a&&f.isValid(f.parse(a,n,new Date)),Y=!!a&&a.length>=n.length&&!T||N;return c.jsx(D.Box,{width:d,children:c.jsx(Q.Popover,{arrow:!1,lazy:!0,visible:w,zIndex:u,appendTo:l!=null?l:"parent",placement:ne,onClickOutside:M,tippyRef:k,content:c.jsx(ke,{...e,onChange:E,onChangePanel:b,value:a&&T?f.parse(a,n,new Date):void 0,minDate:g,maxDate:h,theme:x}),children:c.jsx($.TextInput,{...p,variant:Y?"error":m,disableContentPaddingRight:!0,contentRight:y?void 0:c.jsx(D.Row,{alignItems:"center",indent:.5,children:c.jsx(j.FlatButton,{size:"small",disabled:p.disabled,leftIcon:j.stenaCalendar,onClick:C})}),onValueChange:R,placeholder:i,value:a||"",min:g,max:h,size:10})})})},le=e=>{if(e==="")return"00";const t=parseInt(e,10);if(isNaN(t))throw new Error("Hours is not a number");if(t<0||t>23)throw new Error("Hours is an invalid number");switch(e.length){case 1:return`0${t}`;case 2:return e;default:throw new Error("Invalid hour string")}},de=e=>{if(e==="")return"00";const t=parseInt(e,10);if(isNaN(t))throw new Error("Minutes is not a number");if(t<0||t>59)throw new Error("Minutes is an invalid number");switch(e.length){case 1:return`0${t}`;case 2:return e;default:throw new Error("Invalid minute string")}},vt=e=>{if(!ge(e))return{time:e,success:!1};const t=e&&e.split(/-|:|,|;|[/]|[.]| /);if(t&&t.length===2)try{const n=le(t[0]),r=de(t[1]);return{time:`${n}:${r}`,success:!0}}catch{return{time:e,success:!1}}else if(t&&t.length===1){let n=0,r=0;switch(e.length){case 1:return{time:`0${e}:00`,success:!0};case 2:const s=parseInt(t[0],10);return s>=0&&s<24?{time:`${e}:00`,success:!0}:s>=24&&s<59?{time:`00:${e}`,success:!0}:{time:e,success:!1};case 3:return r=parseInt(e.substr(1,2),10),r>=0&&r<=59?{time:`0${e.substr(0,1)}:${e.substr(1,2)}`,success:!0}:{time:e,success:!1};case 4:return n=parseInt(e.substr(0,2),10),r=parseInt(e.substr(2,2),10),n<0||n>23?{time:e,success:!1}:r<0||r>59?{time:e,success:!1}:{time:`${e.substr(0,2)}:${e.substr(2,2)}`,success:!0};default:return{time:e,success:!1}}}return{time:e,success:!1}},ge=e=>e?/^[-:.,/; 0-9]+$/.test(e):!0,Gt=({onValueChange:e,showPlaceholder:t=!0,useIcon:n=!0,value:r,width:s="85px",variant:i,...l})=>{const[a,d]=o.useState(()=>ge(r)),u="hh:mm",x=o.useCallback(()=>{if(r){const g=vt(r);d(g.success),g.success&&e&&e(g.time)}},[r,e,d]),y=o.useCallback(g=>{const h=g.target.value,m=ge(h);d(m&&h.length<=u.length),e&&e(h)},[e,d]);return c.jsx($.TextInput,{...l,type:"time",variant:a?i:"error",iconLeft:n?j.stenaClock:void 0,value:r,placeholder:t?u:void 0,onChange:y,onBlur:x,width:s})},et=({autoFocusLeft:e,autoFocusRight:t,onEsc:n,onEnter:r,onValueChangeLeft:s,onValueChangeRight:i,separatorIcon:l,placeholderLeft:a,placeholderRight:d,typeLeft:u,typeRight:x,onChangeLeft:y,onChangeRight:g,valueLeft:h,valueRight:m,minLeft:p,maxLeft:w,minRight:S,maxRight:k,onClickLeft:b,onClickRight:C,onClickCalendar:M,onClickArrowDown:R,onBlurLeft:E,onBlurRight:N,onFocusLeft:T,onFocusRight:L,inputRefLeft:Y,inputRefRight:H,variant:K,variantLeft:X,variantRight:v,onBlur:W,showPresets:Z,widthLeft:V,widthRight:ee,disabled:q})=>{const I=o.useRef(0),A=o.useMemo(()=>J.debounce(P=>{P===0&&(W==null||W())},10),[W]),se=o.useCallback(P=>{I.current++,A(I.current),T&&T(P)},[T,I,A]),ce=o.useCallback(P=>{I.current++,A(I.current),L&&L(P)},[L,I,A]),ie=o.useCallback(P=>{I.current--,A(I.current),E&&E(P)},[E,I,A]),nt=o.useCallback(P=>{I.current--,A(I.current),N&&N(P)},[N,I,A]);return c.jsx(D.Box,{children:c.jsxs($.TextInputBox,{disableContentPaddingRight:!0,disabled:q,variant:K,contentRight:c.jsxs(D.Row,{alignItems:"center",children:[c.jsx(D.Indent,{num:.5,children:c.jsx(j.FlatButton,{leftIcon:j.stenaCalendar,onClick:M,disabled:q,size:"small"})}),Z?c.jsxs(c.Fragment,{children:[c.jsx(D.Row,{height:"22px",children:c.jsx(D.SeparatorLine,{vertical:!0})}),c.jsx(D.Indent,{num:.5,children:c.jsx(j.FlatButton,{leftIcon:j.stenaAngleDown,onClick:R,disabled:q,size:"small"})})]}):null]}),children:[c.jsx(D.Box,{width:V,children:c.jsx($.TextInput,{onEsc:n,onEnter:r,onClick:b,disabled:q,hideBorder:!0,placeholder:a,value:h,onValueChange:s,onChange:y,onBlur:ie,onFocus:se,inputRef:Y,variant:X,type:u,autoFocus:e,min:p,max:w})}),c.jsx(D.Row,{indent:.5,alignItems:"center",justifyContent:"center",children:c.jsx(j.Icon,{icon:l,size:12,color:Me.cssColor("--lhds-color-ui-500")})}),c.jsx(D.Box,{width:ee,children:c.jsx($.TextInput,{onEsc:n,onEnter:r,onClick:C,disabled:q,hideBorder:!0,placeholder:d,value:m,onValueChange:i,onChange:g,onBlur:nt,onFocus:ce,inputRef:H,variant:v,type:x,autoFocus:t,min:S,max:k})})]})})},Qt=e=>{if(e==null)throw new Error("Time is not set.");if(e==="")throw new Error("Time is empty.");const t=e.split(":");if(t.length!==2)throw new Error("Invalid time.");if(t[1].length!==2)throw new Error("Invalid time.");if(t[0].length<1||t[0].length>2)throw new Error("Invalid time.");const n=parseInt(t[0],10),r=parseInt(t[1],10);if(isNaN(n))throw new Error("Invalid time.");if(isNaN(r))throw new Error("Invalid time.");if(n<0||n>23)throw new Error("Invalid time.");if(r<0||r>59)throw new Error("Invalid time.");return n*100+r},Xt=e=>{try{return Qt(e),!0}catch{return!1}},oe=e=>{if(e&&Xt(e)){const t=e.split(":");return{hour:D.parseIntElseUndefined(t[0]),minute:D.parseIntElseUndefined(t[1])}}return{hour:void 0,minute:void 0}},Zt=e=>`${le(String(e.getHours()))}:${de(String(e.getMinutes()))}`,Vt="_timePicker_1w05d_1",en="_timePickerColumn_1w05d_6";var tt={timePicker:Vt,timePickerColumn:en};const tn=({onClick:e,item:t,selected:n,columnRef:r,canScrollRef:s})=>{const i=o.useRef(null);return o.useEffect(function(){if(n&&r.current&&i.current&&s.current){const a=i.current.scrollHeight*Math.max(t-2,0);r.current.scrollTo(0,a),s.current=!1}},[r,t,n,s]),c.jsx(D.Row,{width:"64px",justifyContent:"center",spacing:.5,indent:.5,ref:i,children:n?c.jsx(j.PrimaryButton,{label:String(t),onClick:()=>e&&e(t)}):c.jsx(j.FlatButton,{label:String(t),onClick:()=>e&&e(t)})})},Se=({onClick:e,items:t,selectedItem:n,canScrollRef:r})=>{const s=o.useRef(null);return c.jsx(D.Column,{className:tt.timePickerColumn,ref:s,children:t.map(i=>c.jsx(tn,{item:i,onClick:e,selected:i===n,columnRef:s,canScrollRef:r},i))})},nn=J.range(0,24),rn=J.range(0,60),sn=({value:e,onValueChange:t})=>{const n=o.useRef(!0),[r,s]=o.useState(void 0),[i,l]=o.useState(void 0);o.useEffect(()=>{if(e){const{minute:u,hour:x}=oe(e);s(x),l(u)}},[e]);const a=o.useCallback(u=>{s(u),t==null||t(`${le(String(u!=null?u:0))}:${de(String(i!=null?i:0))}`)},[i,t]),d=o.useCallback(u=>{l(u),t==null||t(`${le(String(r!=null?r:0))}:${de(String(u!=null?u:0))}`)},[r,t]);return c.jsxs(D.Row,{className:tt.timePicker,children:[c.jsx(Se,{items:nn,onClick:a,selectedItem:r,canScrollRef:n}),c.jsx(D.Indent,{}),c.jsx(Se,{items:rn,onClick:d,selectedItem:i,canScrollRef:n})]})},cn=(e,t,n)=>{o.useEffect(function(){e&&t(e)},[e,t]),o.useEffect(function(){n.current&&(e?n.current.valueAsDate=new Date(Date.UTC(e.getFullYear(),e.getMonth(),e.getDate())):n.current.valueAsDate=null)},[e,n])},on=(e,t,{setDateInFocus:n,showCalendarInternal:r,hideCalendarInternal:s,setFirstFocusedInput:i,setCurrentPanel:l,localTime:a,setLocalTime:d,localDate:u,setLocalDate:x},y)=>{const g=o.useCallback(k=>{if(!k)return;const b=new Date(k);if(e)b.setHours(e.getHours()),b.setMinutes(e.getMinutes()),t==null||t(b),x(void 0);else if(a){const{minute:C,hour:M}=oe(a);b.setHours(M!=null?M:0),b.setMinutes(C!=null?C:0),t==null||t(b),x(void 0)}else x(b);n(b),y.current&&(y.current.valueAsDate=b)},[e,y,a,t,n,x]),h=o.useCallback(k=>{if(!!k)if(e){const b=oe(k),C=new Date(e);C.setHours(b.hour||0),C.setMinutes(b.minute||0),t==null||t(C),d(void 0)}else if(u){const b=oe(k),C=new Date(u);C.setHours(b.hour||0),C.setMinutes(b.minute||0),t==null||t(C),d(void 0)}else d(k)},[t,e,u,d]),m=o.useCallback(k=>{k.target.value[0]!=="0"&&g(k.target.valueAsDate)},[g]),p=o.useCallback(k=>h(k.target.value),[h]),w=o.useCallback(()=>{n(e||new Date),l("calendar"),r()},[e,l,r,n]),S=o.useCallback(()=>{i(void 0),s()},[i,s]);return{inputLeftChangeHandler:m,inputRightChangeHandler:p,hideCalendar:S,showCalendar:w,onChangeTime:h,onChangeDate:g}},an=e=>{const[t,n]=o.useState(void 0),[r,s]=o.useState(void 0),[i,l,a]=D.useBoolean(!1),[d,u,x]=D.useBoolean(!1),[y,g]=o.useState(void 0),[h,m]=o.useState(()=>e!=null?e:new Date),[p,w]=o.useState("calendar");return{isCalendarVisible:i,showCalendarInternal:l,hideCalendarInternal:a,firstFocusedInput:y,setFirstFocusedInput:g,dateInFocus:h,setDateInFocus:m,currentPanel:p,setCurrentPanel:w,isTimePickerVisible:d,showTimePicker:u,hideTimePicker:x,localDate:t,setLocalDate:n,localTime:r,setLocalTime:s}},ln=(e,t,n,r,{isCalendarVisible:s,setCurrentPanel:i,showTimePicker:l,hideTimePicker:a})=>{const d=o.useCallback(()=>{s||n(),i("calendar"),a()},[a,s,i,n]),u=o.useCallback(()=>{r(),l()},[r,l]),x=o.useCallback(m=>{e(m.date),r(),l()},[e,r,l]),y=o.useCallback(()=>{i("presets"),n()},[i,n]),g=o.useCallback(()=>{var m;s?r():((m=t.current)==null||m.focus(),i("calendar"),n())},[s,r,t,i,n]),h=o.useCallback(m=>{m.key==="Escape"&&r()},[r]);return{onFocusLeft:d,onFocusRight:u,onClickDay:x,onClickArrowButton:y,onClickCalendarButton:g,onKeyDownHandler:h}},dn=({value:e,onValueChange:t,onEnter:n,onEsc:r,onBlur:s,autoFocus:i,minDate:l,widthLeft:a=128,widthRight:d=80,maxDate:u=re,variant:x,disabled:y})=>{const g=o.useRef(null),h=o.useRef(null),m=an(e),{setCurrentPanel:p,currentPanel:w,isCalendarVisible:S,dateInFocus:k,setDateInFocus:b,isTimePickerVisible:C,hideTimePicker:M,localTime:R,localDate:E}=m,{showCalendar:N,hideCalendar:T,inputLeftChangeHandler:L,inputRightChangeHandler:Y,onChangeTime:H,onChangeDate:K}=on(e,t,m,g),{onKeyDownHandler:X,onFocusRight:v,onFocusLeft:W,onClickDay:Z,onClickCalendarButton:V,onClickArrowButton:ee}=ln(K,g,N,T,m);cn(e,b,g);const q=o.useMemo(()=>{const ie=e||E;return ie?O(void 0,ie,["singleSelected","selected"]):{}},[E,e]),I=o.useCallback(()=>{T(),M()},[T,M]),A=o.useMemo(()=>e?Zt(e):R,[e,R]),se=D.useDelayedFalse(S,300),ce=D.useDelayedFalse(C,300);return c.jsx(D.Box,{onKeyDown:X,children:c.jsx(Q.Popover,{arrow:!1,lazy:!0,disabled:y,placement:ne,visible:S||C,onClickOutside:I,content:(se||ce)&&c.jsx(D.Column,{children:se?c.jsx(_,{statePerMonth:q,onClickDay:Z,dateInFocus:k,setDateInFocus:b,currentPanel:w,setCurrentPanel:p,minDate:l,maxDate:u}):ce?c.jsxs(D.Column,{children:[c.jsx(D.Column,{overflow:"hidden",height:"250px",children:c.jsx(sn,{value:A!=null?A:"",onValueChange:H})}),c.jsx(D.Space,{}),c.jsx(D.Row,{justifyContent:"flex-end",children:c.jsx(j.PrimaryButton,{label:"Done",onClick:M})})]}):null}),children:c.jsx(et,{autoFocusLeft:i,onEsc:r,onEnter:n,onBlur:s,disabled:y,separatorIcon:j.stenaClock,typeLeft:"date",typeRight:"time",placeholderLeft:"yyyy-mm-dd",placeholderRight:"hh:mm",onChangeLeft:L,onChangeRight:Y,onClickArrowDown:ee,onClickCalendar:V,onFocusLeft:W,onFocusRight:v,onClickLeft:W,onClickRight:v,inputRefLeft:g,inputRefRight:h,valueRight:A!=null?A:"",widthLeft:a,widthRight:d,minLeft:l,maxLeft:u,variant:x})})})},un=(e,t,n,r,s)=>{o.useEffect(function(){e&&n(e)},[e,n]),o.useEffect(function(){t&&n(t)},[t,n]),o.useEffect(function(){r.current&&(e?r.current.valueAsDate=new Date(Date.UTC(e.getFullYear(),e.getMonth(),e.getDate())):r.current.valueAsDate=null)},[e,r]),o.useEffect(function(){s.current&&(t?s.current.valueAsDate=new Date(Date.UTC(t.getFullYear(),t.getMonth(),t.getDate())):s.current.valueAsDate=null)},[t,s])},fn=(e,t,n,{setDateInFocus:r,showCalendarInternal:s,hideCalendarInternal:i,setFirstFocusedInput:l,setCurrentPanel:a})=>{const d=o.useCallback(g=>{var h;g.target.value[0]!=="0"&&(n==null||n({startDate:(h=g.target.valueAsDate)!=null?h:void 0,endDate:t}))},[n,t]),u=o.useCallback(g=>{var h;g.target.value[0]!=="0"&&(n==null||n({startDate:e,endDate:(h=g.target.valueAsDate)!=null?h:void 0}))},[n,e]),x=o.useCallback(()=>{r(e||t||new Date),a("calendar"),s()},[e,t,a,s,r]),y=o.useCallback(()=>{l(void 0),i()},[l,i]);return{inputLeftChangeHandler:d,inputRightChangeHandler:u,hideCalendar:y,setDateInFocus:r,setCurrentPanel:a,showCalendar:x}},Dn=(e,t)=>{const[n,r,s]=D.useBoolean(!1),[i,l]=o.useState(void 0),[a,d]=o.useState("startDate"),[u,x]=o.useState(()=>{const h=a==="startDate"?e:a==="endDate"?t:void 0;return h!=null?h:new Date}),[y,g]=o.useState("calendar");return{isCalendarVisible:n,showCalendarInternal:r,hideCalendarInternal:s,firstFocusedInput:i,setFirstFocusedInput:l,focusedInput:a,setFocusedInput:d,dateInFocus:u,setDateInFocus:x,currentPanel:y,setCurrentPanel:g}},xn=(e,t,n,r,s,i,l,{firstFocusedInput:a,setFirstFocusedInput:d,isCalendarVisible:u,setFocusedInput:x,focusedInput:y,setCurrentPanel:g})=>{const h=o.useCallback(()=>{a==null&&d("startDate"),x("startDate"),u||i()},[u,x,i,d,a]),m=o.useCallback(()=>{a==null&&d("endDate"),x("endDate"),u||i()},[u,x,i,d,a]),p=o.useCallback(b=>{var C,M,R,E;y==="startDate"?t!=null&&f.isAfter(b.date,t)?(n==null||n({startDate:b.date,endDate:void 0}),x("endDate"),(C=s.current)==null||C.focus()):(n==null||n({startDate:b.date,endDate:t}),a==="startDate"?(x("endDate"),(M=s.current)==null||M.focus()):setTimeout(l,50)):y==="endDate"&&(e?f.isAfter(e,b.date)?(n==null||n({startDate:b.date,endDate:void 0}),x("endDate"),(E=s.current)==null||E.focus()):(n==null||n({startDate:e,endDate:b.date}),setTimeout(l,50)):(n==null||n({startDate:e,endDate:b.date}),x("startDate"),(R=r.current)==null||R.focus()))},[y,n,t,a,x,s,l,e,r]),w=o.useCallback(()=>{g("presets"),i()},[g,i]),S=o.useCallback(()=>{var b;u?l():(x("startDate"),d("startDate"),(b=r.current)==null||b.focus(),g("calendar"),i())},[u,l,x,d,r,g,i]),k=o.useCallback(b=>{b.key==="Escape"&&l()},[l]);return{onFocusLeft:h,onFocusRight:m,onClickDay:p,onClickArrowButton:w,onClickCalendarButton:S,onKeyDownHandler:k}},gn=({value:e,onValueChange:t,autoFocus:n,onBlur:r,onEnter:s,onEsc:i,minDate:l,maxDate:a=re,calendarProps:d,widthLeft:u=128,widthRight:x=128,variant:y,disabled:g})=>{const{startDate:h,endDate:m}=e||{},p=o.useRef(null),w=o.useRef(null),S=Dn(h,m),{dateInFocus:k,setDateInFocus:b,isCalendarVisible:C,currentPanel:M,setCurrentPanel:R}=S,{showCalendar:E,hideCalendar:N,inputLeftChangeHandler:T,inputRightChangeHandler:L}=fn(h,m,t,S),{onKeyDownHandler:Y,onFocusRight:H,onFocusLeft:K,onClickDay:X,onClickCalendarButton:v,onClickArrowButton:W}=xn(h,m,t,p,w,E,N,S);un(h,m,b,p,w);const Z=o.useMemo(()=>h&&m&&f.isAfter(h,m),[h,m]),V=o.useMemo(()=>Ee(d==null?void 0:d.statePerMonth,h,m,k),[d==null?void 0:d.statePerMonth,h,m,k]),ee=D.useDelayedFalse(C,300);return c.jsx(D.Box,{onKeyDown:Y,children:c.jsx(Q.Popover,{arrow:!1,lazy:!0,disabled:g,placement:ne,onClickOutside:N,visible:C,content:ee&&c.jsx(_,{onClickDay:X,dateInFocus:k,setDateInFocus:b,currentPanel:M,setCurrentPanel:R,minDate:l,maxDate:a,...d,statePerMonth:V}),children:c.jsx(et,{autoFocusLeft:n,onEsc:i,onEnter:s,onBlur:r,disabled:g,separatorIcon:j.stenaArrowRight,typeLeft:"date",typeRight:"date",placeholderLeft:"Start date",placeholderRight:"End date",onChangeLeft:T,onChangeRight:L,onClickArrowDown:W,onClickCalendar:v,onFocusLeft:K,onFocusRight:H,onClickLeft:K,onClickRight:H,inputRefLeft:p,inputRefRight:w,variant:Z?"error":y,widthLeft:u,widthRight:x,minLeft:l,maxLeft:a,minRight:l,maxRight:a})})})};exports.Calendar=ae;exports.CalendarDay=be;exports.DateInput=_t;exports.DateRangeCalendar=Lt;exports.DateRangeDualTextInput=gn;exports.DateRangeExclusionCalendar=Ft;exports.DateRangeInput=Jt;exports.DateTextInput=Kt;exports.DateTimeInput=dn;exports.Month=B;exports.MonthPicker=Fe;exports.MultiDateCalendar=Ot;exports.PresetPicker=ze;exports.SingleDateCalendar=ke;exports.SingleWeekCalendar=Wt;exports.TimeTextInput=Gt;exports.WeekDay=Ie;exports.WeekDayCell=$e;exports.WeekNumberCell=Ue;exports.YearPicker=_e;exports.addDayStateHighlights=O;exports.addDayStateHighlightsOnSingleDay=he;exports.addWeekRangeHighlights=Ae;exports.addWeekStateHighlights=ut;exports.buildDayStateForDateRange=G;exports.buildDayStateForRange=Te;exports.buildDayStateForSingleMonth=Ee;exports.calculateOverflowingMonth=Ye;exports.createDay=Ne;exports.dateRangeToStrings=qe;exports.dayHasHighlight=Oe;exports.dayHighlightSelect=U;exports.defaultCalendarTheme=z;exports.defaultTextPropsProvider=Pe;exports.defaultWrapperStyleProvider=We;exports.extranetCalendarTheme=Dt;exports.getDaysForWeekForDate=He;exports.getMonthInYear=ye;exports.getMonthsInYear=xe;exports.getStartDateOfISOWeek=Le;exports.getWeekForDate=ue;exports.getWeeksForMonth=Be;exports.isDateRangeInvalid=me;exports.setDayStateValue=lt;exports.setDayStateValueFunction=dt;exports.stringsToDateRange=Je;exports.toggleDateStringsIfEndIsEarlierThanStart=Ht;exports.toggleDatesIfEndIsEarlierThanStart=je;exports.useDateRangeCalendarState=Yt;exports.useDateRangeExclusionSelection=Ze;exports.useDateRangeSelection=ve;exports.useMultiDateSelection=Qe;exports.useSingleDateSelection=Ge;exports.useSingleWeekSelection=Xe;
2156
2
  //# sourceMappingURL=index.js.map