@elliemae/ds-time-picker 2.1.0 → 2.2.0-alpha.3

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 (40) hide show
  1. package/cjs/DSTimePicker.js +100 -115
  2. package/cjs/DSTimePicker.js.map +7 -0
  3. package/cjs/DSTimePickerMenu.js +46 -33
  4. package/cjs/DSTimePickerMenu.js.map +7 -0
  5. package/cjs/PickerPanel.js +151 -254
  6. package/cjs/PickerPanel.js.map +7 -0
  7. package/cjs/TimePickerDropdown.js +73 -52
  8. package/cjs/TimePickerDropdown.js.map +7 -0
  9. package/cjs/TimePickerImpl.js +146 -138
  10. package/cjs/TimePickerImpl.js.map +7 -0
  11. package/cjs/TimePickerMenu.js +138 -209
  12. package/cjs/TimePickerMenu.js.map +7 -0
  13. package/cjs/index.js +40 -17
  14. package/cjs/index.js.map +7 -0
  15. package/cjs/moveElementOnScroll.js +57 -39
  16. package/cjs/moveElementOnScroll.js.map +7 -0
  17. package/cjs/utils.js +57 -24
  18. package/cjs/utils.js.map +7 -0
  19. package/esm/DSTimePicker.js +71 -105
  20. package/esm/DSTimePicker.js.map +7 -0
  21. package/esm/DSTimePickerMenu.js +17 -22
  22. package/esm/DSTimePickerMenu.js.map +7 -0
  23. package/esm/PickerPanel.js +120 -242
  24. package/esm/PickerPanel.js.map +7 -0
  25. package/esm/TimePickerDropdown.js +44 -44
  26. package/esm/TimePickerDropdown.js.map +7 -0
  27. package/esm/TimePickerImpl.js +106 -117
  28. package/esm/TimePickerImpl.js.map +7 -0
  29. package/esm/TimePickerMenu.js +102 -191
  30. package/esm/TimePickerMenu.js.map +7 -0
  31. package/esm/index.js +11 -4
  32. package/esm/index.js.map +7 -0
  33. package/esm/moveElementOnScroll.js +28 -34
  34. package/esm/moveElementOnScroll.js.map +7 -0
  35. package/esm/utils.js +28 -17
  36. package/esm/utils.js.map +7 -0
  37. package/package.json +7 -7
  38. package/types/PickerPanel.d.ts +1 -0
  39. package/types/TimePickerDropdown.d.ts +1 -0
  40. package/types/TimePickerImpl.d.ts +1 -0
@@ -1,53 +1,74 @@
1
- 'use strict';
2
-
3
- var _jsx = require('@babel/runtime/helpers/jsx');
4
- require('react');
5
- var dsIcons = require('@elliemae/ds-icons');
6
- var DSButton = require('@elliemae/ds-button');
7
- var DSPopper = require('@elliemae/ds-popper');
8
-
9
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
10
-
11
- var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
12
- var DSButton__default = /*#__PURE__*/_interopDefaultLegacy(DSButton);
13
- var DSPopper__default = /*#__PURE__*/_interopDefaultLegacy(DSPopper);
14
-
15
- var _RecentDocuments;
16
-
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
- });
1
+ var __create = Object.create;
2
+ var __defProp = Object.defineProperty;
3
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
+ var __getOwnPropNames = Object.getOwnPropertyNames;
5
+ var __getProtoOf = Object.getPrototypeOf;
6
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
7
+ var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
8
+ var __export = (target, all) => {
9
+ for (var name in all)
10
+ __defProp(target, name, { get: all[name], enumerable: true });
51
11
  };
