@elliemae/ds-time-picker 2.3.1 → 3.0.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.
- package/dist/cjs/DSTimePicker.js +106 -0
- package/dist/cjs/DSTimePicker.js.map +7 -0
- package/dist/cjs/DSTimePickerMenu.js +60 -0
- package/dist/cjs/DSTimePickerMenu.js.map +7 -0
- package/dist/cjs/PickerPanel.js +313 -0
- package/dist/cjs/PickerPanel.js.map +7 -0
- package/dist/cjs/TimePickerDropdown.js +74 -0
- package/dist/cjs/TimePickerDropdown.js.map +7 -0
- package/dist/cjs/TimePickerImpl.js +210 -0
- package/dist/cjs/TimePickerImpl.js.map +7 -0
- package/dist/cjs/TimePickerMenu.js +258 -0
- package/dist/cjs/TimePickerMenu.js.map +7 -0
- package/dist/cjs/index.js +40 -0
- package/dist/cjs/index.js.map +7 -0
- package/dist/cjs/moveElementOnScroll.js +93 -0
- package/dist/cjs/moveElementOnScroll.js.map +7 -0
- package/dist/cjs/utils.js +71 -0
- package/dist/cjs/utils.js.map +7 -0
- package/dist/esm/DSTimePicker.js +77 -0
- package/dist/esm/DSTimePicker.js.map +7 -0
- package/dist/esm/DSTimePickerMenu.js +33 -0
- package/dist/esm/DSTimePickerMenu.js.map +7 -0
- package/dist/esm/PickerPanel.js +286 -0
- package/dist/esm/PickerPanel.js.map +7 -0
- package/dist/esm/TimePickerDropdown.js +45 -0
- package/dist/esm/TimePickerDropdown.js.map +7 -0
- package/dist/esm/TimePickerImpl.js +183 -0
- package/dist/esm/TimePickerImpl.js.map +7 -0
- package/dist/esm/TimePickerMenu.js +231 -0
- package/dist/esm/TimePickerMenu.js.map +7 -0
- package/dist/esm/index.js +11 -0
- package/dist/esm/index.js.map +7 -0
- package/dist/esm/moveElementOnScroll.js +64 -0
- package/dist/esm/moveElementOnScroll.js.map +7 -0
- package/dist/esm/utils.js +42 -0
- package/dist/esm/utils.js.map +7 -0
- package/package.json +46 -37
- package/cjs/DSTimePicker.js +0 -121
- package/cjs/DSTimePickerMenu.js +0 -35
- package/cjs/PickerPanel.js +0 -402
- package/cjs/TimePickerDropdown.js +0 -53
- package/cjs/TimePickerImpl.js +0 -175
- package/cjs/TimePickerMenu.js +0 -312
- package/cjs/index.js +0 -17
- package/cjs/moveElementOnScroll.js +0 -75
- package/cjs/utils.js +0 -38
- package/esm/DSTimePicker.js +0 -111
- package/esm/DSTimePickerMenu.js +0 -24
- package/esm/PickerPanel.js +0 -392
- package/esm/TimePickerDropdown.js +0 -45
- package/esm/TimePickerImpl.js +0 -165
- package/esm/TimePickerMenu.js +0 -301
- package/esm/index.js +0 -4
- package/esm/moveElementOnScroll.js +0 -70
- package/esm/utils.js +0 -31
- package/types/DSTimePicker.d.ts +0 -162
- package/types/DSTimePickerMenu.d.ts +0 -4
- package/types/PickerPanel.d.ts +0 -24
- package/types/TimePickerDropdown.d.ts +0 -25
- package/types/TimePickerImpl.d.ts +0 -35
- package/types/TimePickerMenu.d.ts +0 -19
- package/types/index.d.ts +0 -5
- package/types/moveElementOnScroll.d.ts +0 -13
- package/types/utils.d.ts +0 -8
|
@@ -0,0 +1,210 @@
|
|
|
1
|
+
var __create = Object.create;
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
6
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
7
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
9
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
10
|
+
var __spreadValues = (a, b) => {
|
|
11
|
+
for (var prop in b || (b = {}))
|
|
12
|
+
if (__hasOwnProp.call(b, prop))
|
|
13
|
+
__defNormalProp(a, prop, b[prop]);
|
|
14
|
+
if (__getOwnPropSymbols)
|
|
15
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
16
|
+
if (__propIsEnum.call(b, prop))
|
|
17
|
+
__defNormalProp(a, prop, b[prop]);
|
|
18
|
+
}
|
|
19
|
+
return a;
|
|
20
|
+
};
|
|
21
|
+
var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
|
|
22
|
+
var __objRest = (source, exclude) => {
|
|
23
|
+
var target = {};
|
|
24
|
+
for (var prop in source)
|
|
25
|
+
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
26
|
+
target[prop] = source[prop];
|
|
27
|
+
if (source != null && __getOwnPropSymbols)
|
|
28
|
+
for (var prop of __getOwnPropSymbols(source)) {
|
|
29
|
+
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
30
|
+
target[prop] = source[prop];
|
|
31
|
+
}
|
|
32
|
+
return target;
|
|
33
|
+
};
|
|
34
|
+
var __export = (target, all) => {
|
|
35
|
+
for (var name in all)
|
|
36
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
37
|
+
};
|
|
38
|
+
var __reExport = (target, module2, copyDefault, desc) => {
|
|
39
|
+
if (module2 && typeof module2 === "object" || typeof module2 === "function") {
|
|
40
|
+
for (let key of __getOwnPropNames(module2))
|
|
41
|
+
if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
|
|
42
|
+
__defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
|
|
43
|
+
}
|
|
44
|
+
return target;
|
|
45
|
+
};
|
|
46
|
+
var __toESM = (module2, isNodeMode) => {
|
|
47
|
+
return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
|
|
48
|
+
};
|
|
49
|
+
var __toCommonJS = /* @__PURE__ */ ((cache) => {
|
|
50
|
+
return (module2, temp) => {
|
|
51
|
+
return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
|
|
52
|
+
};
|
|
53
|
+
})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
|
|
54
|
+
var TimePickerImpl_exports = {};
|
|
55
|
+
__export(TimePickerImpl_exports, {
|
|
56
|
+
TimePickerImpl: () => TimePickerImpl,
|
|
57
|
+
default: () => TimePickerImpl_default
|
|
58
|
+
});
|
|
59
|
+
var React = __toESM(require("react"));
|
|
60
|
+
var import_react = __toESM(require("react"));
|
|
61
|
+
var import_prop_types = __toESM(require("prop-types"));
|
|
62
|
+
var import_moment = __toESM(require("moment"));
|
|
63
|
+
var import_memoize_one = __toESM(require("memoize-one"));
|
|
64
|
+
var import_ds_utilities = require("@elliemae/ds-utilities");
|
|
65
|
+
var import_ds_classnames = require("@elliemae/ds-classnames");
|
|
66
|
+
var import_ds_form = require("@elliemae/ds-form");
|
|
67
|
+
var import_TimePickerMenu = require("./TimePickerMenu");
|
|
68
|
+
var import_TimePickerDropdown = require("./TimePickerDropdown");
|
|
69
|
+
var import_utils = require("./utils");
|
|
70
|
+
const blockName = "time-picker";
|
|
71
|
+
const TimePickerContainer = (0, import_ds_classnames.aggregatedClasses)(import_ds_form.DSInputGroup)(blockName, null, ({ isMenuOpened }) => ({
|
|
72
|
+
isMenuOpened
|
|
73
|
+
}));
|
|
74
|
+
const TimePickerImpl = ({
|
|
75
|
+
value,
|
|
76
|
+
onChange,
|
|
77
|
+
onOpen,
|
|
78
|
+
format,
|
|
79
|
+
disabled,
|
|
80
|
+
hasHeader,
|
|
81
|
+
hasHeaderDisplay,
|
|
82
|
+
className,
|
|
83
|
+
containerProps,
|
|
84
|
+
placement,
|
|
85
|
+
zIndex,
|
|
86
|
+
disabledTimes,
|
|
87
|
+
minutesInterval
|
|
88
|
+
}) => {
|
|
89
|
+
const [time, setTime] = (0, import_react.useState)();
|
|
90
|
+
const [isMenuOpened, setIsMenuOpened] = (0, import_react.useState)(false);
|
|
91
|
+
const [focusedColumn, setFocusedColumn] = (0, import_react.useState)(null);
|
|
92
|
+
const timePickerRef = (0, import_react.useRef)();
|
|
93
|
+
(0, import_react.useEffect)(() => {
|
|
94
|
+
if ((0, import_moment.default)(value).isValid())
|
|
95
|
+
setTime((0, import_moment.default)(value));
|
|
96
|
+
else if (value === null)
|
|
97
|
+
setTime(void 0);
|
|
98
|
+
}, [value]);
|
|
99
|
+
(0, import_react.useEffect)(() => {
|
|
100
|
+
window.addEventListener("click", handleClickOutside, false);
|
|
101
|
+
return () => window.removeEventListener("click", handleClickOutside, false);
|
|
102
|
+
}, []);
|
|
103
|
+
(0, import_react.useEffect)(() => {
|
|
104
|
+
window.addEventListener("keydown", handleKeyDown, false);
|
|
105
|
+
return () => window.removeEventListener("keydown", handleKeyDown, false);
|
|
106
|
+
}, []);
|
|
107
|
+
(0, import_react.useEffect)(() => {
|
|
108
|
+
if (isMenuOpened)
|
|
109
|
+
handleChangeFocus();
|
|
110
|
+
}, [isMenuOpened]);
|
|
111
|
+
const handleClickOutside = () => {
|
|
112
|
+
if (isMenuOpened)
|
|
113
|
+
setIsMenuOpened(false);
|
|
114
|
+
};
|
|
115
|
+
const handleKeyDown = (event) => {
|
|
116
|
+
const { key } = event;
|
|
117
|
+
const menuOpenKeys = ["Escape", " ", "Enter"];
|
|
118
|
+
if (menuOpenKeys.includes(key))
|
|
119
|
+
setIsMenuOpened(false);
|
|
120
|
+
};
|
|
121
|
+
const handleChangeFocus = () => {
|
|
122
|
+
const [firstColumn] = document.getElementsByClassName("em-ds-time-picker-panel");
|
|
123
|
+
if (firstColumn && !focusedColumn) {
|
|
124
|
+
setFocusedColumn(firstColumn);
|
|
125
|
+
firstColumn.focus();
|
|
126
|
+
}
|
|
127
|
+
};
|
|
128
|
+
const handlePickerChange = (newTime) => {
|
|
129
|
+
setTime((0, import_moment.default)(newTime));
|
|
130
|
+
onChange((0, import_moment.default)(newTime));
|
|
131
|
+
};
|
|
132
|
+
const handleInputChange = (newTime) => {
|
|
133
|
+
setTime(newTime);
|
|
134
|
+
onChange(newTime);
|
|
135
|
+
};
|
|
136
|
+
const handleMenuOpen = (isOpen) => {
|
|
137
|
+
onOpen(isOpen);
|
|
138
|
+
setIsMenuOpened(isOpen);
|
|
139
|
+
if (!isOpen)
|
|
140
|
+
setFocusedColumn(null);
|
|
141
|
+
};
|
|
142
|
+
const getVisibleTimePanels = (0, import_memoize_one.default)((format2) => (0, import_ds_utilities.getVisibleTimeByFormat)(format2));
|
|
143
|
+
const timePickerBlockName = (0, import_ds_classnames.convertPropToCssClassName)(blockName);
|
|
144
|
+
const visiblePanels = getVisibleTimePanels(format);
|
|
145
|
+
const disabledTimeRange = disabledTimes && {
|
|
146
|
+
from: (0, import_utils.convertTimeString)(disabledTimes.from),
|
|
147
|
+
to: (0, import_utils.convertTimeString)(disabledTimes.to)
|
|
148
|
+
};
|
|
149
|
+
return /* @__PURE__ */ import_react.default.createElement(TimePickerContainer, {
|
|
150
|
+
className: `${className} variant-${!disabled ? "default" : "disabled"}`,
|
|
151
|
+
containerProps,
|
|
152
|
+
disabled,
|
|
153
|
+
rightAddon: /* @__PURE__ */ import_react.default.createElement(import_TimePickerDropdown.TimePickerDropdown, {
|
|
154
|
+
blockName: timePickerBlockName,
|
|
155
|
+
disabled,
|
|
156
|
+
isOpen: isMenuOpened,
|
|
157
|
+
zIndex,
|
|
158
|
+
placement,
|
|
159
|
+
onOpen: handleMenuOpen,
|
|
160
|
+
onClick: (e) => {
|
|
161
|
+
e.preventDefault();
|
|
162
|
+
handleMenuOpen(!isMenuOpened);
|
|
163
|
+
},
|
|
164
|
+
menu: /* @__PURE__ */ import_react.default.createElement("div", {
|
|
165
|
+
ref: timePickerRef
|
|
166
|
+
}, /* @__PURE__ */ import_react.default.createElement(import_TimePickerMenu.TimePickerMenu, __spreadValues({
|
|
167
|
+
disabled,
|
|
168
|
+
disabledTimes: disabledTimeRange,
|
|
169
|
+
format,
|
|
170
|
+
hasHeader,
|
|
171
|
+
hasHeaderDisplay,
|
|
172
|
+
onTimeChange: handlePickerChange,
|
|
173
|
+
minutesInterval,
|
|
174
|
+
time
|
|
175
|
+
}, visiblePanels)))
|
|
176
|
+
})
|
|
177
|
+
}, /* @__PURE__ */ import_react.default.createElement(import_ds_form.DSInput, {
|
|
178
|
+
customInputType: (_a) => {
|
|
179
|
+
var _b = _a, { onChange: handleChange } = _b, restInputProps = __objRest(_b, ["onChange"]);
|
|
180
|
+
return /* @__PURE__ */ import_react.default.createElement(import_ds_form.TimeInputImpl, __spreadValues({
|
|
181
|
+
clearable: true,
|
|
182
|
+
disabled,
|
|
183
|
+
format,
|
|
184
|
+
onChange: handleChange
|
|
185
|
+
}, restInputProps));
|
|
186
|
+
},
|
|
187
|
+
isShowElipsisActive: false,
|
|
188
|
+
disabled,
|
|
189
|
+
onChange: handleInputChange,
|
|
190
|
+
value: time
|
|
191
|
+
}));
|
|
192
|
+
};
|
|
193
|
+
TimePickerImpl.propTypes = {
|
|
194
|
+
value: import_prop_types.default.instanceOf(Date, import_moment.default),
|
|
195
|
+
onChange: import_prop_types.default.func,
|
|
196
|
+
onOpen: import_prop_types.default.func,
|
|
197
|
+
format: import_prop_types.default.string,
|
|
198
|
+
disabled: import_prop_types.default.bool,
|
|
199
|
+
hasHeader: import_prop_types.default.bool,
|
|
200
|
+
hasHeaderDisplay: import_prop_types.default.bool,
|
|
201
|
+
className: import_prop_types.default.string,
|
|
202
|
+
containerProps: import_prop_types.default.object,
|
|
203
|
+
placement: import_prop_types.default.string,
|
|
204
|
+
zIndex: import_prop_types.default.number,
|
|
205
|
+
disabledTimes: import_prop_types.default.object,
|
|
206
|
+
minutesInterval: import_prop_types.default.number
|
|
207
|
+
};
|
|
208
|
+
var TimePickerImpl_default = TimePickerImpl;
|
|
209
|
+
module.exports = __toCommonJS(TimePickerImpl_exports);
|
|
210
|
+
//# 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
|
+
}
|
|
@@ -0,0 +1,258 @@
|
|
|
1
|
+
var __create = Object.create;
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __defProps = Object.defineProperties;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
6
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
7
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
8
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
9
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
10
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
11
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
12
|
+
var __spreadValues = (a, b) => {
|
|
13
|
+
for (var prop in b || (b = {}))
|
|
14
|
+
if (__hasOwnProp.call(b, prop))
|
|
15
|
+
__defNormalProp(a, prop, b[prop]);
|
|
16
|
+
if (__getOwnPropSymbols)
|
|
17
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
18
|
+
if (__propIsEnum.call(b, prop))
|
|
19
|
+
__defNormalProp(a, prop, b[prop]);
|
|
20
|
+
}
|
|
21
|
+
return a;
|
|
22
|
+
};
|
|
23
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
24
|
+
var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
|
|
25
|
+
var __export = (target, all) => {
|
|
26
|
+
for (var name in all)
|
|
27
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
28
|
+
};
|
|
29
|
+
var __reExport = (target, module2, copyDefault, desc) => {
|
|
30
|
+
if (module2 && typeof module2 === "object" || typeof module2 === "function") {
|
|
31
|
+
for (let key of __getOwnPropNames(module2))
|
|
32
|
+
if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
|
|
33
|
+
__defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
|
|
34
|
+
}
|
|
35
|
+
return target;
|
|
36
|
+
};
|
|
37
|
+
var __toESM = (module2, isNodeMode) => {
|
|
38
|
+
return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
|
|
39
|
+
};
|
|
40
|
+
var __toCommonJS = /* @__PURE__ */ ((cache) => {
|
|
41
|
+
return (module2, temp) => {
|
|
42
|
+
return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
|
|
43
|
+
};
|
|
44
|
+
})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
|
|
45
|
+
var TimePickerMenu_exports = {};
|
|
46
|
+
__export(TimePickerMenu_exports, {
|
|
47
|
+
TimePickerMenu: () => TimePickerMenu,
|
|
48
|
+
default: () => TimePickerMenu_default
|
|
49
|
+
});
|
|
50
|
+
var React = __toESM(require("react"));
|
|
51
|
+
var import_react = __toESM(require("react"));
|
|
52
|
+
var import_prop_types = __toESM(require("prop-types"));
|
|
53
|
+
var import_ds_classnames = require("@elliemae/ds-classnames");
|
|
54
|
+
var import_moment = __toESM(require("moment"));
|
|
55
|
+
var import_ds_utilities = require("@elliemae/ds-utilities");
|
|
56
|
+
var import_utils = require("./utils");
|
|
57
|
+
var import_PickerPanel = require("./PickerPanel");
|
|
58
|
+
const blockName = "time-picker-menu";
|
|
59
|
+
const TimePickerContainer = (0, import_ds_classnames.aggregatedClasses)("div")(blockName);
|
|
60
|
+
const TimePickerHeader = (0, import_ds_classnames.aggregatedClasses)("div")(blockName, "header");
|
|
61
|
+
const TimePickerPanelContainer = (0, import_ds_classnames.aggregatedClasses)("div")(blockName, "panel-container");
|
|
62
|
+
const generateOption = (format) => (option) => ({
|
|
63
|
+
value: option,
|
|
64
|
+
label: typeof format === "function" ? format(option) : option
|
|
65
|
+
});
|
|
66
|
+
class TimePickerMenu extends import_react.Component {
|
|
67
|
+
constructor(props) {
|
|
68
|
+
super(props);
|
|
69
|
+
this.renderHeader = () => {
|
|
70
|
+
const { time } = this.state;
|
|
71
|
+
return /* @__PURE__ */ import_react.default.createElement(TimePickerHeader, null, time.format("hh:mma"));
|
|
72
|
+
};
|
|
73
|
+
this.state = {
|
|
74
|
+
time: (0, import_moment.default)(props.time || "", props.format) || (0, import_moment.default)()
|
|
75
|
+
};
|
|
76
|
+
}
|
|
77
|
+
static getDerivedStateFromProps(props, state) {
|
|
78
|
+
if (props.time) {
|
|
79
|
+
return __spreadProps(__spreadValues({}, state), { time: (0, import_moment.default)(props.time) });
|
|
80
|
+
}
|
|
81
|
+
return __spreadProps(__spreadValues({}, state), { time: void 0 });
|
|
82
|
+
}
|
|
83
|
+
componentDidMount() {
|
|
84
|
+
const { time } = this.state;
|
|
85
|
+
this.setState({ time });
|
|
86
|
+
}
|
|
87
|
+
handleMinuteChange(value) {
|
|
88
|
+
const { time } = this.state;
|
|
89
|
+
this.updateTime(time.minute(value));
|
|
90
|
+
}
|
|
91
|
+
handleHoursChange(value) {
|
|
92
|
+
const { time } = this.state;
|
|
93
|
+
const { use12Hours } = this.props;
|
|
94
|
+
let nextHour = value;
|
|
95
|
+
if (use12Hours) {
|
|
96
|
+
if (!(0, import_utils.isAM)(time)) {
|
|
97
|
+
nextHour = value % 12 + 12;
|
|
98
|
+
}
|
|
99
|
+
}
|
|
100
|
+
this.updateTime(time.hour(nextHour));
|
|
101
|
+
}
|
|
102
|
+
handleSecondsChange(value) {
|
|
103
|
+
const { time } = this.state;
|
|
104
|
+
this.updateTime(time.second(value));
|
|
105
|
+
}
|
|
106
|
+
handleAMPMChange(value) {
|
|
107
|
+
const { time } = this.state;
|
|
108
|
+
const hour = time.hour();
|
|
109
|
+
const nextHour = value.toLowerCase() === "am" ? hour % 12 : hour % 12 + 12;
|
|
110
|
+
this.updateTime(time.hour(nextHour));
|
|
111
|
+
}
|
|
112
|
+
updateTime(time) {
|
|
113
|
+
const { onTimeChange } = this.props;
|
|
114
|
+
onTimeChange(time);
|
|
115
|
+
this.setState({ time });
|
|
116
|
+
}
|
|
117
|
+
renderHoursPanel() {
|
|
118
|
+
const { time } = this.state;
|
|
119
|
+
const { showHours, use12Hours, format, hasHeader, disabledTimes } = this.props;
|
|
120
|
+
if (!showHours)
|
|
121
|
+
return null;
|
|
122
|
+
const hour = time.hour();
|
|
123
|
+
let selectedHour = use12Hours ? hour % 12 || 12 : hour;
|
|
124
|
+
if (disabledTimes) {
|
|
125
|
+
const { from, to } = disabledTimes;
|
|
126
|
+
if (hour > from.hour && hour < to.hour) {
|
|
127
|
+
if (to.hour < 24) {
|
|
128
|
+
const toFormatted = to.hour % 12 || 12;
|
|
129
|
+
if (selectedHour !== toFormatted)
|
|
130
|
+
this.handleHoursChange(toFormatted);
|
|
131
|
+
selectedHour = toFormatted;
|
|
132
|
+
} else if (from) {
|
|
133
|
+
selectedHour = (from.hour - 1) % 12 || 12;
|
|
134
|
+
}
|
|
135
|
+
}
|
|
136
|
+
}
|
|
137
|
+
const meridiem = hour >= 12 ? "PM" : "AM";
|
|
138
|
+
const withLeadingZeros = format.indexOf("hh") > -1;
|
|
139
|
+
const rangeHours = use12Hours ? (0, import_ds_utilities.range)(1, 13) : (0, import_ds_utilities.range)(24);
|
|
140
|
+
const hoursOptions = rangeHours.map(generateOption(withLeadingZeros && (0, import_ds_utilities.addLeadingZeros)(2)));
|
|
141
|
+
return /* @__PURE__ */ import_react.default.createElement(import_PickerPanel.PickerPanel, {
|
|
142
|
+
type: "hour",
|
|
143
|
+
time,
|
|
144
|
+
meridiem,
|
|
145
|
+
hasHeader,
|
|
146
|
+
header: "H",
|
|
147
|
+
onChange: this.handleHoursChange,
|
|
148
|
+
options: hoursOptions,
|
|
149
|
+
selected: selectedHour,
|
|
150
|
+
disabledTimes
|
|
151
|
+
});
|
|
152
|
+
}
|
|
153
|
+
renderMinutesPanel() {
|
|
154
|
+
const { time } = this.state;
|
|
155
|
+
const { showMinutes, format, hasHeader, disabledTimes, minutesInterval } = this.props;
|
|
156
|
+
if (!showMinutes)
|
|
157
|
+
return null;
|
|
158
|
+
const withLeadingZeros = format.indexOf("mm") > -1;
|
|
159
|
+
const rangeMinutes = (0, import_ds_utilities.range)(0, 60, minutesInterval).map(generateOption(withLeadingZeros && (0, import_ds_utilities.addLeadingZeros)(2)));
|
|
160
|
+
let selectedMinute = time.minute();
|
|
161
|
+
const selectedHour = time.hour();
|
|
162
|
+
if (disabledTimes) {
|
|
163
|
+
const { from, to } = disabledTimes;
|
|
164
|
+
if (selectedHour <= to.hour && selectedHour > from.hour) {
|
|
165
|
+
if (to) {
|
|
166
|
+
if (selectedMinute < to.min)
|
|
167
|
+
this.handleMinuteChange(to.min);
|
|
168
|
+
} else if (from) {
|
|
169
|
+
if (selectedMinute > from.min)
|
|
170
|
+
this.handleMinuteChange(from.min - 1);
|
|
171
|
+
}
|
|
172
|
+
} else {
|
|
173
|
+
selectedMinute = time.minute();
|
|
174
|
+
}
|
|
175
|
+
}
|
|
176
|
+
return /* @__PURE__ */ import_react.default.createElement(import_PickerPanel.PickerPanel, {
|
|
177
|
+
type: "minutes",
|
|
178
|
+
time,
|
|
179
|
+
hasHeader,
|
|
180
|
+
header: "M",
|
|
181
|
+
onChange: this.handleMinuteChange,
|
|
182
|
+
options: rangeMinutes,
|
|
183
|
+
selected: selectedMinute,
|
|
184
|
+
disabledTimes
|
|
185
|
+
});
|
|
186
|
+
}
|
|
187
|
+
renderSecondsPanel() {
|
|
188
|
+
const { time } = this.state;
|
|
189
|
+
const { showSeconds, format, hasHeader } = this.props;
|
|
190
|
+
if (!showSeconds)
|
|
191
|
+
return null;
|
|
192
|
+
const withLeadingZeros = format.indexOf("ss") > -1;
|
|
193
|
+
const rangeSeconds = (0, import_ds_utilities.range)(60).map(generateOption(withLeadingZeros && (0, import_ds_utilities.addLeadingZeros)(2)));
|
|
194
|
+
return /* @__PURE__ */ import_react.default.createElement(import_PickerPanel.PickerPanel, {
|
|
195
|
+
type: "seconds",
|
|
196
|
+
hasHeader,
|
|
197
|
+
header: "S",
|
|
198
|
+
onChange: this.handleSecondsChange,
|
|
199
|
+
options: rangeSeconds,
|
|
200
|
+
selected: time.second()
|
|
201
|
+
});
|
|
202
|
+
}
|
|
203
|
+
renderAMPMPanel() {
|
|
204
|
+
const { time } = this.state;
|
|
205
|
+
const { use12Hours, hasHeader, disabledTimes } = this.props;
|
|
206
|
+
if (!use12Hours)
|
|
207
|
+
return null;
|
|
208
|
+
let meridiemSelected = !(0, import_utils.isAM)(time) ? "pm" : "am";
|
|
209
|
+
if (disabledTimes && disabledTimes.to && meridiemSelected === "am") {
|
|
210
|
+
meridiemSelected = disabledTimes.to.hour >= 12 ? "pm" : "am";
|
|
211
|
+
if (meridiemSelected === "am" && time.hour() > 12) {
|
|
212
|
+
this.handleAMPMChange("am");
|
|
213
|
+
}
|
|
214
|
+
if (meridiemSelected === "pm" && time.hour() <= 12) {
|
|
215
|
+
this.handleAMPMChange("pm");
|
|
216
|
+
}
|
|
217
|
+
}
|
|
218
|
+
return /* @__PURE__ */ import_react.default.createElement(import_PickerPanel.PickerPanel, {
|
|
219
|
+
type: "meridiem",
|
|
220
|
+
hasHeader,
|
|
221
|
+
header: "",
|
|
222
|
+
onChange: this.handleAMPMChange,
|
|
223
|
+
options: [
|
|
224
|
+
{ value: "am", label: "am" },
|
|
225
|
+
{ value: "pm", label: "pm" }
|
|
226
|
+
],
|
|
227
|
+
selected: meridiemSelected,
|
|
228
|
+
disabledTimes
|
|
229
|
+
});
|
|
230
|
+
}
|
|
231
|
+
render() {
|
|
232
|
+
const { hasHeaderDisplay } = this.props;
|
|
233
|
+
return /* @__PURE__ */ import_react.default.createElement(TimePickerContainer, null, hasHeaderDisplay && this.renderHeader(), /* @__PURE__ */ import_react.default.createElement(TimePickerPanelContainer, null, this.renderHoursPanel(), this.renderMinutesPanel(), this.renderSecondsPanel(), this.renderAMPMPanel()));
|
|
234
|
+
}
|
|
235
|
+
}
|
|
236
|
+
TimePickerMenu.defaultProps = {
|
|
237
|
+
time: (0, import_moment.default)(),
|
|
238
|
+
hasHeader: false,
|
|
239
|
+
use12Hours: true,
|
|
240
|
+
showSeconds: true,
|
|
241
|
+
showMinutes: true,
|
|
242
|
+
showHours: true,
|
|
243
|
+
disabledTimes: void 0,
|
|
244
|
+
onTimeChange: () => null
|
|
245
|
+
};
|
|
246
|
+
TimePickerMenu.propTypes = {
|
|
247
|
+
time: import_prop_types.default.instanceOf(import_moment.default),
|
|
248
|
+
hasHeader: import_prop_types.default.bool,
|
|
249
|
+
use12Hours: import_prop_types.default.bool,
|
|
250
|
+
showSeconds: import_prop_types.default.bool,
|
|
251
|
+
showMinutes: import_prop_types.default.bool,
|
|
252
|
+
showHours: import_prop_types.default.bool,
|
|
253
|
+
onTimeChange: import_prop_types.default.func,
|
|
254
|
+
disabledTimes: import_prop_types.default.object
|
|
255
|
+
};
|
|
256
|
+
var TimePickerMenu_default = TimePickerMenu;
|
|
257
|
+
module.exports = __toCommonJS(TimePickerMenu_exports);
|
|
258
|
+
//# sourceMappingURL=TimePickerMenu.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/TimePickerMenu.tsx", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
+
"sourcesContent": ["/* eslint-disable complexity */\n/* eslint-disable max-lines */\n/* eslint-disable react/prop-types */\nimport React, { Component } from 'react';\nimport PropTypes from 'prop-types';\nimport { aggregatedClasses } from '@elliemae/ds-classnames';\nimport moment from 'moment';\nimport { range, addLeadingZeros } from '@elliemae/ds-utilities';\nimport { isAM } from './utils';\nimport { PickerPanel } from './PickerPanel';\n\nconst blockName = 'time-picker-menu';\n\nconst TimePickerContainer = aggregatedClasses('div')(blockName);\nconst TimePickerHeader = aggregatedClasses('div')(blockName, 'header');\nconst TimePickerPanelContainer = aggregatedClasses('div')(blockName, 'panel-container');\n\nconst generateOption = (format) => (option) => ({\n value: option,\n label: typeof format === 'function' ? format(option) : option,\n});\n\nclass TimePickerMenu extends Component {\n constructor(props) {\n super(props);\n this.state = {\n time: moment(props.time || '', props.format) || moment(),\n };\n }\n\n static getDerivedStateFromProps(props, state) {\n if (props.time) {\n return { ...state, time: moment(props.time) };\n }\n return { ...state, time: undefined };\n }\n\n componentDidMount() {\n const { time } = this.state;\n this.setState({ time });\n }\n\n handleMinuteChange(value) {\n const { time } = this.state;\n this.updateTime(time.minute(value));\n }\n\n handleHoursChange(value) {\n const { time } = this.state;\n const { use12Hours } = this.props;\n let nextHour = value;\n if (use12Hours) {\n if (!isAM(time)) {\n nextHour = (value % 12) + 12;\n }\n }\n this.updateTime(time.hour(nextHour));\n }\n\n handleSecondsChange(value) {\n const { time } = this.state;\n this.updateTime(time.second(value));\n }\n\n handleAMPMChange(value) {\n const { time } = this.state;\n const hour = time.hour();\n const nextHour = value.toLowerCase() === 'am' ? hour % 12 : (hour % 12) + 12;\n this.updateTime(time.hour(nextHour));\n }\n\n updateTime(time) {\n const { onTimeChange } = this.props;\n onTimeChange(time);\n this.setState({ time });\n }\n\n renderHoursPanel() {\n const { time } = this.state;\n const { showHours, use12Hours, format, hasHeader, disabledTimes } = this.props;\n if (!showHours) return null;\n\n const hour = time.hour(); // in 24 format\n let selectedHour = use12Hours ? hour % 12 || 12 : hour;\n if (disabledTimes) {\n const { from, to } = disabledTimes;\n if (hour > from.hour && hour < to.hour) {\n if (to.hour < 24) {\n const toFormatted = to.hour % 12 || 12;\n if (selectedHour !== toFormatted) this.handleHoursChange(toFormatted);\n selectedHour = toFormatted;\n } else if (from) {\n selectedHour = (from.hour - 1) % 12 || 12;\n }\n }\n }\n\n const meridiem = hour >= 12 ? 'PM' : 'AM';\n const withLeadingZeros = format.indexOf('hh') > -1;\n const rangeHours = use12Hours ? range(1, 13) : range(24);\n const hoursOptions = rangeHours.map(generateOption(withLeadingZeros && addLeadingZeros(2)));\n return (\n <PickerPanel\n type=\"hour\"\n time={time}\n meridiem={meridiem}\n hasHeader={hasHeader}\n header=\"H\"\n onChange={this.handleHoursChange}\n options={hoursOptions}\n selected={selectedHour}\n disabledTimes={disabledTimes}\n />\n );\n }\n\n renderMinutesPanel() {\n const { time } = this.state;\n const { showMinutes, format, hasHeader, disabledTimes, minutesInterval } = this.props;\n if (!showMinutes) return null;\n const withLeadingZeros = format.indexOf('mm') > -1;\n const rangeMinutes = range(0, 60, minutesInterval).map(generateOption(withLeadingZeros && addLeadingZeros(2)));\n\n let selectedMinute = time.minute();\n const selectedHour = time.hour();\n\n if (disabledTimes) {\n const { from, to } = disabledTimes;\n if (selectedHour <= to.hour && selectedHour > from.hour) {\n if (to) {\n if (selectedMinute < to.min) this.handleMinuteChange(to.min);\n } else if (from) {\n if (selectedMinute > from.min) this.handleMinuteChange(from.min - 1);\n }\n } else {\n selectedMinute = time.minute();\n }\n }\n\n return (\n <PickerPanel\n type=\"minutes\"\n time={time}\n hasHeader={hasHeader}\n header=\"M\"\n onChange={this.handleMinuteChange}\n options={rangeMinutes}\n selected={selectedMinute}\n disabledTimes={disabledTimes}\n />\n );\n }\n\n renderSecondsPanel() {\n const { time } = this.state;\n const { showSeconds, format, hasHeader } = this.props;\n if (!showSeconds) return null;\n const withLeadingZeros = format.indexOf('ss') > -1;\n const rangeSeconds = range(60).map(generateOption(withLeadingZeros && addLeadingZeros(2)));\n return (\n <PickerPanel\n type=\"seconds\"\n hasHeader={hasHeader}\n header=\"S\"\n onChange={this.handleSecondsChange}\n options={rangeSeconds}\n selected={time.second()}\n />\n );\n }\n\n renderAMPMPanel() {\n const { time } = this.state;\n const { use12Hours, hasHeader, disabledTimes } = this.props;\n if (!use12Hours) return null;\n\n let meridiemSelected = !isAM(time) ? 'pm' : 'am';\n if (disabledTimes && disabledTimes.to && meridiemSelected === 'am') {\n meridiemSelected = disabledTimes.to.hour >= 12 ? 'pm' : 'am';\n if (meridiemSelected === 'am' && time.hour() > 12) {\n this.handleAMPMChange('am');\n }\n\n if (meridiemSelected === 'pm' && time.hour() <= 12) {\n this.handleAMPMChange('pm');\n }\n }\n\n return (\n <PickerPanel\n type=\"meridiem\"\n hasHeader={hasHeader}\n header=\"\"\n onChange={this.handleAMPMChange}\n options={[\n { value: 'am', label: 'am' },\n { value: 'pm', label: 'pm' },\n ]}\n selected={meridiemSelected}\n disabledTimes={disabledTimes}\n />\n );\n }\n\n renderHeader = () => {\n const { time } = this.state;\n return <TimePickerHeader>{time.format('hh:mma')}</TimePickerHeader>;\n };\n\n render() {\n const { hasHeaderDisplay } = this.props;\n\n return (\n <TimePickerContainer>\n {hasHeaderDisplay && this.renderHeader()}\n <TimePickerPanelContainer>\n {this.renderHoursPanel()}\n {this.renderMinutesPanel()}\n {this.renderSecondsPanel()}\n {this.renderAMPMPanel()}\n </TimePickerPanelContainer>\n </TimePickerContainer>\n );\n }\n}\n\nTimePickerMenu.defaultProps = {\n time: moment(),\n hasHeader: false,\n use12Hours: true,\n showSeconds: true,\n showMinutes: true,\n showHours: true,\n disabledTimes: undefined,\n onTimeChange: () => null,\n};\n\nTimePickerMenu.propTypes = {\n /** Time value */\n time: PropTypes.instanceOf(moment),\n /** If the menu has header or not */\n hasHeader: PropTypes.bool,\n /** Whether to use the 12 hours format */\n use12Hours: PropTypes.bool,\n /** Whether show 'seconds' or not */\n showSeconds: PropTypes.bool,\n /** Whether show 'minutes' or not */\n showMinutes: PropTypes.bool,\n /** Whether show 'hours' or not */\n showHours: PropTypes.bool,\n /** Handler when time changes */\n onTimeChange: PropTypes.func,\n disabledTimes: PropTypes.object,\n};\n\nexport { TimePickerMenu };\nexport default TimePickerMenu;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,40 @@
|
|
|
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);
|
|
26
|
+
};
|
|
27
|
+
})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
|
|
28
|
+
var src_exports = {};
|
|
29
|
+
__export(src_exports, {
|
|
30
|
+
convertTimeString: () => import_utils.convertTimeString,
|
|
31
|
+
default: () => import_DSTimePicker.default
|
|
32
|
+
});
|
|
33
|
+
var React = __toESM(require("react"));
|
|
34
|
+
__reExport(src_exports, require("./DSTimePicker"));
|
|
35
|
+
__reExport(src_exports, require("./TimePickerMenu"));
|
|
36
|
+
__reExport(src_exports, require("./DSTimePickerMenu"));
|
|
37
|
+
var import_utils = require("./utils");
|
|
38
|
+
var import_DSTimePicker = __toESM(require("./DSTimePicker"));
|
|
39
|
+
module.exports = __toCommonJS(src_exports);
|
|
40
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/index.tsx", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
+
"sourcesContent": ["export * from './DSTimePicker';\nexport * from './TimePickerMenu';\nexport * from './DSTimePickerMenu';\n\nexport { convertTimeString } from './utils'; // this is an exception, we should move utils to shared tho?\n\nexport { default } from './DSTimePicker';\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,wBAAc;AACd,wBAAc;AACd,wBAAc;AAEd,mBAAkC;AAElC,0BAAwB;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,93 @@
|
|
|
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);
|
|
26
|
+
};
|
|
27
|
+
})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
|
|
28
|
+
var moveElementOnScroll_exports = {};
|
|
29
|
+
__export(moveElementOnScroll_exports, {
|
|
30
|
+
MoveElementOnScroll: () => MoveElementOnScroll,
|
|
31
|
+
default: () => moveElementOnScroll_default
|
|
32
|
+
});
|
|
33
|
+
var React = __toESM(require("react"));
|
|
34
|
+
function MoveElementOnScroll(element, {
|
|
35
|
+
container,
|
|
36
|
+
min = 0,
|
|
37
|
+
max = element.offsetHeight,
|
|
38
|
+
speed = 1,
|
|
39
|
+
smooth = 2,
|
|
40
|
+
onUpdate = () => null,
|
|
41
|
+
onEndScroll = () => null
|
|
42
|
+
}) {
|
|
43
|
+
let moving = false;
|
|
44
|
+
let pos = min;
|
|
45
|
+
let lastPos = pos;
|
|
46
|
+
const requestFrame = function() {
|
|
47
|
+
return window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.oRequestAnimationFrame || window.msRequestAnimationFrame || function(func) {
|
|
48
|
+
window.setTimeout(func, 1e3 / 50);
|
|
49
|
+
};
|
|
50
|
+
}();
|
|
51
|
+
function update() {
|
|
52
|
+
moving = true;
|
|
53
|
+
const delta = (pos - lastPos) / smooth;
|
|
54
|
+
lastPos += delta;
|
|
55
|
+
if (Math.abs(delta) > 0.7) {
|
|
56
|
+
requestFrame(() => {
|
|
57
|
+
onUpdate(lastPos, delta);
|
|
58
|
+
update();
|
|
59
|
+
});
|
|
60
|
+
} else {
|
|
61
|
+
onEndScroll(pos);
|
|
62
|
+
moving = false;
|
|
63
|
+
}
|
|
64
|
+
}
|
|
65
|
+
function scrolling(e) {
|
|
66
|
+
e.preventDefault();
|
|
67
|
+
let delta = e.delta || e.wheelDelta;
|
|
68
|
+
if (delta === void 0) {
|
|
69
|
+
delta = -e.detail;
|
|
70
|
+
delta *= 10 * speed;
|
|
71
|
+
}
|
|
72
|
+
pos += -delta * speed;
|
|
73
|
+
pos = Math.max(min, Math.min(pos, max));
|
|
74
|
+
if (!moving) {
|
|
75
|
+
update();
|
|
76
|
+
}
|
|
77
|
+
}
|
|
78
|
+
container.addEventListener("mousewheel", scrolling, false);
|
|
79
|
+
container.addEventListener("DOMMouseScroll", scrolling, false);
|
|
80
|
+
return {
|
|
81
|
+
unsubscribe: () => {
|
|
82
|
+
container.removeEventListener("mousewheel", scrolling);
|
|
83
|
+
container.removeEventListener("DOMMouseScroll", scrolling);
|
|
84
|
+
},
|
|
85
|
+
updatePosition: (newPos) => {
|
|
86
|
+
pos = -newPos;
|
|
87
|
+
lastPos = -pos;
|
|
88
|
+
}
|
|
89
|
+
};
|
|
90
|
+
}
|
|
91
|
+
var moveElementOnScroll_default = MoveElementOnScroll;
|
|
92
|
+
module.exports = __toCommonJS(moveElementOnScroll_exports);
|
|
93
|
+
//# sourceMappingURL=moveElementOnScroll.js.map
|