@entur/datepicker 3.0.8 → 3.0.10

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.
@@ -29,39 +29,46 @@ function _extends() {
29
29
  _extends = Object.assign || function (target) {
30
30
  for (var i = 1; i < arguments.length; i++) {
31
31
  var source = arguments[i];
32
+
32
33
  for (var key in source) {
33
34
  if (Object.prototype.hasOwnProperty.call(source, key)) {
34
35
  target[key] = source[key];
35
36
  }
36
37
  }
37
38
  }
39
+
38
40
  return target;
39
41
  };
42
+
40
43
  return _extends.apply(this, arguments);
41
44
  }
45
+
42
46
  function _objectWithoutPropertiesLoose(source, excluded) {
43
47
  if (source == null) return {};
44
48
  var target = {};
45
49
  var sourceKeys = Object.keys(source);
46
50
  var key, i;
51
+
47
52
  for (i = 0; i < sourceKeys.length; i++) {
48
53
  key = sourceKeys[i];
49
54
  if (excluded.indexOf(key) >= 0) continue;
50
55
  target[key] = source[key];
51
56
  }
57
+
52
58
  return target;
53
59
  }
54
60
 
55
61
  var DatePickerHeader = function DatePickerHeader(_ref) {
56
62
  var _date$getMonth;
63
+
57
64
  var date = _ref.date,
58
- decreaseMonth = _ref.decreaseMonth,
59
- increaseMonth = _ref.increaseMonth,
60
- prevMonthButtonDisabled = _ref.prevMonthButtonDisabled,
61
- nextMonthButtonDisabled = _ref.nextMonthButtonDisabled,
62
- nextMonthAriaLabel = _ref.nextMonthAriaLabel,
63
- previousMonthAriaLabel = _ref.previousMonthAriaLabel,
64
- locale = _ref.locale;
65
+ decreaseMonth = _ref.decreaseMonth,
66
+ increaseMonth = _ref.increaseMonth,
67
+ prevMonthButtonDisabled = _ref.prevMonthButtonDisabled,
68
+ nextMonthButtonDisabled = _ref.nextMonthButtonDisabled,
69
+ nextMonthAriaLabel = _ref.nextMonthAriaLabel,
70
+ previousMonthAriaLabel = _ref.previousMonthAriaLabel,
71
+ locale = _ref.locale;
65
72
  var currentMonthIndex = (_date$getMonth = date == null ? void 0 : date.getMonth()) != null ? _date$getMonth : 0;
66
73
  return React__default["default"].createElement("div", {
67
74
  className: "eds-datepicker__calender__header"
@@ -83,6 +90,7 @@ var DatePickerHeader = function DatePickerHeader(_ref) {
83
90
  "aria-label": nextMonthAriaLabel + " (" + getMonthName(currentMonthIndex + 1, locale) + ")"
84
91
  }, React__default["default"].createElement(icons.RightArrowIcon, null)));
85
92
  };