52
-
53
- module.exports = TimePickerDropdown;
12
+ var __reExport = (target, module2, copyDefault, desc) => {
13
+ if (module2 && typeof module2 === "object" || typeof module2 === "function") {
14
+ for (let key of __getOwnPropNames(module2))
15
+ if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
16
+ __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
17
+ }
18
+ return target;
19
+ };
20
+ var __toESM = (module2, isNodeMode) => {
21
+ return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
22
+ };
23
+ var __toCommonJS = /* @__PURE__ */ ((cache) => {
24
+ return (module2, temp) => {
25
+ return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
26
+ };
27
+ })(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
28
+ var TimePickerDropdown_exports = {};
29
+ __export(TimePickerDropdown_exports, {
30
+ TimePickerDropdown: () => TimePickerDropdown,
31
+ default: () => TimePickerDropdown_default
32
+ });
33
+ var React = __toESM(require("react"));
34
+ var import_react = __toESM(require("react"));
35
+ var import_prop_types = __toESM(require("prop-types"));
36
+ var import_ds_icons = __toESM(require("@elliemae/ds-icons"));
37
+ var import_ds_button = __toESM(require("@elliemae/ds-button"));
38
+ var import_ds_popper = __toESM(require("@elliemae/ds-popper"));
39
+ const TimePickerDropdown = ({ disabled = false, onClick, onOpen, isOpen, menu, zIndex, blockName, placement }) => /* @__PURE__ */ import_react.default.createElement(import_ds_popper.DSPopper, {
40
+ blockName,
41
+ placement,
42
+ contentComponent: menu,
43
+ isOpen,
44
+ onOpen,
45
+ modifiers: {
46
+ preventOverflow: {
47
+ enabled: true,
48
+ padding: 0,
49
+ boundariesElement: "window"
50
+ }
51
+ },
52
+ showArrow: false,
53
+ triggerComponent: /* @__PURE__ */ import_react.default.createElement(import_ds_button.DSButton, {
54
+ buttonType: "secondary",
55
+ disabled,
56
+ icon: /* @__PURE__ */ import_react.default.createElement(import_ds_icons.RecentDocuments, null),
57
+ iconSize: "s",
58
+ onClick
59
+ }),
60
+ zIndex
61
+ });
62
+ TimePickerDropdown.propTypes = {
63
+ onClick: import_prop_types.default.func,
64
+ onOpen: import_prop_types.default.func,
65
+ disabled: import_prop_types.default.bool,
66
+ isOpen: import_prop_types.default.bool,
67
+ menu: import_prop_types.default.element,
68
+ blockName: import_prop_types.default.string,
69
+ placement: import_prop_types.default.string,
70
+ zIndex: import_prop_types.default.number
71
+ };
72
+ var TimePickerDropdown_default = TimePickerDropdown;
73
+ module.exports = __toCommonJS(TimePickerDropdown_exports);
74
+ //# sourceMappingURL=TimePickerDropdown.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/TimePickerDropdown.tsx", "../../../../scripts/build/transpile/react-shim.js"],
4
+ "sourcesContent": ["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { RecentDocuments } from '@elliemae/ds-icons';\nimport { DSButton } from '@elliemae/ds-button';\nimport { DSPopper } from '@elliemae/ds-popper';\n\nconst TimePickerDropdown = ({ disabled = false, onClick, onOpen, isOpen, menu, zIndex, blockName, placement }) => (\n <DSPopper\n blockName={blockName}\n placement={placement}\n contentComponent={menu}\n isOpen={isOpen}\n onOpen={onOpen}\n modifiers={{\n preventOverflow: {\n enabled: true,\n padding: 0,\n boundariesElement: 'window',\n },\n }}\n showArrow={false}\n triggerComponent={\n <DSButton buttonType=\"secondary\" disabled={disabled} icon={<RecentDocuments />} iconSize=\"s\" onClick={onClick} />\n }\n zIndex={zIndex}\n />\n);\n\nTimePickerDropdown.propTypes = {\n onClick: PropTypes.func,\n onOpen: PropTypes.func,\n disabled: PropTypes.bool,\n isOpen: PropTypes.bool,\n menu: PropTypes.element,\n blockName: PropTypes.string,\n placement: PropTypes.string,\n zIndex: PropTypes.number,\n};\n\nexport { TimePickerDropdown };\nexport default TimePickerDropdown;\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,wBAAsB;AACtB,sBAAgC;AAChC,uBAAyB;AACzB,uBAAyB;AAEzB,MAAM,qBAAqB,CAAC,EAAE,WAAW,OAAO,SAAS,QAAQ,QAAQ,MAAM,QAAQ,WAAW,gBAChG,mDAAC,2BAAD;AAAA,EACE;AAAA,EACA;AAAA,EACA,kBAAkB;AAAA,EAClB;AAAA,EACA;AAAA,EACA,WAAW;AAAA,IACT,iBAAiB;AAAA,MACf,SAAS;AAAA,MACT,SAAS;AAAA,MACT,mBAAmB;AAAA;AAAA;AAAA,EAGvB,WAAW;AAAA,EACX,kBACE,mDAAC,2BAAD;AAAA,IAAU,YAAW;AAAA,IAAY;AAAA,IAAoB,MAAM,mDAAC,iCAAD;AAAA,IAAqB,UAAS;AAAA,IAAI;AAAA;AAAA,EAE/F;AAAA;AAIJ,mBAAmB,YAAY;AAAA,EAC7B,SAAS,0BAAU;AAAA,EACnB,QAAQ,0BAAU;AAAA,EAClB,UAAU,0BAAU;AAAA,EACpB,QAAQ,0BAAU;AAAA,EAClB,MAAM,0BAAU;AAAA,EAChB,WAAW,0BAAU;AAAA,EACrB,WAAW,0BAAU;AAAA,EACrB,QAAQ,0BAAU;AAAA;AAIpB,IAAO,6BAAQ;",
6
+ "names": []
7
+ }
@@ -1,175 +1,183 @@
1
- 'use strict';
2
-
3
- var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
4
- var _jsx = require('@babel/runtime/helpers/jsx');
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');
12
- var React = require('react');
13
- var moment = require('moment');
14
- var memoizeOne = require('memoize-one');
15
- var dsUtilities = require('@elliemae/ds-utilities');
16
- var dsClassnames = require('@elliemae/ds-classnames');
17
- var dsForm = require('@elliemae/ds-form');
18
- var TimePickerMenu = require('./TimePickerMenu.js');
19
- var TimePickerDropdown = require('./TimePickerDropdown.js');
20
- var utils = require('./utils.js');
21
- var jsxRuntime = require('react/jsx-runtime');
22
-
23
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
24
-
25
- var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
26
- var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
27
- var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
28
- var moment__default = /*#__PURE__*/_interopDefaultLegacy(moment);
29
- var memoizeOne__default = /*#__PURE__*/_interopDefaultLegacy(memoizeOne);
30
-
31
- const _excluded = ["onChange"];
32
-
33
- 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; }
34
-
35
- 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__default["default"](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; }
36
- const blockName = 'time-picker';
37
- const TimePickerContainer = dsClassnames.aggregatedClasses(dsForm.DSInputGroup)(blockName, null, _ref => {
38
- let {
39
- isMenuOpened
40
- } = _ref;
41
- return {
42
- isMenuOpened
1
+ var __create = Object.create;
2
+ var __defProp = Object.defineProperty;
3
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
+ var __getOwnPropNames = Object.getOwnPropertyNames;
5
+ var __getProtoOf = Object.getPrototypeOf;
6
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
7
+ var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
8
+ var __export = (target, all) => {
9
+ for (var name in all)
10
+ __defProp(target, name, { get: all[name], enumerable: true });
11
+ };
12
+ var __reExport = (target, module2, copyDefault, desc) => {
13
+ if (module2 && typeof module2 === "object" || typeof module2 === "function") {
14
+ for (let key of __getOwnPropNames(module2))
15
+ if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
16
+ __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
17
+ }
18
+ return target;
19
+ };
20
+ var __toESM = (module2, isNodeMode) => {
21
+ return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
22
+ };
23
+ var __toCommonJS = /* @__PURE__ */ ((cache) => {
24
+ return (module2, temp) => {
25
+ return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
43
26
  };
27
+ })(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
28
+ var TimePickerImpl_exports = {};
29
+ __export(TimePickerImpl_exports, {
30
+ TimePickerImpl: () => TimePickerImpl,
31
+ default: () => TimePickerImpl_default
44
32
  });
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;
62
- const [time, setTime] = React.useState();
63
- const [isMenuOpened, setIsMenuOpened] = React.useState(false);
64
- const [focusedColumn, setFocusedColumn] = React.useState(null);
65
- const timePickerRef = React.useRef();
66
- React.useEffect(() => {
67
- if (moment__default["default"](value).isValid()) setTime(moment__default["default"](value));else if (value === null) setTime(undefined);
33
+ var React = __toESM(require("react"));
34
+ var import_react = __toESM(require("react"));
35
+ var import_prop_types = __toESM(require("prop-types"));
36
+ var import_moment = __toESM(require("moment"));
37
+ var import_memoize_one = __toESM(require("memoize-one"));
38
+ var import_ds_utilities = __toESM(require("@elliemae/ds-utilities"));
39
+ var import_ds_classnames = __toESM(require("@elliemae/ds-classnames"));
40
+ var import_ds_form = __toESM(require("@elliemae/ds-form"));
41
+ var import_TimePickerMenu = __toESM(require("./TimePickerMenu"));
42
+ var import_TimePickerDropdown = __toESM(require("./TimePickerDropdown"));
43
+ var import_utils = __toESM(require("./utils"));
44
+ const blockName = "time-picker";
45
+ const TimePickerContainer = (0, import_ds_classnames.aggregatedClasses)(import_ds_form.DSInputGroup)(blockName, null, ({ isMenuOpened }) => ({
46
+ isMenuOpened
47
+ }));
48
+ const TimePickerImpl = ({
49
+ value,
50
+ onChange,
51
+ onOpen,
52
+ format,
53
+ disabled,
54
+ hasHeader,
55
+ hasHeaderDisplay,
56
+ className,
57
+ containerProps,
58
+ placement,
59
+ zIndex,
60
+ disabledTimes,
61
+ minutesInterval
62
+ }) => {
63
+ const [time, setTime] = (0, import_react.useState)();
64
+ const [isMenuOpened, setIsMenuOpened] = (0, import_react.useState)(false);
65
+ const [focusedColumn, setFocusedColumn] = (0, import_react.useState)(null);
66
+ const timePickerRef = (0, import_react.useRef)();
67
+ (0, import_react.useEffect)(() => {
68
+ if ((0, import_moment.default)(value).isValid())
69
+ setTime((0, import_moment.default)(value));
70
+ else if (value === null)
71
+ setTime(void 0);
68
72
  }, [value]);
69
- React.useEffect(() => {
70
- window.addEventListener('click', handleClickOutside, false);
71
- return () => window.removeEventListener('click', handleClickOutside, false);
73
+ (0, import_react.useEffect)(() => {
74
+ window.addEventListener("click", handleClickOutside, false);
75
+ return () => window.removeEventListener("click", handleClickOutside, false);
72
76
  }, []);
73
- React.useEffect(() => {
74
- window.addEventListener('keydown', handleKeyDown, false);
75
- return () => window.removeEventListener('keydown', handleKeyDown, false);
77
+ (0, import_react.useEffect)(() => {
78
+ window.addEventListener("keydown", handleKeyDown, false);
79
+ return () => window.removeEventListener("keydown", handleKeyDown, false);
76
80
  }, []);
77
- React.useEffect(() => {
78
- if (isMenuOpened) handleChangeFocus();
81
+ (0, import_react.useEffect)(() => {
82
+ if (isMenuOpened)
83
+ handleChangeFocus();
79
84
  }, [isMenuOpened]);
80
-
81
85
  const handleClickOutside = () => {
82
- if (isMenuOpened) setIsMenuOpened(false);
86
+ if (isMenuOpened)
87
+ setIsMenuOpened(false);
83
88
  };
84
-
85
- const handleKeyDown = event => {
86
- const {
87
- key
88
- } = event;
89
- const menuOpenKeys = ['Escape', ' ', 'Enter'];
90
- if (menuOpenKeys.includes(key)) setIsMenuOpened(false);
89
+ const handleKeyDown = (event) => {
90
+ const { key } = event;
91
+ const menuOpenKeys = ["Escape", " ", "Enter"];
92
+ if (menuOpenKeys.includes(key))
93
+ setIsMenuOpened(false);
91
94
  };
92
-
93
95
  const handleChangeFocus = () => {
94
- const [firstColumn] = document.getElementsByClassName('em-ds-time-picker-panel');
95
-
96
+ const [firstColumn] = document.getElementsByClassName("em-ds-time-picker-panel");
96
97
  if (firstColumn && !focusedColumn) {
97
98
  setFocusedColumn(firstColumn);
98
99
  firstColumn.focus();
99
100
  }
100
101
  };
101
-
102
- const handlePickerChange = newTime => {
103
- setTime(moment__default["default"](newTime));
104
- onChange(moment__default["default"](newTime));
102
+ const handlePickerChange = (newTime) => {
103
+ setTime((0, import_moment.default)(newTime));
104
+ onChange((0, import_moment.default)(newTime));
105
105
  };
106
-
107
- const handleInputChange = newTime => {
106
+ const handleInputChange = (newTime) => {
108
107
  setTime(newTime);
109
108
  onChange(newTime);
110
109
  };
111
-
112
- const handleMenuOpen = isOpen => {
110
+ const handleMenuOpen = (isOpen) => {
113
111
  onOpen(isOpen);
114
112
  setIsMenuOpened(isOpen);
115
- if (!isOpen) setFocusedColumn(null);
113
+ if (!isOpen)
114
+ setFocusedColumn(null);
116
115
  };
117
-
118
- const getVisibleTimePanels = memoizeOne__default["default"](format => dsUtilities.getVisibleTimeByFormat(format));
119
- const timePickerBlockName = dsClassnames.convertPropToCssClassName(blockName);
116
+ const getVisibleTimePanels = (0, import_memoize_one.default)((format2) => (0, import_ds_utilities.getVisibleTimeByFormat)(format2));
117
+ const timePickerBlockName = (0, import_ds_classnames.convertPropToCssClassName)(blockName);
120
118
  const visiblePanels = getVisibleTimePanels(format);
121
119
  const disabledTimeRange = disabledTimes && {
122
- from: utils.convertTimeString(disabledTimes.from),
123
- to: utils.convertTimeString(disabledTimes.to)
120
+ from: (0, import_utils.convertTimeString)(disabledTimes.from),
121
+ to: (0, import_utils.convertTimeString)(disabledTimes.to)
124
122
  };
125
- return /*#__PURE__*/_jsx__default["default"](TimePickerContainer, {
126
- className: "".concat(className, " variant-").concat(!disabled ? 'default' : 'disabled'),
127
- containerProps: containerProps,
128
- disabled: disabled,
129
- rightAddon: /*#__PURE__*/_jsx__default["default"](TimePickerDropdown, {
123
+ return /* @__PURE__ */ import_react.default.createElement(TimePickerContainer, {
124
+ className: `${className} variant-${!disabled ? "default" : "disabled"}`,
125
+ containerProps,
126
+ disabled,
127
+ rightAddon: /* @__PURE__ */ import_react.default.createElement(import_TimePickerDropdown.TimePickerDropdown, {
130
128
  blockName: timePickerBlockName,
131
- disabled: disabled,
129
+ disabled,
132
130
  isOpen: isMenuOpened,
133
- zIndex: zIndex,
134
- placement: placement,
131
+ zIndex,
132
+ placement,
135
133
  onOpen: handleMenuOpen,
136
- onClick: e => {
134
+ onClick: (e) => {
137
135
  e.preventDefault();
138
136
  handleMenuOpen(!isMenuOpened);
139
137
  },
140
- menu: /*#__PURE__*/jsxRuntime.jsx("div", {
141
- ref: timePickerRef,
142
- children: /*#__PURE__*/jsxRuntime.jsx(TimePickerMenu.TimePickerMenu, _objectSpread({
143
- disabled: disabled,
144
- disabledTimes: disabledTimeRange,
145
- format: format,
146
- hasHeader: hasHeader,
147
- hasHeaderDisplay: hasHeaderDisplay,
148
- onTimeChange: handlePickerChange,
149
- minutesInterval: minutesInterval,
150
- time: time
151
- }, visiblePanels))
152
- })
138
+ menu: /* @__PURE__ */ import_react.default.createElement("div", {
139
+ ref: timePickerRef
140
+ }, /* @__PURE__ */ import_react.default.createElement(import_TimePickerMenu.TimePickerMenu, {
141
+ disabled,
142
+ disabledTimes: disabledTimeRange,
143
+ format,
144
+ hasHeader,
145
+ hasHeaderDisplay,
146
+ onTimeChange: handlePickerChange,
147
+ minutesInterval,
148
+ time,
149
+ ...visiblePanels
150
+ }))
153
151
  })
154
- }, void 0, /*#__PURE__*/_jsx__default["default"](dsForm.DSInput, {
155
- customInputType: _ref3 => {
156
- let {
157
- onChange: handleChange
158
- } = _ref3,
159
- restInputProps = _objectWithoutProperties__default["default"](_ref3, _excluded);
160
-
161
- return /*#__PURE__*/jsxRuntime.jsx(dsForm.TimeInputImpl, _objectSpread({
162
- clearable: true,
163
- disabled: disabled,
164
- format: format,
165
- onChange: handleChange
166
- }, restInputProps));
167
- },
152
+ }, /* @__PURE__ */ import_react.default.createElement(import_ds_form.DSInput, {
153
+ customInputType: ({ onChange: handleChange, ...restInputProps }) => /* @__PURE__ */ import_react.default.createElement(import_ds_form.TimeInputImpl, {
154
+ clearable: true,
155
+ disabled,
156
+ format,
157
+ onChange: handleChange,
158
+ ...restInputProps
159
+ }),
168
160
  isShowElipsisActive: false,
169
- disabled: disabled,
161
+ disabled,
170
162
  onChange: handleInputChange,
171
163
  value: time
172
164
  }));
173
165
  };
174
-
175
- module.exports = TimePickerImpl;
166
+ TimePickerImpl.propTypes = {
167
+ value: import_prop_types.default.instanceOf(Date, import_moment.default),
168
+ onChange: import_prop_types.default.func,
169
+ onOpen: import_prop_types.default.func,
170
+ format: import_prop_types.default.string,
171
+ disabled: import_prop_types.default.bool,
172
+ hasHeader: import_prop_types.default.bool,
173
+ hasHeaderDisplay: import_prop_types.default.bool,
174
+ className: import_prop_types.default.string,
175
+ containerProps: import_prop_types.default.object,
176
+ placement: import_prop_types.default.string,
177
+ zIndex: import_prop_types.default.number,
178
+ disabledTimes: import_prop_types.default.object,
179
+ minutesInterval: import_prop_types.default.number
180
+ };
181
+ var TimePickerImpl_default = TimePickerImpl;
182
+ module.exports = __toCommonJS(TimePickerImpl_exports);
183
+ //# sourceMappingURL=TimePickerImpl.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/TimePickerImpl.tsx", "../../../../scripts/build/transpile/react-shim.js"],
4
+ "sourcesContent": ["/* eslint-disable max-lines */\n/* eslint-disable no-shadow */\nimport React, { useState, useEffect, useRef } from 'react';\nimport PropTypes from 'prop-types';\nimport moment from 'moment';\nimport memoizeOne from 'memoize-one';\nimport { getVisibleTimeByFormat } from '@elliemae/ds-utilities';\nimport { aggregatedClasses, convertPropToCssClassName } from '@elliemae/ds-classnames';\nimport { DSInput, DSInputGroup, TimeInputImpl } from '@elliemae/ds-form';\nimport { TimePickerMenu } from './TimePickerMenu';\nimport { TimePickerDropdown } from './TimePickerDropdown';\nimport { convertTimeString } from './utils';\n\nconst blockName = 'time-picker';\n\nconst TimePickerContainer = aggregatedClasses(DSInputGroup)(blockName, null, ({ isMenuOpened }) => ({\n isMenuOpened,\n}));\n\nconst TimePickerImpl = ({\n value,\n onChange,\n onOpen,\n format,\n disabled,\n hasHeader,\n hasHeaderDisplay,\n className,\n containerProps,\n placement,\n zIndex,\n disabledTimes,\n minutesInterval,\n}) => {\n const [time, setTime] = useState();\n const [isMenuOpened, setIsMenuOpened] = useState(false);\n const [focusedColumn, setFocusedColumn] = useState(null);\n const timePickerRef = useRef();\n useEffect(() => {\n if (moment(value).isValid()) setTime(moment(value));\n else if (value === null) setTime(undefined);\n }, [value]);\n\n useEffect(() => {\n window.addEventListener('click', handleClickOutside, false);\n return () => window.removeEventListener('click', handleClickOutside, false);\n }, []);\n\n useEffect(() => {\n window.addEventListener('keydown', handleKeyDown, false);\n return () => window.removeEventListener('keydown', handleKeyDown, false);\n }, []);\n\n useEffect(() => {\n if (isMenuOpened) handleChangeFocus();\n }, [isMenuOpened]);\n\n const handleClickOutside = () => {\n if (isMenuOpened) setIsMenuOpened(false);\n };\n\n const handleKeyDown = (event) => {\n const { key } = event;\n const menuOpenKeys = ['Escape', ' ', 'Enter'];\n if (menuOpenKeys.includes(key)) setIsMenuOpened(false);\n };\n\n const handleChangeFocus = () => {\n const [firstColumn] = document.getElementsByClassName('em-ds-time-picker-panel');\n if (firstColumn && !focusedColumn) {\n setFocusedColumn(firstColumn);\n firstColumn.focus();\n }\n };\n\n const handlePickerChange = (newTime) => {\n setTime(moment(newTime));\n onChange(moment(newTime));\n };\n\n const handleInputChange = (newTime) => {\n setTime(newTime);\n onChange(newTime);\n };\n\n const handleMenuOpen = (isOpen) => {\n onOpen(isOpen);\n setIsMenuOpened(isOpen);\n if (!isOpen) setFocusedColumn(null);\n };\n\n const getVisibleTimePanels = memoizeOne((format) => getVisibleTimeByFormat(format));\n const timePickerBlockName = convertPropToCssClassName(blockName);\n const visiblePanels = getVisibleTimePanels(format);\n\n const disabledTimeRange = disabledTimes && {\n from: convertTimeString(disabledTimes.from),\n to: convertTimeString(disabledTimes.to),\n };\n\n return (\n <TimePickerContainer\n className={`${className} variant-${!disabled ? 'default' : 'disabled'}`}\n containerProps={containerProps}\n disabled={disabled}\n rightAddon={\n <TimePickerDropdown\n blockName={timePickerBlockName}\n disabled={disabled}\n isOpen={isMenuOpened}\n zIndex={zIndex}\n placement={placement}\n onOpen={handleMenuOpen}\n onClick={(e) => {\n e.preventDefault();\n handleMenuOpen(!isMenuOpened);\n }}\n menu={\n <div ref={timePickerRef}>\n <TimePickerMenu\n disabled={disabled}\n disabledTimes={disabledTimeRange}\n format={format}\n hasHeader={hasHeader}\n hasHeaderDisplay={hasHeaderDisplay}\n onTimeChange={handlePickerChange}\n minutesInterval={minutesInterval}\n time={time}\n {...visiblePanels}\n />\n </div>\n }\n />\n }\n >\n <DSInput\n customInputType={({ onChange: handleChange, ...restInputProps }) => (\n <TimeInputImpl clearable disabled={disabled} format={format} onChange={handleChange} {...restInputProps} />\n )}\n isShowElipsisActive={false}\n disabled={disabled}\n onChange={handleInputChange}\n value={time}\n />\n </TimePickerContainer>\n );\n};\n\nTimePickerImpl.propTypes = {\n value: PropTypes.instanceOf(Date, moment),\n onChange: PropTypes.func,\n onOpen: PropTypes.func,\n format: PropTypes.string,\n disabled: PropTypes.bool,\n hasHeader: PropTypes.bool,\n hasHeaderDisplay: PropTypes.bool,\n className: PropTypes.string,\n containerProps: PropTypes.object,\n placement: PropTypes.string,\n zIndex: PropTypes.number,\n disabledTimes: PropTypes.object,\n minutesInterval: PropTypes.number,\n};\n\nexport { TimePickerImpl };\nexport default TimePickerImpl;\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": "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",
6
+ "names": []
7
+ }