@atlaskit/datetime-picker 12.3.6 → 12.3.8

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.
@@ -6,21 +6,15 @@ import _inherits from "@babel/runtime/helpers/inherits";
6
6
  import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
7
7
  import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
8
8
  import _defineProperty from "@babel/runtime/helpers/defineProperty";
9
-
10
9
  function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
11
-
12
10
  function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
13
-
14
11
  function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
15
-
16
12
  function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
17
-
18
13
  /* eslint-disable @repo/internal/react/use-noop */
19
-
20
14
  /** @jsx jsx */
21
15
  import React from 'react';
22
- import { css, jsx } from '@emotion/react'; // eslint-disable-next-line no-restricted-imports
23
-
16
+ import { css, jsx } from '@emotion/react';
17
+ // eslint-disable-next-line no-restricted-imports
24
18
  import { format, isValid, parseISO } from 'date-fns';
25
19
  import pick from 'lodash/pick';
26
20
  import { createAndFireEvent, withAnalyticsContext, withAnalyticsEvents } from '@atlaskit/analytics-next';
@@ -33,7 +27,8 @@ import DatePicker from './date-picker';
33
27
  import TimePicker from './time-picker';
34
28
  import { convertTokens } from './utils';
35
29
  var packageName = "@atlaskit/datetime-picker";
36
- var packageVersion = "12.3.6";
30
+ var packageVersion = "12.3.8";
31
+
37
32
  /* eslint-disable react/no-unused-prop-types */
38
33
 
39
34
  var isInvalidBorderStyles = css({
@@ -87,9 +82,10 @@ var baseContainerStyles = css({
87
82
  '&:hover': {
88
83
  cursor: 'pointer'
89
84
  }
90
- }); // Make DatePicker 50% the width of DateTimePicker
91
- // If rendering an icon container, shrink the TimePicker
85
+ });
92
86
 
87
+ // Make DatePicker 50% the width of DateTimePicker
88
+ // If rendering an icon container, shrink the TimePicker
93
89
  var datePickerContainerStyles = css({
94
90
  flexBasis: '50%',
95
91
  flexGrow: 1,
@@ -113,8 +109,9 @@ var iconContainerStyles = css({
113
109
  '&:hover': {
114
110
  color: "var(--ds-text-subtle, ".concat(N500, ")")
115
111
  }
116
- }); // react-select overrides (via @atlaskit/select).
112
+ });
117
113
 
