@elliemae/ds-time-picker 2.0.0-alpha.1 → 2.0.0-alpha.13

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 (22) hide show
  1. package/cjs/DSTimePicker.js +44 -41
  2. package/cjs/DSTimePickerMenu.js +9 -4
  3. package/cjs/PickerPanel.js +60 -46
  4. package/cjs/TimePickerDropdown.js +36 -34
  5. package/cjs/TimePickerImpl.js +46 -40
  6. package/cjs/TimePickerMenu.js +27 -21
  7. package/cjs/index.js +1 -1
  8. package/cjs/moveElementOnScroll.js +11 -10
  9. package/cjs/utils.js +2 -1
  10. package/esm/DSTimePicker.js +42 -39
  11. package/esm/DSTimePickerMenu.js +5 -0
  12. package/esm/PickerPanel.js +44 -28
  13. package/esm/TimePickerDropdown.js +36 -33
  14. package/esm/TimePickerImpl.js +36 -28
  15. package/esm/TimePickerMenu.js +11 -5
  16. package/esm/moveElementOnScroll.js +10 -9
  17. package/esm/utils.js +2 -1
  18. package/package.json +9 -9
  19. package/types/DSTimePicker.d.ts +133 -19
  20. package/types/TimePickerDropdown.d.ts +1 -1
  21. package/cjs/package.json +0 -7
  22. package/esm/package.json +0 -7
package/cjs/DSTimePicker.js CHANGED
@@ -12,45 +12,48 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
12
12
 
13
13
  var moment__default = /*#__PURE__*/_interopDefaultLegacy(moment);
14
14
 
15
- const DSTimePicker = ({
16
- containerProps = {},
17
- innerRef,
18
- className = '',
19
- disabled = false,
20
- value = '',
21
- format,
22
- style = {},
23
- onChange = () => null,
24
- onOpen = () => null,
25
- isOpen = undefined,
26
- clearable = false,
27
- hasHeader = true,
28
- hasHeaderDisplay = false,
29
- 'aria-label': ariaLabel,
30
- zIndex = 'auto',
31
- placement = 'bottom',
32
- disabledTimes,
33
- minutesInterval = 1
34
- }) => /*#__PURE__*/jsxRuntime.jsx(TimePickerImpl, {
35
- ref: innerRef,
36
- "aria-label": ariaLabel,
37
- className: className,
38
- clearable: clearable,
39
- containerProps: containerProps,
40
- disabled: disabled,
41
- format: format,
42
- hasHeader: hasHeader,
43
- hasHeaderDisplay: hasHeaderDisplay,
44
- isOpen: isOpen,
45
- onChange: onChange,
46
- onOpen: onOpen,
47
- placement: placement,
48
- style: style,
49
- value: value,
50
- zIndex: zIndex,
51
- minutesInterval: minutesInterval,
52
- disabledTimes: disabledTimes
53
- });
15
+ const DSTimePicker = _ref => {
16
+ let {
17
+ containerProps = {},
18
+ innerRef,
19
+ className = '',
20
+ disabled = false,
21
+ value = '',
22
+ format,
23
+ style = {},
24
+ onChange = () => null,
25
+ onOpen = () => null,
26
+ isOpen = undefined,
27
+ clearable = false,
28
+ hasHeader = true,
29
+ hasHeaderDisplay = false,
30
+ 'aria-label': ariaLabel,
31
+ zIndex = 'auto',
32
+ placement = 'bottom',
33
+ disabledTimes,
34
+ minutesInterval = 1
35
+ } = _ref;
36
+ return /*#__PURE__*/jsxRuntime.jsx(TimePickerImpl, {
37
+ ref: innerRef,
38
+ "aria-label": ariaLabel,
39
+ className: className,
40
+ clearable: clearable,
41
+ containerProps: containerProps,
42
+ disabled: disabled,
43
+ format: format,
44
+ hasHeader: hasHeader,
45
+ hasHeaderDisplay: hasHeaderDisplay,
46
+ isOpen: isOpen,
47
+ onChange: onChange,
48
+ onOpen: onOpen,
49
+ placement: placement,
50
+ style: style,
51
+ value: value,
52
+ zIndex: zIndex,
53
+ minutesInterval: minutesInterval,
54
+ disabledTimes: disabledTimes
55
+ });
56
+ };
54
57
 