93
+
86
94
  function getMonthName(monthIndex, locale) {
87
95
  var year = new Date().getFullYear();
88
96
  var formatter = new Intl.DateTimeFormat(locale.code, {
@@ -94,68 +102,79 @@ function getMonthName(monthIndex, locale) {
94
102
  var _excluded$4 = ["style", "label", "inputPlaceholder", "prepend", "feedback", "variant", "disabled", "calendarButtonTooltipOpen", "calendarButtonTooltipClose", "hideCalendarButton", "disableLabelAnimation", "inputRef", "calendarButtonId", "forwardRef", "toggleCalendarGUI", "onKeyDownInput", "onBlurInput", "selectedDate", "setFocusToCalendarGUI", "setShouldFocusOnCalendarButtonAfterSelect", "calendarGUIIsOpen", "placeholder", "onClick", "aria-labelledby"];
95
103
  var DatePickerInput = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
96
104
  var style = _ref.style,
97
- label = _ref.label,
98
- inputPlaceholder = _ref.inputPlaceholder,
99
- prepend = _ref.prepend,
100
- feedback = _ref.feedback,
101
- variant = _ref.variant,
102
- disabled = _ref.disabled,
103
- calendarButtonTooltipOpen = _ref.calendarButtonTooltipOpen,
104
- calendarButtonTooltipClose = _ref.calendarButtonTooltipClose,
105
- hideCalendarButton = _ref.hideCalendarButton,
106
- disableLabelAnimation = _ref.disableLabelAnimation,
107
- inputRef = _ref.inputRef,
108
- calendarButtonId = _ref.calendarButtonId,
109
- forwardRef = _ref.forwardRef,
110
- toggleCalendarGUI = _ref.toggleCalendarGUI,
111
- onKeyDownInput = _ref.onKeyDownInput,
112
- onBlurInput = _ref.onBlurInput,
113
- selectedDate = _ref.selectedDate,
114
- setFocusToCalendarGUI = _ref.setFocusToCalendarGUI,
115
- setShouldFocusOnCalendarButtonAfterSelect = _ref.setShouldFocusOnCalendarButtonAfterSelect,
116
- calendarGUIIsOpen = _ref.calendarGUIIsOpen,
117
- onClick = _ref.onClick,
118
- rest = _objectWithoutPropertiesLoose(_ref, _excluded$4);
105
+ label = _ref.label,
106
+ inputPlaceholder = _ref.inputPlaceholder,
107
+ prepend = _ref.prepend,
108
+ feedback = _ref.feedback,
109
+ variant = _ref.variant,
110
+ disabled = _ref.disabled,
111
+ calendarButtonTooltipOpen = _ref.calendarButtonTooltipOpen,
112
+ calendarButtonTooltipClose = _ref.calendarButtonTooltipClose,
113
+ hideCalendarButton = _ref.hideCalendarButton,
114
+ disableLabelAnimation = _ref.disableLabelAnimation,
115
+ inputRef = _ref.inputRef,
116
+ calendarButtonId = _ref.calendarButtonId,
117
+ forwardRef = _ref.forwardRef,
118
+ toggleCalendarGUI = _ref.toggleCalendarGUI,
119
+ onKeyDownInput = _ref.onKeyDownInput,
120
+ onBlurInput = _ref.onBlurInput,
121
+ selectedDate = _ref.selectedDate,
122
+ setFocusToCalendarGUI = _ref.setFocusToCalendarGUI,
123
+ setShouldFocusOnCalendarButtonAfterSelect = _ref.setShouldFocusOnCalendarButtonAfterSelect,
124
+ calendarGUIIsOpen = _ref.calendarGUIIsOpen,
125
+ onClick = _ref.onClick,
126
+ rest = _objectWithoutPropertiesLoose(_ref, _excluded$4);
127
+
119
128
  React__default["default"].useEffect(function () {
120
129
  var _inputRef$current, _inputRef$current2, _inputRef$current3;
130
+
121
131
  (_inputRef$current = inputRef.current) == null ? void 0 : _inputRef$current.addEventListener('keydown', handleOnKeyDown);
122
132
  (_inputRef$current2 = inputRef.current) == null ? void 0 : _inputRef$current2.addEventListener('blur', handleOnBlur);
123
133
  (_inputRef$current3 = inputRef.current) == null ? void 0 : _inputRef$current3.addEventListener('focus', handleOnFocus);
124
134
  return function () {
125
135
  var _inputRef$current4, _inputRef$current5, _inputRef$current6;
136
+
126
137
  (_inputRef$current4 = inputRef.current) == null ? void 0 : _inputRef$current4.removeEventListener('keydown', handleOnKeyDown);
127
138
  (_inputRef$current5 = inputRef.current) == null ? void 0 : _inputRef$current5.removeEventListener('blur', handleOnBlur);
128
139
  (_inputRef$current6 = inputRef.current) == null ? void 0 : _inputRef$current6.removeEventListener('focus', handleOnFocus);
129
- };
130
- // eslint-disable-next-line react-hooks/exhaustive-deps
140
+ }; // eslint-disable-next-line react-hooks/exhaustive-deps
131
141
  }, [inputRef, selectedDate]);
142
+
132
143
  function handleOnKeyDown(event) {
133
144
  onKeyDownInput(event);
134
145
  }
146
+
135
147
  function handleOnBlur(event) {
136
148
  onBlurInput(event);
137
149
  }
150
+
138
151
  var handleOnFocus = function handleOnFocus() {
139
152
  return requestAnimationFrame(function () {
140
153
  var _inputRef$current7;
154
+
141
155
  return (_inputRef$current7 = inputRef.current) == null ? void 0 : _inputRef$current7.select();
142
156
  });
143
157
  };
158
+
144
159
  var handleOnClickInputField = function handleOnClickInputField(event) {
145
160
  setShouldFocusOnCalendarButtonAfterSelect(false);
146
161
  onClick && onClick(event);
147
162
  };
163
+
148
164
  var handleOnClickCalendarButton = function handleOnClickCalendarButton() {
149
165
  toggleCalendarGUI();
150
166
  setFocusToCalendarGUI();
151
167
  setShouldFocusOnCalendarButtonAfterSelect(true);
152
168
  };
169
+
153
170
  var calendarButtonAriaLabel = function calendarButtonAriaLabel() {
154
171
  var _inputRef$current8;
172
+
155
173
  var buttonStateText = calendarGUIIsOpen() ? calendarButtonTooltipClose : calendarButtonTooltipOpen;
156
174
  var currentSelectionText = selectedDate ? ((_inputRef$current8 = inputRef.current) == null ? void 0 : _inputRef$current8.value) + " valgt" : 'Ingen dato valgt';
157
175
  return buttonStateText + ", " + currentSelectionText;
158
176
  };
177
+
159
178
  return React__default["default"].createElement(form.TextField, _extends({
160
179
  style: style,
161
180
  label: label,
@@ -186,85 +205,95 @@ var _excluded$3 = ["style", "className", "selectedDate", "label", "placeholder",
186
205
  ReactDatepicker.registerLocale('nb', locale.nb);
187
206
  var DatePicker = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
188
207
  var style = _ref.style,
189
- className = _ref.className,
190
- selectedDate = _ref.selectedDate,
191
- label = _ref.label,
192
- _ref$placeholder = _ref.placeholder,
193
- placeholder = _ref$placeholder === void 0 ? 'dd.mm.yyyy' : _ref$placeholder,
194
- onChange = _ref.onChange,
195
- _ref$onKeyDown = _ref.onKeyDown,
196
- onKeyDown = _ref$onKeyDown === void 0 ? function () {
197
- return null;
198
- } : _ref$onKeyDown,
199
- _ref$dateFormats = _ref.dateFormats,
200
- dateFormats = _ref$dateFormats === void 0 ? ['dd.MM.yyyy', 'ddMMyyyy', 'dd/MM/yyyy', 'ddMMyy'] : _ref$dateFormats,
201
- minDate = _ref.minDate,
202
- maxDate = _ref.maxDate,
203
- _ref$inline = _ref.inline,
204
- inline = _ref$inline === void 0 ? false : _ref$inline,
205
- disabled = _ref.disabled,
206
- prepend = _ref.prepend,
207
- _ref$feedback = _ref.feedback,
208
- feedback = _ref$feedback === void 0 ? '' : _ref$feedback,
209
- variant = _ref.variant,
210
- _ref$validationFeedba = _ref.validationFeedback,
211
- validationFeedback = _ref$validationFeedba === void 0 ? 'Ugyldig dato' : _ref$validationFeedba,
212
- _ref$validationVarian = _ref.validationVariant,
213
- validationVariant = _ref$validationVarian === void 0 ? 'error' : _ref$validationVarian,
214
- _ref$disableLabelAnim = _ref.disableLabelAnimation,
215
- disableLabelAnimation = _ref$disableLabelAnim === void 0 ? false : _ref$disableLabelAnim,
216
- _ref$calendarButtonTo = _ref.calendarButtonTooltipOpen,
217
- calendarButtonTooltipOpen = _ref$calendarButtonTo === void 0 ? 'Åpne\xa0kalender' : _ref$calendarButtonTo,
218
- _ref$calendarButtonTo2 = _ref.calendarButtonTooltipClose,
219
- calendarButtonTooltipClose = _ref$calendarButtonTo2 === void 0 ? 'Lukk\xa0kalender' : _ref$calendarButtonTo2,
220
- _ref$hideCalendarButt = _ref.hideCalendarButton,
221
- hideCalendarButton = _ref$hideCalendarButt === void 0 ? false : _ref$hideCalendarButt,
222
- _ref$hideCalendar = _ref.hideCalendar,
223
- hideCalendar = _ref$hideCalendar === void 0 ? false : _ref$hideCalendar,
224
- _ref$hideValidation = _ref.hideValidation,
225
- hideValidation = _ref$hideValidation === void 0 ? false : _ref$hideValidation,
226
- _ref$weekLabel = _ref.weekLabel,
227
- weekLabel = _ref$weekLabel === void 0 ? 'uke' : _ref$weekLabel,
228
- _ref$chooseDayAriaLab = _ref.chooseDayAriaLabelPrefix,
229
- chooseDayAriaLabelPrefix = _ref$chooseDayAriaLab === void 0 ? 'Velg' : _ref$chooseDayAriaLab,
230
- _ref$previousMonthAri = _ref.previousMonthAriaLabel,
231
- previousMonthAriaLabel = _ref$previousMonthAri === void 0 ? 'Forrige måned' : _ref$previousMonthAri,
232
- _ref$nextMonthAriaLab = _ref.nextMonthAriaLabel,
233
- nextMonthAriaLabel = _ref$nextMonthAriaLab === void 0 ? 'Neste måned' : _ref$nextMonthAriaLab,
234
- _ref$locale = _ref.locale,
235
- locale$1 = _ref$locale === void 0 ? locale.nb : _ref$locale,
236
- open = _ref.open,
237
- rest = _objectWithoutPropertiesLoose(_ref, _excluded$3);
208
+ className = _ref.className,
209
+ selectedDate = _ref.selectedDate,
210
+ label = _ref.label,
211
+ _ref$placeholder = _ref.placeholder,
212
+ placeholder = _ref$placeholder === void 0 ? 'dd.mm.yyyy' : _ref$placeholder,
213
+ onChange = _ref.onChange,
214
+ _ref$onKeyDown = _ref.onKeyDown,
215
+ onKeyDown = _ref$onKeyDown === void 0 ? function () {
216
+ return null;
217
+ } : _ref$onKeyDown,
218
+ _ref$dateFormats = _ref.dateFormats,
219
+ dateFormats = _ref$dateFormats === void 0 ? ['dd.MM.yyyy', 'ddMMyyyy', 'dd/MM/yyyy', 'ddMMyy'] : _ref$dateFormats,
220
+ minDate = _ref.minDate,
221
+ maxDate = _ref.maxDate,
222
+ _ref$inline = _ref.inline,
223
+ inline = _ref$inline === void 0 ? false : _ref$inline,
224
+ disabled = _ref.disabled,
225
+ prepend = _ref.prepend,
226
+ _ref$feedback = _ref.feedback,
227
+ feedback = _ref$feedback === void 0 ? '' : _ref$feedback,
228
+ variant = _ref.variant,
229
+ _ref$validationFeedba = _ref.validationFeedback,
230
+ validationFeedback = _ref$validationFeedba === void 0 ? 'Ugyldig dato' : _ref$validationFeedba,
231
+ _ref$validationVarian = _ref.validationVariant,
232
+ validationVariant = _ref$validationVarian === void 0 ? 'error' : _ref$validationVarian,
233
+ _ref$disableLabelAnim = _ref.disableLabelAnimation,
234
+ disableLabelAnimation = _ref$disableLabelAnim === void 0 ? false : _ref$disableLabelAnim,
235
+ _ref$calendarButtonTo = _ref.calendarButtonTooltipOpen,
236
+ calendarButtonTooltipOpen = _ref$calendarButtonTo === void 0 ? 'Åpne\xa0kalender' : _ref$calendarButtonTo,
237
+ _ref$calendarButtonTo2 = _ref.calendarButtonTooltipClose,
238
+ calendarButtonTooltipClose = _ref$calendarButtonTo2 === void 0 ? 'Lukk\xa0kalender' : _ref$calendarButtonTo2,
239
+ _ref$hideCalendarButt = _ref.hideCalendarButton,
240
+ hideCalendarButton = _ref$hideCalendarButt === void 0 ? false : _ref$hideCalendarButt,
241
+ _ref$hideCalendar = _ref.hideCalendar,
242
+ hideCalendar = _ref$hideCalendar === void 0 ? false : _ref$hideCalendar,
243
+ _ref$hideValidation = _ref.hideValidation,
244
+ hideValidation = _ref$hideValidation === void 0 ? false : _ref$hideValidation,
245
+ _ref$weekLabel = _ref.weekLabel,
246
+ weekLabel = _ref$weekLabel === void 0 ? 'uke' : _ref$weekLabel,
247
+ _ref$chooseDayAriaLab = _ref.chooseDayAriaLabelPrefix,
248
+ chooseDayAriaLabelPrefix = _ref$chooseDayAriaLab === void 0 ? 'Velg' : _ref$chooseDayAriaLab,
249
+ _ref$previousMonthAri = _ref.previousMonthAriaLabel,
250
+ previousMonthAriaLabel = _ref$previousMonthAri === void 0 ? 'Forrige måned' : _ref$previousMonthAri,
251
+ _ref$nextMonthAriaLab = _ref.nextMonthAriaLabel,
252
+ nextMonthAriaLabel = _ref$nextMonthAriaLab === void 0 ? 'Neste måned' : _ref$nextMonthAriaLab,
253
+ _ref$locale = _ref.locale,
254
+ locale$1 = _ref$locale === void 0 ? locale.nb : _ref$locale,
255
+ open = _ref.open,
256
+ rest = _objectWithoutPropertiesLoose(_ref, _excluded$3);
257
+
238
258
  var datepickerId = utils.useRandomId('eds-datepicker');
239
259
  var datepickerRef = React.useRef(null);
240
260
  var inputRef = React__default["default"].useRef(null);
241
261
  var calendarButton = document.getElementById(datepickerId + '-button');
262
+
242
263
  var _useState = React.useState(false),
243
- showValidation = _useState[0],
244
- setShowValidation = _useState[1];
264
+ showValidation = _useState[0],
265
+ setShowValidation = _useState[1];
266
+
245
267
  var _useState2 = React.useState(false),
246
- shouldFocusOnCalendarButtonAfterSelect = _useState2[0],
247
- setShouldFocusOnCalendarButtonAfterSelect = _useState2[1];
248
- // eslint-disable-next-line react-hooks/exhaustive-deps
268
+ shouldFocusOnCalendarButtonAfterSelect = _useState2[0],
269
+ setShouldFocusOnCalendarButtonAfterSelect = _useState2[1]; // eslint-disable-next-line react-hooks/exhaustive-deps
270
+
271
+
249
272
  React__default["default"].useEffect(function () {
250
273
  return validateInput();
251
274
  }, [selectedDate]);
275
+
252
276
  var handleOnChange = function handleOnChange(date, event) {
253
277
  var _inputRef$current;
278
+
254
279
  if (shouldFocusOnCalendarButtonAfterSelect && !hideCalendarButton) {
255
280
  calendarButton == null ? void 0 : calendarButton.focus();
256
281
  setShouldFocusOnCalendarButtonAfterSelect(false);
257
282
  } else (_inputRef$current = inputRef.current) == null ? void 0 : _inputRef$current.focus();
283
+
258
284
  onChange(date, event);
259
285
  };
286
+
260
287
  var handleOnKeyDown = function handleOnKeyDown(event) {
261
288
  setShowValidation(false);
289
+
262
290
  if (event.key === 'Enter') {
263
291
  if (!datePickerGUIIsOpen()) {
264
292
  // onBlurInput will validate if calendar is open
265
293
  validateInput();
266
294
  forceUpdateInputFormat();
267
295
  }
296
+
268
297
  focusAndSelectInputField();
269
298
  } else if (event.key === 'Tab' && datePickerGUIIsOpen()) {
270
299
  forceUpdateInputFormat();
@@ -273,18 +302,23 @@ var DatePicker = /*#__PURE__*/React__default["default"].forwardRef(function (_re
273
302
  focusAndSelectInputField();
274
303
  if (datePickerGUIIsOpen()) toggleCalendarGUI();
275
304
  }
305
+
276
306
  onKeyDown(event);
277
307
  };
308
+
278
309
  var handleOnClickOutside = function handleOnClickOutside() {
279
310
  return setShouldFocusOnCalendarButtonAfterSelect(false);
280
311
  };
312
+
281
313
  var handleOnBlurInput = function handleOnBlurInput() {
282
314
  if (datePickerGUIIsOpen()) return;
283
315
  validateInput();
284
316
  forceUpdateInputFormat();
285
317
  };
318
+
286
319
  var validateInput = function validateInput() {
287
320
  var _inputRef$current2;
321
+
288
322
  setShowValidation(false);
289
323
  var inputValue = (_inputRef$current2 = inputRef.current) == null ? void 0 : _inputRef$current2.value;
290
324
  if (!inputValue) return;
@@ -296,6 +330,7 @@ var DatePicker = /*#__PURE__*/React__default["default"].forwardRef(function (_re
296
330
  var parsedDateFromInputIsTheSameAsSelectedDate = selectedDate && inputValueParsedWithAllDateFormats.some(function (dateFormat) {
297
331
  return dateFns.isSameDay(dateFormat, selectedDate);
298
332
  });
333
+
299
334
  if (parsedDateFromInputIsTheSameAsSelectedDate) {
300
335
  // valid date inputted
301
336
  setShowValidation(false);
@@ -304,6 +339,7 @@ var DatePicker = /*#__PURE__*/React__default["default"].forwardRef(function (_re
304
339
  setShowValidation(true);
305
340
  }
306
341
  };
342
+
307
343
  var getFeedbackAndVariant = function getFeedbackAndVariant() {
308
344
  if (feedback) return {
309
345
  feedback: feedback,
@@ -318,32 +354,42 @@ var DatePicker = /*#__PURE__*/React__default["default"].forwardRef(function (_re
318
354
  variant: undefined
319
355
  };
320
356
  };
357
+
321
358
  var focusAndSelectInputField = function focusAndSelectInputField() {
322
359
  return requestAnimationFrame(function () {
323
360
  var _inputRef$current3;
361
+
324
362
  return (_inputRef$current3 = inputRef.current) == null ? void 0 : _inputRef$current3.select();
325
363
  });
326
364
  };
365
+
327
366
  var forceUpdateInputFormat = function forceUpdateInputFormat() {
328
367
  var _datepickerRef$curren;
368
+
329
369
  return (_datepickerRef$curren = datepickerRef.current) == null ? void 0 : _datepickerRef$curren.setState({
330
370
  inputValue: null
331
371
  });
332
372
  };
373
+
333
374
  var toggleCalendarGUI = function toggleCalendarGUI() {
334
375
  var _datepickerRef$curren2;
376
+
335
377
  return (_datepickerRef$curren2 = datepickerRef.current) == null ? void 0 : _datepickerRef$curren2.setOpen(!datePickerGUIIsOpen());
336
378
  };
379
+
337
380
  var setFocusToCalendarGUI = function setFocusToCalendarGUI() {
338
- if (inline || hideCalendar || datePickerGUIIsOpen()) return;
339
- // 1 frame delay to allow calendar to spawn
381
+ if (inline || hideCalendar || datePickerGUIIsOpen()) return; // 1 frame delay to allow calendar to spawn
382
+
340
383
  requestAnimationFrame(function () {
341
384
  var _datepickerRef$curren3;
385
+
342
386
  var datepickerGUIWrapper = // @ts-expect-error .calendar does actually exist in ReactDatePicker ref
343
387
  (_datepickerRef$curren3 = datepickerRef.current) == null ? void 0 : _datepickerRef$curren3.calendar.componentNode;
344
388
  var dateToSetFocusTo = selectedDate ? datepickerGUIWrapper.querySelector('.eds-datepicker__calender__day[tabindex="0"]') : datepickerGUIWrapper.querySelector('.eds-datepicker__calender__day[aria-current="date"]');
389
+
345
390
  if (dateToSetFocusTo !== null) {
346
391
  var _datepickerRef$curren4;
392
+
347
393
  (_datepickerRef$curren4 = datepickerRef.current) == null ? void 0 : _datepickerRef$curren4.setBlur();
348
394
  dateToSetFocusTo.focus({
349
395
  preventScroll: true
@@ -353,10 +399,13 @@ var DatePicker = /*#__PURE__*/React__default["default"].forwardRef(function (_re
353
399
  setShouldFocusOnCalendarButtonAfterSelect(true);
354
400
  setShowValidation(false);
355
401
  };
402
+
356
403
  var datePickerGUIIsOpen = function datePickerGUIIsOpen() {
357
404
  var _datepickerRef$curren5;
405
+
358
406
  return (_datepickerRef$curren5 = datepickerRef.current) == null ? void 0 : _datepickerRef$curren5.isCalendarOpen();
359
407
  };
408
+
360
409
  return React__default["default"].createElement(React__default["default"].Fragment, null, React__default["default"].createElement(ReactDatepicker__default["default"], _extends({
361
410
  selected: selectedDate,
362
411
  minDate: minDate,
@@ -391,12 +440,12 @@ var DatePicker = /*#__PURE__*/React__default["default"].forwardRef(function (_re
391
440
  }],
392
441
  renderCustomHeader: function renderCustomHeader(_ref2) {
393
442
  var date = _ref2.date,
394
- changeYear = _ref2.changeYear,
395
- changeMonth = _ref2.changeMonth,
396
- decreaseMonth = _ref2.decreaseMonth,
397
- increaseMonth = _ref2.increaseMonth,
398
- prevMonthButtonDisabled = _ref2.prevMonthButtonDisabled,
399
- nextMonthButtonDisabled = _ref2.nextMonthButtonDisabled;
443
+ changeYear = _ref2.changeYear,
444
+ changeMonth = _ref2.changeMonth,
445
+ decreaseMonth = _ref2.decreaseMonth,
446
+ increaseMonth = _ref2.increaseMonth,
447
+ prevMonthButtonDisabled = _ref2.prevMonthButtonDisabled,
448
+ nextMonthButtonDisabled = _ref2.nextMonthButtonDisabled;
400
449
  return React__default["default"].createElement(DatePickerHeader, {
401
450
  date: date,
402
451
  changeYear: changeYear,
@@ -437,20 +486,21 @@ var DatePicker = /*#__PURE__*/React__default["default"].forwardRef(function (_re
437
486
  });
438
487
 
439
488
  var _excluded$2 = ["className", "style", "label", "onChange", "feedback", "variant", "disableLabelAnimation", "prepend"],
440
- _excluded2$1 = ["onChange", "variant", "value"];
489
+ _excluded2$1 = ["onChange", "variant", "value"];
441
490
  var NativeDatePicker = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
442
491
  var className = _ref.className,
443
- style = _ref.style,
444
- label = _ref.label,
445
- onChange = _ref.onChange,
446
- feedback = _ref.feedback,
447
- variant = _ref.variant,
448
- disableLabelAnimation = _ref.disableLabelAnimation,
449
- _ref$prepend = _ref.prepend,
450
- prepend = _ref$prepend === void 0 ? React__default["default"].createElement(icons.DateIcon, {
451
- inline: true
452
- }) : _ref$prepend,
453
- rest = _objectWithoutPropertiesLoose(_ref, _excluded$2);
492
+ style = _ref.style,
493
+ label = _ref.label,
494
+ onChange = _ref.onChange,
495
+ feedback = _ref.feedback,
496
+ variant = _ref.variant,
497
+ disableLabelAnimation = _ref.disableLabelAnimation,
498
+ _ref$prepend = _ref.prepend,
499
+ prepend = _ref$prepend === void 0 ? React__default["default"].createElement(icons.DateIcon, {
500
+ inline: true
501
+ }) : _ref$prepend,
502
+ rest = _objectWithoutPropertiesLoose(_ref, _excluded$2);
503
+
454
504
  var nativedatepickerId = utils.useRandomId('eds-nativetimepicker');
455
505
  return React__default["default"].createElement(form.BaseFormControl, {
456
506
  style: style,
@@ -471,14 +521,17 @@ var NativeDatePicker = /*#__PURE__*/React__default["default"].forwardRef(functio
471
521
  });
472
522
  var NativeDatePickerBase = /*#__PURE__*/React__default["default"].forwardRef(function (_ref2, ref) {
473
523
  var onChange = _ref2.onChange,
474
- variant = _ref2.variant,
475
- value = _ref2.value,
476
- rest = _objectWithoutPropertiesLoose(_ref2, _excluded2$1);
524
+ variant = _ref2.variant,
525
+ value = _ref2.value,
526
+ rest = _objectWithoutPropertiesLoose(_ref2, _excluded2$1);
527
+
477
528
  var contextVariant = form.useVariant();
478
529
  var currentVariant = variant || contextVariant;
530
+
479
531
  var _useInputGroupContext = form.useInputGroupContext(),
480
- isDatepickerFilled = _useInputGroupContext.isFilled,
481
- setFiller = _useInputGroupContext.setFilled;
532
+ isDatepickerFilled = _useInputGroupContext.isFilled,
533
+ setFiller = _useInputGroupContext.setFilled;
534
+
482
535
  utils.useOnMount(function () {
483
536
  setFiller && !isDatepickerFilled && setFiller(true);
484
537
  });
@@ -489,16 +542,19 @@ var NativeDatePickerBase = /*#__PURE__*/React__default["default"].forwardRef(fun
489
542
  setFiller && isDatepickerFilled && setFiller(false);
490
543
  }
491
544
  }, [value, setFiller, isDatepickerFilled]);
545
+
492
546
  var handleChange = function handleChange(event) {
493
547
  if (form.isFilled(event.target)) {
494
548
  setFiller && !isDatepickerFilled && setFiller(true);
495
549
  } else {
496
550
  setFiller && isDatepickerFilled && setFiller(false);
497
551
  }
552
+
498
553
  if (onChange) {
499
554
  onChange(event);
500
555
  }
501
556
  };
557
+
502
558
  return React__default["default"].createElement("input", _extends({
503
559
  ref: ref,
504
560
  "aria-invalid": currentVariant === 'error',
@@ -511,19 +567,23 @@ var NativeDatePickerBase = /*#__PURE__*/React__default["default"].forwardRef(fun
511
567
 
512
568
  var TimeSegment = function TimeSegment(_ref) {
513
569
  var segment = _ref.segment,
514
- state = _ref.state;
570
+ state = _ref.state;
515
571
  var ref = React.useRef(null);
572
+
516
573
  var _useDateSegment = datepicker.useDateSegment(segment, state, ref),
517
- segmentProps = _useDateSegment.segmentProps;
574
+ segmentProps = _useDateSegment.segmentProps;
575
+
518
576
  var is12HourFormatted = state.segments.some(function (segment) {
519
577
  return segment.text === 'AM' || segment.text === 'PM';
520
578
  });
579
+
521
580
  var segmentDisplayText = function segmentDisplayText() {
522
- if (is12HourFormatted) return segment.text;
523
- // if number add '0' padding to start when one digit
581
+ if (is12HourFormatted) return segment.text; // if number add '0' padding to start when one digit
582
+
524
583
  if (segment.text.match(/\d+/)) return segment.text.padStart(2, '0');
525
584
  return segment.text;
526
585
  };
586
+
527
587
  return React__default["default"].createElement("div", _extends({}, segmentProps, {
528
588
  ref: ref,
529
589
  className: classNames__default["default"]('eds-timepicker__segment', {
@@ -534,9 +594,9 @@ var TimeSegment = function TimeSegment(_ref) {
534
594
 
535
595
  var TimePickerArrowButton = function TimePickerArrowButton(_ref) {
536
596
  var direction = _ref.direction,
537
- onClick = _ref.onClick,
538
- disabled = _ref.disabled,
539
- ariaLabel = _ref['aria-label'];
597
+ onClick = _ref.onClick,
598
+ disabled = _ref.disabled,
599
+ ariaLabel = _ref['aria-label'];
540
600
  return React__default["default"].createElement(button.IconButton, {
541
601
  className: classNames__default["default"]('eds-timepicker__arrowbutton', "eds-timepicker__arrowbutton--" + direction, {
542
602
  'eds-timepicker__arrowbutton--disabled': disabled
@@ -552,25 +612,27 @@ var TimePickerArrowButton = function TimePickerArrowButton(_ref) {
552
612
  var _excluded$1 = ["selectedTime", "onChange", "disabled", "className", "style", "label", "labelTooltip", "feedback", "variant", "locale", "showTimeZone", "minuteIncrementForArrowButtons", "leftArrowButtonAriaLabel", "rightArrowButtonAriaLabel"];
553
613
  var TimePicker = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
554
614
  var selectedTime = _ref.selectedTime,
555
- onChange = _ref.onChange,
556
- disabled = _ref.disabled,
557
- className = _ref.className,
558
- style = _ref.style,
559
- label = _ref.label,
560
- labelTooltip = _ref.labelTooltip,
561
- feedback = _ref.feedback,
562
- variant = _ref.variant,
563
- customLocale = _ref.locale,
564
- showTimeZone = _ref.showTimeZone,
565
- _ref$minuteIncrementF = _ref.minuteIncrementForArrowButtons,
566
- minuteIncrementForArrowButtons = _ref$minuteIncrementF === void 0 ? 30 : _ref$minuteIncrementF,
567
- _ref$leftArrowButtonA = _ref.leftArrowButtonAriaLabel,
568
- leftArrowButtonAriaLabel = _ref$leftArrowButtonA === void 0 ? "Trekk fra " + minuteIncrementForArrowButtons + " minutter" : _ref$leftArrowButtonA,
569
- _ref$rightArrowButton = _ref.rightArrowButtonAriaLabel,
570
- rightArrowButtonAriaLabel = _ref$rightArrowButton === void 0 ? "Legg til " + minuteIncrementForArrowButtons + " minutter" : _ref$rightArrowButton,
571
- rest = _objectWithoutPropertiesLoose(_ref, _excluded$1);
615
+ onChange = _ref.onChange,
616
+ disabled = _ref.disabled,
617
+ className = _ref.className,
618
+ style = _ref.style,
619
+ label = _ref.label,
620
+ labelTooltip = _ref.labelTooltip,
621
+ feedback = _ref.feedback,
622
+ variant = _ref.variant,
623
+ customLocale = _ref.locale,
624
+ showTimeZone = _ref.showTimeZone,
625
+ _ref$minuteIncrementF = _ref.minuteIncrementForArrowButtons,
626
+ minuteIncrementForArrowButtons = _ref$minuteIncrementF === void 0 ? 30 : _ref$minuteIncrementF,
627
+ _ref$leftArrowButtonA = _ref.leftArrowButtonAriaLabel,
628
+ leftArrowButtonAriaLabel = _ref$leftArrowButtonA === void 0 ? "Trekk fra " + minuteIncrementForArrowButtons + " minutter" : _ref$leftArrowButtonA,
629
+ _ref$rightArrowButton = _ref.rightArrowButtonAriaLabel,
630
+ rightArrowButtonAriaLabel = _ref$rightArrowButton === void 0 ? "Legg til " + minuteIncrementForArrowButtons + " minutter" : _ref$rightArrowButton,
631
+ rest = _objectWithoutPropertiesLoose(_ref, _excluded$1);
632
+
572
633
  var _useLocale = i18n.useLocale(),
573
- locale = _useLocale.locale;
634
+ locale = _useLocale.locale;
635
+
574
636
  if (customLocale) locale = customLocale;
575
637
  var state = datepicker$1.useTimeFieldState(_extends({
576
638
  onChange: onChange,
@@ -581,12 +643,15 @@ var TimePicker = /*#__PURE__*/React__default["default"].forwardRef(function (_re
581
643
  isDisabled: disabled
582
644
  }, rest));
583
645
  var timeFieldRef = React.useRef(null);
646
+
584
647
  var _useTimeField = datepicker.useTimeField(_extends({}, rest, {
585
- label: label
586
- }), state, timeFieldRef),
587
- labelProps = _useTimeField.labelProps,
588
- fieldProps = _useTimeField.fieldProps;
648
+ label: label
649
+ }), state, timeFieldRef),
650
+ labelProps = _useTimeField.labelProps,
651
+ fieldProps = _useTimeField.fieldProps;
652
+
589
653
  var id = utils.useRandomId('timepicker');
654
+
590
655
  var handleOnClickArrowButton = function handleOnClickArrowButton(minutes) {
591
656
  if (someSegmentIsUndefined) {
592
657
  setTimeToNearestMinuteIncrement();
@@ -594,9 +659,11 @@ var TimePicker = /*#__PURE__*/React__default["default"].forwardRef(function (_re
594
659
  addMinutesToSelectedTime(minutes);
595
660
  }
596
661
  };
662
+
597
663
  var someSegmentIsUndefined = state.segments.some(function (segment) {
598
664
  return segment.text === '––';
599
665
  });
666
+
600
667
  var setTimeToNearestMinuteIncrement = function setTimeToNearestMinuteIncrement() {
601
668
  var currentTime = date.now(date.getLocalTimeZone());
602
669
  var roundedMinute = Math.floor(currentTime.minute / minuteIncrementForArrowButtons) * minuteIncrementForArrowButtons;
@@ -605,12 +672,15 @@ var TimePicker = /*#__PURE__*/React__default["default"].forwardRef(function (_re
605
672
  });
606
673
  onChange(newTime);
607
674
  };
675
+
608
676
  var addMinutesToSelectedTime = function addMinutesToSelectedTime(minutes) {
609
677
  var _state$value;
678
+
610
679
  state.value && state.setValue((_state$value = state.value) == null ? void 0 : _state$value.add({
611
680
  minutes: minutes
612
681
  }));
613
682
  };
683
+
614
684
  return React__default["default"].createElement(i18n.I18nProvider, {
615
685
  locale: locale
616
686
  }, React__default["default"].createElement("div", {
@@ -652,16 +722,17 @@ var TimePicker = /*#__PURE__*/React__default["default"].forwardRef(function (_re
652
722
  });
653
723
 
654
724
  var _excluded = ["className", "style", "onChange", "label", "feedback", "variant", "prepend"],
655
- _excluded2 = ["onChange", "value"];
725
+ _excluded2 = ["onChange", "value"];
656
726
  var NativeTimePicker = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
657
727
  var className = _ref.className,
658
- style = _ref.style,
659
- onChange = _ref.onChange,
660
- label = _ref.label,
661
- feedback = _ref.feedback,
662
- variant = _ref.variant,
663
- prepend = _ref.prepend,
664
- rest = _objectWithoutPropertiesLoose(_ref, _excluded);
728
+ style = _ref.style,
729
+ onChange = _ref.onChange,
730
+ label = _ref.label,
731
+ feedback = _ref.feedback,
732
+ variant = _ref.variant,
733
+ prepend = _ref.prepend,
734
+ rest = _objectWithoutPropertiesLoose(_ref, _excluded);
735
+
665
736
  var nativetimepickerId = utils.useRandomId('eds-native-timepicker');
666
737
  return React__default["default"].createElement(form.BaseFormControl, {
667
738
  style: style,
@@ -680,13 +751,16 @@ var NativeTimePicker = /*#__PURE__*/React__default["default"].forwardRef(functio
680
751
  });
681
752
  var NativeTimePickerBase = /*#__PURE__*/React__default["default"].forwardRef(function (_ref2, ref) {
682
753
  var onChange = _ref2.onChange,
683
- value = _ref2.value,
684
- rest = _objectWithoutPropertiesLoose(_ref2, _excluded2);
754
+ value = _ref2.value,
755
+ rest = _objectWithoutPropertiesLoose(_ref2, _excluded2);
756
+
685
757
  var contextVariant = form.useVariant();
686
758
  var currentVariant = rest.variant || contextVariant;
759
+
687
760
  var _useInputGroupContext = form.useInputGroupContext(),
688
- isTimepickerFilled = _useInputGroupContext.isFilled,
689
- setFiller = _useInputGroupContext.setFilled;
761
+ isTimepickerFilled = _useInputGroupContext.isFilled,
762
+ setFiller = _useInputGroupContext.setFilled;
763
+
690
764
  utils.useOnMount(function () {
691
765
  setFiller && !isTimepickerFilled && setFiller(true);
692
766
  });
@@ -697,16 +771,19 @@ var NativeTimePickerBase = /*#__PURE__*/React__default["default"].forwardRef(fun
697
771
  setFiller && isTimepickerFilled && setFiller(false);
698
772
  }
699
773
  }, [value, setFiller, isTimepickerFilled]);
774
+
700
775
  var handleChange = function handleChange(event) {
701
776
  if (form.isFilled(event.target)) {
702
777
  setFiller && !isTimepickerFilled && setFiller(true);
703
778
  } else {
704
779
  setFiller && isTimepickerFilled && setFiller(false);
705
780
  }
781
+
706
782
  if (onChange) {
707
783
  onChange(event);
708
784
  }
709
785
  };
786
+
710
787
  return React__default["default"].createElement("input", _extends({
711
788
  ref: ref,
712
789
  "aria-invalid": currentVariant === 'error',
@@ -725,16 +802,20 @@ var NativeTimePickerBase = /*#__PURE__*/React__default["default"].forwardRef(fun
725
802
  * @param {number} offset UTC-offset i millisekunder, må brukes med en tidssone. Ved å legge på en offset lager du en variant av en tidssone. Det betyr at tidspunktet ikke endres (time, minutt, sekund uendret), men tidssonen, med tilhørende offset, tidspunktet er i endres.
726
803
  * @returns {Time | CalendarDateTime | ZonedDateTime} et av TimeValue-objektene med verdier fra date
727
804
  */
805
+
728
806
  var nativeDateToTimeValue = function nativeDateToTimeValue(date$1, noDateOnlyTime, timeZone, offset) {
729
807
  if (noDateOnlyTime === void 0) {
730
808
  noDateOnlyTime = false;
731
809
  }
810
+
732
811
  if (timeZone) {
733
812
  if (offset) {
734
813
  return new date.ZonedDateTime(date$1.getFullYear(), date$1.getMonth() + 1, date$1.getDate(), timeZone, offset, date$1.getHours(), date$1.getMinutes(), date$1.getSeconds());
735
814
  }
815
+
736
816
  return date.parseAbsolute(date$1.toISOString(), timeZone);
737
817
  }
818
+
738
819
  if (noDateOnlyTime) return new date.Time(date$1.getHours(), date$1.getMinutes(), date$1.getSeconds(), 0);
739
820
  return new date.CalendarDateTime(date$1.getFullYear(), date$1.getMonth() + 1, date$1.getDate(), date$1.getHours(), date$1.getMinutes(), date$1.getSeconds());
740
821
  };
@@ -745,6 +826,7 @@ var nativeDateToTimeValue = function nativeDateToTimeValue(date$1, noDateOnlyTim
745
826
  * @returns {Date} et Date-objekt med verdier fra time
746
827
  */
747
828
  // This function uses a lot of @ts-expect-error to make it work with all TimeValue types. Sorry ...
829
+
748
830
  var timeValueToNativeDate = function timeValueToNativeDate(time, timeZoneForCalendarDateTime) {
749
831
  // @ts-expect-error .day does not exist on Time-object
750
832
  if (!time.day) {
@@ -754,22 +836,20 @@ var timeValueToNativeDate = function timeValueToNativeDate(time, timeZoneForCale
754
836
  date.setMinutes(time.minute);
755
837
  date.setSeconds(time.second);
756
838
  return date;
757
- }
758
- // @ts-expect-error .timeZone does not exist in type Time and CalendarDateTime
839
+ } // @ts-expect-error .timeZone does not exist in type Time and CalendarDateTime
840
+
841
+
759
842
  if (!time.timeZone) {
760
843
  // type is CalendarDateTime
761
- if (timeZoneForCalendarDateTime)
762
- // @ts-expect-error .toDate(timeZone) does not exist in type Time
844
+ if (timeZoneForCalendarDateTime) // @ts-expect-error .toDate(timeZone) does not exist in type Time
763
845
  return time.toDate(timeZoneForCalendarDateTime);
764
- return new Date(
765
- // @ts-expect-error not in type Time
766
- time.year,
767
- // @ts-expect-error not in type Time
768
- time.month - 1,
769
- // @ts-expect-error not in type Time
846
+ return new Date( // @ts-expect-error not in type Time
847
+ time.year, // @ts-expect-error not in type Time
848
+ time.month - 1, // @ts-expect-error not in type Time
770
849
  time.day, time.hour, time.minute, time.second);
771
- }
772
- // @ts-expect-error .toDate() does not exist in type Time or CalendarDateTime
850
+ } // @ts-expect-error .toDate() does not exist in type Time or CalendarDateTime
851
+
852
+
773
853
  return time.toDate();
774
854
  };
775
855