114
+ // react-select overrides (via @atlaskit/select).
118
115
  var styles = {
119
116
  control: function control(style) {
120
117
  return _objectSpread(_objectSpread({}, style), {}, {
@@ -148,27 +145,20 @@ var dateTimePickerDefaultProps = {
148
145
  timePickerSelectProps: {},
149
146
  times: defaultTimes,
150
147
  spacing: 'default',
151
- locale: 'en-US' // Not including a default prop for value as it will
148
+ locale: 'en-US'
149
+ // Not including a default prop for value as it will
152
150
  // Make the component a controlled component
153
-
154
151
  };
155
-
156
152
  var DateTimePicker = /*#__PURE__*/function (_React$Component) {
157
153
  _inherits(DateTimePicker, _React$Component);
158
-
159
154
  var _super = _createSuper(DateTimePicker);
160
-
161
155
  function DateTimePicker() {
162
156
  var _this;
163
-
164
157
  _classCallCheck(this, DateTimePicker);
165
-
166
158
  for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
167
159
  args[_key] = arguments[_key];
168
160
  }
169
-
170
161
  _this = _super.call.apply(_super, [this].concat(args));
171
-
172
162
  _defineProperty(_assertThisInitialized(_this), "state", {
173
163
  active: 0,
174
164
  dateValue: '',
@@ -177,58 +167,46 @@ var DateTimePicker = /*#__PURE__*/function (_React$Component) {
177
167
  value: _this.props.defaultValue,
178
168
  zoneValue: ''
179
169
  });
180
-
181
170
  _defineProperty(_assertThisInitialized(_this), "getSafeState", function () {
182
171
  var mappedState = _objectSpread(_objectSpread({}, _this.state), pick(_this.props, ['value']));
183
-
184
172
  return _objectSpread(_objectSpread({}, mappedState), _this.parseValue(mappedState.value, mappedState.dateValue, mappedState.timeValue, mappedState.zoneValue));
185
173
  });
186
-
187
174
  _defineProperty(_assertThisInitialized(_this), "onBlur", function (event) {
188
175
  _this.setState({
189
176
  isFocused: false
190
177
  });
191
-
192
178
  _this.props.onBlur(event);
193
179
  });
194
-
195
180
  _defineProperty(_assertThisInitialized(_this), "onFocus", function (event) {
196
181
  _this.setState({
197
182
  isFocused: true
198
183
  });
199
-
200
184
  _this.props.onFocus(event);
201
185
  });
202
-
203
186
  _defineProperty(_assertThisInitialized(_this), "onDateChange", function (dateValue) {
204
187
  _this.onValueChange(_objectSpread(_objectSpread({}, _this.getSafeState()), {}, {
205
188
  dateValue: dateValue
206
189
  }));
207
190
  });
208
-
209
191
  _defineProperty(_assertThisInitialized(_this), "onTimeChange", function (timeValue) {
210
192
  _this.onValueChange(_objectSpread(_objectSpread({}, _this.getSafeState()), {}, {
211
193
  timeValue: timeValue
212
194
  }));
213
195
  });
214
-
215
196
  _defineProperty(_assertThisInitialized(_this), "onClear", function () {
216
197
  _this.onValueChange(_objectSpread(_objectSpread({}, _this.getSafeState()), {}, {
217
198
  timeValue: '',
218
199
  dateValue: ''
219
200
  }));
220
201
  });
221
-
222
202
  return _this;
223
203
  }
224
-
225
204
  _createClass(DateTimePicker, [{
226
205
  key: "parseValue",
227
206
  value: function parseValue(value, dateValue, timeValue, zoneValue) {
228
207
  if (this.props.parseValue) {
229
208
  return this.props.parseValue(value, dateValue, timeValue, zoneValue);
230
209
  }
231
-
232
210
  var parsed = parseISO(value);
233
211
  return isValid(parsed) ? {
234
212
  dateValue: format(parsed, convertTokens('YYYY-MM-DD')),
@@ -244,25 +222,23 @@ var DateTimePicker = /*#__PURE__*/function (_React$Component) {
244
222
  key: "onValueChange",
245
223
  value: function onValueChange(_ref) {
246
224
  var dateValue = _ref.dateValue,
247
- timeValue = _ref.timeValue,
248
- zoneValue = _ref.zoneValue;
225
+ timeValue = _ref.timeValue,
226
+ zoneValue = _ref.zoneValue;
249
227
  this.setState({
250
228
  dateValue: dateValue,
251
229
  timeValue: timeValue,
252
230
  zoneValue: zoneValue
253
231
  });
254
-
255
232
  if (dateValue && timeValue) {
256
233
  var _value = formatDateTimeZoneIntoIso(dateValue, timeValue, zoneValue);
257
-
258
234
  var _this$parseValue = this.parseValue(_value, dateValue, timeValue, zoneValue),
259
- parsedZone = _this$parseValue.zoneValue;
260
-
235
+ parsedZone = _this$parseValue.zoneValue;
261
236
  var valueWithValidZone = formatDateTimeZoneIntoIso(dateValue, timeValue, parsedZone);
262
237
  this.setState({
263
238
  value: valueWithValidZone
264
239
  });
265
- this.props.onChange(valueWithValidZone); // If the date or time value was cleared when there is an existing datetime value, then clear the value.
240
+ this.props.onChange(valueWithValidZone);
241
+ // If the date or time value was cleared when there is an existing datetime value, then clear the value.
266
242
  } else if (this.getSafeState().value) {
267
243
  this.setState({
268
244
  value: ''
@@ -274,28 +250,26 @@ var DateTimePicker = /*#__PURE__*/function (_React$Component) {
274
250
  key: "render",
275
251
  value: function render() {
276
252
  var _this$props = this.props,
277
- autoFocus = _this$props.autoFocus,
278
- id = _this$props.id,
279
- innerProps = _this$props.innerProps,
280
- isDisabled = _this$props.isDisabled,
281
- name = _this$props.name,
282
- timeIsEditable = _this$props.timeIsEditable,
283
- dateFormat = _this$props.dateFormat,
284
- datePickerProps = _this$props.datePickerProps,
285
- datePickerSelectProps = _this$props.datePickerSelectProps,
286
- timePickerProps = _this$props.timePickerProps,
287
- timePickerSelectProps = _this$props.timePickerSelectProps,
288
- times = _this$props.times,
289
- timeFormat = _this$props.timeFormat,
290
- locale = _this$props.locale,
291
- testId = _this$props.testId;
292
-
253
+ autoFocus = _this$props.autoFocus,
254
+ id = _this$props.id,
255
+ innerProps = _this$props.innerProps,
256
+ isDisabled = _this$props.isDisabled,
257
+ name = _this$props.name,
258
+ timeIsEditable = _this$props.timeIsEditable,
259
+ dateFormat = _this$props.dateFormat,
260
+ datePickerProps = _this$props.datePickerProps,
261
+ datePickerSelectProps = _this$props.datePickerSelectProps,
262
+ timePickerProps = _this$props.timePickerProps,
263
+ timePickerSelectProps = _this$props.timePickerSelectProps,
264
+ times = _this$props.times,
265
+ timeFormat = _this$props.timeFormat,
266
+ locale = _this$props.locale,
267
+ testId = _this$props.testId;
293
268
  var _this$getSafeState = this.getSafeState(),
294
- isFocused = _this$getSafeState.isFocused,
295
- value = _this$getSafeState.value,
296
- dateValue = _this$getSafeState.dateValue,
297
- timeValue = _this$getSafeState.timeValue;
298
-
269
+ isFocused = _this$getSafeState.isFocused,
270
+ value = _this$getSafeState.value,
271
+ dateValue = _this$getSafeState.dateValue,
272
+ timeValue = _this$getSafeState.timeValue;
299
273
  var bothProps = {
300
274
  isDisabled: isDisabled,
301
275
  onBlur: this.onBlur,
@@ -305,20 +279,18 @@ var DateTimePicker = /*#__PURE__*/function (_React$Component) {
305
279
  spacing: this.props.spacing
306
280
  };
307
281
  var _datePickerSelectProp = datePickerSelectProps.styles,
308
- datePickerStyles = _datePickerSelectProp === void 0 ? {} : _datePickerSelectProp;
282
+ datePickerStyles = _datePickerSelectProp === void 0 ? {} : _datePickerSelectProp;
309
283
  var _timePickerSelectProp = timePickerSelectProps.styles,
310
- timePickerStyles = _timePickerSelectProp === void 0 ? {} : _timePickerSelectProp;
311
-
284
+ timePickerStyles = _timePickerSelectProp === void 0 ? {} : _timePickerSelectProp;
312
285
  var mergedDatePickerSelectProps = _objectSpread(_objectSpread({}, datePickerSelectProps), {}, {
313
286
  styles: mergeStyles(styles, datePickerStyles)
314
287
  });
315
-
316
288
  var mergedTimePickerSelectProps = _objectSpread(_objectSpread({}, timePickerSelectProps), {}, {
317
289
  styles: mergeStyles(styles, timePickerStyles)
318
- }); // Render DateTimePicker's IconContainer when a value has been filled
319
- // Don't use Date or TimePicker's because they can't be customised
320
-
290
+ });
321
291
 
292
+ // Render DateTimePicker's IconContainer when a value has been filled
293
+ // Don't use Date or TimePicker's because they can't be customised
322
294
  var isClearable = Boolean(dateValue || timeValue);
323
295
  var notFocusedOrIsDisabled = !(isFocused || isDisabled);
324
296
  var labelId = (datePickerSelectProps === null || datePickerSelectProps === void 0 ? void 0 : datePickerSelectProps.inputId) || (timePickerSelectProps === null || timePickerSelectProps === void 0 ? void 0 : timePickerSelectProps.inputId) || '';
@@ -355,7 +327,8 @@ var DateTimePicker = /*#__PURE__*/function (_React$Component) {
355
327
  timeFormat: timeFormat,
356
328
  locale: locale,
357
329
  testId: testId && "".concat(testId, "--timepicker")
358
- }, timePickerProps))), isClearable && !isDisabled ? // eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions
330
+ }, timePickerProps))), isClearable && !isDisabled ?
331
+ // eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions
359
332
  jsx("div", {
360
333
  css: iconContainerStyles,
361
334
  onClick: this.onClear,
@@ -367,12 +340,9 @@ var DateTimePicker = /*#__PURE__*/function (_React$Component) {
367
340
  })) : null);
368
341
  }
369
342
  }]);
370
-
371
343
  return DateTimePicker;
372
344
  }(React.Component);
373
-
374
345
  _defineProperty(DateTimePicker, "defaultProps", dateTimePickerDefaultProps);
375
-
376
346
  export { DateTimePicker as DateTimePickerWithoutAnalytics };
377
347
  export default withAnalyticsContext({
378
348
  componentName: 'dateTimePicker',
@@ -8,19 +8,15 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
8
8
  import _extends from "@babel/runtime/helpers/extends";
9
9
  import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
10
10
  var _excluded = ["selectProps"],
11
- _excluded2 = ["styles"];
12
-
11
+ _excluded2 = ["styles"];
13
12
  function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
14
-
15
13
  function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
16
-
17
14
  function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
18
-
19
15
  function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
20
-
21
16
  /* eslint-disable @repo/internal/react/use-noop */
22
- import React from 'react'; // eslint-disable-next-line no-restricted-imports
17
+ import React from 'react';
23
18
 
19
+ // eslint-disable-next-line no-restricted-imports
24
20
  import { format, isValid } from 'date-fns';
25
21
  import pick from 'lodash/pick';
26
22
  import { createAndFireEvent, withAnalyticsContext, withAnalyticsEvents } from '@atlaskit/analytics-next';
@@ -32,22 +28,18 @@ import FixedLayer from '../internal/fixed-layer';
32
28
  import parseTime from '../internal/parse-time';
33
29
  import { convertTokens } from './utils';
34
30
  var packageName = "@atlaskit/datetime-picker";
35
- var packageVersion = "12.3.6";
31
+ var packageVersion = "12.3.8";
36
32
  var menuStyles = {
37
33
  /* Need to remove default absolute positioning as that causes issues with position fixed */
38
34
  position: 'static',
39
-
40
35
  /* Need to add overflow to the element with max-height, otherwise causes overflow issues in IE11 */
41
36
  overflowY: 'auto',
42
-
43
37
  /* React-Popper has already offset the menu so we need to reset the margin, otherwise the offset value is doubled */
44
38
  margin: 0
45
39
  };
46
-
47
40
  var FixedLayerMenu = function FixedLayerMenu(_ref) {
48
41
  var selectProps = _ref.selectProps,
49
- rest = _objectWithoutProperties(_ref, _excluded);
50
-
42
+ rest = _objectWithoutProperties(_ref, _excluded);
51
43
  return /*#__PURE__*/React.createElement(FixedLayer, {
52
44
  inputValue: selectProps.inputValue,
53
45
  containerRef: selectProps.fixedLayerRef,
@@ -57,7 +49,6 @@ var FixedLayerMenu = function FixedLayerMenu(_ref) {
57
49
  testId: selectProps.testId
58
50
  });
59
51
  };
60
-
61
52
  var timePickerDefaultProps = {
62
53
  appearance: 'default',
63
54
  autoFocus: false,
@@ -79,29 +70,21 @@ var timePickerDefaultProps = {
79
70
  spacing: 'default',
80
71
  times: defaultTimes,
81
72
  timeIsEditable: false,
82
- locale: 'en-US' // Not including a default prop for value as it will
73
+ locale: 'en-US'
74
+ // Not including a default prop for value as it will
83
75
  // Make the component a controlled component
84
-
85
76
  };
86
-
87
77
  var TimePicker = /*#__PURE__*/function (_React$Component) {
88
78
  _inherits(TimePicker, _React$Component);
89
-
90
79
  var _super = _createSuper(TimePicker);
91
-
92
80
  function TimePicker() {
93
81
  var _this;
94
-
95
82
  _classCallCheck(this, TimePicker);
96
-
97
83
  for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
98
84
  args[_key] = arguments[_key];
99
85
  }
100
-
101
86
  _this = _super.call.apply(_super, [this].concat(args));
102
-
103
87
  _defineProperty(_assertThisInitialized(_this), "containerRef", null);
104
-
105
88
  _defineProperty(_assertThisInitialized(_this), "state", {
106
89
  isOpen: _this.props.defaultIsOpen,
107
90
  clearingFromIcon: false,
@@ -109,36 +92,29 @@ var TimePicker = /*#__PURE__*/function (_React$Component) {
109
92
  isFocused: false,
110
93
  l10n: createLocalizationProvider(_this.props.locale)
111
94
  });
112
-
113
95
  _defineProperty(_assertThisInitialized(_this), "getSafeState", function () {
114
96
  return _objectSpread(_objectSpread({}, _this.state), pick(_this.props, ['value', 'isOpen']));
115
97
  });
116
-
117
98
  _defineProperty(_assertThisInitialized(_this), "onChange", function (newValue, action) {
118
99
  var rawValue = newValue ? newValue.value || newValue : '';
119
100
  var value = rawValue.toString();
120
101
  var changedState = {
121
102
  value: value
122
103
  };
123
-
124
104
  if (action && action.action === 'clear') {
125
105
  changedState = _objectSpread(_objectSpread({}, changedState), {}, {
126
106
  clearingFromIcon: true
127
107
  });
128
108
  }
129
-
130
109
  _this.setState(changedState);
131
-
132
110
  _this.props.onChange(value);
133
111
  });
134
-
135
112
  _defineProperty(_assertThisInitialized(_this), "onCreateOption", function (inputValue) {
136
113
  if (_this.props.timeIsEditable) {
137
114
  var _this$props = _this.props,
138
- parseInputValue = _this$props.parseInputValue,
139
- _timeFormat = _this$props.timeFormat;
115
+ parseInputValue = _this$props.parseInputValue,
116
+ _timeFormat = _this$props.timeFormat;
140
117
  var sanitizedInput;
141
-
142
118
  try {
143
119
  sanitizedInput = parseInputValue(inputValue, _timeFormat || defaultTimeFormat);
144
120
  } catch (e) {
@@ -146,17 +122,14 @@ var TimePicker = /*#__PURE__*/function (_React$Component) {
146
122
  }
147
123
 
148
124
  var formattedValue = format(sanitizedInput, 'HH:mm') || '';
149
-
150
125
  _this.setState({
151
126
  value: formattedValue
152
127
  });
153
-
154
128
  _this.props.onChange(formattedValue);
155
129
  } else {
156
130
  _this.onChange(inputValue);
157
131
  }
158
132
  });
159
-
160
133
  _defineProperty(_assertThisInitialized(_this), "onMenuOpen", function () {
161
134
  // Don't open menu after the user has clicked clear
162
135
  if (_this.getSafeState().clearingFromIcon) {
@@ -169,7 +142,6 @@ var TimePicker = /*#__PURE__*/function (_React$Component) {
169
142
  });
170
143
  }
171
144
  });
172
-
173
145
  _defineProperty(_assertThisInitialized(_this), "onMenuClose", function () {
174
146
  // Don't close menu after the user has clicked clear
175
147
  if (_this.getSafeState().clearingFromIcon) {
@@ -182,37 +154,30 @@ var TimePicker = /*#__PURE__*/function (_React$Component) {
182
154
  });
183
155
  }
184
156
  });
185
-
186
157
  _defineProperty(_assertThisInitialized(_this), "setContainerRef", function (ref) {
187
158
  var oldRef = _this.containerRef;
188
- _this.containerRef = ref; // Cause a re-render if we're getting the container ref for the first time
159
+ _this.containerRef = ref;
160
+ // Cause a re-render if we're getting the container ref for the first time
189
161
  // as the layered menu requires it for dimension calculation
190
-
191
162
  if (oldRef == null && ref != null) {
192
163
  _this.forceUpdate();
193
164
  }
194
165
  });
195
-
196
166
  _defineProperty(_assertThisInitialized(_this), "onBlur", function (event) {
197
167
  _this.setState({
198
168
  isFocused: false
199
169
  });
200
-
201
170
  _this.props.onBlur(event);
202
171
  });
203
-
204
172
  _defineProperty(_assertThisInitialized(_this), "onFocus", function (event) {
205
173
  _this.setState({
206
174
  isFocused: true
207
175
  });
208
-
209
176
  _this.props.onFocus(event);
210
177
  });
211
-
212
178
  _defineProperty(_assertThisInitialized(_this), "onSelectKeyDown", function (event) {
213
179
  var key = event.key;
214
180
  var keyPressed = key.toLowerCase();
215
-
216
181
  if (_this.getSafeState().clearingFromIcon && (keyPressed === 'backspace' || keyPressed === 'delete')) {
217
182
  // If being cleared from keyboard, don't change behaviour
218
183
  _this.setState({
@@ -220,52 +185,38 @@ var TimePicker = /*#__PURE__*/function (_React$Component) {
220
185
  });
221
186
  }
222
187
  });
223
-
224
188
  _defineProperty(_assertThisInitialized(_this), "formatTime", function (time) {
225
189
  var _this$props2 = _this.props,
226
- formatDisplayLabel = _this$props2.formatDisplayLabel,
227
- timeFormat = _this$props2.timeFormat;
228
-
190
+ formatDisplayLabel = _this$props2.formatDisplayLabel,
191
+ timeFormat = _this$props2.timeFormat;
229
192
  var _this$getSafeState = _this.getSafeState(),
230
- l10n = _this$getSafeState.l10n;
231
-
193
+ l10n = _this$getSafeState.l10n;
232
194
  if (formatDisplayLabel) {
233
195
  return formatDisplayLabel(time, timeFormat || defaultTimeFormat);
234
196
  }
235
-
236
197
  var date = parseTime(time);
237
-
238
198
  if (!(date instanceof Date)) {
239
199
  return '';
240
200
  }
241
-
242
201
  if (!isValid(date)) {
243
202
  return time;
244
203
  }
245
-
246
204
  if (timeFormat) {
247
205
  return format(date, convertTokens(timeFormat));
248
206
  }
249
-
250
207
  return l10n.formatTime(date);
251
208
  });
252
-
253
209
  _defineProperty(_assertThisInitialized(_this), "getPlaceholder", function () {
254
210
  var placeholder = _this.props.placeholder;
255
-
256
211
  if (placeholder) {
257
212
  return placeholder;
258
213
  }
259
-
260
214
  var _this$getSafeState2 = _this.getSafeState(),
261
- l10n = _this$getSafeState2.l10n;
262
-
215
+ l10n = _this$getSafeState2.l10n;
263
216
  return l10n.formatTime(placeholderDatetime);
264
217
  });
265
-
266
218
  return _this;
267
219
  }
268
-
269
220
  _createClass(TimePicker, [{
270
221
  key: "UNSAFE_componentWillReceiveProps",
271
222
  value: function UNSAFE_componentWillReceiveProps(nextProps) {
@@ -274,14 +225,14 @@ var TimePicker = /*#__PURE__*/function (_React$Component) {
274
225
  l10n: createLocalizationProvider(nextProps.locale)
275
226
  });
276
227
  }
277
- } // All state needs to be accessed via this function so that the state is mapped from props
278
- // correctly to allow controlled/uncontrolled usage.
228
+ }
279
229
 
230
+ // All state needs to be accessed via this function so that the state is mapped from props
231
+ // correctly to allow controlled/uncontrolled usage.
280
232
  }, {
281
233
  key: "getOptions",
282
234
  value: function getOptions() {
283
235
  var _this2 = this;
284
-
285
236
  return this.props.times.map(function (time) {
286
237
  return {
287
238
  label: _this2.formatTime(time),
@@ -293,43 +244,37 @@ var TimePicker = /*#__PURE__*/function (_React$Component) {
293
244
  key: "render",
294
245
  value: function render() {
295
246
  var _this3 = this;
296
-
297
247
  var _this$props3 = this.props,
298
- autoFocus = _this$props3.autoFocus,
299
- hideIcon = _this$props3.hideIcon,
300
- id = _this$props3.id,
301
- innerProps = _this$props3.innerProps,
302
- isDisabled = _this$props3.isDisabled,
303
- name = _this$props3.name,
304
- selectProps = _this$props3.selectProps,
305
- spacing = _this$props3.spacing,
306
- testId = _this$props3.testId,
307
- isInvalid = _this$props3.isInvalid,
308
- timeIsEditable = _this$props3.timeIsEditable;
248
+ autoFocus = _this$props3.autoFocus,
249
+ hideIcon = _this$props3.hideIcon,
250
+ id = _this$props3.id,
251
+ innerProps = _this$props3.innerProps,
252
+ isDisabled = _this$props3.isDisabled,
253
+ name = _this$props3.name,
254
+ selectProps = _this$props3.selectProps,
255
+ spacing = _this$props3.spacing,
256
+ testId = _this$props3.testId,
257
+ isInvalid = _this$props3.isInvalid,
258
+ timeIsEditable = _this$props3.timeIsEditable;
309
259
  var ICON_PADDING = 2;
310
-
311
260
  var _this$getSafeState3 = this.getSafeState(),
312
- _this$getSafeState3$v = _this$getSafeState3.value,
313
- value = _this$getSafeState3$v === void 0 ? '' : _this$getSafeState3$v,
314
- isOpen = _this$getSafeState3.isOpen;
315
-
261
+ _this$getSafeState3$v = _this$getSafeState3.value,
262
+ value = _this$getSafeState3$v === void 0 ? '' : _this$getSafeState3$v,
263
+ isOpen = _this$getSafeState3.isOpen;
316
264
  var _selectProps$styles = selectProps.styles,
317
- selectStyles = _selectProps$styles === void 0 ? {} : _selectProps$styles,
318
- otherSelectProps = _objectWithoutProperties(selectProps, _excluded2);
319
-
265
+ selectStyles = _selectProps$styles === void 0 ? {} : _selectProps$styles,
266
+ otherSelectProps = _objectWithoutProperties(selectProps, _excluded2);
320
267
  var SelectComponent = timeIsEditable ? CreatableSelect : Select;
321
268
  var labelAndValue = value && {
322
269
  label: this.formatTime(value),
323
270
  value: value
324
271
  };
325
-
326
272
  var selectComponents = _objectSpread({
327
273
  DropdownIndicator: EmptyComponent,
328
274
  Menu: FixedLayerMenu
329
275
  }, hideIcon && {
330
276
  ClearIndicator: EmptyComponent
331
277
  });
332
-
333
278
  var renderIconContainer = Boolean(!hideIcon && value);
334
279
  var mergedStyles = mergeStyles(selectStyles, {
335
280
  control: function control(base) {
@@ -381,7 +326,8 @@ var TimePicker = /*#__PURE__*/function (_React$Component) {
381
326
  placeholder: this.getPlaceholder(),
382
327
  styles: mergedStyles,
383
328
  value: labelAndValue,
384
- spacing: spacing // @ts-ignore caused by prop not part of @atlaskit/select
329
+ spacing: spacing
330
+ // @ts-ignore caused by prop not part of @atlaskit/select
385
331
  ,
386
332
  fixedLayerRef: this.containerRef,
387
333
  isInvalid: isInvalid,
@@ -390,12 +336,9 @@ var TimePicker = /*#__PURE__*/function (_React$Component) {
390
336
  );
391
337
  }
392
338
  }]);
393
-
394
339
  return TimePicker;
395
340
  }(React.Component);
396
-
397
341
  _defineProperty(TimePicker, "defaultProps", timePickerDefaultProps);
398
-
399
342
  export { TimePicker as TimePickerWithoutAnalytics };
400
343
  export default withAnalyticsContext({
401
344
  componentName: 'timePicker',
@@ -1,4 +1,5 @@
1
1
  // https://github.com/date-fns/date-fns-upgrade/blob/master/src/v2/convertTokens/index.ts
2
+
2
3
  var tokensMap = {
3
4
  // 'D MMMM': '',
4
5
  // 'Do MMMM': '',
@@ -52,32 +53,25 @@ var v1tokens = Object.keys(tokensMap).sort().reverse();
52
53
  var tokensRegExp = new RegExp('(\\[[^\\[]*\\])|(\\\\)?' + '(' + v1tokens.join('|') + '|.)', 'g');
53
54
  export function convertTokens(format) {
54
55
  var tokensCaptures = format.match(tokensRegExp);
55
-
56
56
  if (tokensCaptures) {
57
57
  return tokensCaptures.reduce(function (acc, tokenString, index) {
58
58
  var v2token = tokensMap[tokenString];
59
-
60
59
  if (!v2token) {
61
60
  var escapedCaptures = tokenString.match(/^\[(.+)\]$/);
62
-
63
61
  if (escapedCaptures) {
64
62
  acc.textBuffer.push(escapedCaptures[1]);
65
63
  } else {
66
64
  acc.textBuffer.push(tokenString);
67
65
  }
68
66
  }
69
-
70
67
  var endOfString = index === tokensCaptures.length - 1;
71
-
72
68
  if (acc.textBuffer.length && (v2token || endOfString)) {
73
69
  acc.formatBuffer.push("'".concat(acc.textBuffer.join(''), "'"));
74
70
  acc.textBuffer = [];
75
71
  }
76
-
77
72
  if (v2token) {
78
73
  acc.formatBuffer.push(v2token);
79
74
  }
80
-
81
75
  return acc;
82
76
  }, {
83
77
  formatBuffer: [],