55
58
  DSTimePicker.defaultProps = {
56
59
  format: 'hh:mm:ss A'
@@ -66,7 +69,7 @@ const props = {
66
69
  disabled: reactDesc.PropTypes.bool.description('Whether the time picker is disabled or not'),
67
70
 
68
71
  /** Time picker value */
69
- value: reactDesc.PropTypes.instanceOf(moment__default['default']).description('Time picker value'),
72
+ value: reactDesc.PropTypes.instanceOf(moment__default["default"]).description('Time picker value'),
70
73
 
71
74
  /** Time format (hh:mm:ss, H:m:s) */
72
75
  format: reactDesc.PropTypes.string.description('Time format (hh:mm:ss, H:m:s)'),
@@ -115,4 +118,4 @@ DSTimePickerWithSchema.propTypes = props;
115
118
 
116
119
  exports.DSTimePicker = DSTimePicker;
117
120
  exports.DSTimePickerWithSchema = DSTimePickerWithSchema;
118
- exports['default'] = DSTimePicker;
121
+ exports["default"] = DSTimePicker;
package/cjs/DSTimePickerMenu.js CHANGED
@@ -2,6 +2,11 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
+ require('core-js/modules/esnext.async-iterator.filter.js');
6
+ require('core-js/modules/esnext.iterator.constructor.js');
7
+ require('core-js/modules/esnext.iterator.filter.js');
8
+ require('core-js/modules/esnext.async-iterator.for-each.js');
9
+ require('core-js/modules/esnext.iterator.for-each.js');
5
10
  var _jsx = require('@babel/runtime/helpers/jsx');
6
11
  var _defineProperty = require('@babel/runtime/helpers/defineProperty');
7
12
  require('react');
@@ -17,14 +22,14 @@ var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
17
22
 
18
23
  function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
19
24
 
20
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
21
- const DSTimePickerMenuWrapper = /*#__PURE__*/styled__default['default'].div.withConfig({
25
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
26
+ const DSTimePickerMenuWrapper = /*#__PURE__*/styled__default["default"].div.withConfig({
22
27
  componentId: "sc-1lnruj5-0"
23
28
  })(["display:flex;height:18.6rem;"]);
24
29
 
25
30
  function DSTimePickerMenu(props) {
26
- return /*#__PURE__*/_jsx__default['default'](DSTimePickerMenuWrapper, {}, void 0, /*#__PURE__*/jsxRuntime.jsx(TimePickerMenu.TimePickerMenu, _objectSpread({}, props)));
31
+ return /*#__PURE__*/_jsx__default["default"](DSTimePickerMenuWrapper, {}, void 0, /*#__PURE__*/jsxRuntime.jsx(TimePickerMenu.TimePickerMenu, _objectSpread({}, props)));
27
32
  }
28
33
 
29
34
  exports.DSTimePickerMenu = DSTimePickerMenu;
30
- exports['default'] = DSTimePickerMenu;
35
+ exports["default"] = DSTimePickerMenu;
package/cjs/PickerPanel.js CHANGED
@@ -1,13 +1,22 @@
1
1
  'use strict';
2
2
 
3
- var _jsx = require('@babel/runtime/helpers/jsx');
4
3
  var _defineProperty = require('@babel/runtime/helpers/defineProperty');
4
+ var _jsx = require('@babel/runtime/helpers/jsx');
5
+ require('core-js/modules/web.dom-collections.iterator.js');
6
+ require('core-js/modules/esnext.async-iterator.find.js');
7
+ require('core-js/modules/esnext.iterator.constructor.js');
8
+ require('core-js/modules/esnext.iterator.find.js');
9
+ require('core-js/modules/esnext.async-iterator.map.js');
10
+ require('core-js/modules/esnext.iterator.map.js');
11
+ require('core-js/modules/esnext.async-iterator.filter.js');
12
+ require('core-js/modules/esnext.iterator.filter.js');
13
+ require('core-js/modules/esnext.async-iterator.for-each.js');
14
+ require('core-js/modules/esnext.iterator.for-each.js');
5
15
  var React = require('react');
6
16
  var lodash = require('lodash');
7
17
  var dsClassnames = require('@elliemae/ds-classnames');
8
18
  var memoizeOne = require('memoize-one');
9
- var ChevronSmallUp = require('@elliemae/ds-icons/ChevronSmallUp');
10
- var ChevronSmallDown = require('@elliemae/ds-icons/ChevronSmallDown');
19
+ var dsIcons = require('@elliemae/ds-icons');
11
20
  var DSButton = require('@elliemae/ds-button');
12
21
  var moveElementOnScroll = require('./moveElementOnScroll.js');
13
22
  var utils = require('./utils.js');
@@ -15,41 +24,46 @@ var jsxRuntime = require('react/jsx-runtime');
15
24
 
16
25
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
17
26
 
18
- var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
19
27
  var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
28
+ var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
20
29
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
21
30
  var memoizeOne__default = /*#__PURE__*/_interopDefaultLegacy(memoizeOne);
22
- var ChevronSmallUp__default = /*#__PURE__*/_interopDefaultLegacy(ChevronSmallUp);
23
- var ChevronSmallDown__default = /*#__PURE__*/_interopDefaultLegacy(ChevronSmallDown);
24
31
  var DSButton__default = /*#__PURE__*/_interopDefaultLegacy(DSButton);
25
32
 
26
33
  var _SelectedCircle, _ChevronSmallUp, _ChevronSmallDown;
27
34
 
28
35
  function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
29
36
 
30
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
37
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
31
38
  const blockName = 'time-picker-panel';
32
- const Container = dsClassnames.aggregatedClasses('div')(blockName, null, ({
33
- scrolling
34
- }) => ({
35
- scrolling
36
- }));
39
+ const Container = dsClassnames.aggregatedClasses('div')(blockName, null, _ref => {
40
+ let {
41
+ scrolling
42
+ } = _ref;
43
+ return {
44
+ scrolling
45
+ };
46
+ });
37
47
  const Wrapper = dsClassnames.aggregatedClasses('div')(blockName, 'wrapper');
38
48
  const PickerItemListContainer = dsClassnames.aggregatedClasses('div')(blockName, 'item-list-container');
39
49
  const PickerItemList = dsClassnames.aggregatedClasses('div')(blockName, 'item-list');
40
50
  const PickerHeader = dsClassnames.aggregatedClasses('div')(blockName, 'header');
41
- const PickerItemContainer = dsClassnames.aggregatedClasses('div')(blockName, 'item', ({
42
- selected,
43
- disabled
44
- }) => ({
45
- selected,
46
- disabled
47
- }));
51
+ const PickerItemContainer = dsClassnames.aggregatedClasses('div')(blockName, 'item', _ref2 => {
52
+ let {
53
+ selected,
54
+ disabled
55
+ } = _ref2;
56
+ return {
57
+ selected,
58
+ disabled
59
+ };
60
+ });
48
61
  const PickerSelectedOptionSelected = dsClassnames.aggregatedClasses('div')(blockName, 'selected-container');
49
62
  const SelectedCircle = dsClassnames.aggregatedClasses('div')(blockName, 'selected-circle');
50
63
  const ArrowButtonContainer = dsClassnames.aggregatedClasses('div')(blockName, 'arrow-container');
51
64
 
52
- const getOptionIndex = (options, selectedOption, valueProperty = 'value') => {
65
+ const getOptionIndex = function (options, selectedOption) {
66
+ let valueProperty = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'value';
53
67
  const index = options.findIndex(option => option[valueProperty] === selectedOption);
54
68
  return utils.validateIndex(index, options);
55
69
  };
@@ -63,8 +77,7 @@ const arrowProps = {
63
77
  class PickerPanel extends React.Component {
64
78
  constructor(props) {
65
79
  super(props);
66
-
67
- _defineProperty__default['default'](this, "computeContainerTranslation", memoizeOne__default['default'](index => {
80
+ this.computeContainerTranslation = memoizeOne__default["default"](index => {
68
81
  const {
69
82
  options,
70
83
  valueProperty
@@ -77,19 +90,19 @@ class PickerPanel extends React.Component {
77
90
  const listYPosition = this.minYListPosition - selectedOptionIndex * this.optionHeight;
78
91
  if (this.scrollHandler && !scrolling) this.scrollHandler.updatePosition(listYPosition);
79
92
  return listYPosition;
80
- }));
93
+ });
81
94
 
82
- _defineProperty__default['default'](this, "renderHeader", () => {
95
+ this.renderHeader = () => {
83
96
  const {
84
97
  header
85
98
  } = this.props;
86
- return /*#__PURE__*/_jsx__default['default'](PickerHeader, {}, void 0, header);
87
- });
99
+ return /*#__PURE__*/_jsx__default["default"](PickerHeader, {}, void 0, header);
100
+ };
88
101
 
89
- this.pickerListContainerRef = /*#__PURE__*/React__default['default'].createRef();
90
- this.pickerListRef = /*#__PURE__*/React__default['default'].createRef();
91
- this.pickerItemRef = /*#__PURE__*/React__default['default'].createRef();
92
- this.selectedOptionRef = /*#__PURE__*/React__default['default'].createRef();
102
+ this.pickerListContainerRef = /*#__PURE__*/React__default["default"].createRef();
103
+ this.pickerListRef = /*#__PURE__*/React__default["default"].createRef();
104
+ this.pickerItemRef = /*#__PURE__*/React__default["default"].createRef();
105
+ this.selectedOptionRef = /*#__PURE__*/React__default["default"].createRef();
93
106
  this.state = {
94
107
  selectedOption: props.selected,
95
108
  activeIndex: 0,
@@ -129,9 +142,10 @@ class PickerPanel extends React.Component {
129
142
  this.scrollHandler.unsubscribe();
130
143
  }
131
144
 
132
- static getDerivedStateFromProps(nextProps, {
133
- prevProps
134
- }) {
145
+ static getDerivedStateFromProps(nextProps, _ref3) {
146
+ let {
147
+ prevProps
148
+ } = _ref3;
135
149
  const {
136
150
  selected,
137
151
  valueProperty,
@@ -298,31 +312,31 @@ class PickerPanel extends React.Component {
298
312
  scrolling
299
313
  } = this.state;
300
314
  const listYPosition = this.computeContainerTranslation(activeIndex);
301
- return /*#__PURE__*/_jsx__default['default'](Wrapper, {}, void 0, hasHeader && this.renderHeader(), /*#__PURE__*/_jsx__default['default'](Container, {
315
+ return /*#__PURE__*/_jsx__default["default"](Wrapper, {}, void 0, hasHeader && this.renderHeader(), /*#__PURE__*/_jsx__default["default"](Container, {
302
316
  classProps: {
303
317
  scrolling
304
318
  },
305
319
  onKeyDown: this.handleKeyDown,
306
320
  tabIndex: 0
307
- }, void 0, /*#__PURE__*/_jsx__default['default'](PickerSelectedOptionSelected, {
321
+ }, void 0, /*#__PURE__*/_jsx__default["default"](PickerSelectedOptionSelected, {
308
322
  innerRef: this.selectedOptionRef
309
- }, void 0, _SelectedCircle || (_SelectedCircle = /*#__PURE__*/_jsx__default['default'](SelectedCircle, {}))), /*#__PURE__*/_jsx__default['default'](ArrowButtonContainer, {}, void 0, /*#__PURE__*/jsxRuntime.jsx(DSButton__default['default'], _objectSpread(_objectSpread({}, arrowProps), {}, {
323
+ }, void 0, _SelectedCircle || (_SelectedCircle = /*#__PURE__*/_jsx__default["default"](SelectedCircle, {}))), /*#__PURE__*/_jsx__default["default"](ArrowButtonContainer, {}, void 0, /*#__PURE__*/jsxRuntime.jsx(DSButton__default["default"], _objectSpread(_objectSpread({}, arrowProps), {}, {
310
324
  "aria-label": "Chevron Up",
311
- "data-testid": `${type}-chevron-up`,
325
+ "data-testid": "".concat(type, "-chevron-up"),
312
326
  disabled: activeIndex <= 0,
313
- icon: _ChevronSmallUp || (_ChevronSmallUp = /*#__PURE__*/_jsx__default['default'](ChevronSmallUp__default['default'], {})),
327
+ icon: _ChevronSmallUp || (_ChevronSmallUp = /*#__PURE__*/_jsx__default["default"](dsIcons.ChevronSmallUp, {})),
314
328
  onClick: this.handleStepMoveUp,
315
329
  tabIndex: -1
316
- }))), /*#__PURE__*/_jsx__default['default'](PickerItemListContainer, {
330
+ }))), /*#__PURE__*/_jsx__default["default"](PickerItemListContainer, {
317
331
  innerRef: this.pickerListContainerRef,
318
332
  style: {
319
333
  height: this.listHeight
320
334
  }
321
- }, void 0, /*#__PURE__*/_jsx__default['default'](PickerItemList, {
322
- "data-testid": `${type}-list`,
335
+ }, void 0, /*#__PURE__*/_jsx__default["default"](PickerItemList, {
336
+ "data-testid": "".concat(type, "-list"),
323
337
  innerRef: this.pickerListRef,
324
338
  style: {
325
- transform: `translateY(${listYPosition}px)`
339
+ transform: "translateY(".concat(listYPosition, "px)")
326
340
  }
327
341
  }, void 0, options.map((option, index) => {
328
342
  const value = this.getOptionValue(option);
@@ -355,7 +369,7 @@ class PickerPanel extends React.Component {
355
369
  }
356
370
 
357
371
  option.disabled = disabled;
358
- return /*#__PURE__*/_jsx__default['default'](PickerItemContainer, {
372
+ return /*#__PURE__*/_jsx__default["default"](PickerItemContainer, {
359
373
  classProps: {
360
374
  selected: selectedOption ? value === selectedOption : index === 0,
361
375
  disabled
@@ -365,11 +379,11 @@ class PickerPanel extends React.Component {
365
379
  if (!disabled) this.handleOptionSelect(value, index);
366
380
  }
367
381
  }, value, label);
368
- }))), /*#__PURE__*/_jsx__default['default'](ArrowButtonContainer, {}, void 0, /*#__PURE__*/jsxRuntime.jsx(DSButton__default['default'], _objectSpread(_objectSpread({}, arrowProps), {}, {
382
+ }))), /*#__PURE__*/_jsx__default["default"](ArrowButtonContainer, {}, void 0, /*#__PURE__*/jsxRuntime.jsx(DSButton__default["default"], _objectSpread(_objectSpread({}, arrowProps), {}, {
369
383
  "aria-label": "Chevron Down",
370
- "data-testid": `${type}-chevron-down`,
384
+ "data-testid": "".concat(type, "-chevron-down"),
371
385
  disabled: activeIndex >= options.length - 1,
372
- icon: _ChevronSmallDown || (_ChevronSmallDown = /*#__PURE__*/_jsx__default['default'](ChevronSmallDown__default['default'], {})),
386
+ icon: _ChevronSmallDown || (_ChevronSmallDown = /*#__PURE__*/_jsx__default["default"](dsIcons.ChevronSmallDown, {})),
373
387
  onClick: this.handleStepMoveDown,
374
388
  tabIndex: -1
375
389
  })))));
package/cjs/TimePickerDropdown.js CHANGED
@@ -2,50 +2,52 @@
2
2
 
3
3
  var _jsx = require('@babel/runtime/helpers/jsx');
4
4
  require('react');
5
- var RecentDocuments = require('@elliemae/ds-icons/RecentDocuments');
5
+ var dsIcons = require('@elliemae/ds-icons');
6
6
  var DSButton = require('@elliemae/ds-button');
7
7
  var DSPopper = require('@elliemae/ds-popper');
8
8
 
9
9
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
10
10
 
11
11
  var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
12
- var RecentDocuments__default = /*#__PURE__*/_interopDefaultLegacy(RecentDocuments);
13
12
  var DSButton__default = /*#__PURE__*/_interopDefaultLegacy(DSButton);
14
13
  var DSPopper__default = /*#__PURE__*/_interopDefaultLegacy(DSPopper);
15
14
 
16
15
  var _RecentDocuments;
17
16
 
18
- const TimePickerDropdown = ({
19
- disabled = false,
20
- onClick,
21
- onOpen,
22
- isOpen,
23
- menu,
24
- zIndex,
25
- blockName,
26
- placement
27
- }) => /*#__PURE__*/_jsx__default['default'](DSPopper__default['default'], {
28
- blockName: blockName,
29
- placement: placement,
30
- contentComponent: menu,
31
- isOpen: isOpen,
32
- onOpen: onOpen,
33
- modifiers: {
34
- preventOverflow: {
35
- enabled: true,
36
- padding: 0,
37
- boundariesElement: 'window'
38
- }
39
- },
40
- showArrow: false,
41
- triggerComponent: /*#__PURE__*/_jsx__default['default'](DSButton__default['default'], {
42
- buttonType: "secondary",
43
- disabled: disabled,
44
- icon: _RecentDocuments || (_RecentDocuments = /*#__PURE__*/_jsx__default['default'](RecentDocuments__default['default'], {})),
45
- iconSize: "s",
46
- onClick: onClick
47
- }),
48
- zIndex: zIndex
49
- });
17
+ const TimePickerDropdown = _ref => {
18
+ let {
19
+ disabled = false,
20
+ onClick,
21
+ onOpen,
22
+ isOpen,
23
+ menu,
24
+ zIndex,
25
+ blockName,
26
+ placement
27
+ } = _ref;
28
+ return /*#__PURE__*/_jsx__default["default"](DSPopper__default["default"], {
29
+ blockName: blockName,
30
+ placement: placement,
31
+ contentComponent: menu,
32
+ isOpen: isOpen,
33
+ onOpen: onOpen,
34
+ modifiers: {
35
+ preventOverflow: {
36
+ enabled: true,
37
+ padding: 0,
38
+ boundariesElement: 'window'
39
+ }
40
+ },
41
+ showArrow: false,
42
+ triggerComponent: /*#__PURE__*/_jsx__default["default"](DSButton__default["default"], {
43
+ buttonType: "secondary",
44
+ disabled: disabled,
45
+ icon: _RecentDocuments || (_RecentDocuments = /*#__PURE__*/_jsx__default["default"](dsIcons.RecentDocuments, {})),
46
+ iconSize: "s",
47
+ onClick: onClick
48
+ }),
49
+ zIndex: zIndex
50
+ });
51
+ };
50
52
 
51
53
  module.exports = TimePickerDropdown;
package/cjs/TimePickerImpl.js CHANGED
@@ -3,14 +3,18 @@
3
3
  var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
4
4
  var _jsx = require('@babel/runtime/helpers/jsx');
5
5
  var _defineProperty = require('@babel/runtime/helpers/defineProperty');
6
+ require('core-js/modules/web.dom-collections.iterator.js');
7
+ require('core-js/modules/esnext.async-iterator.filter.js');
8
+ require('core-js/modules/esnext.iterator.constructor.js');
9
+ require('core-js/modules/esnext.iterator.filter.js');
10
+ require('core-js/modules/esnext.async-iterator.for-each.js');
11
+ require('core-js/modules/esnext.iterator.for-each.js');
6
12
  var React = require('react');
7
13
  var moment = require('moment');
8
14
  var memoizeOne = require('memoize-one');
9
- var timeUtils = require('@elliemae/ds-utilities/timeUtils');
15
+ var dsUtilities = require('@elliemae/ds-utilities');
10
16
  var dsClassnames = require('@elliemae/ds-classnames');
11
- var DSInputGroup = require('@elliemae/ds-form/InputGroup');
12
- var TimeInput = require('@elliemae/ds-form/TimeInput');
13
- var DSInput = require('@elliemae/ds-form/Input');
17
+ var dsForm = require('@elliemae/ds-form');
14
18
  var TimePickerMenu = require('./TimePickerMenu.js');
15
19
  var TimePickerDropdown = require('./TimePickerDropdown.js');
16
20
  var utils = require('./utils.js');
@@ -23,42 +27,44 @@ var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
23
27
  var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
24
28
  var moment__default = /*#__PURE__*/_interopDefaultLegacy(moment);
25
29
  var memoizeOne__default = /*#__PURE__*/_interopDefaultLegacy(memoizeOne);
26
- var DSInputGroup__default = /*#__PURE__*/_interopDefaultLegacy(DSInputGroup);
27
- var DSInput__default = /*#__PURE__*/_interopDefaultLegacy(DSInput);
28
30
 
29
31
  const _excluded = ["onChange"];
30
32
 
31
33
  function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
32
34
 
33
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
35
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
34
36
  const blockName = 'time-picker';
35
- const TimePickerContainer = dsClassnames.aggregatedClasses(DSInputGroup__default['default'])(blockName, null, ({
36
- isMenuOpened
37
- }) => ({
38
- isMenuOpened
39
- }));
40
-
41
- const TimePickerImpl = ({
42
- value,
43
- onChange,
44
- onOpen,
45
- format,
46
- disabled,
47
- hasHeader,
48
- hasHeaderDisplay,
49
- className,
50
- containerProps,
51
- placement,
52
- zIndex,
53
- disabledTimes,
54
- minutesInterval
55
- }) => {
37
+ const TimePickerContainer = dsClassnames.aggregatedClasses(dsForm.DSInputGroup)(blockName, null, _ref => {
38
+ let {
39
+ isMenuOpened
40
+ } = _ref;
41
+ return {
42
+ isMenuOpened
43
+ };
44
+ });
45
+
46
+ const TimePickerImpl = _ref2 => {
47
+ let {
48
+ value,
49
+ onChange,
50
+ onOpen,
51
+ format,
52
+ disabled,
53
+ hasHeader,
54
+ hasHeaderDisplay,
55
+ className,
56
+ containerProps,
57
+ placement,
58
+ zIndex,
59
+ disabledTimes,
60
+ minutesInterval
61
+ } = _ref2;
56
62
  const [time, setTime] = React.useState();
57
63
  const [isMenuOpened, setIsMenuOpened] = React.useState(false);
58
64
  const [focusedColumn, setFocusedColumn] = React.useState(null);
59
65
  const timePickerRef = React.useRef();
60
66
  React.useEffect(() => {
61
- if (moment__default['default'](value).isValid()) setTime(moment__default['default'](value));else if (value === null) setTime(undefined);
67
+ if (moment__default["default"](value).isValid()) setTime(moment__default["default"](value));else if (value === null) setTime(undefined);
62
68
  }, [value]);
63
69
  React.useEffect(() => {
64
70
  window.addEventListener('click', handleClickOutside, false);
@@ -94,8 +100,8 @@ const TimePickerImpl = ({
94
100
  };
95
101
 
96
102
  const handlePickerChange = newTime => {
97
- setTime(moment__default['default'](newTime));
98
- onChange(moment__default['default'](newTime));
103
+ setTime(moment__default["default"](newTime));
104
+ onChange(moment__default["default"](newTime));
99
105
  };
100
106
 
101
107
  const handleInputChange = newTime => {
@@ -109,18 +115,18 @@ const TimePickerImpl = ({
109
115
  if (!isOpen) setFocusedColumn(null);
110
116
  };
111
117
 
112
- const getVisibleTimePanels = memoizeOne__default['default'](format => timeUtils.getVisibleTimeByFormat(format));
118
+ const getVisibleTimePanels = memoizeOne__default["default"](format => dsUtilities.getVisibleTimeByFormat(format));
113
119
  const timePickerBlockName = dsClassnames.convertPropToCssClassName(blockName);
114
120
  const visiblePanels = getVisibleTimePanels(format);
115
121
  const disabledTimeRange = disabledTimes && {
116
122
  from: utils.convertTimeString(disabledTimes.from),
117
123
  to: utils.convertTimeString(disabledTimes.to)
118
124
  };
119
- return /*#__PURE__*/_jsx__default['default'](TimePickerContainer, {
120
- className: `${className} variant-${!disabled ? 'default' : 'disabled'}`,
125
+ return /*#__PURE__*/_jsx__default["default"](TimePickerContainer, {
126
+ className: "".concat(className, " variant-").concat(!disabled ? 'default' : 'disabled'),
121
127
  containerProps: containerProps,
122
128
  disabled: disabled,
123
- rightAddon: /*#__PURE__*/_jsx__default['default'](TimePickerDropdown, {
129
+ rightAddon: /*#__PURE__*/_jsx__default["default"](TimePickerDropdown, {
124
130
  blockName: timePickerBlockName,
125
131
  disabled: disabled,
126
132
  isOpen: isMenuOpened,
@@ -145,14 +151,14 @@ const TimePickerImpl = ({
145
151
  }, visiblePanels))
146
152
  })
147
153
  })
148
- }, void 0, /*#__PURE__*/_jsx__default['default'](DSInput__default['default'], {
149
- customInputType: _ref => {
154
+ }, void 0, /*#__PURE__*/_jsx__default["default"](dsForm.DSInput, {
155
+ customInputType: _ref3 => {
150
156
  let {
151
157
  onChange: handleChange
152
- } = _ref,
153
- restInputProps = _objectWithoutProperties__default['default'](_ref, _excluded);
158
+ } = _ref3,
159
+ restInputProps = _objectWithoutProperties__default["default"](_ref3, _excluded);
154
160
 
155
- return /*#__PURE__*/jsxRuntime.jsx(TimeInput.TimeInputImpl, _objectSpread({
161
+ return /*#__PURE__*/jsxRuntime.jsx(dsForm.TimeInputImpl, _objectSpread({
156
162
  clearable: true,
157
163
  disabled: disabled,
158
164
  format: format,